reactjs-tiptap-editor 0.4.2 → 1.0.1

package/lib/Mermaid.js

@@ -1,118 +1,129 @@
-import { q as G, m as X } from "./index-kbO3iWqL.js";
-import { t as Z, u as Y, A as J, v as K, w as Q, x as tt, B as et, y as rt, z as q, E as it, F as at } from "./RichTextEditor-DGcKEUGr.js";
-import { N as st, R as nt } from "./dom-dataset-lYeH6gfI.js";
-import { jsxs as H, jsx as o } from "react/jsx-runtime";
-import { useState as m, useRef as ot, useCallback as y, useEffect as R, useMemo as F } from "react";
-import { s as lt, i as ct } from "./shortId-WJVkrvml.js";
-import { T as dt } from "./textarea-aPtytkDx.js";
-import { I as V, i as ht, j as W } from "./index-LmrOdnen.js";
-const j = `graph TB
-a-->b`, ut = ({ editor: e, upload: t, tooltipOptions: a }) => {
-  const [r, g] = m(j), [_, N] = m(""), [p, I] = m(!1), M = ot(null), [n, S] = m(null), z = y(
+import { q as G, m as U } from "./index-DnWWK9F_.js";
+import { a as q, c as X } from "./throttle-CdwDrFpn.js";
+import { N as Z, R as Y } from "./index-DzcKxutn.js";
+import { jsxs as C, jsx as n, Fragment as J } from "react/jsx-runtime";
+import { useState as m, useRef as K, useCallback as A, useEffect as H, useMemo as P } from "react";
+import { s as Q, i as tt } from "./shortId-WJVkrvml.js";
+import { A as et } from "./toggle-Cdp4IT2U.js";
+import { D as rt, a as it, b as at, c as st, d as nt } from "./dialog-PtQivpHS.js";
+import { T as ot } from "./textarea-DUUM1jZd.js";
+import { I as V, m as W, n as lt } from "./index-DYkucCoF.js";
+import { u as ct, a as dt, i as ut } from "./useButtonProps-BsEd4zYM.js";
+import { a as ht } from "./index-BPfVXs5_.js";
+import { d as mt } from "./file-BLas99n7.js";
+import { B as gt } from "./button-DXMsXUEn.js";
+const pt = `graph TB
+a-->b`;
+function Rt() {
+  const e = ht(), t = ct(vt.name), {
+    tooltipOptions: i = {},
+    isActive: s = void 0,
+    upload: w
+  } = (t == null ? void 0 : t.componentProps) ?? {}, { editorDisabled: T } = dt(s), [c, S] = m(pt), [D, y] = m(""), [o, _] = m(!1), L = K(null), [d, B] = m(null), [g, O] = m(!0), k = A(
     (l) => {
-      l && import("mermaid").then((f) => {
-        S(f.default);
-      });
+      l && import("mermaid").then((u) => {
+        B(u.default);
+      }).finally(() => O(!1));
     },
     []
-  ), A = async (l) => {
+  ), I = async (l) => {
     try {
-      const { svg: f } = await n.render("mermaid-svg", l);
-      N(f);
+      const { svg: u } = await d.render("mermaid-svg", l);
+      y(u);
     } catch {
-      N("");
+      y("");
     }
-  }, B = () => {
-    n.initialize({
+  }, E = () => {
+    d.initialize({
       darkMode: !1,
       startOnLoad: !1,
       // fontFamily:'',
       fontSize: 12,
       theme: "base"
-    }), A(r);
+    }), I(c);
   };
-  return R(() => {
-    n && p && B();
-  }, [n, p]), R(() => {
-    n && p && A(r);
-  }, [n && r]), /* @__PURE__ */ H(
-    Z,
+  return H(() => {
+    !g && d && o && E();
+  }, [d, o]), H(() => {
+    !g && d && o && I(c);
+  }, [d && c]), /* @__PURE__ */ C(
+    rt,
     {
-      onOpenChange: I,
-      open: p,
+      onOpenChange: _,
+      open: o,
       children: [
-        /* @__PURE__ */ o(Y, { asChild: !0, children: /* @__PURE__ */ o(
-          J,
+        /* @__PURE__ */ n(it, { asChild: !0, children: /* @__PURE__ */ n(
+          et,
           {
-            action: () => I(!0),
+            disabled: T,
             icon: "Mermaid",
             tooltip: "Mermaid",
-            tooltipOptions: a
+            tooltipOptions: i,
+            action: () => {
+              T || _(!0);
+            }
           }
         ) }),
-        /* @__PURE__ */ H(K, { className: "richtext-z-[99999] !richtext-max-w-[1300px]", children: [
-          /* @__PURE__ */ o(Q, { children: "Mermaid" }),
-          /* @__PURE__ */ o(
+        /* @__PURE__ */ C(at, { className: "richtext-z-[99999] !richtext-max-w-[1300px]", children: [
+          /* @__PURE__ */ n(st, { children: "Mermaid" }),
+          /* @__PURE__ */ n(
             "div",
             {
-              ref: z,
+              ref: k,
               style: { height: "100%", border: "1px solid hsl(var(--border))" },
-              children: /* @__PURE__ */ H("div", { className: "richtext-flex richtext-gap-[10px] richtext-rounded-[10px] richtext-p-[10px]", children: [
-                /* @__PURE__ */ o(
-                  dt,
+              children: g ? /* @__PURE__ */ n("p", { children: "Loading..." }) : /* @__PURE__ */ n(J, { children: /* @__PURE__ */ C("div", { className: "richtext-flex richtext-gap-[10px] richtext-rounded-[10px] richtext-p-[10px]", children: [
+                /* @__PURE__ */ n(
+                  ot,
                   {
                     autoFocus: !0,
                     className: "richtext-flex-1",
-                    defaultValue: j,
-                    onChange: (l) => g(l.target.value),
+                    onChange: (l) => S(l.target.value),
                     placeholder: "Text",
                     required: !0,
                     rows: 10,
-                    value: r,
+                    value: c,
                     style: {
                       color: "hsl(var(--richtext-foreground))"
                     }
                   }
                 ),
-                /* @__PURE__ */ o(
+                /* @__PURE__ */ n(
                   "div",
                   {
                     className: "richtext-flex richtext-flex-1 richtext-items-center richtext-justify-center richtext-rounded-[10px] richtext-p-[10px]",
-                    dangerouslySetInnerHTML: { __html: _ },
-                    ref: M,
+                    dangerouslySetInnerHTML: { __html: D },
+                    ref: L,
                     style: { height: "100%", borderWidth: 1, minHeight: 500, background: "#fff" }
                   }
                 )
-              ] })
+              ] }) })
             }
           ),
-          /* @__PURE__ */ o(tt, { children: /* @__PURE__ */ o(
-            et,
+          /* @__PURE__ */ n(nt, { children: /* @__PURE__ */ n(
+            gt,
             {
+              disabled: !d,
               onClick: async () => {
-                if (r !== "") {
-                  if (r) {
-                    const l = M.current.querySelector("svg"), { width: f, height: L } = l.getBoundingClientRect(), E = `mermaid-${lt()}.svg`;
-                    let x = ct(l.outerHTML);
-                    if (t) {
-                      console.log({
-                        src: x
-                      });
-                      const T = rt(x, E);
-                      x = await t(T);
+                if (c !== "") {
+                  if (c) {
+                    const l = L.current.querySelector("svg"), { width: u, height: R } = l.getBoundingClientRect(), N = `mermaid-${Q()}.svg`;
+                    let M = tt(l.outerHTML);
+                    if (w) {
+                      const r = mt(M, N);
+                      M = await w(r);
                     }
                     e == null || e.chain().focus().setMermaid(
                       {
                         type: "mermaid",
-                        src: x,
-                        alt: encodeURIComponent(r),
-                        width: f,
-                        height: L
+                        src: M,
+                        alt: encodeURIComponent(c),
+                        width: u,
+                        height: R
                       },
-                      !!r
+                      !!c
                     ).run();
                   }
-                  I(!1);
+                  _(!1);
                 }
               },
               type: "button",
@@ -123,143 +134,144 @@ a-->b`, ut = ({ editor: e, upload: t, tooltipOptions: a }) => {
       ]
     }
   );
-}, C = {
+}
+const z = {
   TOP_LEFT: "tl",
   TOP_RIGHT: "tr",
   BOTTOM_LEFT: "bl",
   BOTTOM_RIGHT: "br"
 };
-function mt({ editor: e, node: t, updateAttributes: a, getPos: r, selected: g }) {
-  const [_, N] = m({
+function ft({ editor: e, node: t, updateAttributes: i, getPos: s, selected: w }) {
+  const [T, c] = m({
     width: V,
     height: V
-  }), [p, I] = m({
+  }), [S, D] = m({
     width: 0,
     height: 0
-  }), [M] = m([
-    C.TOP_LEFT,
-    C.TOP_RIGHT,
-    C.BOTTOM_LEFT,
-    C.BOTTOM_RIGHT
-  ]), [n, S] = m(!1), [z, A] = m({
+  }), [y] = m([
+    z.TOP_LEFT,
+    z.TOP_RIGHT,
+    z.BOTTOM_LEFT,
+    z.BOTTOM_RIGHT
+  ]), [o, _] = m(!1), [L, d] = m({
     x: 0,
     y: 0,
     w: 0,
     h: 0,
     dir: ""
-  }), { align: B } = t == null ? void 0 : t.attrs, b = F(() => {
-    const { src: i, alt: d, width: h, height: w } = t == null ? void 0 : t.attrs, v = G(h) ? `${h}px` : h, s = G(w) ? `${w}px` : w;
+  }), { align: B } = t == null ? void 0 : t.attrs, g = P(() => {
+    const { src: r, alt: p, width: f, height: b } = t == null ? void 0 : t.attrs, x = G(f) ? `${f}px` : f, a = G(b) ? `${b}px` : b;
     return {
-      src: i || void 0,
-      alt: d || void 0,
+      src: r || void 0,
+      alt: p || void 0,
       style: {
-        width: v || void 0,
-        height: s || void 0
+        width: x || void 0,
+        height: a || void 0
       }
     };
-  }, [t == null ? void 0 : t.attrs]), l = F(() => {
+  }, [t == null ? void 0 : t.attrs]), O = P(() => {
     const {
-      style: { width: i }
-    } = b;
-    return { width: i === "100%" ? i : void 0 };
-  }, [b]);
-  function f(i) {
-    I({
-      width: i.target.width,
-      height: i.target.height
+      style: { width: r }
+    } = g;
+    return { width: r === "100%" ? r : void 0 };
+  }, [g]);
+  function k(r) {
+    D({
+      width: r.target.width,
+      height: r.target.height
     });
   }
-  function L() {
-    e.commands.setNodeSelection(r());
+  function I() {
+    e.commands.setNodeSelection(s());
   }
-  const E = y(
+  const E = A(
     q(() => {
-      const { width: i } = getComputedStyle(e.view.dom);
-      N((d) => ({
-        ...d,
-        width: Number.parseInt(i, 10)
+      const { width: r } = getComputedStyle(e.view.dom);
+      c((p) => ({
+        ...p,
+        width: Number.parseInt(r, 10)
       }));
     }, W),
     [e]
   );
-  function x(i, d) {
-    i.preventDefault(), i.stopPropagation();
-    const h = p.width, w = p.height, v = h / w;
-    let s = Number(t.attrs.width), u = Number(t.attrs.height);
-    const c = _.width;
-    s && !u ? (s = s > c ? c : s, u = Math.round(s / v)) : u && !s ? (s = Math.round(u * v), s = s > c ? c : s) : !s && !u ? (s = h > c ? c : h, u = Math.round(s / v)) : s = s > c ? c : s, S(!0), A({
-      x: i.clientX,
-      y: i.clientY,
-      w: s,
-      h: u,
-      dir: d
+  function F(r, p) {
+    r.preventDefault(), r.stopPropagation();
+    const f = S.width, b = S.height, x = f / b;
+    let a = Number(t.attrs.width), v = Number(t.attrs.height);
+    const h = T.width;
+    a && !v ? (a = a > h ? h : a, v = Math.round(a / x)) : v && !a ? (a = Math.round(v * x), a = a > h ? h : a) : !a && !v ? (a = f > h ? h : f, v = Math.round(a / x)) : a = a > h ? h : a, _(!0), d({
+      x: r.clientX,
+      y: r.clientY,
+      w: a,
+      h: v,
+      dir: p
     });
   }
-  const T = y(
-    q((i) => {
-      if (i.preventDefault(), i.stopPropagation(), !n)
+  const l = A(
+    q((r) => {
+      if (r.preventDefault(), r.stopPropagation(), !o)
         return;
-      const { x: d, w: h, dir: w } = z, v = (i.clientX - d) * (/l/.test(w) ? -1 : 1), { width: s, height: u } = t == null ? void 0 : t.attrs, c = s / u, $ = it(h + v, ht, _.width), U = Math.round($ / c);
-      a({
+      const { x: p, w: f, dir: b } = L, x = (r.clientX - p) * (/l/.test(b) ? -1 : 1), { width: a, height: v } = t == null ? void 0 : t.attrs, h = a / v, $ = ut(f + x, lt, T.width), j = Math.round($ / h);
+      i({
         width: $,
-        height: U
+        height: j
       });
     }, W),
-    [n, z, _, a, t == null ? void 0 : t.attrs]
-  ), O = y(
-    (i) => {
-      i.preventDefault(), i.stopPropagation(), n && (A({
+    [o, L, T, i, t == null ? void 0 : t.attrs]
+  ), u = A(
+    (r) => {
+      r.preventDefault(), r.stopPropagation(), o && (d({
         x: 0,
         y: 0,
         w: 0,
         h: 0,
         dir: ""
-      }), S(!1), L());
+      }), _(!1), I());
     },
-    [n, L]
-  ), P = y(() => {
-    document == null || document.addEventListener("mousemove", T, !0), document == null || document.addEventListener("mouseup", O, !0);
-  }, [T, O]), D = y(() => {
-    document == null || document.removeEventListener("mousemove", T, !0), document == null || document.removeEventListener("mouseup", O, !0);
-  }, [T, O]);
-  R(() => (n ? P() : D(), () => {
-    D();
-  }), [n, P, D]);
-  const k = F(() => new ResizeObserver(() => E()), [E]);
-  return R(() => (k.observe(e.view.dom), () => {
-    k.disconnect();
-  }), [e.view.dom, k]), /* @__PURE__ */ o(
-    st,
+    [o, I]
+  ), R = A(() => {
+    document == null || document.addEventListener("mousemove", l, !0), document == null || document.addEventListener("mouseup", u, !0);
+  }, [l, u]), N = A(() => {
+    document == null || document.removeEventListener("mousemove", l, !0), document == null || document.removeEventListener("mouseup", u, !0);
+  }, [l, u]);
+  H(() => (o ? R() : N(), () => {
+    N();
+  }), [o, R, N]);
+  const M = P(() => new ResizeObserver(() => E()), [E]);
+  return H(() => (M.observe(e.view.dom), () => {
+    M.disconnect();
+  }), [e.view.dom, M]), /* @__PURE__ */ n(
+    Z,
     {
       className: "image-view",
-      style: { ...l, width: "100%", textAlign: B },
-      children: /* @__PURE__ */ H(
+      style: { ...O, width: "100%", textAlign: B },
+      children: /* @__PURE__ */ C(
         "div",
         {
           "data-drag-handle": !0,
           draggable: "true",
-          style: { ...l, background: "#fff" },
-          className: `image-view__body ${g ? "image-view__body--focused" : ""} ${n ? "image-view__body--resizing" : ""}`,
+          style: { ...O, background: "#fff" },
+          className: `image-view__body ${w ? "image-view__body--focused" : ""} ${o ? "image-view__body--resizing" : ""}`,
           children: [
-            /* @__PURE__ */ o(
+            /* @__PURE__ */ n(
               "img",
               {
-                alt: b.alt,
+                alt: g.alt,
                 className: "image-view__body__image block",
                 height: "auto",
-                onClick: L,
-                onLoad: f,
-                src: b.src,
-                style: b.style
+                onClick: I,
+                onLoad: k,
+                src: g.src,
+                style: g.style
               }
             ),
-            e.view.editable && (g || n) && /* @__PURE__ */ o("div", { className: "image-resizer", children: M == null ? void 0 : M.map((i) => /* @__PURE__ */ o(
+            e.view.editable && (w || o) && /* @__PURE__ */ n("div", { className: "image-resizer", children: y == null ? void 0 : y.map((r) => /* @__PURE__ */ n(
               "span",
               {
-                className: `image-resizer__handler image-resizer__handler--${i}`,
-                onMouseDown: (d) => x(d, i)
+                className: `image-resizer__handler image-resizer__handler--${r}`,
+                onMouseDown: (p) => F(p, r)
               },
-              `image-dir-${i}`
+              `image-dir-${r}`
             )) })
           ]
         }
@@ -267,7 +279,7 @@ function mt({ editor: e, node: t, updateAttributes: a, getPos: r, selected: g })
     }
   );
 }
-const Tt = /* @__PURE__ */ at.extend({
+const vt = /* @__PURE__ */ X.extend({
   name: "mermaid",
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
   //@ts-expect-error
@@ -285,18 +297,17 @@ const Tt = /* @__PURE__ */ at.extend({
       HTMLAttributes: {
         class: "mermaid"
       },
-      button: ({ editor: t, t: a, extension: r }) => {
-        var g;
+      button: ({ editor: t, t: i, extension: s }) => {
+        var w;
         return {
-          component: ut,
           componentProps: {
             action: () => !0,
             isActive: () => !1,
             disabled: !1,
             editor: t,
             icon: "Mermaid",
-            tooltip: a("editor.mermaid.tooltip"),
-            upload: (g = r == null ? void 0 : r.options) == null ? void 0 : g.upload
+            tooltip: i("editor.mermaid.tooltip"),
+            upload: (w = s == null ? void 0 : s.options) == null ? void 0 : w.upload
           }
         };
       }
@@ -309,8 +320,8 @@ const Tt = /* @__PURE__ */ at.extend({
       width: {
         default: null,
         parseHTML: (t) => {
-          const a = t.querySelector("img"), r = a == null ? void 0 : a.getAttribute("width");
-          return r ? Number.parseInt(r, 10) : 320;
+          const i = t.querySelector("img"), s = i == null ? void 0 : i.getAttribute("width");
+          return s ? Number.parseInt(s, 10) : 320;
         },
         renderHTML: (t) => ({
           width: t.width
@@ -319,8 +330,8 @@ const Tt = /* @__PURE__ */ at.extend({
       height: {
         default: null,
         parseHTML: (t) => {
-          const a = t.querySelector("img"), r = a == null ? void 0 : a.getAttribute("height");
-          return r ? Number.parseInt(r, 10) : 212;
+          const i = t.querySelector("img"), s = i == null ? void 0 : i.getAttribute("height");
+          return s ? Number.parseInt(s, 10) : 212;
         },
         renderHTML: (t) => ({
           height: t.height
@@ -336,15 +347,15 @@ const Tt = /* @__PURE__ */ at.extend({
     };
   },
   addNodeView() {
-    return nt(mt);
+    return Y(ft);
   },
   // @ts-ignore
   addCommands() {
     return {
-      setMermaid: (e, t) => ({ commands: a, editor: r }) => t ? a.insertContent({
+      setMermaid: (e, t) => ({ commands: i, editor: s }) => t ? i.insertContent({
         type: this.name,
         attrs: e
-      }) : a.insertContentAt(r.state.selection.anchor, {
+      }) : i.insertContentAt(s.state.selection.anchor, {
         type: this.name,
         attrs: e
       }),
@@ -362,7 +373,7 @@ const Tt = /* @__PURE__ */ at.extend({
       },
       [
         "img",
-        X(
+        U(
           // @ts-ignore
           this.options.HTMLAttributes,
           e
@@ -375,12 +386,12 @@ const Tt = /* @__PURE__ */ at.extend({
       {
         tag: "div[class=imageMermaid]",
         getAttrs: (e) => {
-          const t = e.querySelector("img"), a = t == null ? void 0 : t.getAttribute("width"), r = t == null ? void 0 : t.getAttribute("height");
+          const t = e.querySelector("img"), i = t == null ? void 0 : t.getAttribute("width"), s = t == null ? void 0 : t.getAttribute("height");
           return {
             src: t == null ? void 0 : t.getAttribute("src"),
             alt: t == null ? void 0 : t.getAttribute("alt"),
-            width: a ? Number.parseInt(a, 10) : null,
-            height: r ? Number.parseInt(r, 10) : null,
+            width: i ? Number.parseInt(i, 10) : null,
+            height: s ? Number.parseInt(s, 10) : null,
             align: (t == null ? void 0 : t.getAttribute("align")) || e.style.textAlign || null
           };
         }
@@ -389,5 +400,6 @@ const Tt = /* @__PURE__ */ at.extend({
   }
 });
 export {
-  Tt as Mermaid
+  vt as Mermaid,
+  Rt as RichTextMermaid
 };

package/lib/MoreMark.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("./index-DF2Lp4HZ.cjs"),d=require("./index-CUogRI7j.cjs"),c=require("react/jsx-runtime"),m=require("react"),s=require("./RichTextEditor-CxvwGvQG.cjs");function g(t){var n;const i=m.useMemo(()=>{var r;const e=(r=t==null?void 0:t.items)==null?void 0:r.find(u=>u.isActive());return e&&!e.default?{...e,icon:e!=null&&e.icon?e==null?void 0:e.icon:t==null?void 0:t.icon}:{title:t.tooltip,icon:t.icon,isActive:()=>!1}},[t]);return c.jsxs(s.DropdownMenu,{children:[c.jsx(s.DropdownMenuTrigger,{asChild:!0,disabled:t==null?void 0:t.disabled,children:c.jsx(s.ActionButton,{customClass:"!richtext-w-12 richtext-h-12",disabled:t==null?void 0:t.disabled,icon:t==null?void 0:t.icon,tooltip:t==null?void 0:t.tooltip,children:c.jsx(s.MenuDown,{className:"richtext-size-3 richtext-text-gray-500"})})}),c.jsx(s.DropdownMenuContent,{className:"w-full",children:(n=t==null?void 0:t.items)==null?void 0:n.map((e,o)=>c.jsxs(s.DropdownMenuCheckboxItem,{checked:i.title===e.title,className:"richtext-flex richtext-items-center richtext-gap-3",onClick:e.action,children:[c.jsx(s.IconComponent,{name:e==null?void 0:e.icon}),c.jsx("span",{className:"richtext-ml-1",children:e.title}),!!(e!=null&&e.shortcutKeys)&&c.jsx("span",{className:"richtext-ml-auto richtext-text-xs richtext-tracking-widest richtext-opacity-60",children:s.getShortcutKeys(e.shortcutKeys)})]},`more-mark-${o}`))})]})}const f=b.Extension.create({name:"moreMark",addOptions(){var t;return{...(t=this.parent)==null?void 0:t.call(this),button({editor:i,extension:n,t:e}){var l,h;const o=n.options.subscript,r=n.options.superscript,u={action:()=>i.commands.toggleSubscript(),isActive:()=>i.isActive("subscript")||!1,disabled:!i.can().toggleSubscript(),icon:"Subscript",title:e("editor.subscript.tooltip"),shortcutKeys:((l=n.options.shortcutKeys)==null?void 0:l[0])??["mod","."]},x={action:()=>i.commands.toggleSuperscript(),isActive:()=>i.isActive("superscript")||!1,disabled:!i.can().toggleSuperscript(),icon:"Superscript",title:e("editor.superscript.tooltip"),shortcutKeys:((h=n.options.shortcutKeys)==null?void 0:h[1])??["mod",","]},a=[];return o!==!1&&a.push(u),r!==!1&&a.push(x),{component:g,componentProps:{icon:"Type",tooltip:e("editor.moremark"),disabled:!i.isEditable,items:a}}}}},addExtensions(){const t=[];return this.options.subscript!==!1&&t.push(d.Subscript.configure(this.options.subscript)),this.options.superscript!==!1&&t.push(d.Superscript.configure(this.options.superscript)),t}});exports.MoreMark=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("./index-RfTlOzIr.cjs"),r=require("react/jsx-runtime"),M=require("react"),x=require("./toggle-D41PzQLJ.cjs");require("./index-DV5kbgRU.cjs");const f=require("./Icon-DUpv2cI6.cjs"),S=require("./icons-CqHjeW5T.cjs"),h=require("./useButtonProps-C6Vpn190.cjs"),p=require("./dropdown-menu-CdSm4emp.cjs");var k=c.Mark.create({name:"subscript",addOptions(){return{HTMLAttributes:{}}},parseHTML(){return[{tag:"sub"},{style:"vertical-align",getAttrs(t){return t!=="sub"?!1:null}}]},renderHTML({HTMLAttributes:t}){return["sub",c.mergeAttributes(this.options.HTMLAttributes,t),0]},addCommands(){return{setSubscript:()=>({commands:t})=>t.setMark(this.name),toggleSubscript:()=>({commands:t})=>t.toggleMark(this.name),unsetSubscript:()=>({commands:t})=>t.unsetMark(this.name)}},addKeyboardShortcuts(){return{"Mod-,":()=>this.editor.commands.toggleSubscript()}}}),A=c.Mark.create({name:"superscript",addOptions(){return{HTMLAttributes:{}}},parseHTML(){return[{tag:"sup"},{style:"vertical-align",getAttrs(t){return t!=="super"?!1:null}}]},renderHTML({HTMLAttributes:t}){return["sup",c.mergeAttributes(this.options.HTMLAttributes,t),0]},addCommands(){return{setSuperscript:()=>({commands:t})=>t.setMark(this.name),toggleSuperscript:()=>({commands:t})=>t.toggleMark(this.name),unsetSuperscript:()=>({commands:t})=>t.unsetMark(this.name)}},addKeyboardShortcuts(){return{"Mod-.":()=>this.editor.commands.toggleSuperscript()}}});function v(){const t=h.useButtonProps(b.name),{icon:s=void 0,tooltip:n=void 0,items:i=[],isActive:l=void 0}=(t==null?void 0:t.componentProps)??{},{disabled:u,dataState:o}=h.useActive(l),d=M.useMemo(()=>(o==null?void 0:o.title)||"",[o]);return t?r.jsxs(p.DropdownMenu,{children:[r.jsx(p.DropdownMenuTrigger,{asChild:!0,disabled:u,children:r.jsx(x.ActionButton,{customClass:"!richtext-w-12 richtext-h-12",disabled:u,icon:s,tooltip:n,children:r.jsx(S.MenuDown,{className:"richtext-size-3 richtext-text-gray-500"})})}),r.jsx(p.DropdownMenuContent,{className:"w-full",children:i==null?void 0:i.map((e,a)=>r.jsxs(p.DropdownMenuCheckboxItem,{checked:d===e.title,className:"richtext-flex richtext-items-center richtext-gap-3",onClick:e.action,children:[r.jsx(f.IconComponent,{name:e==null?void 0:e.icon}),r.jsx("span",{className:"richtext-ml-1",children:e.title}),!!(e!=null&&e.shortcutKeys)&&r.jsx("span",{className:"richtext-ml-auto richtext-text-xs richtext-tracking-widest richtext-opacity-60",children:h.getShortcutKeys(e.shortcutKeys)})]},`more-mark-${a}`))})]}):r.jsx(r.Fragment,{})}const b=c.Extension.create({name:"moreMark",addOptions(){var t;return{...(t=this.parent)==null?void 0:t.call(this),button({editor:s,extension:n,t:i}){var a,g;const l=n.options.subscript,u=n.options.superscript,o={action:()=>s.commands.toggleSubscript(),isActive:()=>s.isActive("subscript")||!1,disabled:!s.can().toggleSubscript(),icon:"Subscript",title:i("editor.subscript.tooltip"),shortcutKeys:((a=n.options.shortcutKeys)==null?void 0:a[0])??["mod","."]},d={action:()=>s.commands.toggleSuperscript(),isActive:()=>s.isActive("superscript")||!1,disabled:!s.can().toggleSuperscript(),icon:"Superscript",title:i("editor.superscript.tooltip"),shortcutKeys:((g=n.options.shortcutKeys)==null?void 0:g[1])??["mod",","]},e=[];return l!==!1&&e.push(o),u!==!1&&e.push(d),{componentProps:{icon:"Type",tooltip:i("editor.moremark"),disabled:!s.isEditable,items:e,isActive:()=>e==null?void 0:e.find(m=>m.isActive())}}}}},addExtensions(){const t=[];return this.options.subscript!==!1&&t.push(k.configure(this.options.subscript)),this.options.superscript!==!1&&t.push(A.configure(this.options.superscript)),t}});exports.MoreMark=b;exports.RichTextMoreMark=v;