reactjs-tiptap-editor 0.3.31 → 0.4.1

package/lib/BaseKit.d.ts

@@ -0,0 +1,481 @@
+import { CharacterCountOptions } from '@tiptap/extensions';
+import { DropcursorOptions } from '@tiptap/extensions';
+import { Editor } from '@tiptap/react';
+import { Extension } from '@tiptap/core';
+import { FocusOptions as FocusOptions_2 } from '@tiptap/extensions';
+import { HardBreakOptions } from '@tiptap/extension-hard-break';
+import { HorizontalRuleOptions } from '@tiptap/extension-horizontal-rule';
+import { ListItemOptions } from '@tiptap/extension-list';
+import { ListKeymapOptions } from '@tiptap/extension-list';
+import { OrderedListOptions } from '@tiptap/extension-list';
+import { ParagraphOptions } from '@tiptap/extension-paragraph';
+import { PlaceholderOptions } from '@tiptap/extensions';
+import { StrikeOptions } from '@tiptap/extension-strike';
+import { TextStyleOptions } from '@tiptap/extension-text-style';
+import { TrailingNodeOptions } from '@tiptap/extensions';
+
+export declare const BaseKit: Extension<BaseKitOptions, any>;
+
+/**
+ * Represents the interface for options in the base toolkit.
+ */
+export declare interface BaseKitOptions {
+    /**
+     * Whether to enable the document option
+     *
+     * @default false
+     */
+    multiColumn?: boolean;
+    /**
+     * character count options or false, indicating whether to enable character count
+     *
+     * @default true
+     */
+    characterCount: Partial<CharacterCountOptions> | false;
+    /**
+     * selection options or false, indicating whether to enable the selection
+     *
+     * @default true
+     */
+    selection: any | false;
+    /**
+     * Focus options or false, indicating whether to enable focus functionality
+     *
+     * @default true
+     */
+    focus: Partial<FocusOptions_2> | false;
+    /**
+     * Placeholder options or false, indicating whether to enable placeholders
+     *
+     * @default true
+     */
+    placeholder: Partial<PlaceholderOptions> | false;
+    /**
+     * textBubble options or false, indicating whether to enable the textBubble
+     *
+     * @default true
+     */
+    textBubble: Partial<TextBubbleOptions> | false;
+    /**
+     * Text Style options or false, indicating whether to enable text style functionality
+     *
+     * @default true
+     */
+    textStyle: Partial<TextStyleOptions> | false;
+    /**
+     * If set to false, the document extension will not be registered
+     * @example document: false
+     */
+    document: false;
+    /**
+     * If set to false, the dropcursor extension will not be registered
+     * @example dropcursor: false
+     */
+    dropcursor: Partial<DropcursorOptions> | false;
+    /**
+     * If set to false, the gapcursor extension will not be registered
+     * @example gapcursor: false
+     */
+    gapcursor: false;
+    /**
+     * If set to false, the hardBreak extension will not be registered
+     * @example hardBreak: false
+     */
+    hardBreak: Partial<HardBreakOptions> | false;
+    /**
+     * If set to false, the horizontalRule extension will not be registered
+     * @example horizontalRule: false
+     */
+    horizontalRule: Partial<HorizontalRuleOptions> | false;
+    /**
+     * If set to false, the listItem extension will not be registered
+     * @example listItem: false
+     */
+    listItem: Partial<ListItemOptions> | false;
+    /**
+     * If set to false, the listItemKeymap extension will not be registered
+     * @example listKeymap: false
+     */
+    listKeymap: Partial<ListKeymapOptions> | false;
+    /**
+     * If set to false, the orderedList extension will not be registered
+     * @example orderedList: false
+     */
+    orderedList: Partial<OrderedListOptions> | false;
+    /**
+     * If set to false, the paragraph extension will not be registered
+     * @example paragraph: false
+     */
+    paragraph: Partial<ParagraphOptions> | false;
+    /**
+     * If set to false, the strike extension will not be registered
+     * @example strike: false
+     */
+    strike: Partial<StrikeOptions> | false;
+    /**
+     * If set to false, the text extension will not be registered
+     * @example text: false
+     */
+    text: false;
+    /**
+     * If set to false, the trailingNode extension will not be registered
+     * @example trailingNode: false
+     */
+    trailingNode: Partial<TrailingNodeOptions> | false;
+}
+
+/**
+ * Represents the ButtonView function.
+ */
+declare type ButtonView<T = any> = (options: ButtonViewParams<T>) => ButtonViewReturn | ButtonViewReturn[];
+
+/**
+ * Represents the parameters for the ButtonView function.
+ */
+declare interface ButtonViewParams<T = any> {
+    /** Editor object */
+    editor: Editor;
+    /** Extension object */
+    extension: Extension<T>;
+    /** Translation function */
+    t: (path: string) => string;
+}
+
+/**
+ * Represents the return value for the ButtonView component.
+ */
+declare interface ButtonViewReturn {
+    /** Component */
+    component: unknown;
+    /** Component props */
+    componentProps: ButtonViewReturnComponentProps;
+    /** Component slots */
+    componentSlots?: ButtonViewReturnComponentSlots;
+}
+
+/**
+ * Represents the props for the ButtonView component.
+ */
+declare interface ButtonViewReturnComponentProps {
+    /** Method triggered when action is performed */
+    action?: (value?: any) => void;
+    /** Whether it is in the active state */
+    isActive?: () => boolean;
+    /** Button icon */
+    icon?: any;
+    /** Text displayed on hover */
+    tooltip?: string;
+    [x: string]: any;
+}
+
+/**
+ * Represents the slots for the ButtonView component.
+ */
+declare interface ButtonViewReturnComponentSlots {
+    /** Dialog slot */
+    dialog: () => any;
+    [x: string]: () => any;
+}
+
+/**
+ * Represents the general options for Tiptap extensions.
+ */
+declare interface GeneralOptions<T> {
+    /** Enabled divider */
+    divider: boolean;
+    /** Enabled spacer */
+    spacer: boolean;
+    /** Button view function */
+    button: ButtonView<T>;
+    /** Show on Toolbar */
+    toolbar?: boolean;
+    /** Shortcut keys override */
+    shortcutKeys?: string[] | string[][];
+}
+
+declare interface TextBubbleOptions extends GeneralOptions<TextBubbleOptions> {
+}
+
+export { }
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        attachment: {
+            setAttachment: (attrs?: unknown) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        setCodeBlock: {
+            setCodeBlock: (options?: any) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        codeView: {
+            /**
+                   * Toggle code view mode
+                   */
+            toggleCodeView: () => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        drawer: {
+            setDrawer: (options: any, replace?: any) => ReturnType;
+            setAlignImageDrawer: (align: 'left' | 'center' | 'right') => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        excalidraw: {
+            setExcalidraw: (attrs?: IExcalidrawAttrs) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        exportPdf: {
+            exportToPdf: () => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        exportWord: {
+            exportToWord: () => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        fontSize: {
+            /**
+             * Set the text font size. ex: "12px", "2em", or "small". Must be a valid
+             * CSS font-size
+             * (https://developer.mozilla.org/en-US/docs/Web/CSS/font-size).
+             */
+            setFontSize: (fontSize: string) => ReturnType;
+            /**
+             * Unset the font size
+             */
+            unsetFontSize: () => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        painter: {
+            setPainter: (marks: Mark[]) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        iframe: {
+            /**
+             * Add an iframe
+             */
+            setIframe: (options: {
+                src: string;
+                service: string;
+            }) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        imageUpload: {
+            /**
+             * Add an image
+             */
+            setImageInline: (options: Partial<SetImageAttrsOptions>) => ReturnType;
+            /**
+             * Update an image
+             */
+            updateImage: (options: Partial<SetImageAttrsOptions>) => ReturnType;
+            /**
+             * Set image alignment
+             */
+            setAlignImage: (align: 'left' | 'center' | 'right') => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        indent: {
+            /**
+             * Set the indent attribute
+             */
+            indent: () => ReturnType;
+            /**
+             * Set the outdent attribute
+             */
+            outdent: () => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        imageGifUpload: {
+            /**
+             * Add an image gif
+             */
+            setImageGif: (options: Partial<SetImageAttrsOptions>) => ReturnType;
+            /**
+             * Update an image gif
+             */
+            updateImageGif: (options: Partial<SetImageAttrsOptions>) => ReturnType;
+            /**
+             * Set image alignment
+             */
+            setAlignImageGif: (align: 'left' | 'center' | 'right') => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        katex: {
+            setKatex: (arg?: IKatexAttrs) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        lineHeight: {
+            setLineHeight: (lineHeight: string) => ReturnType;
+            unsetLineHeight: () => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        mermaid: {
+            setMermaid: (options: any, replace?: any) => ReturnType;
+            setAlignImageMermaid: (align: 'left' | 'center' | 'right') => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        columns: {
+            insertColumns: (attrs?: {
+                cols: number;
+            }) => ReturnType;
+            addColBefore: () => ReturnType;
+            addColAfter: () => ReturnType;
+            deleteCol: () => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        search: {
+            setSearchTerm: (searchTerm: string) => ReturnType;
+            setReplaceTerm: (replaceTerm: string) => ReturnType;
+            setCaseSensitive: (caseSensitive: boolean) => ReturnType;
+            resetIndex: () => ReturnType;
+            nextSearchResult: () => ReturnType;
+            previousSearchResult: () => ReturnType;
+            replace: () => ReturnType;
+            replaceAll: () => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Storage {
+        searchAndReplace: SearchAndReplaceStorage;
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        tableOfContents: {
+            setTableOfContents: () => ReturnType;
+            removeTableOfContents: () => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        twitter: {
+            /**
+             * Insert a tweet
+             * @param options The tweet attributes
+             * @example editor.commands.setTweet({ src: 'https://x.com/seanpk/status/1800145949580517852' })
+             */
+            setTweet: (options: SetTweetOptions) => ReturnType;
+            updateTweet: (options: SetTweetOptions) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        video: {
+            /**
+             * Add an video
+             */
+            setVideo: (options: Partial<SetVideoOptions>) => ReturnType;
+            /**
+             * Update an video
+             */
+            updateVideo: (options: Partial<SetVideoOptions>) => ReturnType;
+        };
+    }
+}
+
+
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        tableCellBackground: {
+            setTableCellBackground: (color: string) => ReturnType;
+            unsetTableCellBackground: () => ReturnType;
+        };
+    }
+}

package/lib/BaseKit.js

@@ -0,0 +1,132 @@
+import { N as c, m, E as g } from "./index-kbO3iWqL.js";
+import { D as k } from "./index-Dy4DlW9o.js";
+import { H as M } from "./index-BBz7Nmv9.js";
+import { L as x, b } from "./index-Ch6dBBad.js";
+import { T as y } from "./index-ByurDDMv.js";
+import { P as T, F as C, C as H, S as B, D as L, G as A, T as N } from "./index-VvXaaKe3.js";
+import { G as S, J as w } from "./RichTextEditor-DGcKEUGr.js";
+import { TextBubble as K } from "./TextBubble.js";
+import { n as h } from "./index-LmrOdnen.js";
+var v = c.create({
+  name: "hardBreak",
+  markdownTokenName: "br",
+  addOptions() {
+    return {
+      keepMarks: !0,
+      HTMLAttributes: {}
+    };
+  },
+  inline: !0,
+  group: "inline",
+  selectable: !1,
+  linebreakReplacement: !0,
+  parseHTML() {
+    return [{ tag: "br" }];
+  },
+  renderHTML({ HTMLAttributes: t }) {
+    return ["br", m(this.options.HTMLAttributes, t)];
+  },
+  renderText() {
+    return `
+`;
+  },
+  renderMarkdown: () => `  
+`,
+  parseMarkdown: () => ({
+    type: "hardBreak"
+  }),
+  addCommands() {
+    return {
+      setHardBreak: () => ({ commands: t, chain: r, state: s, editor: e }) => t.first([
+        () => t.exitCode(),
+        () => t.command(() => {
+          const { selection: i, storedMarks: l } = s;
+          if (i.$from.parent.type.spec.isolating)
+            return !1;
+          const { keepMarks: a } = this.options, { splittableMarks: n } = e.extensionManager, o = l || i.$to.parentOffset && i.$from.marks();
+          return r().insertContent({ type: this.name }).command(({ tr: p, dispatch: u }) => {
+            if (u && o && a) {
+              const f = o.filter((d) => n.includes(d.type.name));
+              p.ensureMarks(f);
+            }
+            return !0;
+          }).run();
+        })
+      ])
+    };
+  },
+  addKeyboardShortcuts() {
+    return {
+      "Mod-Enter": () => this.editor.commands.setHardBreak(),
+      "Shift-Enter": () => this.editor.commands.setHardBreak()
+    };
+  }
+}), E = c.create({
+  name: "paragraph",
+  priority: 1e3,
+  addOptions() {
+    return {
+      HTMLAttributes: {}
+    };
+  },
+  group: "block",
+  content: "inline*",
+  parseHTML() {
+    return [{ tag: "p" }];
+  },
+  renderHTML({ HTMLAttributes: t }) {
+    return ["p", m(this.options.HTMLAttributes, t), 0];
+  },
+  parseMarkdown: (t, r) => {
+    const s = t.tokens || [];
+    return s.length === 1 && s[0].type === "image" ? r.parseChildren([s[0]]) : r.createNode(
+      "paragraph",
+      void 0,
+      // no attributes for paragraph
+      r.parseInline(s)
+    );
+  },
+  renderMarkdown: (t, r) => !t || !Array.isArray(t.content) ? "" : r.renderChildren(t.content),
+  addCommands() {
+    return {
+      setParagraph: () => ({ commands: t }) => t.setNode(this.name)
+    };
+  },
+  addKeyboardShortcuts() {
+    return {
+      "Mod-Alt-0": () => this.editor.commands.setParagraph()
+    };
+  }
+}), P = c.create({
+  name: "text",
+  group: "inline",
+  parseMarkdown: (t) => ({
+    type: "text",
+    text: t.text || ""
+  }),
+  renderMarkdown: (t) => t.text || ""
+});
+const j = /* @__PURE__ */ g.create({
+  name: "base-kit",
+  addExtensions() {
+    var r, s;
+    const t = [];
+    return this.options.placeholder !== !1 && t.push(
+      T.configure({
+        placeholder: ({ node: e, pos: i, editor: l }) => {
+          var a, n, o, p, u;
+          return ((a = e == null ? void 0 : e.type) == null ? void 0 : a.name) === "columns" || ((n = e == null ? void 0 : e.content) == null ? void 0 : n.size) !== 0 ? "" : ((o = e == null ? void 0 : e.type) == null ? void 0 : o.name) === "heading" ? `${h.t(`editor.heading.h${e.attrs.level}.tooltip`)}` : ((p = e == null ? void 0 : e.type) == null ? void 0 : p.name) === "codeBlock" || ((u = e == null ? void 0 : e.type) == null ? void 0 : u.name) === "table" ? "" : l.extensionManager.extensions.some((f) => f.name === "slashCommand") ? h.t("editor.slash") : i === 0 ? h.t("editor.content") : h.t("editor.content");
+        },
+        ...this.options.placeholder
+      })
+    ), this.options.focus !== !1 && t.push(
+      C.configure({
+        className: "focus",
+        ...this.options.focus
+      })
+    ), this.options.textBubble !== !1 && t.push(K.configure()), this.options.characterCount !== !1 && t.push(H.configure(this.options.characterCount)), this.options.textStyle !== !1 && t.push(y.configure(this.options.textStyle)), this.options.selection !== !1 && t.push(B), this.options.multiColumn !== !1 && t.push(S, w), this.options.document !== !1 && t.push(k.configure(this.options.document)), this.options.dropcursor !== !1 && t.push(L.configure(this.options.dropcursor)), this.options.gapcursor !== !1 && t.push(A.configure(this.options.gapcursor)), this.options.hardBreak !== !1 && t.push(v.configure(this.options.hardBreak)), this.options.horizontalRule !== !1 && t.push(M.configure(this.options.horizontalRule)), this.options.listItem !== !1 && t.push(x.configure(this.options.listItem)), this.options.listKeymap !== !1 && t.push(b.configure((r = this.options) == null ? void 0 : r.listKeymap)), this.options.paragraph !== !1 && t.push(E.configure(this.options.paragraph)), this.options.text !== !1 && t.push(P.configure(this.options.text)), this.options.trailingNode !== !1 && t.push(N.configure((s = this.options) == null ? void 0 : s.trailingNode)), t;
+  }
+});
+export {
+  j as BaseKit
+};

package/lib/Blockquote.cjs

@@ -1 +1,5 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./index-ByRfqzMr.cjs"),u=require("./RichTextEditor-DWlLqTl9.cjs"),s=/^\s*>\s$/,c=o.Node.create({name:"blockquote",addOptions(){return{HTMLAttributes:{}}},content:"block+",group:"block",defining:!0,parseHTML(){return[{tag:"blockquote"}]},renderHTML({HTMLAttributes:t}){return["blockquote",o.mergeAttributes(this.options.HTMLAttributes,t),0]},addCommands(){return{setBlockquote:()=>({commands:t})=>t.wrapIn(this.name),toggleBlockquote:()=>({commands:t})=>t.toggleWrap(this.name),unsetBlockquote:()=>({commands:t})=>t.lift(this.name)}},addKeyboardShortcuts(){return{"Mod-Shift-b":()=>this.editor.commands.toggleBlockquote()}},addInputRules(){return[o.wrappingInputRule({find:s,type:this.type})]}}),i=c.extend({addOptions(){var t;return{...(t=this.parent)==null?void 0:t.call(this),HTMLAttributes:{class:"blockquote"},button:({editor:e,t:n,extension:r})=>({component:u.ActionButton,componentProps:{action:()=>e.commands.toggleBlockquote(),isActive:()=>e.isActive("blockquote")||!1,disabled:!e.can().toggleBlockquote(),icon:"TextQuote",shortcutKeys:r.options.shortcutKeys??["shift","mod","B"],tooltip:n("editor.blockquote.tooltip")}})}}});exports.Blockquote=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./index-DF2Lp4HZ.cjs"),s=require("./jsx-runtime-C_NLcKys.cjs"),l=require("./RichTextEditor-CxvwGvQG.cjs");var a=/^\s*>\s$/,d=r.Node3.create({name:"blockquote",addOptions(){return{HTMLAttributes:{}}},content:"block+",group:"block",defining:!0,parseHTML(){return[{tag:"blockquote"}]},renderHTML({HTMLAttributes:t}){return s.h("blockquote",{...r.mergeAttributes(this.options.HTMLAttributes,t),children:s.h("slot",{})})},parseMarkdown:(t,e)=>e.createNode("blockquote",void 0,e.parseChildren(t.tokens||[])),renderMarkdown:(t,e)=>{if(!t.content)return"";const o=">",n=[];return t.content.forEach(u=>{const c=e.renderChildren([u]).split(`
+`).map(i=>i.trim()===""?o:`${o} ${i}`);n.push(c.join(`
+`))}),n.join(`
+${o}
+`)},addCommands(){return{setBlockquote:()=>({commands:t})=>t.wrapIn(this.name),toggleBlockquote:()=>({commands:t})=>t.toggleWrap(this.name),unsetBlockquote:()=>({commands:t})=>t.lift(this.name)}},addKeyboardShortcuts(){return{"Mod-Shift-b":()=>this.editor.commands.toggleBlockquote()}},addInputRules(){return[r.wrappingInputRule({find:a,type:this.type})]}});const p=d.extend({addOptions(){var t;return{...(t=this.parent)==null?void 0:t.call(this),HTMLAttributes:{class:"blockquote"},button:({editor:e,t:o,extension:n})=>({component:l.ActionButton,componentProps:{action:()=>e.commands.toggleBlockquote(),isActive:()=>e.isActive("blockquote")||!1,disabled:!e.can().toggleBlockquote(),icon:"TextQuote",shortcutKeys:n.options.shortcutKeys??["shift","mod","B"],tooltip:o("editor.blockquote.tooltip")}})}}});exports.Blockquote=p;