ianhitchman/tiptap
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: make shouldShow and pluginKey option for menus, fix #1779

Browse Source
This commit is contained in:
Philipp Kühn
2021-08-23 18:44:40 +02:00
parent 1618e8ee85
commit 70a328bd3d
4 changed files with 16 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/extension-bubble-menu/src/bubble-menu-plugin.ts
View File

@@ -13,7 +13,7 @@ export interface BubbleMenuPluginProps {
editor: Editor, editor: Editor,
element: HTMLElement, element: HTMLElement,
tippyOptions?: Partial<Props>, tippyOptions?: Partial<Props>,
shouldShow: ((props: { shouldShow?: ((props: {
editor: Editor, editor: Editor,
view: EditorView, view: EditorView,
state: EditorState, state: EditorState,
@@ -140,7 +140,7 @@ export class BubbleMenuView {
const from = Math.min(...ranges.map(range => range.$from.pos)) const from = Math.min(...ranges.map(range => range.$from.pos))
const to = Math.max(...ranges.map(range => range.$to.pos)) const to = Math.max(...ranges.map(range => range.$to.pos))
const shouldShow = this.shouldShow({ const shouldShow = this.shouldShow?.({
editor: this.editor, editor: this.editor,
view, view,
state, state,

4
packages/extension-floating-menu/src/floating-menu-plugin.ts
View File

@@ -8,7 +8,7 @@ export interface FloatingMenuPluginProps {
editor: Editor, editor: Editor,
element: HTMLElement, element: HTMLElement,
tippyOptions?: Partial<Props>, tippyOptions?: Partial<Props>,
shouldShow: ((props: { shouldShow?: ((props: {
editor: Editor, editor: Editor,
view: EditorView, view: EditorView,
state: EditorState, state: EditorState,
@@ -122,7 +122,7 @@ export class FloatingMenuView {
return return
} }
const shouldShow = this.shouldShow({ const shouldShow = this.shouldShow?.({
editor: this.editor, editor: this.editor,
view, view,
state, state,

10
packages/react/src/BubbleMenu.tsx
View File

@@ -1,7 +1,9 @@
import React, { useEffect, useRef } from 'react' import React, { useEffect, useRef } from 'react'
import { BubbleMenuPlugin, BubbleMenuPluginProps } from '@tiptap/extension-bubble-menu' import { BubbleMenuPlugin, BubbleMenuPluginProps } from '@tiptap/extension-bubble-menu'
export type BubbleMenuProps = Omit<BubbleMenuPluginProps, 'element'> & { type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>
export type BubbleMenuProps = Omit<Optional<BubbleMenuPluginProps, 'pluginKey'>, 'element'> & {
className?: string, className?: string,
} }
@@ -10,10 +12,10 @@ export const BubbleMenu: React.FC<BubbleMenuProps> = props => {
useEffect(() => { useEffect(() => {
const { const {
pluginKey, pluginKey = 'bubbleMenu',
editor, editor,
tippyOptions, tippyOptions = {},
shouldShow, shouldShow = null,
} = props } = props
editor.registerPlugin(BubbleMenuPlugin({ editor.registerPlugin(BubbleMenuPlugin({

10
packages/react/src/FloatingMenu.tsx
View File

@@ -1,7 +1,9 @@
import React, { useEffect, useRef } from 'react' import React, { useEffect, useRef } from 'react'
import { FloatingMenuPlugin, FloatingMenuPluginProps } from '@tiptap/extension-floating-menu' import { FloatingMenuPlugin, FloatingMenuPluginProps } from '@tiptap/extension-floating-menu'
export type FloatingMenuProps = Omit<FloatingMenuPluginProps, 'element'> & { type Optional<T, K extends keyof T> = Pick<Partial<T>, K> & Omit<T, K>
export type FloatingMenuProps = Omit<Optional<FloatingMenuPluginProps, 'pluginKey'>, 'element'> & {
className?: string, className?: string,
} }
@@ -10,10 +12,10 @@ export const FloatingMenu: React.FC<FloatingMenuProps> = props => {
useEffect(() => { useEffect(() => {
const { const {
pluginKey, pluginKey = 'floatingMenu',
editor, editor,
tippyOptions, tippyOptions = {},
shouldShow, shouldShow = null,
} = props } = props
editor.registerPlugin(FloatingMenuPlugin({ editor.registerPlugin(FloatingMenuPlugin({