reactjs-tiptap-editor 0.3.30 → 0.4.0

package/lib/bubble-extra.js

@@ -1,30 +1,29 @@
-import { jsxs as b, jsx as t, Fragment as v } from "react/jsx-runtime";
-import { useState as y, useRef as L, useCallback as w, useEffect as T, useMemo as W, Fragment as G } from "react";
-import { B as z } from "./dom-dataset-Di3tIRrR.js";
-import { w as Z, x as J, A as S, y as Q, z as X, F as Y, B as H, G as ee, O as D, a1 as ce, a2 as te, a3 as R, a4 as se, a5 as le } from "./RichTextEditor-BQN2eLD_.js";
+import { jsxs as p, jsx as t, Fragment as v } from "react/jsx-runtime";
+import { useState as y, useRef as O, useCallback as w, useEffect as k, useMemo as D, Fragment as G } from "react";
+import { t as Z, u as J, A as S, v as Q, w as X, x as Y, B as R, y as ee, K as W, aj as ae, ak as P, al as te, am as U, an as se, ao as le } from "./RichTextEditor-DGcKEUGr.js";
 import { Mermaid as j } from "./Mermaid.js";
 import { s as re, i as ne } from "./shortId-WJVkrvml.js";
-import { T as ie } from "./textarea-BglwYF6b.js";
-import { u as O } from "./index-CsK90iVd.js";
-import { E as I, t as de } from "./Excalidraw-CM74U5tG.js";
-import { T as K, F as he } from "./Twitter-Dg6WWauX.js";
+import { T as ie } from "./textarea-aPtytkDx.js";
+import { u as z } from "./index-LmrOdnen.js";
+import { E as N, t as de } from "./Excalidraw-CVWz2Vyn.js";
+import { T as K, F as he } from "./Twitter-BFULyqdR.js";
 import ue from "katex";
 import { HelpCircle as me, Pencil as xe, Trash2 as fe } from "lucide-react";
