reactjs-tiptap-editor 0.3.30 → 0.4.0

package/lib/Mention.d.ts

@@ -39,9 +39,8 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        drawer: {
-            setDrawer: (options: any, replace?: any) => ReturnType;
-            setAlignImageDrawer: (align: 'left' | 'center' | 'right') => ReturnType;
+        excalidraw: {
+            setExcalidraw: (attrs?: IExcalidrawAttrs) => ReturnType;
         };
     }
 }
@@ -49,11 +48,9 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        emoji: {
-            setEmoji: (emoji: {
-                name: string;
-                emoji: string;
-            }) => ReturnType;
+        drawer: {
+            setDrawer: (options: any, replace?: any) => ReturnType;
+            setAlignImageDrawer: (align: 'left' | 'center' | 'right') => ReturnType;
         };
     }
 }
@@ -61,8 +58,8 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        excalidraw: {
-            setExcalidraw: (attrs?: IExcalidrawAttrs) => ReturnType;
+        exportPdf: {
+            exportToPdf: () => ReturnType;
         };
     }
 }
@@ -70,8 +67,8 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        exportPdf: {
-            exportToPdf: () => ReturnType;
+        exportWord: {
+            exportToWord: () => ReturnType;
         };
     }
 }
@@ -79,8 +76,8 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        exportWord: {
-            exportToWord: () => ReturnType;
+        painter: {
+            setPainter: (marks: Mark[]) => ReturnType;
         };
     }
 }
@@ -106,8 +103,14 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        painter: {
-            setPainter: (marks: Mark[]) => ReturnType;
+        iframe: {
+            /**
+             * Add an iframe
+             */
+            setIframe: (options: {
+                src: string;
+                service: string;
+            }) => ReturnType;
         };
     }
 }
@@ -133,21 +136,6 @@ declare module '@tiptap/core' {
 }
 
 
