@tiptap/vue-3 2.11.7 → 3.0.0-beta.0

package/dist/menus/index.d.cts

@@ -0,0 +1,257 @@
+import * as _floating_ui_dom from '@floating-ui/dom';
+import { offset, flip, shift, arrow, size, autoPlacement, hide, inline } from '@floating-ui/dom';
+import { EditorState as EditorState$1, PluginKey as PluginKey$1 } from 'prosemirror-state';
+import { EditorView as EditorView$1 } from 'prosemirror-view';
+import * as _tiptap_core from '@tiptap/core';
+import { Editor } from '@tiptap/core';
+import * as vue from 'vue';
+import { PropType } from 'vue';
+import { PluginKey, EditorState } from '@tiptap/pm/state';
+import { EditorView } from '@tiptap/pm/view';
+
+interface BubbleMenuPluginProps {
+    /**
+     * The plugin key.
+     * @type {PluginKey | string}
+     * @default 'bubbleMenu'
+     */
+    pluginKey: PluginKey | string;
+    /**
+     * The editor instance.
+     */
+    editor: Editor;
+    /**
+     * The DOM element that contains your menu.
+     * @type {HTMLElement}
+     * @default null
+     */
+    element: HTMLElement;
+    /**
+     * The delay in milliseconds before the menu should be updated.
+     * This can be useful to prevent performance issues.
+     * @type {number}
+     * @default 250
+     */
+    updateDelay?: number;
+    /**
+     * The delay in milliseconds before the menu position should be updated on window resize.
+     * This can be useful to prevent performance issues.
+     * @type {number}
+     * @default 60
+     */
+    resizeDelay?: number;
+    /**
+     * A function that determines whether the menu should be shown or not.
+     * If this function returns `false`, the menu will be hidden, otherwise it will be shown.
+     */
+    shouldShow: ((props: {
+        editor: Editor;
+        element: HTMLElement;
+        view: EditorView;
+        state: EditorState;
+        oldState?: EditorState;
+        from: number;
+        to: number;
+    }) => boolean) | null;
+    /**
+     * FloatingUI options.
+     */
+    options?: {
+        strategy?: 'absolute' | 'fixed';
+        placement?: 'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'right-start' | 'right-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end';
+        offset?: Parameters<typeof offset>[0] | boolean;
+        flip?: Parameters<typeof flip>[0] | boolean;
+        shift?: Parameters<typeof shift>[0] | boolean;
+        arrow?: Parameters<typeof arrow>[0] | false;
+        size?: Parameters<typeof size>[0] | boolean;
+        autoPlacement?: Parameters<typeof autoPlacement>[0] | boolean;
+        hide?: Parameters<typeof hide>[0] | boolean;
+        inline?: Parameters<typeof inline>[0] | boolean;
+    };
+}
+
+declare const BubbleMenu: vue.DefineComponent<vue.ExtractPropTypes<{
+    pluginKey: {
+        type: PropType<BubbleMenuPluginProps["pluginKey"]>;
+        default: string;
+    };
+    editor: {
+        type: PropType<BubbleMenuPluginProps["editor"]>;
+        required: true;
+    };
+    updateDelay: {
+        type: PropType<BubbleMenuPluginProps["updateDelay"]>;
+        default: undefined;
+    };
+    resizeDelay: {
+        type: PropType<BubbleMenuPluginProps["resizeDelay"]>;
+        default: undefined;
+    };
+    options: {
+        type: PropType<BubbleMenuPluginProps["options"]>;
+        default: () => {};
+    };
+    shouldShow: {
+        type: PropType<Exclude<Required<BubbleMenuPluginProps>["shouldShow"], null>>;
+        default: null;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    pluginKey: {
+        type: PropType<BubbleMenuPluginProps["pluginKey"]>;
+        default: string;
+    };
+    editor: {
+        type: PropType<BubbleMenuPluginProps["editor"]>;
+        required: true;
+    };
+    updateDelay: {
+        type: PropType<BubbleMenuPluginProps["updateDelay"]>;
+        default: undefined;
+    };
+    resizeDelay: {
+        type: PropType<BubbleMenuPluginProps["resizeDelay"]>;
+        default: undefined;
+    };
+    options: {
+        type: PropType<BubbleMenuPluginProps["options"]>;
+        default: () => {};
+    };
+    shouldShow: {
+        type: PropType<Exclude<Required<BubbleMenuPluginProps>["shouldShow"], null>>;
+        default: null;
+    };
+}>> & Readonly<{}>, {
+    updateDelay: number | undefined;
+    resizeDelay: number | undefined;
+    shouldShow: (props: {
+        editor: _tiptap_core.Editor;
+        element: HTMLElement;
+        view: EditorView$1;
+        state: EditorState$1;
+        oldState?: EditorState$1;
+        from: number;
+        to: number;
+    }) => boolean;
+    options: {
+        strategy?: "absolute" | "fixed";
+        placement?: "top" | "right" | "bottom" | "left" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
+        offset?: Parameters<typeof _floating_ui_dom.offset>[0] | boolean;
+        flip?: Parameters<typeof _floating_ui_dom.flip>[0] | boolean;
+        shift?: Parameters<typeof _floating_ui_dom.shift>[0] | boolean;
+        arrow?: Parameters<typeof _floating_ui_dom.arrow>[0] | false;
+        size?: Parameters<typeof _floating_ui_dom.size>[0] | boolean;
+        autoPlacement?: Parameters<typeof _floating_ui_dom.autoPlacement>[0] | boolean;
+        hide?: Parameters<typeof _floating_ui_dom.hide>[0] | boolean;
+        inline?: Parameters<typeof _floating_ui_dom.inline>[0] | boolean;
+    } | undefined;
+    pluginKey: string | PluginKey$1<any>;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface FloatingMenuPluginProps {
+    /**
+     * The plugin key for the floating menu.
+     * @default 'floatingMenu'
+     */
+    pluginKey: PluginKey | string;
+    /**
+     * The editor instance.
+     * @default null
+     */
+    editor: Editor;
+    /**
+     * The DOM element that contains your menu.
+     * @default null
+     */
+    element: HTMLElement;
+    /**
+     * A function that determines whether the menu should be shown or not.
+     * If this function returns `false`, the menu will be hidden, otherwise it will be shown.
+     */
+    shouldShow: ((props: {
+        editor: Editor;
+        view: EditorView;
+        state: EditorState;
+        oldState?: EditorState;
+        from: number;
+        to: number;
+    }) => boolean) | null;
+    /**
+     * FloatingUI options.
+     */
+    options?: {
+        strategy?: 'absolute' | 'fixed';
+        placement?: 'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'right-start' | 'right-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end';
+        offset?: Parameters<typeof offset>[0] | boolean;
+        flip?: Parameters<typeof flip>[0] | boolean;
+        shift?: Parameters<typeof shift>[0] | boolean;
+        arrow?: Parameters<typeof arrow>[0] | false;
+        size?: Parameters<typeof size>[0] | boolean;
+        autoPlacement?: Parameters<typeof autoPlacement>[0] | boolean;
+        hide?: Parameters<typeof hide>[0] | boolean;
+        inline?: Parameters<typeof inline>[0] | boolean;
+    };
+}
+
+declare const FloatingMenu: vue.DefineComponent<vue.ExtractPropTypes<{
+    pluginKey: {
+        type: null;
+        default: string;
+    };
+    editor: {
+        type: PropType<FloatingMenuPluginProps["editor"]>;
+        required: true;
+    };
+    options: {
+        type: PropType<FloatingMenuPluginProps["options"]>;
+        default: () => {};
+    };
+    shouldShow: {
+        type: PropType<Exclude<Required<FloatingMenuPluginProps>["shouldShow"], null>>;
+        default: null;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    pluginKey: {
+        type: null;
+        default: string;
+    };
+    editor: {
+        type: PropType<FloatingMenuPluginProps["editor"]>;
+        required: true;
+    };
+    options: {
+        type: PropType<FloatingMenuPluginProps["options"]>;
+        default: () => {};
+    };
+    shouldShow: {
+        type: PropType<Exclude<Required<FloatingMenuPluginProps>["shouldShow"], null>>;
+        default: null;
+    };
+}>> & Readonly<{}>, {
+    shouldShow: (props: {
+        editor: _tiptap_core.Editor;
+        view: EditorView$1;
+        state: EditorState$1;
+        oldState?: EditorState$1;
+        from: number;
+        to: number;
+    }) => boolean;
+    options: {
+        strategy?: "absolute" | "fixed";
+        placement?: "top" | "right" | "bottom" | "left" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
+        offset?: Parameters<typeof _floating_ui_dom.offset>[0] | boolean;
+        flip?: Parameters<typeof _floating_ui_dom.flip>[0] | boolean;
+        shift?: Parameters<typeof _floating_ui_dom.shift>[0] | boolean;
+        arrow?: Parameters<typeof _floating_ui_dom.arrow>[0] | false;
+        size?: Parameters<typeof _floating_ui_dom.size>[0] | boolean;
+        autoPlacement?: Parameters<typeof _floating_ui_dom.autoPlacement>[0] | boolean;
+        hide?: Parameters<typeof _floating_ui_dom.hide>[0] | boolean;
+        inline?: Parameters<typeof _floating_ui_dom.inline>[0] | boolean;
+    } | undefined;
+    pluginKey: any;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+export { BubbleMenu, FloatingMenu };

package/dist/menus/index.d.ts

@@ -0,0 +1,257 @@
+import * as _floating_ui_dom from '@floating-ui/dom';
+import { offset, flip, shift, arrow, size, autoPlacement, hide, inline } from '@floating-ui/dom';
+import { EditorState as EditorState$1, PluginKey as PluginKey$1 } from 'prosemirror-state';
+import { EditorView as EditorView$1 } from 'prosemirror-view';
+import * as _tiptap_core from '@tiptap/core';
+import { Editor } from '@tiptap/core';
+import * as vue from 'vue';
+import { PropType } from 'vue';
+import { PluginKey, EditorState } from '@tiptap/pm/state';
+import { EditorView } from '@tiptap/pm/view';
+
+interface BubbleMenuPluginProps {
+    /**
+     * The plugin key.
+     * @type {PluginKey | string}
+     * @default 'bubbleMenu'
+     */
+    pluginKey: PluginKey | string;
+    /**
+     * The editor instance.
+     */
+    editor: Editor;
+    /**
+     * The DOM element that contains your menu.
+     * @type {HTMLElement}
+     * @default null
+     */
+    element: HTMLElement;
+    /**
+     * The delay in milliseconds before the menu should be updated.
+     * This can be useful to prevent performance issues.
+     * @type {number}
+     * @default 250
+     */
+    updateDelay?: number;
+    /**
+     * The delay in milliseconds before the menu position should be updated on window resize.
+     * This can be useful to prevent performance issues.
+     * @type {number}
+     * @default 60
+     */
+    resizeDelay?: number;
+    /**
+     * A function that determines whether the menu should be shown or not.
+     * If this function returns `false`, the menu will be hidden, otherwise it will be shown.
+     */
+    shouldShow: ((props: {
+        editor: Editor;
+        element: HTMLElement;
+        view: EditorView;
+        state: EditorState;
+        oldState?: EditorState;
+        from: number;
+        to: number;
+    }) => boolean) | null;
+    /**
+     * FloatingUI options.
+     */
+    options?: {
+        strategy?: 'absolute' | 'fixed';
+        placement?: 'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'right-start' | 'right-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end';
+        offset?: Parameters<typeof offset>[0] | boolean;
+        flip?: Parameters<typeof flip>[0] | boolean;
+        shift?: Parameters<typeof shift>[0] | boolean;
+        arrow?: Parameters<typeof arrow>[0] | false;
+        size?: Parameters<typeof size>[0] | boolean;
+        autoPlacement?: Parameters<typeof autoPlacement>[0] | boolean;
+        hide?: Parameters<typeof hide>[0] | boolean;
+        inline?: Parameters<typeof inline>[0] | boolean;
+    };
+}
+
+declare const BubbleMenu: vue.DefineComponent<vue.ExtractPropTypes<{
+    pluginKey: {
+        type: PropType<BubbleMenuPluginProps["pluginKey"]>;
+        default: string;
+    };
+    editor: {
+        type: PropType<BubbleMenuPluginProps["editor"]>;
+        required: true;
+    };
+    updateDelay: {
+        type: PropType<BubbleMenuPluginProps["updateDelay"]>;
+        default: undefined;
+    };
+    resizeDelay: {
+        type: PropType<BubbleMenuPluginProps["resizeDelay"]>;
+        default: undefined;
+    };
+    options: {
+        type: PropType<BubbleMenuPluginProps["options"]>;
+        default: () => {};
+    };
+    shouldShow: {
+        type: PropType<Exclude<Required<BubbleMenuPluginProps>["shouldShow"], null>>;
+        default: null;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    pluginKey: {
+        type: PropType<BubbleMenuPluginProps["pluginKey"]>;
+        default: string;
+    };
+    editor: {
+        type: PropType<BubbleMenuPluginProps["editor"]>;
+        required: true;
+    };
+    updateDelay: {
+        type: PropType<BubbleMenuPluginProps["updateDelay"]>;
+        default: undefined;
+    };
+    resizeDelay: {
+        type: PropType<BubbleMenuPluginProps["resizeDelay"]>;
+        default: undefined;
+    };
+    options: {
+        type: PropType<BubbleMenuPluginProps["options"]>;
+        default: () => {};
+    };
+    shouldShow: {
+        type: PropType<Exclude<Required<BubbleMenuPluginProps>["shouldShow"], null>>;
+        default: null;
+    };
+}>> & Readonly<{}>, {
+    updateDelay: number | undefined;
+    resizeDelay: number | undefined;
+    shouldShow: (props: {
+        editor: _tiptap_core.Editor;
+        element: HTMLElement;
+        view: EditorView$1;
+        state: EditorState$1;
+        oldState?: EditorState$1;
+        from: number;
+        to: number;
+    }) => boolean;
+    options: {
+        strategy?: "absolute" | "fixed";
+        placement?: "top" | "right" | "bottom" | "left" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
+        offset?: Parameters<typeof _floating_ui_dom.offset>[0] | boolean;
+        flip?: Parameters<typeof _floating_ui_dom.flip>[0] | boolean;
+        shift?: Parameters<typeof _floating_ui_dom.shift>[0] | boolean;
+        arrow?: Parameters<typeof _floating_ui_dom.arrow>[0] | false;
+        size?: Parameters<typeof _floating_ui_dom.size>[0] | boolean;
+        autoPlacement?: Parameters<typeof _floating_ui_dom.autoPlacement>[0] | boolean;
+        hide?: Parameters<typeof _floating_ui_dom.hide>[0] | boolean;
+        inline?: Parameters<typeof _floating_ui_dom.inline>[0] | boolean;
+    } | undefined;
+    pluginKey: string | PluginKey$1<any>;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+interface FloatingMenuPluginProps {
+    /**
+     * The plugin key for the floating menu.
+     * @default 'floatingMenu'
+     */
+    pluginKey: PluginKey | string;
+    /**
+     * The editor instance.
+     * @default null
+     */
+    editor: Editor;
+    /**
+     * The DOM element that contains your menu.
+     * @default null
+     */
+    element: HTMLElement;
+    /**
+     * A function that determines whether the menu should be shown or not.
+     * If this function returns `false`, the menu will be hidden, otherwise it will be shown.
+     */
+    shouldShow: ((props: {
+        editor: Editor;
+        view: EditorView;
+        state: EditorState;
+        oldState?: EditorState;
+        from: number;
+        to: number;
+    }) => boolean) | null;
+    /**
+     * FloatingUI options.
+     */
+    options?: {
+        strategy?: 'absolute' | 'fixed';
+        placement?: 'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'right-start' | 'right-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end';
+        offset?: Parameters<typeof offset>[0] | boolean;
+        flip?: Parameters<typeof flip>[0] | boolean;
+        shift?: Parameters<typeof shift>[0] | boolean;
+        arrow?: Parameters<typeof arrow>[0] | false;
+        size?: Parameters<typeof size>[0] | boolean;
+        autoPlacement?: Parameters<typeof autoPlacement>[0] | boolean;
+        hide?: Parameters<typeof hide>[0] | boolean;
+        inline?: Parameters<typeof inline>[0] | boolean;
+    };
+}
+
+declare const FloatingMenu: vue.DefineComponent<vue.ExtractPropTypes<{
+    pluginKey: {
+        type: null;
+        default: string;
+    };
+    editor: {
+        type: PropType<FloatingMenuPluginProps["editor"]>;
+        required: true;
+    };
+    options: {
+        type: PropType<FloatingMenuPluginProps["options"]>;
+        default: () => {};
+    };
+    shouldShow: {
+        type: PropType<Exclude<Required<FloatingMenuPluginProps>["shouldShow"], null>>;
+        default: null;
+    };
+}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    pluginKey: {
+        type: null;
+        default: string;
+    };
+    editor: {
+        type: PropType<FloatingMenuPluginProps["editor"]>;
+        required: true;
+    };
+    options: {
+        type: PropType<FloatingMenuPluginProps["options"]>;
+        default: () => {};
+    };
+    shouldShow: {
+        type: PropType<Exclude<Required<FloatingMenuPluginProps>["shouldShow"], null>>;
+        default: null;
+    };
+}>> & Readonly<{}>, {
+    shouldShow: (props: {
+        editor: _tiptap_core.Editor;
+        view: EditorView$1;
+        state: EditorState$1;
+        oldState?: EditorState$1;
+        from: number;
+        to: number;
+    }) => boolean;
+    options: {
+        strategy?: "absolute" | "fixed";
+        placement?: "top" | "right" | "bottom" | "left" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
+        offset?: Parameters<typeof _floating_ui_dom.offset>[0] | boolean;
+        flip?: Parameters<typeof _floating_ui_dom.flip>[0] | boolean;
+        shift?: Parameters<typeof _floating_ui_dom.shift>[0] | boolean;
+        arrow?: Parameters<typeof _floating_ui_dom.arrow>[0] | false;
+        size?: Parameters<typeof _floating_ui_dom.size>[0] | boolean;
+        autoPlacement?: Parameters<typeof _floating_ui_dom.autoPlacement>[0] | boolean;
+        hide?: Parameters<typeof _floating_ui_dom.hide>[0] | boolean;
+        inline?: Parameters<typeof _floating_ui_dom.inline>[0] | boolean;
+    } | undefined;
+    pluginKey: any;
+}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
+
+export { BubbleMenu, FloatingMenu };