-import { Katex as P } from "./Katex.js";
-import { C as pe, D as _ } from "./Drawer-BKTU9CpU.js";
-import { Editor as ge, makeDropdownToolbar as be } from "easydrawer";
+import { Katex as A } from "./Katex.js";
+import { C as ge, D as _ } from "./Drawer-CaAfmqNo.js";
+import { Editor as be, makeDropdownToolbar as pe } from "easydrawer";
 const q = `graph TB
-a-->b`, we = ({ editor: e, attrs: s, extension: o }) => {
-  const { alt: a, align: n } = s, [r, i] = y(decodeURIComponent(a ?? q)), [l, h] = y(""), [m, x] = y(!1), p = L(null), [f, M] = y(null), k = o == null ? void 0 : o.options.upload, A = w(
-    (g) => {
-      g && import("mermaid").then((B) => {
+a-->b`, we = ({ editor: e, attrs: a, extension: o }) => {
+  const { alt: s, align: n } = a, [r, i] = y(decodeURIComponent(s ?? q)), [l, h] = y(""), [m, x] = y(!1), g = O(null), [f, M] = y(null), T = o == null ? void 0 : o.options.upload, L = w(
+    (b) => {
+      b && import("mermaid").then((B) => {
         M(B.default);
       });
     },
     []
-  ), E = async (g) => {
+  ), I = async (b) => {
     try {
-      const { svg: B } = await f.render("mermaid-svg", g);
+      const { svg: B } = await f.render("mermaid-svg", b);
       h(B);
     } catch {
       h("");
@@ -36,13 +35,13 @@ a-->b`, we = ({ editor: e, attrs: s, extension: o }) => {
       // fontFamily:'',
       fontSize: 12,
       theme: "base"
-    }), E(r);
+    }), I(r);
   };
-  return T(() => {
+  return k(() => {
     f && m && $();
-  }, [f, m]), T(() => {
-    f && m && E(r);
-  }, [f, r]), /* @__PURE__ */ b(
+  }, [f, m]), k(() => {
+    f && m && I(r);
+  }, [f, r]), /* @__PURE__ */ p(
     Z,
     {
       onOpenChange: x,
@@ -56,21 +55,21 @@ a-->b`, we = ({ editor: e, attrs: s, extension: o }) => {
             tooltip: "Edit Mermaid"
           }
         ) }),
-        /* @__PURE__ */ b(Q, { className: "richtext-z-[99999] !richtext-max-w-[1300px]", children: [
+        /* @__PURE__ */ p(Q, { className: "richtext-z-[99999] !richtext-max-w-[1300px]", children: [
           /* @__PURE__ */ t(X, { children: "Edit Mermaid" }),
           /* @__PURE__ */ t(
             "div",
             {
-              ref: A,
+              ref: L,
               style: { height: "100%", border: "1px solid hsl(var(--border))" },
-              children: /* @__PURE__ */ b("div", { className: "richtext-flex richtext-gap-[10px] richtext-rounded-[10px] richtext-p-[10px]", children: [
+              children: /* @__PURE__ */ p("div", { className: "richtext-flex richtext-gap-[10px] richtext-rounded-[10px] richtext-p-[10px]", children: [
                 /* @__PURE__ */ t(
                   ie,
                   {
                     autoFocus: !0,
                     className: "richtext-flex-1",
                     defaultValue: q,
-                    onChange: (g) => i(g.target.value),
+                    onChange: (b) => i(b.target.value),
                     placeholder: "Text",
                     required: !0,
                     rows: 10,
@@ -85,7 +84,7 @@ a-->b`, we = ({ editor: e, attrs: s, extension: o }) => {
                   {
                     className: "richtext-flex richtext-flex-1 richtext-items-center richtext-justify-center richtext-rounded-[10px] richtext-p-[10px]",
                     dangerouslySetInnerHTML: { __html: l },
-                    ref: p,
+                    ref: g,
                     style: { height: "100%", border: "1px solid hsl(var(--border))", minHeight: 500, background: "#fff" }
                   }
                 )
@@ -93,16 +92,16 @@ a-->b`, we = ({ editor: e, attrs: s, extension: o }) => {
             }
           ),
           /* @__PURE__ */ t(Y, { children: /* @__PURE__ */ t(
-            H,
+            R,
             {
               onClick: async () => {
                 if (r !== "") {
                   if (r) {
-                    const g = p.current.querySelector("svg"), { width: B, height: V } = g.getBoundingClientRect(), u = `mermaid-${re()}.svg`;
-                    let c = ne(g.outerHTML);
-                    if (k) {
+                    const b = g.current.querySelector("svg"), { width: B, height: V } = b.getBoundingClientRect(), u = `mermaid-${re()}.svg`;
+                    let c = ne(b.outerHTML);
+                    if (T) {
                       const d = ee(c, u);
-                      c = await k(d);
+                      c = await T(d);
                     }
                     e == null || e.chain().focus().setMermaid(
                       {
@@ -127,70 +126,63 @@ a-->b`, we = ({ editor: e, attrs: s, extension: o }) => {
     }
   );
 };
-function oe(e, s) {
-  const [o, a] = y(void 0);
-  return T(() => {
+function oe(e, a) {
+  const [o, s] = y(void 0);
+  return k(() => {
     const n = () => {
-      const r = e.extensionManager.extensions.find((i) => i.name === s);
-      r && a(r);
+      const r = e.extensionManager.extensions.find((i) => i.name === a);
+      r && s(r);
     };
     return e.on("selectionUpdate", n), e.on("transaction", n), () => {
       e.off("selectionUpdate", n), e.off("transaction", n);
     };
-  }, [e, s]), o;
+  }, [e, a]), o;
 }
-const ve = {
-  maxWidth: "auto",
-  zIndex: 20,
-  appendTo: "parent",
-  moveTransition: "transform 0.1s ease-out"
-};
-function ye({ item: e, disabled: s, editor: o }) {
+function ve({ item: e, disabled: a, editor: o }) {
   var n;
-  const a = e.component;
-  return a ? /* @__PURE__ */ t(G, { children: e.type === "divider" ? /* @__PURE__ */ t(
+  const s = e.component;
+  return s ? /* @__PURE__ */ t(G, { children: e.type === "divider" ? /* @__PURE__ */ t(
     te,
     {
       className: "!richtext-mx-1 !richtext-my-2 !richtext-h-[16px]",
       orientation: "vertical"
     }
   ) : /* @__PURE__ */ t(
-    a,
+    s,
     {
       ...e.componentProps,
-      disabled: s || ((n = e == null ? void 0 : e.componentProps) == null ? void 0 : n.disabled),
+      disabled: a || ((n = e == null ? void 0 : e.componentProps) == null ? void 0 : n.disabled),
       editor: o
     }
   ) }) : /* @__PURE__ */ t(v, {});
 }
-function Se(e) {
+function ye(e) {
   return e.type.name === "mermaid";
 }
-function Ve(e) {
-  const { lang: s } = O(), o = D(e.editor, j.name), a = oe(e.editor, j.name), n = ({ editor: i }) => {
+function Re(e) {
+  const { lang: a } = z(), o = W(e.editor, j.name), s = oe(e.editor, j.name), n = ({ editor: i }) => {
     const { selection: l } = i.view.state, { $from: h, to: m } = l;
     let x = !1;
-    return i.view.state.doc.nodesBetween(h.pos, m, (p) => {
-      if (Se(p))
+    return i.view.state.doc.nodesBetween(h.pos, m, (g) => {
+      if (ye(g))
         return x = !0, !1;
     }), x;
-  }, r = W(() => e.disabled ? [] : ce(e.editor), [e.disabled, e.editor, s]);
+  }, r = D(() => e.disabled ? [] : ae(e.editor), [e.disabled, e.editor, a]);
   return /* @__PURE__ */ t(v, { children: /* @__PURE__ */ t(
-    z,
+    P,
     {
       editor: e == null ? void 0 : e.editor,
       shouldShow: n,
-      tippyOptions: ve,
       children: r != null && r.length ? /* @__PURE__ */ t("div", { className: "richtext-pointer-events-auto richtext-w-auto richtext-select-none richtext-rounded-sm !richtext-border richtext-border-neutral-200 richtext-bg-background richtext-px-3 richtext-py-2 richtext-shadow-sm richtext-transition-all dark:richtext-border-neutral-800", children: /* @__PURE__ */ t("div", { className: "richtext-relative richtext-flex richtext-h-[26px] richtext-flex-nowrap richtext-items-center richtext-justify-start richtext-whitespace-nowrap", children: r == null ? void 0 : r.map((i, l) => i.type === "edit" && (o != null && o.src) ? /* @__PURE__ */ t(
         we,
         {
           attrs: o,
           editor: e.editor,
-          extension: a
+          extension: s
         },
         `bubbleMenu-mermaid-${l}`
       ) : /* @__PURE__ */ t(
-        ye,
+        ve,
         {
           disabled: e.disabled,
           editor: e.editor,
@@ -202,105 +194,123 @@ function Ve(e) {
   ) });
 }
 const C = /* @__PURE__ */ new Map();
-function Ce(e) {
-  const s = e.options.element;
-  C.has("width") || C.set("width", s.clientWidth), C.has("width") && C.get("width") <= 0 && C.set("width", s.clientWidth);
-  const o = { attributes: !0, childList: !0, subtree: !0 }, a = function() {
-    C.set("width", s.clientWidth);
-  }, n = new MutationObserver(a);
-  return n.observe(s, o), e.on("destroy", () => {
+function Se(e) {
+  const a = e.options.element;
+  C.has("width") || C.set("width", a.clientWidth), C.has("width") && C.get("width") <= 0 && C.set("width", a.clientWidth);
+  const o = { attributes: !0, childList: !0, subtree: !0 }, s = function() {
+    C.set("width", a.clientWidth);
+  }, n = new MutationObserver(s);
+  return n.observe(a, o), e.on("destroy", () => {
     n.disconnect();
   }), { width: C.get("width") };
 }
-function je({ editor: e }) {
-  const { t: s } = O(), { width: o } = Ce(e), a = D(e, I.name, {
+function Ue({ editor: e }) {
+  const { t: a } = z(), { width: o } = Se(e), s = W(e, N.name, {
     defaultShowPicker: !1,
     createUser: "",
     width: 0,
     height: 0
-  }), { defaultShowPicker: n, createUser: r, width: i, height: l } = a, h = w(
+  }), { defaultShowPicker: n, createUser: r, width: i, height: l } = s, h = w(
     (f) => {
-      e.chain().updateAttributes(I.name, f).setNodeSelection(e.state.selection.from).focus().run();
+      e.chain().updateAttributes(N.name, f).setNodeSelection(e.state.selection.from).focus().run();
     },
     [e]
   ), m = w(() => {
-    de({ ...a, editor: e });
-  }, [e, a]), x = w(() => e.isActive(I.name), [e]), p = w(() => R(I.name, e), [e]);
-  return T(() => {
-    n && (m(), e.chain().updateAttributes(I.name, { defaultShowPicker: !1 }).focus().run());
+    de({ ...s, editor: e });
+  }, [e, s]), x = w(() => e.isActive(N.name), [e]), g = w(() => U(N.name, e), [e]);
+  return k(() => {
+    n && (m(), e.chain().updateAttributes(N.name, { defaultShowPicker: !1 }).focus().run());
   }, [r, n, e, m]), /* @__PURE__ */ t(
-    z,
+    P,
     {
       className: "bubble-menu",
       editor: e,
       pluginKey: "excalidraw-bubble-menu",
       shouldShow: x,
-      tippyOptions: {
-        popperOptions: {
-          modifiers: [{ name: "flip", enabled: !1 }]
-        },
+      options: {
+        // popperOptions: {
+        //   modifiers: [{ name: 'flip', enabled: false }],
+        // },
+        // offset: [-2, 16],
         placement: "bottom-start",
-        offset: [-2, 16],
-        zIndex: 9999
+        offset: {
+          alignmentAxis: 6,
+          crossAxis: 6
+        }
+        // zIndex: 9999,
         // onHidden: () => {
         //   toggleVisible(false)
         // },
       },
-      children: /* @__PURE__ */ b("div", { className: "richtext-w-auto richtext-px-3 richtext-py-2 richtext-transition-all !richtext-border richtext-rounded-sm richtext-shadow-sm richtext-pointer-events-auto richtext-select-none richtext-border-neutral-200 dark:richtext-border-neutral-800 richtext-bg-background", children: [
+      children: /* @__PURE__ */ p("div", { className: "richtext-pointer-events-auto richtext-w-auto richtext-select-none richtext-rounded-sm !richtext-border richtext-border-neutral-200 richtext-bg-background richtext-px-3 richtext-py-2 richtext-shadow-sm richtext-transition-all dark:richtext-border-neutral-800", children: [
         /* @__PURE__ */ t(
           S,
           {
-            icon: "Pencil",
             action: m,
-            tooltip: s("editor.edit")
+            icon: "Pencil",
+            tooltip: a("editor.edit")
           }
         ),
-        /* @__PURE__ */ t(se, { width: i, maxWidth: o, height: l, onOk: h, children: /* @__PURE__ */ t(
-          S,
+        /* @__PURE__ */ t(
+          se,
           {
-            icon: "Settings",
-            tooltip: s("editor.settings")
+            height: l,
+            maxWidth: o,
+            onOk: h,
+            width: i,
+            children: /* @__PURE__ */ t(
+              S,
+              {
+                icon: "Settings",
+                tooltip: a("editor.settings")
+              }
+            )
           }
-        ) }),
+        ),
         /* @__PURE__ */ t(
           S,
           {
+            action: g,
             icon: "Trash2",
-            action: p,
-            tooltip: s("editor.delete")
+            tooltip: a("editor.delete")
           }
         )
       ] })
     }
   );
 }
-function Ke({ editor: e, disabled: s }) {
-  const [o, a] = y(!1), { t: n } = O(), r = w(({ editor: h }) => h.isActive(K.name), []), i = (h) => {
-    e.commands.updateTweet({ src: h }), a(!1);
-  }, l = w(() => R(K.name, e), [e]);
+function He({ editor: e, disabled: a }) {
+  const [o, s] = y(!1), { t: n } = z(), r = w(({ editor: h }) => h.isActive(K.name), []), i = (h) => {
+    e.commands.updateTweet({ src: h }), s(!1);
+  }, l = w(() => U(K.name, e), [e]);
   return /* @__PURE__ */ t(v, { children: /* @__PURE__ */ t(
-    z,
+    P,
     {
       editor: e,
       shouldShow: r,
-      tippyOptions: {
-        popperOptions: {
-          modifiers: [{ name: "flip", enabled: !1 }]
-        },
+      options: {
+        // popperOptions: {
+        //   modifiers: [{ name: 'flip', enabled: false }],
+        // },
+        // placement: 'bottom-start',
+        // offset: [-2, 16],
+        // zIndex: 9999,
+        // onHidden: () => {
+        //   setShowEdit(false);
+        // },
         placement: "bottom-start",
-        offset: [-2, 16],
-        zIndex: 9999,
-        onHidden: () => {
-          a(!1);
+        offset: {
+          alignmentAxis: 6,
+          crossAxis: 6
         }
       },
-      children: s ? /* @__PURE__ */ t(v, {}) : /* @__PURE__ */ t(v, { children: o ? /* @__PURE__ */ t(
+      children: a ? /* @__PURE__ */ t(v, {}) : /* @__PURE__ */ t(v, { children: o ? /* @__PURE__ */ t(
         he,
         {
           editor: e,
           onSetLink: i
         }
-      ) : /* @__PURE__ */ t("div", { className: "richtext-flex richtext-items-center richtext-gap-2 richtext-rounded-lg !richtext-border richtext-border-neutral-200 richtext-bg-white richtext-p-2 richtext-shadow-sm dark:richtext-border-neutral-800 dark:richtext-bg-black", children: /* @__PURE__ */ b("div", { className: "richtext-flex richtext-flex-nowrap", children: [
+      ) : /* @__PURE__ */ t("div", { className: "richtext-flex richtext-items-center richtext-gap-2 richtext-rounded-lg !richtext-border richtext-border-neutral-200 richtext-bg-white richtext-p-2 richtext-shadow-sm dark:richtext-border-neutral-800 dark:richtext-bg-black", children: /* @__PURE__ */ p("div", { className: "richtext-flex richtext-flex-nowrap", children: [
         /* @__PURE__ */ t(
           S,
           {
@@ -308,7 +318,7 @@ function Ke({ editor: e, disabled: s }) {
             tooltip: n("editor.link.edit.tooltip"),
             tooltipOptions: { sideOffset: 15 },
             action: () => {
-              a(!0);
+              s(!0);
             }
           }
         ),
@@ -325,25 +335,25 @@ function Ke({ editor: e, disabled: s }) {
     }
   ) });
 }
-function _e({ editor: e, ...s }) {
-  const o = D(e, P.name, {
+function Ve({ editor: e, ...a }) {
+  const o = W(e, A.name, {
     text: "",
     defaultShowPicker: !1
-  }), { text: a, defaultShowPicker: n } = o, [r, i] = y(""), [l, h] = y(!1), m = w(() => e.isActive(P.name), [e]), x = w(() => R(P.name, e), [e]), p = w(() => {
+  }), { text: s, defaultShowPicker: n } = o, [r, i] = y(""), [l, h] = y(!1), m = w(() => e.isActive(A.name), [e]), x = w(() => U(A.name, e), [e]), g = w(() => {
     e.chain().focus().setKatex({ text: r }).run(), h(!1);
   }, [e, r]);
-  T(() => {
-    n && (h(!0), e.chain().updateAttributes(P.name, { defaultShowPicker: !1 }).focus().run());
-  }, [e, n, h]), T(() => {
-    l && i(a || "");
+  k(() => {
+    n && (h(!0), e.chain().updateAttributes(A.name, { defaultShowPicker: !1 }).focus().run());
+  }, [e, n, h]), k(() => {
+    l && i(s || "");
   }, [l]);
-  const f = W(() => {
+  const f = D(() => {
     try {
       return ue.renderToString(`${r}`);
     } catch {
       return r;
     }
-  }, [r]), M = W(
+  }, [r]), M = D(
     () => `${r}`.trim() ? /* @__PURE__ */ t(
       "span",
       {
@@ -354,29 +364,34 @@ function _e({ editor: e, ...s }) {
     [r, f]
   );
   return /* @__PURE__ */ t(
-    z,
+    P,
     {
       editor: e,
       pluginKey: "Katex-bubble-menu",
       shouldShow: m,
-      tippyOptions: {
-        popperOptions: {
-          modifiers: [{ name: "flip", enabled: !1 }]
-        },
+      options: {
+        // popperOptions: {
+        //   modifiers: [{ name: 'flip', enabled: false }],
+        // },
+        // placement: 'bottom-start',
+        // offset: [-2, 16],
+        // zIndex: 9999,
+        // onHidden: () => {
+        //   toggleVisible(false);
+        // },
         placement: "bottom-start",
-        offset: [-2, 16],
-        zIndex: 9999,
-        onHidden: () => {
-          h(!1);
+        offset: {
+          alignmentAxis: 6,
+          crossAxis: 6
         }
       },
-      children: s != null && s.disabled ? /* @__PURE__ */ t(v, {}) : /* @__PURE__ */ t("div", { className: "richtext-rounded-lg !richtext-border richtext-border-neutral-200 richtext-bg-white richtext-p-2 richtext-shadow-sm dark:richtext-border-neutral-800 dark:richtext-bg-black", children: l ? /* @__PURE__ */ b(v, { children: [
+      children: a != null && a.disabled ? /* @__PURE__ */ t(v, {}) : /* @__PURE__ */ t("div", { className: "richtext-rounded-lg !richtext-border richtext-border-neutral-200 richtext-bg-white richtext-p-2 richtext-shadow-sm dark:richtext-border-neutral-800 dark:richtext-bg-black", children: l ? /* @__PURE__ */ p(v, { children: [
         /* @__PURE__ */ t(
           ie,
           {
             autoFocus: !0,
-            defaultValue: a,
-            onChange: (k) => i(k.target.value),
+            defaultValue: s,
+            onChange: (T) => i(T.target.value),
             placeholder: "Formula text",
             rows: 3,
             style: { marginBottom: 8 },
@@ -384,12 +399,12 @@ function _e({ editor: e, ...s }) {
           }
         ),
         M && /* @__PURE__ */ t("div", { className: "richtext-my-[10px] richtext-overflow-auto richtext-whitespace-nowrap richtext-rounded-[6px] !richtext-border richtext-p-[10px]", children: M }),
-        /* @__PURE__ */ b("div", { className: "richtext-flex richtext-items-center richtext-justify-between richtext-gap-[6px]", children: [
+        /* @__PURE__ */ p("div", { className: "richtext-flex richtext-items-center richtext-justify-between richtext-gap-[6px]", children: [
           /* @__PURE__ */ t(
-            H,
+            R,
             {
               className: "richtext-flex-1",
-              onClick: p,
+              onClick: g,
               children: "Submit"
             }
           ),
@@ -403,7 +418,7 @@ function _e({ editor: e, ...s }) {
             }
           )
         ] })
-      ] }) : /* @__PURE__ */ b("div", { className: "richtext-flex richtext-items-center richtext-justify-center richtext-gap-[6px]", children: [
+      ] }) : /* @__PURE__ */ p("div", { className: "richtext-flex richtext-items-center richtext-justify-center richtext-gap-[6px]", children: [
         /* @__PURE__ */ t(
           S,
           {
@@ -424,29 +439,29 @@ function _e({ editor: e, ...s }) {
     }
   );
 }
-let N = !1;
-function Te({ editor: e, attrs: s, extension: o }) {
-  const [a, n] = y(!1), r = L(null), i = L(null), { alt: l, align: h } = s, m = o == null ? void 0 : o.options.upload, x = () => {
+let E = !1;
+function Ce({ editor: e, attrs: a, extension: o }) {
+  const [s, n] = y(!1), r = O(null), i = O(null), { alt: l, align: h } = a, m = o == null ? void 0 : o.options.upload, x = () => {
     (async () => {
       const c = document.querySelector("#easydrawer");
-      c && (r.current = new ge(c, {
+      c && (r.current = new be(c, {
         wheelEventsEnabled: !1,
         disableZoom: !0
-      }), i.current = be(r.current), i.current.addDefaultToolWidgets(), r.current.loadFromSVG(decodeURIComponent(l)));
+      }), i.current = pe(r.current), i.current.addDefaultToolWidgets(), r.current.loadFromSVG(decodeURIComponent(l)));
     })();
   };
-  T(() => {
-    a && setTimeout(() => {
+  k(() => {
+    s && setTimeout(() => {
       x();
     }, 200);
-  }, [a]);
-  const p = async () => {
+  }, [s]);
+  const g = async () => {
     if (r.current) {
       const u = r.current.toSVG(), c = u.outerHTML, d = `drawer-${re()}.svg`;
       let F = ne(u.outerHTML);
       if (m) {
-        const ae = ee(F, d);
-        F = await m(ae);
+        const ce = ee(F, d);
+        F = await m(ce);
       }
       e == null || e.chain().focus().setDrawer(
         {
@@ -466,35 +481,35 @@ function Te({ editor: e, attrs: s, extension: o }) {
   }, M = (u) => {
     const c = r.current.toolController.getPrimaryTools()[2], d = i.current.getWidgetById("pen-1");
     c && d && (c.setThickness(u), d.serializeState());
-  }, k = (u) => {
+  }, T = (u) => {
     const c = r.current.toolController.getPrimaryTools()[3], d = i.current.getWidgetById("pen-2");
     c && d && (c.setColor(u), d.serializeState());
-  }, A = (u) => {
+  }, L = (u) => {
     const c = i.current.getWidgetById("shape");
     c && c.setShapeType(u);
-  }, E = (u) => {
+  }, I = (u) => {
     const c = r.current.toolController.getPrimaryTools()[5], d = i.current.getWidgetById("shape");
     c && d && (c.setColor(u), d.serializeState());
   }, $ = (u) => {
     const c = r.current.toolController.getPrimaryTools()[5], d = i.current.getWidgetById("shape");
     c && d && (c.setThickness(u), d.serializeState());
-  }, U = (u) => {
+  }, H = (u) => {
     const c = r.current.toolController.getPrimaryTools()[5], d = i.current.getWidgetById("shape");
     c && d && (c.setBorderColor(u), d.serializeState());
-  }, g = () => {
-    if (N) {
+  }, b = () => {
+    if (E) {
       for (; r.current.history.redoStackSize > 0; )
         r.current.history.redo();
-      N = !1;
+      E = !1;
       return;
     }
     r.current.history.undo();
   };
-  return /* @__PURE__ */ b(
+  return /* @__PURE__ */ p(
     Z,
     {
       onOpenChange: n,
-      open: a,
+      open: s,
       children: [
         /* @__PURE__ */ t(J, { asChild: !0, children: /* @__PURE__ */ t(
           S,
@@ -504,9 +519,9 @@ function Te({ editor: e, attrs: s, extension: o }) {
             tooltip: "Edit Drawer"
           }
         ) }),
-        /* @__PURE__ */ b(Q, { className: "richtext-z-[99999] !richtext-max-w-[1300px]", children: [
+        /* @__PURE__ */ p(Q, { className: "richtext-z-[99999] !richtext-max-w-[1300px]", children: [
           /* @__PURE__ */ t(X, { children: "Edit Drawer" }),
-          /* @__PURE__ */ b("div", { style: { height: "100%", borderWidth: 1, background: "white", position: "relative" }, children: [
+          /* @__PURE__ */ p("div", { style: { height: "100%", borderWidth: 1, background: "white", position: "relative" }, children: [
             /* @__PURE__ */ t(
               "div",
               {
@@ -515,34 +530,34 @@ function Te({ editor: e, attrs: s, extension: o }) {
               }
             ),
             /* @__PURE__ */ t(
-              pe,
+              ge,
               {
-                changeBorderColorShape: U,
-                changeColorShape: E,
-                changeShape: A,
+                changeBorderColorShape: H,
+                changeColorShape: I,
+                changeShape: L,
                 onClear: () => {
-                  if (!N) {
+                  if (!E) {
                     for (; r.current.history.undoStackSize > 0; )
-                      g();
-                    N = !0;
+                      b();
+                    E = !0;
                   }
                 },
                 onRedo: () => {
-                  N || r.current.history.redo();
+                  E || r.current.history.redo();
                 },
                 onThicknessChange: $,
-                onUndo: g,
+                onUndo: b,
                 refEditor: r,
-                setColorHighlight: k,
+                setColorHighlight: T,
                 setColorPen: f,
                 setThicknessPen: M
               }
             )
           ] }),
           /* @__PURE__ */ t(Y, { children: /* @__PURE__ */ t(
-            H,
+            R,
             {
-              onClick: p,
+              onClick: g,
               type: "button",
               children: "Save changes"
             }
@@ -552,54 +567,47 @@ function Te({ editor: e, attrs: s, extension: o }) {
     }
   );
 }
-const Me = {
-  maxWidth: "auto",
-  zIndex: 20,
-  appendTo: "parent",
-  moveTransition: "transform 0.1s ease-out"
-};
-function ke({ item: e, disabled: s, editor: o }) {
+function ke({ item: e, disabled: a, editor: o }) {
   var n;
-  const a = e.component;
-  return a ? /* @__PURE__ */ t(G, { children: e.type === "divider" ? /* @__PURE__ */ t(
+  const s = e.component;
+  return s ? /* @__PURE__ */ t(G, { children: e.type === "divider" ? /* @__PURE__ */ t(
     te,
     {
       className: "!richtext-mx-1 !richtext-my-2 !richtext-h-[16px]",
       orientation: "vertical"
     }
   ) : /* @__PURE__ */ t(
-    a,
+    s,
     {
       ...e.componentProps,
-      disabled: s || ((n = e == null ? void 0 : e.componentProps) == null ? void 0 : n.disabled),
+      disabled: a || ((n = e == null ? void 0 : e.componentProps) == null ? void 0 : n.disabled),
       editor: o
     }
   ) }) : /* @__PURE__ */ t(v, {});
 }
-function Be(e) {
+function Me(e) {
   return e.type.name === "drawer";
 }
-function qe(e) {
-  const { lang: s } = O(), o = D(e.editor, _.name), a = oe(e.editor, _.name), n = ({ editor: i }) => {
+function je(e) {
+  const { lang: a } = z(), o = W(e.editor, _.name), s = oe(e.editor, _.name), n = ({ editor: i }) => {
     const { selection: l } = i.view.state, { $from: h, to: m } = l;
     let x = !1;
-    return i.view.state.doc.nodesBetween(h.pos, m, (p) => {
-      if (Be(p))
+    return i.view.state.doc.nodesBetween(h.pos, m, (g) => {
+      if (Me(g))
         return x = !0, !1;
     }), x;
-  }, r = W(() => e.disabled ? [] : le(e.editor), [e.disabled, e.editor, s]);
+  }, r = D(() => e.disabled ? [] : le(e.editor), [e.disabled, e.editor, a]);
   return /* @__PURE__ */ t(
-    z,
+    P,
     {
       editor: e == null ? void 0 : e.editor,
       shouldShow: n,
-      tippyOptions: Me,
       children: r != null && r.length ? /* @__PURE__ */ t("div", { className: "richtext-pointer-events-auto richtext-w-auto richtext-select-none richtext-rounded-sm !richtext-border richtext-border-neutral-200 richtext-bg-background richtext-px-3 richtext-py-2 richtext-shadow-sm richtext-transition-all dark:richtext-border-neutral-800", children: /* @__PURE__ */ t("div", { className: "richtext-relative richtext-flex richtext-h-[26px] richtext-flex-nowrap richtext-items-center richtext-justify-start richtext-whitespace-nowrap", children: r == null ? void 0 : r.map((i, l) => i.type === "edit" && (o != null && o.src) ? /* @__PURE__ */ t(
-        Te,
+        Ce,
         {
           attrs: o,
           editor: e.editor,
-          extension: a
+          extension: s
         },
         `bubbleMenu-drawer-${l}`
       ) : /* @__PURE__ */ t(
@@ -615,9 +623,9 @@ function qe(e) {
   );
 }
 export {
-  qe as BubbleMenuDrawer,
-  je as BubbleMenuExcalidraw,
-  _e as BubbleMenuKatex,
-  Ve as BubbleMenuMermaid,
-  Ke as BubbleMenuTwitter
+  je as BubbleMenuDrawer,
+  Ue as BubbleMenuExcalidraw,
+  Ve as BubbleMenuKatex,
+  Re as BubbleMenuMermaid,
+  He as BubbleMenuTwitter
 };