-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> {
         imageGifUpload: {
@@ -168,6 +156,15 @@ declare module '@tiptap/core' {
 }
 
 
+declare module '@tiptap/core' {
+    interface Commands<ReturnType> {
+        katex: {
+            setKatex: (arg?: IKatexAttrs) => ReturnType;
+        };
+    }
+}
+
+
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
         indent: {
@@ -186,8 +183,9 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        katex: {
-            setKatex: (arg?: IKatexAttrs) => ReturnType;
+        lineHeight: {
+            setLineHeight: (lineHeight: string) => ReturnType;
+            unsetLineHeight: () => ReturnType;
         };
     }
 }
@@ -195,9 +193,13 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        lineHeight: {
-            setLineHeight: (lineHeight: string) => ReturnType;
-            unsetLineHeight: () => ReturnType;
+        columns: {
+            insertColumns: (attrs?: {
+                cols: number;
+            }) => ReturnType;
+            addColBefore: () => ReturnType;
+            addColAfter: () => ReturnType;
+            deleteCol: () => ReturnType;
         };
     }
 }
@@ -215,13 +217,9 @@ declare module '@tiptap/core' {
 
 declare module '@tiptap/core' {
     interface Commands<ReturnType> {
-        columns: {
-            insertColumns: (attrs?: {
-                cols: number;
-            }) => ReturnType;
-            addColBefore: () => ReturnType;
-            addColAfter: () => ReturnType;
-            deleteCol: () => ReturnType;
+        tableOfContents: {
+            setTableOfContents: () => ReturnType;
+            removeTableOfContents: () => ReturnType;
         };
     }
 }
@@ -232,22 +230,20 @@ declare module '@tiptap/core' {
         search: {
             setSearchTerm: (searchTerm: string) => ReturnType;
             setReplaceTerm: (replaceTerm: string) => ReturnType;
+            setCaseSensitive: (caseSensitive: boolean) => ReturnType;
+            resetIndex: () => ReturnType;
+            nextSearchResult: () => ReturnType;
+            previousSearchResult: () => ReturnType;
             replace: () => ReturnType;
             replaceAll: () => ReturnType;
-            goToPrevSearchResult: () => void;
-            goToNextSearchResult: () => void;
-            setCaseSensitive: (caseSensitive: boolean) => ReturnType;
         };
     }
 }
 
 
 declare module '@tiptap/core' {
-    interface Commands<ReturnType> {
-        tableOfContents: {
-            setTableOfContents: () => ReturnType;
-            removeTableOfContents: () => ReturnType;
-        };
+    interface Storage {
+        searchAndReplace: SearchAndReplaceStorage;
     }
 }
 

package/lib/Mention.js

@@ -1,67 +1,73 @@
-import { N as v, q as L, m as c, a as M } from "./index-DI9T3iLd.js";
-import { S as w } from "./index-CbQQFj2T.js";
-import { c as h, g as f, a as H } from "./dom-dataset-Di3tIRrR.js";
-import S from "tippy.js";
+import { c as f, g as p, a as L, b as M } from "./dom-dataset-lYeH6gfI.js";
+import { N as v, s as w, u as H, m as c, a as S } from "./index-kbO3iWqL.js";
+import { S as C } from "./index-J3jHHZ4d.js";
 import { jsx as m } from "react/jsx-runtime";
-import { forwardRef as A, useRef as U, useState as _, useEffect as b, useImperativeHandle as x } from "react";
-import C from "scroll-into-view-if-needed";
-function N({ editor: e, overrideSuggestionOptions: n, extensionName: t, char: r = "@" }) {
-  const i = new M();
+import { forwardRef as A, useRef as x, useState as U, useEffect as b, useImperativeHandle as _ } from "react";
+import N from "scroll-into-view-if-needed";
+function $({
+  editor: e,
+  overrideSuggestionOptions: r,
+  extensionName: n,
+  char: t = "@"
+}) {
+  const s = new S();
   return {
     editor: e,
-    char: r,
-    pluginKey: i,
-    command: ({ editor: o, range: l, props: u }) => {
-      var a, s, d;
-      const p = o.view.state.selection.$to.nodeAfter;
-      ((a = p == null ? void 0 : p.text) === null || a === void 0 ? void 0 : a.startsWith(" ")) && (l.to += 1), o.chain().focus().insertContentAt(l, [
+    char: t,
+    pluginKey: s,
+    command: ({ editor: i, range: a, props: d }) => {
+      var u, o, l;
+      const h = i.view.state.selection.$to.nodeAfter;
+      ((u = h == null ? void 0 : h.text) == null ? void 0 : u.startsWith(" ")) && (a.to += 1), i.chain().focus().insertContentAt(a, [
         {
-          type: t,
-          attrs: { ...u, mentionSuggestionChar: r }
+          type: n,
+          attrs: { ...d, mentionSuggestionChar: t }
         },
         {
           type: "text",
           text: " "
         }
-      ]).run(), (d = (s = o.view.dom.ownerDocument.defaultView) === null || s === void 0 ? void 0 : s.getSelection()) === null || d === void 0 || d.collapseToEnd();
+      ]).run(), (l = (o = i.view.dom.ownerDocument.defaultView) == null ? void 0 : o.getSelection()) == null || l.collapseToEnd();
     },
-    allow: ({ state: o, range: l }) => {
-      const u = o.doc.resolve(l.from), a = o.schema.nodes[t];
-      return !!u.parent.type.contentMatch.matchType(a);
+    allow: ({ state: i, range: a }) => {
+      const d = i.doc.resolve(a.from), u = i.schema.nodes[n];
+      return !!d.parent.type.contentMatch.matchType(u);
     },
-    ...n
+    ...r
   };
 }
 function T(e) {
-  return (e.options.suggestions.length ? e.options.suggestions : [e.options.suggestion]).map((n) => N({
-    // @ts-ignore `editor` can be `undefined` when converting the document to HTML with the HTML utility
-    editor: e.editor,
-    overrideSuggestionOptions: n,
-    extensionName: e.name,
-    char: n.char
-  }));
+  return (e.options.suggestions.length ? e.options.suggestions : [e.options.suggestion]).map(
+    (r) => $({
+      // @ts-ignore `editor` can be `undefined` when converting the document to HTML with the HTML utility
+      editor: e.editor,
+      overrideSuggestionOptions: r,
+      extensionName: e.name,
+      char: r.char
+    })
+  );
 }
-function y(e, n) {
-  const t = T(e), r = t.find((i) => i.char === n);
-  return r || (t.length ? t[0] : null);
+function y(e, r) {
+  const n = T(e), t = n.find((s) => s.char === r);
+  return t || (n.length ? n[0] : null);
 }
-const R = v.create({
+var k = v.create({
   name: "mention",
   priority: 101,
   addOptions() {
     return {
       HTMLAttributes: {},
-      renderText({ node: e, suggestion: n }) {
-        var t, r;
-        return `${(t = n == null ? void 0 : n.char) !== null && t !== void 0 ? t : "@"}${(r = e.attrs.label) !== null && r !== void 0 ? r : e.attrs.id}`;
+      renderText({ node: e, suggestion: r }) {
+        var n, t;
+        return `${(n = r == null ? void 0 : r.char) != null ? n : "@"}${(t = e.attrs.label) != null ? t : e.attrs.id}`;
       },
       deleteTriggerWithBackspace: !1,
-      renderHTML({ options: e, node: n, suggestion: t }) {
-        var r, i;
+      renderHTML({ options: e, node: r, suggestion: n }) {
+        var t, s;
         return [
           "span",
           c(this.HTMLAttributes, e.HTMLAttributes),
-          `${(r = t == null ? void 0 : t.char) !== null && r !== void 0 ? r : "@"}${(i = n.attrs.label) !== null && i !== void 0 ? i : n.attrs.id}`
+          `${(t = n == null ? void 0 : n.char) != null ? t : "@"}${(s = r.attrs.label) != null ? s : r.attrs.id}`
         ];
       },
       suggestions: [],
@@ -105,93 +111,100 @@ const R = v.create({
       }
     ];
   },
-  renderHTML({ node: e, HTMLAttributes: n }) {
-    const t = y(this, e.attrs.mentionSuggestionChar);
+  renderHTML({ node: e, HTMLAttributes: r }) {
+    const n = y(this, e.attrs.mentionSuggestionChar);
     if (this.options.renderLabel !== void 0)
       return console.warn("renderLabel is deprecated use renderText and renderHTML instead"), [
         "span",
-        c({ "data-type": this.name }, this.options.HTMLAttributes, n),
+        c({ "data-type": this.name }, this.options.HTMLAttributes, r),
         this.options.renderLabel({
           options: this.options,
           node: e,
-          suggestion: t
+          suggestion: n
         })
       ];
-    const r = { ...this.options };
-    r.HTMLAttributes = c({ "data-type": this.name }, this.options.HTMLAttributes, n);
-    const i = this.options.renderHTML({
-      options: r,
+    const t = { ...this.options };
+    t.HTMLAttributes = c(
+      { "data-type": this.name },
+      this.options.HTMLAttributes,
+      r
+    );
+    const s = this.options.renderHTML({
+      options: t,
       node: e,
-      suggestion: t
+      suggestion: n
     });
-    return typeof i == "string" ? [
-      "span",
-      c({ "data-type": this.name }, this.options.HTMLAttributes, n),
-      i
-    ] : i;
+    return typeof s == "string" ? ["span", c({ "data-type": this.name }, this.options.HTMLAttributes, r), s] : s;
   },
+  ...w({
+    nodeName: "mention",
+    name: "@",
+    selfClosing: !0,
+    allowedAttributes: ["id", "label"]
+  }),
   renderText({ node: e }) {
-    const n = {
+    const r = {
       options: this.options,
       node: e,
       suggestion: y(this, e.attrs.mentionSuggestionChar)
     };
-    return this.options.renderLabel !== void 0 ? (console.warn("renderLabel is deprecated use renderText and renderHTML instead"), this.options.renderLabel(n)) : this.options.renderText(n);
+    return this.options.renderLabel !== void 0 ? (console.warn("renderLabel is deprecated use renderText and renderHTML instead"), this.options.renderLabel(r)) : this.options.renderText(r);
   },
   addKeyboardShortcuts() {
     return {
-      Backspace: () => this.editor.commands.command(({ tr: e, state: n }) => {
-        let t = !1;
-        const { selection: r } = n, { empty: i, anchor: o } = r;
-        if (!i)
+      Backspace: () => this.editor.commands.command(({ tr: e, state: r }) => {
+        let n = !1;
+        const { selection: t } = r, { empty: s, anchor: i } = t;
+        if (!s)
           return !1;
-        n.doc.nodesBetween(o - 1, o, (a, s) => {
-          if (a.type.name === this.name)
-            return t = !0, e.insertText(this.options.deleteTriggerWithBackspace ? "" : this.options.suggestion.char || "", s, s + a.nodeSize), !1;
-        });
-        let l = new L(), u = 0;
-        return n.doc.nodesBetween(o - 1, o, (a, s) => {
-          if (a.type.name === this.name)
-            return t = !0, l = a, u = s, !1;
-        }), t && e.insertText(this.options.deleteTriggerWithBackspace ? "" : l.attrs.mentionSuggestionChar, u, u + l.nodeSize), t;
+        let a = new H(), d = 0;
+        return r.doc.nodesBetween(i - 1, i, (u, o) => {
+          if (u.type.name === this.name)
+            return n = !0, a = u, d = o, !1;
+        }), n && e.insertText(
+          this.options.deleteTriggerWithBackspace ? "" : a.attrs.mentionSuggestionChar,
+          d,
+          d + a.nodeSize
+        ), n;
       })
     };
   },
   addProseMirrorPlugins() {
-    return T(this).map(w);
+    return T(this).map(C);
   }
-}), $ = "_listUsers_en3pm_1", k = "_itemUser_en3pm_10", D = "_selectedUser_en3pm_31", g = {
-  listUsers: $,
-  itemUser: k,
-  selectedUser: D
-}, E = A((e, n) => {
-  const t = U(null), [r, i] = _(0), o = (s) => {
-    const d = e.items[s];
-    d && e.command({ id: d, label: d });
-  }, l = () => {
-    i((r + e.items.length - 1) % e.items.length);
-  }, u = () => {
-    i((r + 1) % e.items.length);
+}), E = k;
+const D = "_listUsers_en3pm_1", R = "_itemUser_en3pm_10", K = "_selectedUser_en3pm_31", g = {
+  listUsers: D,
+  itemUser: R,
+  selectedUser: K
+}, B = A((e, r) => {
+  const n = x(null), [t, s] = U(0), i = (o) => {
+    const l = e.items[o];
+    l && (e.command({ id: l, label: l }), e != null && e.onClose && (e == null || e.onClose()));
   }, a = () => {
-    o(r);
+    s((t + e.items.length - 1) % e.items.length);
+  }, d = () => {
+    s((t + 1) % e.items.length);
+  }, u = () => {
+    i(t);
   };
-  return b(() => i(0), [e.items]), b(() => {
-    if (Number.isNaN(r + 1))
+  return b(() => s(0), [e.items]), b(() => {
+    if (Number.isNaN(t + 1))
       return;
-    const s = t.current.querySelector(`span:nth-of-type(${r + 1})`);
-    s && C(s, { behavior: "smooth", scrollMode: "if-needed" });
-  }, [r]), x(n, () => ({
-    onKeyDown: ({ event: s }) => s.key === "ArrowUp" ? (l(), !0) : s.key === "ArrowDown" ? (u(), !0) : s.key === "Enter" ? (a(), !0) : !1
-  })), /* @__PURE__ */ m("div", { className: h("listUsers", g.listUsers), children: /* @__PURE__ */ m("div", { ref: t, children: e.items.length > 0 ? e.items.map((s, d) => /* @__PURE__ */ m(
+    const o = n.current.querySelector(`span:nth-of-type(${t + 1})`);
+    o && N(o, { behavior: "smooth", scrollMode: "if-needed" });
+  }, [t]), _(r, () => ({
+    onKeyDown: ({ event: o }) => o.key === "ArrowUp" ? (a(), !0) : o.key === "ArrowDown" ? (d(), !0) : o.key === "Enter" ? (u(), !0) : !1
+  })), /* @__PURE__ */ m("div", { className: f("listUsers", g.listUsers), children: /* @__PURE__ */ m("div", { ref: n, children: e.items.length > 0 ? e.items.map((o, l) => /* @__PURE__ */ m(
     "span",
     {
-      className: h("itemUser", g.itemUser, d === r ? g.selectedUser : ""),
-      onClick: () => o(d),
-      children: s
+      className: f("itemUser", g.itemUser, l === t ? g.selectedUser : ""),
+      onClick: () => i(l),
+      children: o
     },
-    d
-  )) : /* @__PURE__ */ m("div", { className: h("itemUserEmpty", g.itemUser), children: "Empty" }) }) });
-}), B = [
+    l
+  )) : /* @__PURE__ */ m("div", { className: f("itemUserEmpty", g.itemUser), children: "Empty" }) }) });
+}), I = [
   {
     id: "1",
     name: "John Doe"
@@ -208,49 +221,16 @@ const R = v.create({
     id: "4",
     name: "Bob"
   }
-], K = {
-  items: async ({ query: e }) => B.map((t) => t.name).filter((t) => t.toLowerCase().startsWith(e.toLowerCase())),
-  render: () => {
-    let e, n;
-    return {
-      onStart: (t) => {
-        e = new H(E, {
-          props: t,
-          editor: t.editor
-        }), n = S("body", {
-          getReferenceClientRect: t.clientRect,
-          appendTo: () => document.body,
-          content: e.element,
-          showOnCreate: !0,
-          interactive: !0,
-          trigger: "manual",
-          placement: "bottom-start"
-        });
-      },
-      onUpdate(t) {
-        e.updateProps(t), n[0].setProps({
-          getReferenceClientRect: t.clientRect
-        });
-      },
-      onKeyDown(t) {
-        var r;
-        return t.event.key === "Escape" ? (n[0].hide(), !0) : (r = e.ref) == null ? void 0 : r.onKeyDown(t);
-      },
-      onExit() {
-        n[0].destroy(), e.destroy();
-      }
-    };
-  }
-}, j = /* @__PURE__ */ R.extend({
+], z = /* @__PURE__ */ E.extend({
   addAttributes() {
     return {
       id: {
         default: "",
-        parseHTML: f("id")
+        parseHTML: p("id")
       },
       label: {
         default: "",
-        parseHTML: f("label")
+        parseHTML: p("label")
       }
     };
   }
@@ -258,8 +238,57 @@ const R = v.create({
   HTMLAttributes: {
     class: "mention"
   },
-  suggestion: K
+  suggestion: {
+    items: async ({ query: e }) => I.map((n) => n.name).filter((n) => n.toLowerCase().startsWith(e.toLowerCase())),
+    render: () => {
+      let e;
+      function r(t) {
+        if (!e || !e.element)
+          return;
+        M({
+          getBoundingClientRect() {
+            return t;
+          }
+        }, e.element, {
+          placement: "bottom-start"
+        }).then((i) => {
+          Object.assign(e.element.style, {
+            left: `${i.x}px`,
+            top: `${i.y}px`,
+            position: i.strategy === "fixed" ? "fixed" : "absolute"
+          });
+        });
+      }
+      const n = () => {
+        e && (document.body.contains(e.element) && document.body.removeChild(e.element), e.destroy());
+      };
+      return {
+        onStart: (t) => {
+          n(), e = new L(B, {
+            props: {
+              ...t,
+              onClose: n
+            },
+            editor: t.editor
+          }), document.body.appendChild(e.element), r(t.clientRect());
+        },
+        onUpdate(t) {
+          e.updateProps(t), r(t.clientRect());
+        },
+        onKeyDown(t) {
+          var s;
+          return t.event.key === "Escape" ? (document.body.removeChild(e.element), e.destroy(), !0) : (s = e.ref) == null ? void 0 : s.onKeyDown(t);
+        }
+        // onExit() {
+        //   if (document.body.contains(component.element)) {
+        //     document.body.removeChild(component.element);
+        //   }
+        //   component.destroy();
+        // },
+      };
+    }
+  }
 });
 export {
-  j as Mention
+  z as Mention
 };

package/lib/Mermaid.cjs

@@ -1,2 +1,2 @@
-"use strict";var W=Object.create;var G=Object.defineProperty;var X=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var Z=Object.getPrototypeOf,Y=Object.prototype.hasOwnProperty;var J=(t,e,r,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let l of U(e))!Y.call(t,l)&&l!==r&&G(t,l,{get:()=>e[l],enumerable:!(a=X(e,l))||a.enumerable});return t};var K=(t,e,r)=>(r=t!=null?W(Z(t)):{},J(e||!t||!t.__esModule?G(r,"default",{value:t,enumerable:!0}):r,t));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("./index-ByRfqzMr.cjs"),u=require("./RichTextEditor-C8Sm1E6J.cjs"),F=require("./dom-dataset-Byuf1YmW.cjs"),o=require("react/jsx-runtime"),s=require("react"),P=require("./shortId-Bfj8TyNr.cjs"),Q=require("./textarea-D5WVZMgt.cjs"),S=require("./index-D_A0TBRA.cjs"),$=`graph TB
-a-->b`,ee=({editor:t,upload:e})=>{const[r,a]=s.useState($),[l,v]=s.useState(""),[T,y]=s.useState(!1),A=s.useRef(null),[d,h]=s.useState(null),E=s.useCallback(c=>{c&&import("mermaid").then(x=>{h(x.default)})},[]),_=async c=>{try{const{svg:x}=await d.render("mermaid-svg",c);v(x)}catch{v("")}},L=()=>{d.initialize({darkMode:!1,startOnLoad:!1,fontSize:12,theme:"base"}),_(r)};s.useEffect(()=>{d&&T&&L()},[d,T]),s.useEffect(()=>{d&&T&&_(r)},[d&&r]);const R=async()=>{if(r!==""){if(r){const c=A.current.querySelector("svg"),{width:x,height:j}=c.getBoundingClientRect(),I=`mermaid-${P.shortId()}.svg`;let M=P.i(c.outerHTML);if(e){console.log({src:M});const H=u.dataURLtoFile(M,I);M=await e(H)}t==null||t.chain().focus().setMermaid({type:"mermaid",src:M,alt:encodeURIComponent(r),width:x,height:j},!!r).run()}y(!1)}};return o.jsxs(u.Dialog,{onOpenChange:y,open:T,children:[o.jsx(u.DialogTrigger,{asChild:!0,children:o.jsx(u.ActionButton,{action:()=>y(!0),icon:"Mermaid",tooltip:"Mermaid"})}),o.jsxs(u.DialogContent,{className:"richtext-z-[99999] !richtext-max-w-[1300px]",children:[o.jsx(u.DialogTitle,{children:"Mermaid"}),o.jsx("div",{ref:E,style:{height:"100%",border:"1px solid hsl(var(--border))"},children:o.jsxs("div",{className:"richtext-flex richtext-gap-[10px] richtext-rounded-[10px] richtext-p-[10px]",children:[o.jsx(Q.Textarea,{autoFocus:!0,className:"richtext-flex-1",defaultValue:$,onChange:c=>a(c.target.value),placeholder:"Text",required:!0,rows:10,value:r,style:{color:"hsl(var(--richtext-foreground))"}}),o.jsx("div",{className:"richtext-flex richtext-flex-1 richtext-items-center richtext-justify-center richtext-rounded-[10px] richtext-p-[10px]",dangerouslySetInnerHTML:{__html:l},ref:A,style:{height:"100%",borderWidth:1,minHeight:500,background:"#fff"}})]})}),o.jsx(u.DialogFooter,{children:o.jsx(u.Button,{onClick:R,type:"button",children:"Save changes"})})]})]})},O={TOP_LEFT:"tl",TOP_RIGHT:"tr",BOTTOM_LEFT:"bl",BOTTOM_RIGHT:"br"};function te({editor:t,node:e,updateAttributes:r,getPos:a,selected:l}){const[v,T]=s.useState({width:S.IMAGE_MAX_SIZE,height:S.IMAGE_MAX_SIZE}),[y,A]=s.useState({width:0,height:0}),[d]=s.useState([O.TOP_LEFT,O.TOP_RIGHT,O.BOTTOM_LEFT,O.BOTTOM_RIGHT]),[h,E]=s.useState(!1),[_,L]=s.useState({x:0,y:0,w:0,h:0,dir:""}),{align:R}=e==null?void 0:e.attrs,c=s.useMemo(()=>{const{src:i,alt:m,width:f,height:b}=e==null?void 0:e.attrs,w=q.isNumber(f)?`${f}px`:f,n=q.isNumber(b)?`${b}px`:b;return{src:i||void 0,alt:m||void 0,style:{width:w||void 0,height:n||void 0}}},[e==null?void 0:e.attrs]),x=s.useMemo(()=>{const{style:{width:i}}=c;return{width:i==="100%"?i:void 0}},[c]);function j(i){A({width:i.target.width,height:i.target.height})}function I(){t.commands.setNodeSelection(a())}const M=s.useCallback(u.throttle(()=>{const{width:i}=getComputedStyle(t.view.dom);T(m=>({...m,width:Number.parseInt(i,10)}))},S.IMAGE_THROTTLE_WAIT_TIME),[t]);function H(i,m){i.preventDefault(),i.stopPropagation();const f=y.width,b=y.height,w=f/b;let n=Number(e.attrs.width),p=Number(e.attrs.height);const g=v.width;n&&!p?(n=n>g?g:n,p=Math.round(n/w)):p&&!n?(n=Math.round(p*w),n=n>g?g:n):!n&&!p?(n=f>g?g:f,p=Math.round(n/w)):n=n>g?g:n,E(!0),L({x:i.clientX,y:i.clientY,w:n,h:p,dir:m})}const N=s.useCallback(u.throttle(i=>{if(i.preventDefault(),i.stopPropagation(),!h)return;const{x:m,w:f,dir:b}=_,w=(i.clientX-m)*(/l/.test(b)?-1:1),{width:n,height:p}=e==null?void 0:e.attrs,g=n/p,B=u.clamp(f+w,S.IMAGE_MIN_SIZE,v.width),V=Math.round(B/g);r({width:B,height:V})},S.IMAGE_THROTTLE_WAIT_TIME),[h,_,v,r,e==null?void 0:e.attrs]),C=s.useCallback(i=>{i.preventDefault(),i.stopPropagation(),h&&(L({x:0,y:0,w:0,h:0,dir:""}),E(!1),I())},[h,I]),D=s.useCallback(()=>{document==null||document.addEventListener("mousemove",N,!0),document==null||document.addEventListener("mouseup",C,!0)},[N,C]),z=s.useCallback(()=>{document==null||document.removeEventListener("mousemove",N,!0),document==null||document.removeEventListener("mouseup",C,!0)},[N,C]);s.useEffect(()=>(h?D():z(),()=>{z()}),[h,D,z]);const k=s.useMemo(()=>new ResizeObserver(()=>M()),[M]);return s.useEffect(()=>(k.observe(t.view.dom),()=>{k.disconnect()}),[t.view.dom,k]),o.jsx(F.NodeViewWrapper,{className:"image-view",style:{...x,width:"100%",textAlign:R},children:o.jsxs("div",{"data-drag-handle":!0,draggable:"true",style:{...x,background:"#fff"},className:`image-view__body ${l?"image-view__body--focused":""} ${h?"image-view__body--resizing":""}`,children:[o.jsx("img",{alt:c.alt,className:"image-view__body__image block",height:"auto",onClick:I,onLoad:j,src:c.src,style:c.style}),t.view.editable&&(l||h)&&o.jsx("div",{className:"image-resizer",children:d==null?void 0:d.map(i=>o.jsx("span",{className:`image-resizer__handler image-resizer__handler--${i}`,onMouseDown:m=>H(m,i)},`image-dir-${i}`))})]})})}const re=u.Image.extend({name:"mermaid",addOptions(){var t;return{...(t=this.parent)==null?void 0:t.call(this),inline:!1,content:"",marks:"",group:"block",draggable:!1,selectable:!0,atom:!0,HTMLAttributes:{class:"mermaid"},button:({editor:e,t:r,extension:a})=>{var l;return{component:ee,componentProps:{action:()=>!0,isActive:()=>!1,disabled:!1,editor:e,icon:"Mermaid",tooltip:r("editor.mermaid.tooltip"),upload:(l=a==null?void 0:a.options)==null?void 0:l.upload}}}}},addAttributes(){var t;return{...(t=this.parent)==null?void 0:t.call(this),width:{default:null,parseHTML:e=>{const r=e.querySelector("img"),a=r==null?void 0:r.getAttribute("width");return a?Number.parseInt(a,10):320},renderHTML:e=>({width:e.width})},height:{default:null,parseHTML:e=>{const r=e.querySelector("img"),a=r==null?void 0:r.getAttribute("height");return a?Number.parseInt(a,10):212},renderHTML:e=>({height:e.height})},align:{default:"center",parseHTML:e=>e.getAttribute("align"),renderHTML:e=>({align:e.align})}}},addNodeView(){return F.ReactNodeViewRenderer(te)},addCommands(){return{setMermaid:(t,e)=>({commands:r,editor:a})=>e?r.insertContent({type:this.name,attrs:t}):r.insertContentAt(a.state.selection.anchor,{type:this.name,attrs:t}),setAlignImageMermaid:t=>({commands:e})=>e.updateAttributes(this.name,{align:t})}},renderHTML({HTMLAttributes:t}){const{align:e}=t;return["div",{style:e?`text-align: ${e};`:"",class:"imageMermaid"},["img",q.mergeAttributes(this.options.HTMLAttributes,t)]]},parseHTML(){return[{tag:"div[class=imageMermaid]",getAttrs:t=>{const e=t.querySelector("img"),r=e==null?void 0:e.getAttribute("width"),a=e==null?void 0:e.getAttribute("height");return{src:e==null?void 0:e.getAttribute("src"),alt:e==null?void 0:e.getAttribute("alt"),width:r?Number.parseInt(r,10):null,height:a?Number.parseInt(a,10):null,align:(e==null?void 0:e.getAttribute("align"))||t.style.textAlign||null}}}]}});exports.Mermaid=re;
+"use strict";var W=Object.create;var G=Object.defineProperty;var X=Object.getOwnPropertyDescriptor;var U=Object.getOwnPropertyNames;var Z=Object.getPrototypeOf,Y=Object.prototype.hasOwnProperty;var J=(t,e,i,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let c of U(e))!Y.call(t,c)&&c!==i&&G(t,c,{get:()=>e[c],enumerable:!(r=X(e,c))||r.enumerable});return t};var K=(t,e,i)=>(i=t!=null?W(Z(t)):{},J(e||!t||!t.__esModule?G(i,"default",{value:t,enumerable:!0}):i,t));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("./index-DF2Lp4HZ.cjs"),u=require("./RichTextEditor-CxvwGvQG.cjs"),F=require("./dom-dataset-_6-diIRQ.cjs"),o=require("react/jsx-runtime"),a=require("react"),P=require("./shortId-Bfj8TyNr.cjs"),Q=require("./textarea-DFo_aXnj.cjs"),E=require("./index-6D1J-A-o.cjs"),$=`graph TB
+a-->b`,ee=({editor:t,upload:e,tooltipOptions:i})=>{const[r,c]=a.useState($),[y,L]=a.useState(""),[p,I]=a.useState(!1),v=a.useRef(null),[l,N]=a.useState(null),C=a.useCallback(d=>{d&&import("mermaid").then(M=>{N(M.default)})},[]),S=async d=>{try{const{svg:M}=await l.render("mermaid-svg",d);L(M)}catch{L("")}},H=()=>{l.initialize({darkMode:!1,startOnLoad:!1,fontSize:12,theme:"base"}),S(r)};a.useEffect(()=>{l&&p&&H()},[l,p]),a.useEffect(()=>{l&&p&&S(r)},[l&&r]);const x=async()=>{if(r!==""){if(r){const d=v.current.querySelector("svg"),{width:M,height:A}=d.getBoundingClientRect(),O=`mermaid-${P.shortId()}.svg`;let T=P.i(d.outerHTML);if(e){console.log({src:T});const _=u.dataURLtoFile(T,O);T=await e(_)}t==null||t.chain().focus().setMermaid({type:"mermaid",src:T,alt:encodeURIComponent(r),width:M,height:A},!!r).run()}I(!1)}};return o.jsxs(u.Dialog,{onOpenChange:I,open:p,children:[o.jsx(u.DialogTrigger,{asChild:!0,children:o.jsx(u.ActionButton,{action:()=>I(!0),icon:"Mermaid",tooltip:"Mermaid",tooltipOptions:i})}),o.jsxs(u.DialogContent,{className:"richtext-z-[99999] !richtext-max-w-[1300px]",children:[o.jsx(u.DialogTitle,{children:"Mermaid"}),o.jsx("div",{ref:C,style:{height:"100%",border:"1px solid hsl(var(--border))"},children:o.jsxs("div",{className:"richtext-flex richtext-gap-[10px] richtext-rounded-[10px] richtext-p-[10px]",children:[o.jsx(Q.Textarea,{autoFocus:!0,className:"richtext-flex-1",defaultValue:$,onChange:d=>c(d.target.value),placeholder:"Text",required:!0,rows:10,value:r,style:{color:"hsl(var(--richtext-foreground))"}}),o.jsx("div",{className:"richtext-flex richtext-flex-1 richtext-items-center richtext-justify-center richtext-rounded-[10px] richtext-p-[10px]",dangerouslySetInnerHTML:{__html:y},ref:v,style:{height:"100%",borderWidth:1,minHeight:500,background:"#fff"}})]})}),o.jsx(u.DialogFooter,{children:o.jsx(u.Button,{onClick:x,type:"button",children:"Save changes"})})]})]})},j={TOP_LEFT:"tl",TOP_RIGHT:"tr",BOTTOM_LEFT:"bl",BOTTOM_RIGHT:"br"};function te({editor:t,node:e,updateAttributes:i,getPos:r,selected:c}){const[y,L]=a.useState({width:E.IMAGE_MAX_SIZE,height:E.IMAGE_MAX_SIZE}),[p,I]=a.useState({width:0,height:0}),[v]=a.useState([j.TOP_LEFT,j.TOP_RIGHT,j.BOTTOM_LEFT,j.BOTTOM_RIGHT]),[l,N]=a.useState(!1),[C,S]=a.useState({x:0,y:0,w:0,h:0,dir:""}),{align:H}=e==null?void 0:e.attrs,x=a.useMemo(()=>{const{src:s,alt:g,width:m,height:b}=e==null?void 0:e.attrs,w=q.isNumber(m)?`${m}px`:m,n=q.isNumber(b)?`${b}px`:b;return{src:s||void 0,alt:g||void 0,style:{width:w||void 0,height:n||void 0}}},[e==null?void 0:e.attrs]),d=a.useMemo(()=>{const{style:{width:s}}=x;return{width:s==="100%"?s:void 0}},[x]);function M(s){I({width:s.target.width,height:s.target.height})}function A(){t.commands.setNodeSelection(r())}const O=a.useCallback(u.throttle(()=>{const{width:s}=getComputedStyle(t.view.dom);L(g=>({...g,width:Number.parseInt(s,10)}))},E.IMAGE_THROTTLE_WAIT_TIME),[t]);function T(s,g){s.preventDefault(),s.stopPropagation();const m=p.width,b=p.height,w=m/b;let n=Number(e.attrs.width),f=Number(e.attrs.height);const h=y.width;n&&!f?(n=n>h?h:n,f=Math.round(n/w)):f&&!n?(n=Math.round(f*w),n=n>h?h:n):!n&&!f?(n=m>h?h:m,f=Math.round(n/w)):n=n>h?h:n,N(!0),S({x:s.clientX,y:s.clientY,w:n,h:f,dir:g})}const _=a.useCallback(u.throttle(s=>{if(s.preventDefault(),s.stopPropagation(),!l)return;const{x:g,w:m,dir:b}=C,w=(s.clientX-g)*(/l/.test(b)?-1:1),{width:n,height:f}=e==null?void 0:e.attrs,h=n/f,B=u.clamp(m+w,E.IMAGE_MIN_SIZE,y.width),V=Math.round(B/h);i({width:B,height:V})},E.IMAGE_THROTTLE_WAIT_TIME),[l,C,y,i,e==null?void 0:e.attrs]),R=a.useCallback(s=>{s.preventDefault(),s.stopPropagation(),l&&(S({x:0,y:0,w:0,h:0,dir:""}),N(!1),A())},[l,A]),D=a.useCallback(()=>{document==null||document.addEventListener("mousemove",_,!0),document==null||document.addEventListener("mouseup",R,!0)},[_,R]),z=a.useCallback(()=>{document==null||document.removeEventListener("mousemove",_,!0),document==null||document.removeEventListener("mouseup",R,!0)},[_,R]);a.useEffect(()=>(l?D():z(),()=>{z()}),[l,D,z]);const k=a.useMemo(()=>new ResizeObserver(()=>O()),[O]);return a.useEffect(()=>(k.observe(t.view.dom),()=>{k.disconnect()}),[t.view.dom,k]),o.jsx(F.NodeViewWrapper,{className:"image-view",style:{...d,width:"100%",textAlign:H},children:o.jsxs("div",{"data-drag-handle":!0,draggable:"true",style:{...d,background:"#fff"},className:`image-view__body ${c?"image-view__body--focused":""} ${l?"image-view__body--resizing":""}`,children:[o.jsx("img",{alt:x.alt,className:"image-view__body__image block",height:"auto",onClick:A,onLoad:M,src:x.src,style:x.style}),t.view.editable&&(c||l)&&o.jsx("div",{className:"image-resizer",children:v==null?void 0:v.map(s=>o.jsx("span",{className:`image-resizer__handler image-resizer__handler--${s}`,onMouseDown:g=>T(g,s)},`image-dir-${s}`))})]})})}const re=u.index_default.extend({name:"mermaid",addOptions(){var t;return{...(t=this.parent)==null?void 0:t.call(this),inline:!1,content:"",marks:"",group:"block",draggable:!1,selectable:!0,atom:!0,HTMLAttributes:{class:"mermaid"},button:({editor:e,t:i,extension:r})=>{var c;return{component:ee,componentProps:{action:()=>!0,isActive:()=>!1,disabled:!1,editor:e,icon:"Mermaid",tooltip:i("editor.mermaid.tooltip"),upload:(c=r==null?void 0:r.options)==null?void 0:c.upload}}}}},addAttributes(){var t;return{...(t=this.parent)==null?void 0:t.call(this),width:{default:null,parseHTML:e=>{const i=e.querySelector("img"),r=i==null?void 0:i.getAttribute("width");return r?Number.parseInt(r,10):320},renderHTML:e=>({width:e.width})},height:{default:null,parseHTML:e=>{const i=e.querySelector("img"),r=i==null?void 0:i.getAttribute("height");return r?Number.parseInt(r,10):212},renderHTML:e=>({height:e.height})},align:{default:"center",parseHTML:e=>e.getAttribute("align"),renderHTML:e=>({align:e.align})}}},addNodeView(){return F.ReactNodeViewRenderer(te)},addCommands(){return{setMermaid:(t,e)=>({commands:i,editor:r})=>e?i.insertContent({type:this.name,attrs:t}):i.insertContentAt(r.state.selection.anchor,{type:this.name,attrs:t}),setAlignImageMermaid:t=>({commands:e})=>e.updateAttributes(this.name,{align:t})}},renderHTML({HTMLAttributes:t}){const{align:e}=t;return["div",{style:e?`text-align: ${e};`:"",class:"imageMermaid"},["img",q.mergeAttributes(this.options.HTMLAttributes,t)]]},parseHTML(){return[{tag:"div[class=imageMermaid]",getAttrs:t=>{const e=t.querySelector("img"),i=e==null?void 0:e.getAttribute("width"),r=e==null?void 0:e.getAttribute("height");return{src:e==null?void 0:e.getAttribute("src"),alt:e==null?void 0:e.getAttribute("alt"),width:i?Number.parseInt(i,10):null,height:r?Number.parseInt(r,10):null,align:(e==null?void 0:e.getAttribute("align"))||t.style.textAlign||null}}}]}});exports.Mermaid=re;