@mario9/tiptap-editor 0.1.4 → 0.1.6

package/dist/tiptap-editor.js

@@ -1,21 +1,21 @@
-import { defineComponent as c, computed as D, ref as M, openBlock as Z, createBlock as te, unref as w, withCtx as _, createElementBlock as R, normalizeClass as le, createElementVNode as y, createTextVNode as B, toDisplayString as P, Fragment as we, renderList as ke, normalizeStyle as be, createCommentVNode as xe, withModifiers as G, createVNode as e, mergeProps as b, inject as I, watch as N, nextTick as j, watchEffect as ne, provide as J } from "vue";
-import He from "@tiptap/starter-kit";
-import { nodeViewProps as Be, NodeViewWrapper as Me, VueNodeViewRenderer as Ae, useEditor as ye, EditorContent as Le } from "@tiptap/vue-3";
-import { TaskList as Ie, TaskItem as Ee } from "@tiptap/extension-list";
-import { TextAlign as Ve } from "@tiptap/extension-text-align";
-import { Placeholder as Te } from "@tiptap/extension-placeholder";
-import { CodeBlockLowlight as Ze } from "@tiptap/extension-code-block-lowlight";
-import { createLowlight as Fe, common as _e } from "lowlight";
-import { Image as Re } from "@tiptap/extension-image";
-import { Plugin as De, NodeSelection as Se } from "@tiptap/pm/state";
-import { Decoration as Ue, DecorationSet as $e } from "@tiptap/pm/view";
-import { TableRow as ze, TableHeader as Pe, TableCell as Oe, Table as Ne } from "@tiptap/extension-table";
-import { Mathematics as je } from "@tiptap/extension-mathematics";
-import { Node as We, mergeAttributes as Ke } from "@tiptap/core";
-import { ElTooltip as U, ElButton as S, ElPopover as oe, ElInput as ie, ElDropdown as X, ElDropdownMenu as Q, ElDropdownItem as T, ElDialog as qe, ElRadioGroup as Ge, ElRadioButton as Y } from "element-plus";
-import Je from "katex";
-import { BubbleMenu as Xe } from "@tiptap/vue-3/menus";
-const Qe = Re.extend({
+import { defineComponent as c, computed as V, ref as H, createVNode as e, createTextVNode as m, mergeProps as k, inject as B, watch as D, nextTick as P, watchEffect as G, Fragment as de, provide as z } from "vue";
+import pe from "@tiptap/starter-kit";
+import { nodeViewProps as Ce, NodeViewWrapper as ve, VueNodeViewRenderer as fe, useEditor as he, EditorContent as ge } from "@tiptap/vue-3";
+import { TaskList as me, TaskItem as we } from "@tiptap/extension-list";
+import { TextAlign as be } from "@tiptap/extension-text-align";
+import { Placeholder as ke } from "@tiptap/extension-placeholder";
+import { CodeBlockLowlight as xe } from "@tiptap/extension-code-block-lowlight";
+import { createLowlight as He, common as Be } from "lowlight";
+import { Image as Ae } from "@tiptap/extension-image";
+import { Plugin as ye, NodeSelection as Me } from "@tiptap/pm/state";
+import { Decoration as Ie, DecorationSet as Le } from "@tiptap/pm/view";
+import { TableRow as Ee, TableHeader as Fe, TableCell as Ve, Table as Te } from "@tiptap/extension-table";
+import { Mathematics as Ze } from "@tiptap/extension-mathematics";
+import { Node as Re, mergeAttributes as De } from "@tiptap/core";
+import { ElTooltip as R, ElButton as Z, ElPopover as J, ElInput as X, ElDropdown as j, ElDropdownMenu as W, ElDropdownItem as E, ElDialog as Se, ElRadioGroup as Ue, ElRadioButton as q } from "element-plus";
+import _e from "katex";
+import { BubbleMenu as Pe } from "@tiptap/vue-3/menus";
+const ze = Ae.extend({
   addAttributes() {
     return {
       ...this.parent?.(),
@@ -29,130 +29,134 @@ const Qe = Re.extend({
   addProseMirrorPlugins() {
     const t = this.name;
     return [
-      new De({
+      new ye({
         props: {
           decorations(l) {
             const n = [];
-            return l.doc.descendants((i, a) => {
-              i.type.name === t && i.attrs.align && n.push(
-                Ue.node(a, a + i.nodeSize, {
-                  "data-align": i.attrs.align
+            return l.doc.descendants((o, u) => {
+              o.type.name === t && o.attrs.align && n.push(
+                Ie.node(u, u + o.nodeSize, {
+                  "data-align": o.attrs.align
                 })
               );
-            }), $e.create(l.doc, n);
+            }), Le.create(l.doc, n);
           }
         }
       })
     ];
   }
-}), Ye = { class: "tiptap-image-upload-content" }, e1 = { class: "tiptap-image-upload-subtext" }, t1 = {
-  key: 1,
-  class: "tiptap-image-upload-previews"
-}, l1 = { class: "tiptap-image-upload-preview-content" }, n1 = { class: "tiptap-image-upload-text" }, o1 = { class: "tiptap-image-upload-subtext" }, i1 = ["onClick"], r1 = ["accept", "multiple"], u1 = /* @__PURE__ */ c({
-  __name: "ImageUploadView",
-  props: Be,
+}), Oe = /* @__PURE__ */ c({
+  name: "ImageUploadView",
+  props: Ce,
   setup(t) {
-    const l = t, n = D(() => l.node.attrs.accept), i = D(() => l.node.attrs.limit), a = D(() => l.node.attrs.maxSize), u = M([]), h = M(), m = M(!1), f = async (d) => {
-      if (a.value > 0 && d.size > a.value)
-        return l.extension.options.onError?.(
-          new Error(`文件大小超出限制 ${a.value / 1024 / 1024}MB`)
-        ), null;
-      const p = crypto.randomUUID();
-      u.value.push({ id: p, file: d, progress: 0, status: "uploading" });
+    const l = V(() => t.node.attrs.accept), n = V(() => t.node.attrs.limit), o = V(() => t.node.attrs.maxSize), u = H([]), s = H(), f = H(!1), g = async (a) => {
+      if (o.value > 0 && a.size > o.value)
+        return t.extension.options.onError?.(new Error(`文件大小超出限制 ${o.value / 1024 / 1024}MB`)), null;
+      const d = crypto.randomUUID();
+      u.value.push({
+        id: d,
+        file: a,
+        progress: 0,
+        status: "uploading"
+      });
       try {
-        const v = l.extension.options.upload;
+        const v = t.extension.options.upload;
         if (!v) throw new Error("未配置 upload 函数");
-        const A = await v(d);
-        if (!A) throw new Error("上传失败：未返回 URL");
-        const H = u.value.find((E) => E.id === p);
-        return H && (H.status = "success", H.progress = 100), l.extension.options.onSuccess?.(A), A;
+        const h = await v(a);
+        if (!h) throw new Error("上传失败：未返回 URL");
+        const A = u.value.find((T) => T.id === d);
+        return A && (A.status = "success", A.progress = 100), t.extension.options.onSuccess?.(h), h;
       } catch (v) {
-        const A = u.value.find((H) => H.id === p);
-        return A && (A.status = "error", A.progress = 0), l.extension.options.onError?.(v instanceof Error ? v : new Error("上传失败")), null;
+        const h = u.value.find((A) => A.id === d);
+        return h && (h.status = "error", h.progress = 0), t.extension.options.onError?.(v instanceof Error ? v : new Error("上传失败")), null;
       }
-    }, C = async (d) => {
-      if (!d.length) return;
-      if (d.length > i.value) {
-        l.extension.options.onError?.(new Error(`最多上传 ${i.value} 个文件`));
+    }, r = async (a) => {
+      if (!a.length) return;
+      if (a.length > n.value) {
+        t.extension.options.onError?.(new Error(`最多上传 ${n.value} 个文件`));
         return;
       }
-      const p = (await Promise.all(d.map(f))).filter((v) => !!v);
-      if (p.length > 0) {
-        const v = l.getPos();
+      const d = (await Promise.all(a.map(g))).filter((v) => !!v);
+      if (d.length > 0) {
+        const v = t.getPos();
         if (typeof v != "number") return;
-        const A = p.map((H) => ({ type: "image", attrs: { src: H } }));
-        l.editor.chain().focus().deleteRange({ from: v, to: v + l.node.nodeSize }).insertContentAt(v, A).run();
+        const h = d.map((A) => ({
+          type: "image",
+          attrs: {
+            src: A
+          }
+        }));
+        t.editor.chain().focus().deleteRange({
+          from: v,
+          to: v + t.node.nodeSize
+        }).insertContentAt(v, h).run();
       }
-    }, o = () => {
-      u.value.length === 0 && h.value && (h.value.value = "", h.value.click());
-    }, r = (d) => {
-      const p = d.target.files;
-      p && C(Array.from(p));
-    }, s = (d) => {
-      d.preventDefault(), m.value = !0;
-    }, x = (d) => {
-      d.currentTarget.contains(d.relatedTarget) || (m.value = !1);
-    }, L = (d) => {
-      d.preventDefault(), m.value = !1;
-      const p = Array.from(d.dataTransfer?.files ?? []);
-      p.length && C(p);
-    }, g = (d) => {
-      u.value = u.value.filter((p) => p.id !== d);
+    }, C = () => {
+      u.value.length === 0 && s.value && (s.value.value = "", s.value.click());
+    }, i = (a) => {
+      const d = a.target.files;
+      d && r(Array.from(d));
+    }, p = (a) => {
+      a.preventDefault(), f.value = !0;
+    }, w = (a) => {
+      a.currentTarget.contains(a.relatedTarget) || (f.value = !1);
+    }, I = (a) => {
+      a.preventDefault(), f.value = !1;
+      const d = Array.from(a.dataTransfer?.files ?? []);
+      d.length && r(d);
+    }, x = (a) => {
+      u.value = u.value.filter((d) => d.id !== a);
     };
-    return (d, p) => (Z(), te(w(Me), {
-      class: "tiptap-image-upload",
-      onClick: o
+    return () => e(ve, {
+      class: "tiptap-image-upload"
     }, {
-      default: _(() => [
-        u.value.length ? (Z(), R("div", t1, [
-          (Z(!0), R(we, null, ke(u.value, (v) => (Z(), R("div", {
-            key: v.id,
-            class: "tiptap-image-upload-preview"
-          }, [
-            v.status === "uploading" ? (Z(), R("div", {
-              key: 0,
-              class: "tiptap-image-upload-progress",
-              style: be({ width: `${v.progress}%` })
-            }, null, 4)) : xe("", !0),
-            y("div", l1, [
-              y("span", n1, P(v.file.name), 1),
-              y("span", o1, P(v.status === "uploading" ? `${v.progress}%` : v.status === "error" ? "上传失败" : "上传成功"), 1),
-              y("button", {
-                class: "tiptap-image-upload-remove",
-                onClick: G((A) => g(v.id), ["stop"])
-              }, "×", 8, i1)
-            ])
-          ]))), 128))
-        ])) : (Z(), R("div", {
-          key: 0,
-          class: le(["tiptap-image-upload-drag-area", { "drag-active": m.value }]),
-          onDragover: s,
-          onDragleave: x,
-          onDrop: L
-        }, [
-          y("div", Ye, [
-            p[1] || (p[1] = y("span", { class: "tiptap-image-upload-text" }, [
-              y("em", null, "点击上传"),
-              B(" 或拖拽图片到此处")
-            ], -1)),
-            y("span", e1, " 最多 " + P(i.value) + " 个文件" + P(a.value ? `，每个不超过 ${a.value / 1024 / 1024}MB` : ""), 1)
-          ])
-        ], 34)),
-        y("input", {
-          ref_key: "inputRef",
-          ref: h,
-          type: "file",
-          accept: n.value,
-          multiple: i.value > 1,
-          onChange: r,
-          onClick: p[0] || (p[0] = G(() => {
-          }, ["stop"]))
-        }, null, 40, r1)
-      ]),
-      _: 1
-    }));
+      default: () => [e("div", {
+        onClick: C
+      }, [u.value.length ? e("div", {
+        class: "tiptap-image-upload-previews"
+      }, [u.value.map((a) => e("div", {
+        key: a.id,
+        class: "tiptap-image-upload-preview"
+      }, [a.status === "uploading" && e("div", {
+        class: "tiptap-image-upload-progress",
+        style: {
+          width: `${a.progress}%`
+        }
+      }, null), e("div", {
+        class: "tiptap-image-upload-preview-content"
+      }, [e("span", {
+        class: "tiptap-image-upload-text"
+      }, [a.file.name]), e("span", {
+        class: "tiptap-image-upload-subtext"
+      }, [a.status === "uploading" ? `${a.progress}%` : a.status === "error" ? "上传失败" : "上传成功"]), e("button", {
+        class: "tiptap-image-upload-remove",
+        onClick: (d) => {
+          d.stopPropagation(), x(a.id);
+        }
+      }, [m("×")])])]))]) : e("div", {
+        class: ["tiptap-image-upload-drag-area", {
+          "drag-active": f.value
+        }],
+        onDragover: p,
+        onDragleave: w,
+        onDrop: I
+      }, [e("div", {
+        class: "tiptap-image-upload-content"
+      }, [e("span", {
+        class: "tiptap-image-upload-text"
+      }, [e("em", null, [m("点击上传")]), m(" 或拖拽图片到此处")]), e("span", {
+        class: "tiptap-image-upload-subtext"
+      }, [m("最多 "), n.value, m(" 个文件"), o.value ? `，每个不超过 ${o.value / 1024 / 1024}MB` : ""])])]), e("input", {
+        ref: s,
+        type: "file",
+        accept: l.value,
+        multiple: n.value > 1,
+        onChange: i,
+        onClick: (a) => a.stopPropagation()
+      }, null)])]
+    });
   }
-}), a1 = We.create({
+}), $e = Re.create({
   name: "imageUpload",
   group: "block",
   draggable: !0,
@@ -194,12 +198,12 @@ const Qe = Re.extend({
   renderHTML({
     HTMLAttributes: t
   }) {
-    return ["div", Ke({
+    return ["div", De({
       "data-type": "image-upload"
     }, t)];
   },
   addNodeView() {
-    return Ae(u1);
+    return fe(Oe);
   },
   addCommands() {
     return {
@@ -221,18 +225,18 @@ const Qe = Re.extend({
           nodeAfter: n
         } = l.$from;
         if (n?.type.name === "imageUpload" && t.isActive("imageUpload")) {
-          const i = t.view.nodeDOM(l.$from.pos);
-          if (i instanceof HTMLElement) {
-            const a = i.firstChild;
-            if (a instanceof HTMLElement)
-              return a.click(), !0;
+          const o = t.view.nodeDOM(l.$from.pos);
+          if (o instanceof HTMLElement) {
+            const u = o.firstChild;
+            if (u instanceof HTMLElement)
+              return u.click(), !0;
           }
         }
         return !1;
       }
     };
   }
-}), s1 = {
+}), Ne = {
   icon: {
     type: Object,
     required: !0
@@ -251,16 +255,16 @@ const Qe = Re.extend({
   onClick: {
     type: Function
   }
-}, k = /* @__PURE__ */ c({
+}, b = /* @__PURE__ */ c({
   name: "IconButton",
-  props: s1,
+  props: Ne,
   setup(t) {
-    return () => e(U, {
+    return () => e(R, {
       showArrow: !1,
       offset: 6,
       content: t.tooltip
     }, {
-      default: () => [e(S, {
+      default: () => [e(Z, {
         text: !0,
         icon: t.icon,
         class: ["tiptap-button", {
@@ -271,12 +275,12 @@ const Qe = Re.extend({
       }, null)]
     });
   }
-}), c1 = /* @__PURE__ */ c({
+}), je = /* @__PURE__ */ c({
   name: "UndoIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -289,12 +293,12 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), d1 = /* @__PURE__ */ c({
+}), We = /* @__PURE__ */ c({
   name: "RedoIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -307,28 +311,28 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), p1 = /* @__PURE__ */ c({
+}), qe = /* @__PURE__ */ c({
   name: "UndoRedoButton",
   setup() {
-    const t = I("editor"), l = D(() => t?.value?.can().undo() ?? !1), n = D(() => t?.value?.can().redo() ?? !1);
-    return () => e("div", null, [e(k, {
-      icon: c1,
+    const t = B("editor"), l = V(() => t?.value?.can().undo() ?? !1), n = V(() => t?.value?.can().redo() ?? !1);
+    return () => e("div", null, [e(b, {
+      icon: je,
       tooltip: "撤销",
       disabled: !l.value,
       onClick: () => t?.value?.chain().focus().undo().run()
-    }, null), e(k, {
-      icon: d1,
+    }, null), e(b, {
+      icon: We,
       tooltip: "重做",
       disabled: !n.value,
       onClick: () => t?.value?.chain().focus().redo().run()
     }, null)]);
   }
-}), C1 = /* @__PURE__ */ c({
+}), Ke = /* @__PURE__ */ c({
   name: "LinkIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -342,12 +346,12 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), v1 = /* @__PURE__ */ c({
+}), Ge = /* @__PURE__ */ c({
   name: "CornerDownLeftIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -363,12 +367,12 @@ const Qe = Re.extend({
       d: "M20 4v7a4 4 0 0 1-4 4H4"
     }, null)]);
   }
-}), f1 = /* @__PURE__ */ c({
+}), Je = /* @__PURE__ */ c({
   name: "ExternalLinkIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -389,12 +393,12 @@ const Qe = Re.extend({
       y2: "3"
     }, null)]);
   }
-}), h1 = /* @__PURE__ */ c({
+}), Xe = /* @__PURE__ */ c({
   name: "TrashIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -410,52 +414,52 @@ const Qe = Re.extend({
       d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
     }, null)]);
   }
-}), m1 = /* @__PURE__ */ c({
+}), Qe = /* @__PURE__ */ c({
   name: "LinkPopover",
   setup() {
-    const t = I("editor"), l = M(!1), n = M("");
-    let i = !1;
-    N(() => t?.value?.isActive("link"), (o) => {
-      i || o && (n.value = t?.value?.getAttributes("link").href ?? "", j(() => {
+    const t = B("editor"), l = H(!1), n = H("");
+    let o = !1;
+    D(() => t?.value?.isActive("link"), (i) => {
+      o || i && (n.value = t?.value?.getAttributes("link").href ?? "", P(() => {
         l.value = !0;
       }));
     });
-    const a = () => {
-      const o = t?.value;
-      if (!o || !n.value) return;
-      i = !0;
+    const u = () => {
+      const i = t?.value;
+      if (!i || !n.value) return;
+      o = !0;
       const {
-        empty: r
-      } = o.state.selection;
-      let s = o.chain().focus().extendMarkRange("link").setLink({
+        empty: p
+      } = i.state.selection;
+      let w = i.chain().focus().extendMarkRange("link").setLink({
         href: n.value
       });
-      r && (s = s.insertContent({
+      p && (w = w.insertContent({
         type: "text",
         text: n.value
-      })), s.run(), l.value = !1, j(() => {
-        i = !1;
+      })), w.run(), l.value = !1, P(() => {
+        o = !1;
       });
-    }, u = () => {
-      const o = t?.value;
-      o && (i = !0, o.chain().focus().extendMarkRange("link").unsetLink().run(), n.value = "", l.value = !1, j(() => {
-        i = !1;
+    }, s = () => {
+      const i = t?.value;
+      i && (o = !0, i.chain().focus().extendMarkRange("link").unsetLink().run(), n.value = "", l.value = !1, P(() => {
+        o = !1;
       }));
-    }, h = () => {
-      const o = t?.value?.getAttributes("link").href;
-      o && window.open(o, "_blank", "noopener,noreferrer");
-    }, m = (o) => {
-      o.key === "Enter" && (o.preventDefault(), a());
-    }, f = (o) => {
-      o && (n.value = t?.value?.getAttributes("link").href ?? ""), l.value = o;
-    }, C = (o) => {
-      n.value = o;
+    }, f = () => {
+      const i = t?.value?.getAttributes("link").href;
+      i && window.open(i, "_blank", "noopener,noreferrer");
+    }, g = (i) => {
+      i.key === "Enter" && (i.preventDefault(), u());
+    }, r = (i) => {
+      i && (n.value = t?.value?.getAttributes("link").href ?? ""), l.value = i;
+    }, C = (i) => {
+      n.value = i;
     };
     return () => {
-      const o = t?.value?.isActive("link") ?? !1;
-      return e(oe, {
+      const i = t?.value?.isActive("link") ?? !1;
+      return e(J, {
         visible: l.value,
-        "onUpdate:visible": f,
+        "onUpdate:visible": r,
         placement: "bottom",
         width: 300,
         trigger: "click",
@@ -463,68 +467,68 @@ const Qe = Re.extend({
         popperClass: "link-popover-popper",
         offset: 6
       }, {
-        reference: () => e("span", null, [e(k, {
+        reference: () => e("span", null, [e(b, {
           tooltip: "链接",
-          icon: C1,
+          icon: Ke,
           class: ["tiptap-button", {
-            "is-active": o
+            "is-active": i
           }]
         }, null)]),
         default: () => e("div", {
           class: "link-popover-inner"
-        }, [e(ie, {
+        }, [e(X, {
           modelValue: n.value,
           "onUpdate:modelValue": C,
           type: "url",
           placeholder: "请输入链接...",
           size: "small",
           autofocus: !0,
-          onKeydown: m
+          onKeydown: g
         }, null), e("div", {
           class: "link-popover-actions"
-        }, [e(U, {
+        }, [e(R, {
           content: "确认",
           showArrow: !1,
           offset: 4
         }, {
-          default: () => [e(S, {
+          default: () => [e(Z, {
             text: !0,
-            icon: v1,
+            icon: Ge,
             disabled: !n.value,
-            onClick: a
+            onClick: u
           }, null)]
-        }), e(U, {
+        }), e(R, {
           content: "在新标签页打开",
           showArrow: !1,
           offset: 4
         }, {
-          default: () => [e(S, {
+          default: () => [e(Z, {
             text: !0,
-            icon: f1,
-            disabled: !n.value && !o,
-            onClick: h
+            icon: Je,
+            disabled: !n.value && !i,
+            onClick: f
           }, null)]
-        }), e(U, {
+        }), e(R, {
           content: "移除链接",
           showArrow: !1,
           offset: 4
         }, {
-          default: () => [e(S, {
+          default: () => [e(Z, {
             text: !0,
-            icon: h1,
-            disabled: !o,
-            onClick: u
+            icon: Xe,
+            disabled: !i,
+            onClick: s
           }, null)]
         })])])
       });
     };
   }
-}), re = /* @__PURE__ */ c({
+}), Q = /* @__PURE__ */ c({
   name: "BoldIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -537,12 +541,12 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), ue = /* @__PURE__ */ c({
+}), Y = /* @__PURE__ */ c({
   name: "ItalicIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -553,12 +557,12 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), ae = /* @__PURE__ */ c({
+}), ee = /* @__PURE__ */ c({
   name: "StrikeIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -572,12 +576,12 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), se = /* @__PURE__ */ c({
+}), te = /* @__PURE__ */ c({
   name: "UnderlineIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -590,38 +594,38 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), g1 = /* @__PURE__ */ c({
+}), Ye = /* @__PURE__ */ c({
   name: "TextStyleButton",
   setup() {
-    const t = I("editor");
-    return () => e("div", null, [e(k, {
-      icon: re,
+    const t = B("editor");
+    return () => e("div", null, [e(b, {
+      icon: Q,
       tooltip: "粗体",
       isActive: t?.value?.isActive("bold"),
       onClick: () => t?.value?.chain().focus().toggleBold().run()
-    }, null), e(k, {
-      icon: ue,
+    }, null), e(b, {
+      icon: Y,
       tooltip: "斜体",
       isActive: t?.value?.isActive("italic"),
       onClick: () => t?.value?.chain().focus().toggleItalic().run()
-    }, null), e(k, {
-      icon: ae,
+    }, null), e(b, {
+      icon: ee,
       tooltip: "删除线",
       isActive: t?.value?.isActive("strike"),
       onClick: () => t?.value?.chain().focus().toggleStrike().run()
-    }, null), e(k, {
-      icon: se,
+    }, null), e(b, {
+      icon: te,
       tooltip: "下划线",
       isActive: t?.value?.isActive("underline"),
       onClick: () => t?.value?.chain().focus().toggleUnderline().run()
-    }, null), e(m1, null, null)]);
+    }, null), e(Qe, null, null)]);
   }
-}), ce = /* @__PURE__ */ c({
+}), le = /* @__PURE__ */ c({
   name: "AlignLeftIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -644,12 +648,12 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), de = /* @__PURE__ */ c({
+}), ne = /* @__PURE__ */ c({
   name: "AlignCenterIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -672,12 +676,12 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), pe = /* @__PURE__ */ c({
+}), oe = /* @__PURE__ */ c({
   name: "AlignRightIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -700,12 +704,12 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), w1 = /* @__PURE__ */ c({
+}), e1 = /* @__PURE__ */ c({
   name: "AlignJustifyIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -728,33 +732,33 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), k1 = /* @__PURE__ */ c({
+}), t1 = /* @__PURE__ */ c({
   name: "TextAlignButton",
   setup() {
-    const t = I("editor");
-    return () => e("div", null, [e(k, {
-      icon: ce,
+    const t = B("editor");
+    return () => e("div", null, [e(b, {
+      icon: le,
       tooltip: "左边对齐",
       isActive: t?.value?.isActive({
         textAlign: "left"
       }),
       onClick: () => t?.value?.chain().focus().setTextAlign("left").run()
-    }, null), e(k, {
-      icon: de,
+    }, null), e(b, {
+      icon: ne,
       tooltip: "中间对齐",
       isActive: t?.value?.isActive({
         textAlign: "center"
       }),
       onClick: () => t?.value?.chain().focus().setTextAlign("center").run()
-    }, null), e(k, {
-      icon: pe,
+    }, null), e(b, {
+      icon: oe,
       tooltip: "右边对齐",
       isActive: t?.value?.isActive({
         textAlign: "right"
       }),
       onClick: () => t?.value?.chain().focus().setTextAlign("right").run()
-    }, null), e(k, {
-      icon: w1,
+    }, null), e(b, {
+      icon: e1,
       tooltip: "两端对齐",
       isActive: t?.value?.isActive({
         textAlign: "justify"
@@ -762,12 +766,12 @@ const Qe = Re.extend({
       onClick: () => t?.value?.chain().focus().setTextAlign("justify").run()
     }, null)]);
   }
-}), b1 = /* @__PURE__ */ c({
+}), l1 = /* @__PURE__ */ c({
   name: "ListIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -805,12 +809,12 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), x1 = /* @__PURE__ */ c({
+}), n1 = /* @__PURE__ */ c({
   name: "ListOrderedIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -848,12 +852,12 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), H1 = /* @__PURE__ */ c({
+}), o1 = /* @__PURE__ */ c({
   name: "ListTodoIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -886,33 +890,33 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), B1 = /* @__PURE__ */ c({
+}), i1 = /* @__PURE__ */ c({
   name: "ListButton",
   setup() {
-    const t = I("editor");
-    return () => e("div", null, [e(k, {
-      icon: b1,
+    const t = B("editor");
+    return () => e("div", null, [e(b, {
+      icon: l1,
       tooltip: "无序列表",
       isActive: t?.value?.isActive("bulletList"),
       onClick: () => t?.value?.chain().focus().toggleBulletList().run()
-    }, null), e(k, {
-      icon: x1,
+    }, null), e(b, {
+      icon: n1,
       tooltip: "有序列表",
       isActive: t?.value?.isActive("orderedList"),
       onClick: () => t?.value?.chain().focus().toggleOrderedList().run()
-    }, null), e(k, {
-      icon: H1,
+    }, null), e(b, {
+      icon: o1,
       tooltip: "任务列表",
       isActive: t?.value?.isActive("taskList"),
       onClick: () => t?.value?.chain().focus().toggleTaskList().run()
     }, null)]);
   }
-}), M1 = /* @__PURE__ */ c({
+}), u1 = /* @__PURE__ */ c({
   name: "ImagePlusIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -925,22 +929,22 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), A1 = /* @__PURE__ */ c({
+}), r1 = /* @__PURE__ */ c({
   name: "ImageButton",
   setup() {
-    const t = I("editor");
-    return () => e("div", null, [e(k, {
-      icon: M1,
+    const t = B("editor");
+    return () => e("div", null, [e(b, {
+      icon: u1,
       tooltip: "图片",
       onClick: () => t?.value?.commands.setImageUploadNode()
     }, null)]);
   }
-}), y1 = /* @__PURE__ */ c({
+}), a1 = /* @__PURE__ */ c({
   name: "TableIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -953,42 +957,42 @@ const Qe = Re.extend({
       fill: "currentColor"
     }, null)]);
   }
-}), L1 = 8, I1 = 8, E1 = /* @__PURE__ */ c({
+}), s1 = 8, c1 = 8, d1 = /* @__PURE__ */ c({
   name: "TableButton",
   setup() {
-    const t = I("editor"), l = M(!1), n = M(0), i = M(0), a = (m, f) => {
-      n.value = m, i.value = f;
-    }, u = () => {
-      n.value = 0, i.value = 0;
-    }, h = (m, f) => {
+    const t = B("editor"), l = H(!1), n = H(0), o = H(0), u = (g, r) => {
+      n.value = g, o.value = r;
+    }, s = () => {
+      n.value = 0, o.value = 0;
+    }, f = (g, r) => {
       t?.value?.chain().focus().insertTable({
-        rows: f,
-        cols: m,
+        rows: r,
+        cols: g,
         withHeaderRow: !0
       }).run(), l.value = !1;
     };
-    return () => e(oe, {
+    return () => e(J, {
       visible: l.value,
-      "onUpdate:visible": (m) => l.value = m,
+      "onUpdate:visible": (g) => l.value = g,
       trigger: "click",
       placement: "bottom-start",
       popperClass: "table-picker-popper",
       width: "auto",
       showArrow: !1
     }, {
-      reference: () => e("span", null, [e(U, {
+      reference: () => e("span", null, [e(R, {
         content: "表格",
         showArrow: !1,
         offset: 6,
         disabled: l.value
       }, {
-        default: () => [e(S, {
+        default: () => [e(Z, {
           text: !0,
           class: ["tiptap-button", {
             "is-active": l.value
           }]
         }, {
-          default: () => [e(y1, {
+          default: () => [e(a1, {
             class: "tiptap-button-icon"
           }, null)]
         })]
@@ -997,34 +1001,34 @@ const Qe = Re.extend({
         class: "table-picker"
       }, [e("div", {
         class: "table-picker-grid",
-        onMouseleave: u
+        onMouseleave: s
       }, [Array.from({
-        length: I1
-      }, (m, f) => e("div", {
-        key: f,
+        length: c1
+      }, (g, r) => e("div", {
+        key: r,
         class: "table-picker-row"
       }, [Array.from({
-        length: L1
-      }, (C, o) => e("div", {
-        key: o,
+        length: s1
+      }, (C, i) => e("div", {
+        key: i,
         class: ["table-picker-cell", {
-          "is-active": o < n.value && f < i.value
+          "is-active": i < n.value && r < o.value
         }],
-        onMouseenter: () => a(o + 1, f + 1),
-        onClick: () => h(o + 1, f + 1)
+        onMouseenter: () => u(i + 1, r + 1),
+        onClick: () => f(i + 1, r + 1)
       }, null))]))]), e("div", {
         class: "table-picker-footer"
       }, [e("div", {
         class: "table-picker-counter"
-      }, [e("span", null, [B("列")]), e("span", null, [n.value || 1])]), e("span", {
+      }, [e("span", null, [m("列")]), e("span", null, [n.value || 1])]), e("span", {
         class: "table-picker-x"
-      }, [B("x")]), e("div", {
+      }, [m("x")]), e("div", {
         class: "table-picker-counter"
-      }, [e("span", null, [B("行")]), e("span", null, [i.value || 1])])])])
+      }, [e("span", null, [m("行")]), e("span", null, [o.value || 1])])])])
     });
   }
 });
-function V1(t) {
+function p1(t) {
   let l = t.nodeType === Node.TEXT_NODE ? t.parentElement : t;
   for (; l && l instanceof HTMLElement; ) {
     if (l.tagName === "TD" || l.tagName === "TH") return l;
@@ -1032,106 +1036,106 @@ function V1(t) {
   }
   return null;
 }
-function T1(t) {
+function C1(t) {
   if (!t.isActive("tableCell") && !t.isActive("tableHeader")) return null;
   const {
     node: l
-  } = t.view.domAtPos(t.state.selection.from), n = V1(l);
+  } = t.view.domAtPos(t.state.selection.from), n = p1(l);
   if (!n) return null;
-  const i = n.parentElement, a = i.parentElement, u = n.closest("table");
-  if (!u) return null;
-  const h = Array.from(i.children).indexOf(n), m = Array.from(a.children).indexOf(i), f = i.children.length, C = a.children.length, o = n.getBoundingClientRect(), r = u.getBoundingClientRect(), s = t.view.dom.closest(".tiptap-editor").getBoundingClientRect();
+  const o = n.parentElement, u = o.parentElement, s = n.closest("table");
+  if (!s) return null;
+  const f = Array.from(o.children).indexOf(n), g = Array.from(u.children).indexOf(o), r = o.children.length, C = u.children.length, i = n.getBoundingClientRect(), p = s.getBoundingClientRect(), w = t.view.dom.closest(".tiptap-editor").getBoundingClientRect();
   return {
     cell: n,
-    colIndex: h,
-    rowIndex: m,
-    totalCols: f,
+    colIndex: f,
+    rowIndex: g,
+    totalCols: r,
     totalRows: C,
-    cellRect: o,
-    tableRect: r,
-    editorRect: s
+    cellRect: i,
+    tableRect: p,
+    editorRect: w
   };
 }
-function ee(t) {
+function K(t) {
   const {
     state: l
   } = t, n = l.selection.from;
-  let i = null;
-  return l.doc.nodesBetween(0, l.doc.content.size, (a, u) => {
-    if (a.type.name === "table" && u <= n && n <= u + a.nodeSize)
-      return i = {
-        node: a,
-        pos: u
+  let o = null;
+  return l.doc.nodesBetween(0, l.doc.content.size, (u, s) => {
+    if (u.type.name === "table" && s <= n && n <= s + u.nodeSize)
+      return o = {
+        node: u,
+        pos: s
       }, !1;
-  }), i;
+  }), o;
 }
-const Z1 = /* @__PURE__ */ c({
+const v1 = /* @__PURE__ */ c({
   name: "TableControls",
   setup() {
-    const t = I("editor"), l = M(null), n = M(null);
-    function i() {
-      const C = t?.value;
-      if (n.value && (n.value.classList.remove("tcc-cell-focused"), n.value = null), !C) {
-        l.value = null;
+    const t = B("editor"), l = B("readonly"), n = H(null), o = H(null);
+    function u() {
+      const i = t?.value;
+      if (o.value && (o.value.classList.remove("tcc-cell-focused"), o.value = null), !i) {
+        n.value = null;
         return;
       }
-      const o = T1(C);
-      l.value = o, o && (o.cell.classList.add("tcc-cell-focused"), n.value = o.cell);
+      const p = C1(i);
+      n.value = p, p && (p.cell.classList.add("tcc-cell-focused"), o.value = p.cell);
     }
-    ne((C) => {
-      const o = t?.value;
-      o && (o.on("selectionUpdate", i), o.on("transaction", i), C(() => {
-        o.off("selectionUpdate", i), o.off("transaction", i), n.value && (n.value.classList.remove("tcc-cell-focused"), n.value = null);
+    G((i) => {
+      const p = t?.value;
+      p && (p.on("selectionUpdate", u), p.on("transaction", u), i(() => {
+        p.off("selectionUpdate", u), p.off("transaction", u), o.value && (o.value.classList.remove("tcc-cell-focused"), o.value = null);
       }));
     });
-    function a(C) {
-      const o = t?.value;
-      if (!o || !l.value) return;
+    function s(i) {
+      const p = t?.value;
+      if (!p || !n.value) return;
       const {
-        colIndex: r,
-        totalCols: s
-      } = l.value, x = C === "left" ? r - 1 : r + 1;
-      if (x < 0 || x >= s) return;
-      const L = ee(o);
-      if (!L) return;
+        colIndex: w,
+        totalCols: I
+      } = n.value, x = i === "left" ? w - 1 : w + 1;
+      if (x < 0 || x >= I) return;
+      const a = K(p);
+      if (!a) return;
       const {
-        node: g,
-        pos: d
-      } = L, p = [];
-      g.forEach((H) => {
-        if (H.type.name !== "tableRow") {
-          p.push(H);
+        node: d,
+        pos: v
+      } = a, h = [];
+      d.forEach((L) => {
+        if (L.type.name !== "tableRow") {
+          h.push(L);
           return;
         }
-        const E = [];
-        H.forEach((z) => E.push(z));
-        const $ = E[r];
-        E[r] = E[x], E[x] = $, p.push(H.type.create(H.attrs, E, H.marks));
+        const y = [];
+        L.forEach((U) => y.push(U));
+        const S = y[w];
+        y[w] = y[x], y[x] = S, h.push(L.type.create(L.attrs, y, L.marks));
       });
-      const v = g.type.create(g.attrs, p, g.marks), A = o.state.tr.replaceWith(d, d + g.nodeSize, v);
-      o.view.dispatch(A);
+      const A = d.type.create(d.attrs, h, d.marks), T = p.state.tr.replaceWith(v, v + d.nodeSize, A);
+      p.view.dispatch(T);
     }
-    function u(C) {
-      const o = t?.value;
-      if (!o || !l.value) return;
+    function f(i) {
+      const p = t?.value;
+      if (!p || !n.value) return;
       const {
-        rowIndex: r,
-        totalRows: s
-      } = l.value, x = C === "up" ? r - 1 : r + 1;
-      if (x < 0 || x >= s) return;
-      const L = ee(o);
-      if (!L) return;
+        rowIndex: w,
+        totalRows: I
+      } = n.value, x = i === "up" ? w - 1 : w + 1;
+      if (x < 0 || x >= I) return;
+      const a = K(p);
+      if (!a) return;
       const {
-        node: g,
-        pos: d
-      } = L, p = [];
-      g.forEach((E) => p.push(E));
-      const v = p[r];
-      p[r] = p[x], p[x] = v;
-      const A = g.type.create(g.attrs, p, g.marks), H = o.state.tr.replaceWith(d, d + g.nodeSize, A);
-      o.view.dispatch(H);
+        node: d,
+        pos: v
+      } = a, h = [];
+      d.forEach((y) => h.push(y));
+      const A = h[w];
+      h[w] = h[x], h[x] = A;
+      const T = d.type.create(d.attrs, h, d.marks), L = p.state.tr.replaceWith(v, v + d.nodeSize, T);
+      p.view.dispatch(L);
     }
-    const h = () => e("svg", {
+    const g = () => e("svg", {
       width: "16",
       height: "4",
       viewBox: "0 0 16 4",
@@ -1148,7 +1152,7 @@ const Z1 = /* @__PURE__ */ c({
       cx: "14",
       cy: "2",
       r: "1.5"
-    }, null)]), m = () => e("svg", {
+    }, null)]), r = () => e("svg", {
       width: "4",
       height: "16",
       viewBox: "0 0 4 16",
@@ -1165,7 +1169,7 @@ const Z1 = /* @__PURE__ */ c({
       cx: "2",
       cy: "14",
       r: "1.5"
-    }, null)]), f = () => e("svg", {
+    }, null)]), C = () => e("svg", {
       width: "10",
       height: "10",
       viewBox: "0 0 10 10",
@@ -1177,126 +1181,127 @@ const Z1 = /* @__PURE__ */ c({
       d: "M5 1v8M1 5h8"
     }, null)]);
     return () => {
-      const C = l.value;
-      if (!C) return null;
+      if (l?.value) return null;
+      const i = n.value;
+      if (!i) return null;
       const {
-        colIndex: o,
-        rowIndex: r,
-        totalCols: s,
+        colIndex: p,
+        rowIndex: w,
+        totalCols: I,
         totalRows: x,
-        cellRect: L,
-        tableRect: g,
-        editorRect: d
-      } = C, p = g.top - d.top, v = g.left - d.left, A = g.right - d.left, H = g.bottom - d.top, E = L.left - d.left, $ = L.top - d.top, z = L.width, W = L.height, Ce = {
+        cellRect: a,
+        tableRect: d,
+        editorRect: v
+      } = i, h = d.top - v.top, A = d.left - v.left, T = d.right - v.left, L = d.bottom - v.top, y = a.left - v.left, S = a.top - v.top, U = a.width, O = a.height, ie = {
         position: "absolute",
-        top: `${p - 20}px`,
-        left: `${E + z / 2 - 18}px`
-      }, ve = {
+        top: `${h - 20}px`,
+        left: `${y + U / 2 - 18}px`
+      }, ue = {
         position: "absolute",
-        top: `${$ + W / 2 - 18}px`,
-        left: `${v - 20}px`
-      }, fe = {
+        top: `${S + O / 2 - 18}px`,
+        left: `${A - 20}px`
+      }, re = {
         position: "absolute",
-        top: `${$ + W / 2 - 12}px`,
-        left: `${A + 6}px`
-      }, he = {
+        top: `${S + O / 2 - 12}px`,
+        left: `${T + 6}px`
+      }, ae = {
         position: "absolute",
-        top: `${H + 6}px`,
-        left: `${E + z / 2 - 12}px`
-      }, me = o === 0, K = o === s - 1, ge = r === 0, q = r === x - 1, F = t?.value;
+        top: `${L + 6}px`,
+        left: `${y + U / 2 - 12}px`
+      }, se = p === 0, $ = p === I - 1, ce = w === 0, N = w === x - 1, F = t?.value;
       return e("div", {
         class: "table-cell-controls"
-      }, [e(X, {
+      }, [e(j, {
         trigger: "click",
         placement: "bottom",
-        style: Ce,
-        onCommand: (V) => {
-          V === "move-left" ? a("left") : V === "move-right" ? a("right") : V === "insert-left" ? F?.chain().focus().addColumnBefore().run() : V === "insert-right" ? F?.chain().focus().addColumnAfter().run() : V === "delete" && F?.chain().focus().deleteColumn().run();
+        style: ie,
+        onCommand: (M) => {
+          M === "move-left" ? s("left") : M === "move-right" ? s("right") : M === "insert-left" ? F?.chain().focus().addColumnBefore().run() : M === "insert-right" ? F?.chain().focus().addColumnAfter().run() : M === "delete" && F?.chain().focus().deleteColumn().run();
         }
       }, {
         default: () => [e("button", {
           class: "tcc-btn tcc-btn--col"
-        }, [e(h, null, null)])],
-        dropdown: () => e(Q, null, {
-          default: () => [e(T, {
+        }, [e(g, null, null)])],
+        dropdown: () => e(W, null, {
+          default: () => [e(E, {
             command: "move-left",
-            disabled: me
+            disabled: se
           }, {
-            default: () => [B("移动列到左侧")]
-          }), e(T, {
+            default: () => [m("移动列到左侧")]
+          }), e(E, {
             command: "move-right",
-            disabled: K
+            disabled: $
           }, {
-            default: () => [B("移动列到右侧")]
-          }), e(T, {
+            default: () => [m("移动列到右侧")]
+          }), e(E, {
             command: "insert-left"
           }, {
-            default: () => [B("在左侧插入一列")]
-          }), e(T, {
+            default: () => [m("在左侧插入一列")]
+          }), e(E, {
             command: "insert-right"
           }, {
-            default: () => [B("在右侧插入一列")]
-          }), e(T, {
+            default: () => [m("在右侧插入一列")]
+          }), e(E, {
             command: "delete",
             divided: !0
           }, {
-            default: () => [B("删除列")]
+            default: () => [m("删除列")]
           })]
         })
-      }), e(X, {
+      }), e(j, {
         trigger: "click",
         placement: "right",
-        style: ve,
-        onCommand: (V) => {
-          V === "move-up" ? u("up") : V === "move-down" ? u("down") : V === "insert-above" ? F?.chain().focus().addRowBefore().run() : V === "insert-below" ? F?.chain().focus().addRowAfter().run() : V === "delete" && F?.chain().focus().deleteRow().run();
+        style: ue,
+        onCommand: (M) => {
+          M === "move-up" ? f("up") : M === "move-down" ? f("down") : M === "insert-above" ? F?.chain().focus().addRowBefore().run() : M === "insert-below" ? F?.chain().focus().addRowAfter().run() : M === "delete" && F?.chain().focus().deleteRow().run();
         }
       }, {
         default: () => [e("button", {
           class: "tcc-btn tcc-btn--row"
-        }, [e(m, null, null)])],
-        dropdown: () => e(Q, null, {
-          default: () => [e(T, {
+        }, [e(r, null, null)])],
+        dropdown: () => e(W, null, {
+          default: () => [e(E, {
             command: "move-up",
-            disabled: ge
+            disabled: ce
           }, {
-            default: () => [B("上移")]
-          }), e(T, {
+            default: () => [m("上移")]
+          }), e(E, {
             command: "move-down",
-            disabled: q
+            disabled: N
           }, {
-            default: () => [B("下移")]
-          }), e(T, {
+            default: () => [m("下移")]
+          }), e(E, {
             command: "insert-above"
           }, {
-            default: () => [B("在上方插入一行")]
-          }), e(T, {
+            default: () => [m("在上方插入一行")]
+          }), e(E, {
             command: "insert-below"
           }, {
-            default: () => [B("在下方插入一行")]
-          }), e(T, {
+            default: () => [m("在下方插入一行")]
+          }), e(E, {
             command: "delete",
             divided: !0
           }, {
-            default: () => [B("删除行")]
+            default: () => [m("删除行")]
           })]
         })
-      }), K && e("button", {
+      }), $ && e("button", {
         class: "tcc-btn tcc-btn--add",
-        style: fe,
+        style: re,
         onClick: () => F?.chain().focus().addColumnAfter().run()
-      }, [e(f, null, null)]), q && e("button", {
+      }, [e(C, null, null)]), N && e("button", {
         class: "tcc-btn tcc-btn--add",
-        style: he,
+        style: ae,
         onClick: () => F?.chain().focus().addRowAfter().run()
-      }, [e(f, null, null)])]);
+      }, [e(C, null, null)])]);
     };
   }
-}), F1 = /* @__PURE__ */ c({
+}), f1 = /* @__PURE__ */ c({
   name: "MathIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -1309,145 +1314,158 @@ const Z1 = /* @__PURE__ */ c({
       fill: "currentColor"
     }, null)]);
   }
-}), _1 = /* @__PURE__ */ c({
+}), h1 = /* @__PURE__ */ c({
   name: "MathButton",
   setup() {
-    const t = I("editor"), l = I("openMathDialog");
-    return () => e(k, {
-      icon: F1,
+    const t = B("editor"), l = B("openMathDialog");
+    return () => e(b, {
+      icon: f1,
       tooltip: "数学公式",
       isActive: t?.value?.isActive("inlineMath") || t?.value?.isActive("blockMath"),
       onClick: () => l?.()
     }, null);
   }
-}), R1 = { class: "math-dialog" }, D1 = {
-  key: 0,
-  class: "math-preview__placeholder"
-}, S1 = ["innerHTML"], U1 = /* @__PURE__ */ c({
-  __name: "MathEditDialog",
+}), g1 = /* @__PURE__ */ c({
+  name: "MathEditDialog",
   props: {
-    visible: { type: Boolean },
-    latex: {},
-    pos: {},
-    type: {}
+    visible: {
+      type: Boolean,
+      required: !0
+    },
+    latex: {
+      type: String,
+      required: !0
+    },
+    pos: {
+      type: Number,
+      default: null
+    },
+    type: {
+      type: String,
+      required: !0
+    }
   },
   emits: ["update:visible"],
-  setup(t, { emit: l }) {
-    const n = t, i = l, a = I("editor"), u = M(""), h = M("inline");
-    N(() => n.latex, (o) => {
-      u.value = o;
-    }, { immediate: !0 }), N(() => n.type, (o) => {
-      h.value = o;
-    }, { immediate: !0 });
-    const m = D(() => n.pos === null), f = D(() => u.value.trim() ? Je.renderToString(u.value, {
-      displayMode: h.value === "block",
+  setup(t, {
+    emit: l
+  }) {
+    const n = B("editor"), o = H(""), u = H("inline");
+    D(() => t.latex, (r) => {
+      o.value = r;
+    }, {
+      immediate: !0
+    }), D(() => t.type, (r) => {
+      u.value = r;
+    }, {
+      immediate: !0
+    });
+    const s = V(() => t.pos === null), f = V(() => o.value.trim() ? _e.renderToString(o.value, {
+      displayMode: u.value === "block",
       throwOnError: !1
-    }) : ""), C = () => {
-      const o = a?.value;
-      if (!(!o || !u.value.trim())) {
-        if (m.value)
-          h.value === "inline" ? o.chain().focus().insertInlineMath({ latex: u.value }).run() : o.chain().focus().insertBlockMath({ latex: u.value }).run();
-        else if (h.value === n.type)
-          n.type === "inline" ? o.commands.updateInlineMath({ latex: u.value, pos: n.pos }) : o.commands.updateBlockMath({ latex: u.value, pos: n.pos });
+    }) : ""), g = () => {
+      const r = n?.value;
+      if (!(!r || !o.value.trim())) {
+        if (s.value)
+          u.value === "inline" ? r.chain().focus().insertInlineMath({
+            latex: o.value
+          }).run() : r.chain().focus().insertBlockMath({
+            latex: o.value
+          }).run();
+        else if (u.value === t.type)
+          t.type === "inline" ? r.commands.updateInlineMath({
+            latex: o.value,
+            pos: t.pos
+          }) : r.commands.updateBlockMath({
+            latex: o.value,
+            pos: t.pos
+          });
         else {
-          const r = n.pos;
-          n.type === "inline" ? o.chain().focus().deleteInlineMath({ pos: r }).insertBlockMath({ latex: u.value }).run() : o.chain().focus().deleteBlockMath({ pos: r }).insertInlineMath({ latex: u.value }).run();
+          const C = t.pos;
+          t.type === "inline" ? r.chain().focus().deleteInlineMath({
+            pos: C
+          }).insertBlockMath({
+            latex: o.value
+          }).run() : r.chain().focus().deleteBlockMath({
+            pos: C
+          }).insertInlineMath({
+            latex: o.value
+          }).run();
         }
-        i("update:visible", !1);
+        l("update:visible", !1);
       }
     };
-    return (o, r) => (Z(), te(w(qe), {
-      "model-value": t.visible,
-      title: m.value ? "插入数学公式" : "编辑数学公式",
+    return () => e(Se, {
+      modelValue: t.visible,
+      title: s.value ? "插入数学公式" : "编辑数学公式",
       width: "520px",
-      "onUpdate:modelValue": r[3] || (r[3] = (s) => i("update:visible", s))
+      "onUpdate:modelValue": (r) => l("update:visible", r)
     }, {
-      footer: _(() => [
-        e(w(S), {
-          onClick: r[2] || (r[2] = (s) => i("update:visible", !1))
+      default: () => [e("div", {
+        class: "math-dialog"
+      }, [e(Ue, {
+        modelValue: u.value,
+        "onUpdate:modelValue": (r) => {
+          u.value = r;
+        }
+      }, {
+        default: () => [e(q, {
+          value: "inline"
         }, {
-          default: _(() => [...r[6] || (r[6] = [
-            B("取消", -1)
-          ])]),
-          _: 1
-        }),
-        e(w(S), {
-          type: "primary",
-          disabled: !u.value.trim(),
-          onClick: C
+          default: () => [m("行内公式")]
+        }), e(q, {
+          value: "block"
         }, {
-          default: _(() => [...r[7] || (r[7] = [
-            B("确认", -1)
-          ])]),
-          _: 1
-        }, 8, ["disabled"])
-      ]),
-      default: _(() => [
-        y("div", R1, [
-          e(w(Ge), {
-            modelValue: h.value,
-            "onUpdate:modelValue": r[0] || (r[0] = (s) => h.value = s)
-          }, {
-            default: _(() => [
-              e(w(Y), { value: "inline" }, {
-                default: _(() => [...r[4] || (r[4] = [
-                  B("行内公式", -1)
-                ])]),
-                _: 1
-              }),
-              e(w(Y), { value: "block" }, {
-                default: _(() => [...r[5] || (r[5] = [
-                  B("块级公式", -1)
-                ])]),
-                _: 1
-              })
-            ]),
-            _: 1
-          }, 8, ["modelValue"]),
-          e(w(ie), {
-            modelValue: u.value,
-            "onUpdate:modelValue": r[1] || (r[1] = (s) => u.value = s),
-            type: "textarea",
-            rows: 3,
-            placeholder: "请输入 LaTeX 公式，例如：E=mc^2"
-          }, null, 8, ["modelValue"]),
-          y("div", {
-            class: le(["math-preview", { "math-preview--empty": !f.value }])
-          }, [
-            f.value ? (Z(), R("div", {
-              key: 1,
-              innerHTML: f.value
-            }, null, 8, S1)) : (Z(), R("span", D1, "预览将在此处显示"))
-          ], 2)
-        ])
-      ]),
-      _: 1
-    }, 8, ["model-value", "title"]));
+          default: () => [m("块级公式")]
+        })]
+      }), e(X, {
+        modelValue: o.value,
+        type: "textarea",
+        rows: 3,
+        placeholder: "请输入 LaTeX 公式，例如：E=mc^2",
+        "onUpdate:modelValue": (r) => {
+          o.value = r;
+        }
+      }, null), e("div", {
+        class: ["math-preview", {
+          "math-preview--empty": !f.value
+        }]
+      }, [f.value ? e("div", {
+        innerHTML: f.value
+      }, null) : e("span", {
+        class: "math-preview__placeholder"
+      }, [m("预览将在此处显示")])])])],
+      footer: () => e(de, null, [e(Z, {
+        onClick: () => l("update:visible", !1)
+      }, {
+        default: () => [m("取消")]
+      }), e(Z, {
+        type: "primary",
+        disabled: !o.value.trim(),
+        onClick: g
+      }, {
+        default: () => [m("确认")]
+      })])
+    });
   }
-}), $1 = (t, l) => {
-  const n = t.__vccOpts || t;
-  for (const [i, a] of l)
-    n[i] = a;
-  return n;
-}, z1 = /* @__PURE__ */ $1(U1, [["__scopeId", "data-v-995dc22f"]]), P1 = [{
+}), m1 = [{
   value: "left",
   title: "居左",
-  Icon: ce
+  Icon: le
 }, {
   value: "center",
   title: "居中",
-  Icon: de
+  Icon: ne
 }, {
   value: "right",
   title: "居右",
-  Icon: pe
-}], O = (t) => t.preventDefault();
-function O1(t) {
+  Icon: oe
+}], _ = (t) => t.preventDefault();
+function w1(t) {
   if (!t.isActive("image")) return null;
   const {
     selection: l
   } = t.state;
-  if (!(l instanceof Se) || l.node.type.name !== "image") return null;
+  if (!(l instanceof Me) || l.node.type.name !== "image") return null;
   const n = l.node;
   return {
     pos: l.from,
@@ -1456,11 +1474,11 @@ function O1(t) {
     align: n.attrs.align ?? "left"
   };
 }
-function N1(t) {
+function b1(t) {
   const l = t.startsWith("data:") ? "image.png" : t.split("/").pop()?.split("?")[0] || "image.png", n = document.createElement("a");
   n.href = t, n.download = l, document.body.appendChild(n), n.click(), document.body.removeChild(n);
 }
-const j1 = () => e("svg", {
+const k1 = () => e("svg", {
   width: "16",
   height: "16",
   viewBox: "0 0 24 24",
@@ -1478,7 +1496,7 @@ const j1 = () => e("svg", {
   y1: "15",
   x2: "12",
   y2: "3"
-}, null)]), W1 = () => e("svg", {
+}, null)]), x1 = () => e("svg", {
   width: "16",
   height: "16",
   viewBox: "0 0 24 24",
@@ -1491,7 +1509,7 @@ const j1 = () => e("svg", {
   points: "1 4 1 10 7 10"
 }, null), e("path", {
   d: "M3.51 15a9 9 0 1 0 .49-4.1L1 10"
-}, null)]), K1 = () => e("svg", {
+}, null)]), H1 = () => e("svg", {
   width: "16",
   height: "16",
   viewBox: "0 0 24 24",
@@ -1508,93 +1526,93 @@ const j1 = () => e("svg", {
   d: "M10 11v6M14 11v6"
 }, null), e("path", {
   d: "M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"
-}, null)]), q1 = /* @__PURE__ */ c({
+}, null)]), B1 = /* @__PURE__ */ c({
   name: "ImageControls",
   setup() {
-    const t = I("editor"), l = M(null);
-    function n() {
-      const i = t?.value;
-      if (!i) {
-        l.value = null;
+    const t = B("editor"), l = B("readonly"), n = H(null);
+    function o() {
+      const u = t?.value;
+      if (!u) {
+        n.value = null;
         return;
       }
-      l.value = O1(i);
+      n.value = w1(u);
     }
-    return ne((i) => {
-      const a = t?.value;
-      a && (a.on("transaction", n), i(() => {
-        a.off("transaction", n);
+    return G((u) => {
+      const s = t?.value;
+      s && (s.on("transaction", o), u(() => {
+        s.off("transaction", o);
       }));
     }), () => {
-      const i = l.value;
-      if (!i) return null;
-      const a = t?.value;
-      if (!a) return null;
+      const u = n.value;
+      if (!u) return null;
+      const s = t?.value;
+      if (!s) return null;
       const {
-        pos: u,
-        nodeSize: h,
-        src: m,
-        align: f
-      } = i, C = a.view.nodeDOM(u);
-      if (!C || !(C instanceof HTMLElement)) return null;
-      const o = C.querySelector("[data-resize-wrapper]") ?? C, r = a.view.dom.closest(".tiptap-editor");
-      if (!r) return null;
-      const s = o.getBoundingClientRect(), x = r.getBoundingClientRect(), L = {
+        pos: f,
+        nodeSize: g,
+        src: r,
+        align: C
+      } = u, i = l?.value ?? !1, p = s.view.nodeDOM(f);
+      if (!p || !(p instanceof HTMLElement)) return null;
+      const w = p.querySelector("[data-resize-wrapper]") ?? p, I = s.view.dom.closest(".tiptap-editor");
+      if (!I) return null;
+      const x = w.getBoundingClientRect(), a = I.getBoundingClientRect(), d = {
         position: "absolute",
-        top: `${s.top - x.top}px`,
-        left: `${s.left - x.left + s.width / 2}px`,
+        top: `${x.top - a.top}px`,
+        left: `${x.left - a.left + x.width / 2}px`,
         transform: "translate(-50%, calc(-100% - 8px))",
         zIndex: 20
       };
       return e("div", {
         class: "image-controls",
-        style: L
-      }, [P1.map(({
-        value: g,
-        title: d,
-        Icon: p
+        style: d
+      }, [!i && m1.map(({
+        value: v,
+        title: h,
+        Icon: A
       }) => e("button", {
-        key: g,
-        class: ["image-controls-btn", f === g && "is-active"],
-        title: d,
-        onMousedown: O,
-        onClick: () => a.chain().focus().updateAttributes("image", {
-          align: g
+        key: v,
+        class: ["image-controls-btn", C === v && "is-active"],
+        title: h,
+        onMousedown: _,
+        onClick: () => s.chain().focus().updateAttributes("image", {
+          align: v
         }).run()
-      }, [e(p, null, null)])), e("span", {
+      }, [e(A, null, null)])), !i && e("span", {
         class: "image-controls-separator"
       }, null), e("button", {
         class: "image-controls-btn",
         title: "下载",
-        onMousedown: O,
-        onClick: () => N1(m)
-      }, [e(j1, null, null)]), e("button", {
+        onMousedown: _,
+        onClick: () => b1(r)
+      }, [e(k1, null, null)]), !i && e("button", {
         class: "image-controls-btn",
         title: "重新上传",
-        onMousedown: O,
-        onClick: () => a.chain().focus().deleteRange({
-          from: u,
-          to: u + h
-        }).insertContentAt(u, {
+        onMousedown: _,
+        onClick: () => s.chain().focus().deleteRange({
+          from: f,
+          to: f + g
+        }).insertContentAt(f, {
           type: "imageUpload"
         }).run()
-      }, [e(W1, null, null)]), e("button", {
+      }, [e(x1, null, null)]), !i && e("button", {
         class: "image-controls-btn",
         title: "删除",
-        onMousedown: O,
-        onClick: () => a.chain().focus().deleteRange({
-          from: u,
-          to: u + h
+        onMousedown: _,
+        onClick: () => s.chain().focus().deleteRange({
+          from: f,
+          to: f + g
         }).run()
-      }, [e(K1, null, null)])]);
+      }, [e(H1, null, null)])]);
     };
   }
-}), G1 = /* @__PURE__ */ c({
+}), A1 = /* @__PURE__ */ c({
   name: "CodeBlockIcon",
   setup(t, {
     attrs: l
   }) {
-    return () => e("svg", b({
+    return () => e("svg", k({
       width: "24",
       height: "24",
       viewBox: "0 0 24 24",
@@ -1610,22 +1628,22 @@ const j1 = () => e("svg", {
       points: "8 6 2 12 8 18"
     }, null)]);
   }
-}), J1 = /* @__PURE__ */ c({
+}), y1 = /* @__PURE__ */ c({
   name: "CodeBlockButton",
   setup() {
-    const t = I("editor");
-    return () => e(k, {
-      icon: G1,
+    const t = B("editor");
+    return () => e(b, {
+      icon: A1,
       tooltip: "代码块",
       isActive: t?.value?.isActive("codeBlock"),
       onClick: () => t?.value?.chain().focus().toggleCodeBlock().run()
     }, null);
   }
-}), X1 = /* @__PURE__ */ c({
+}), M1 = /* @__PURE__ */ c({
   name: "BubbleMenuBar",
   setup() {
-    const t = I("editor");
-    return () => t?.value ? e(Xe, {
+    const t = B("editor"), l = B("readonly");
+    return () => t?.value ? e(Pe, {
       editor: t.value,
       class: "bubble-menu",
       options: {
@@ -1634,148 +1652,158 @@ const j1 = () => e("svg", {
           mainAxis: 8
         }
       },
-      shouldShow: (l) => {
+      shouldShow: (n) => {
+        if (l?.value) return !1;
         const {
-          editor: n,
-          from: i,
-          to: a
-        } = l;
-        return !(i === a || n.isActive("image") || n.isActive("table"));
+          editor: o,
+          from: u,
+          to: s
+        } = n;
+        return !(u === s || o.isActive("image") || o.isActive("table"));
       }
     }, {
       default: () => [e("div", {
         class: "bubble-menu-content"
-      }, [e(k, {
-        icon: re,
+      }, [e(b, {
+        icon: Q,
         tooltip: "粗体",
         isActive: t.value.isActive("bold"),
         onClick: () => t.value?.chain().focus().toggleBold().run()
-      }, null), e(k, {
-        icon: ue,
+      }, null), e(b, {
+        icon: Y,
         tooltip: "斜体",
         isActive: t.value.isActive("italic"),
         onClick: () => t.value?.chain().focus().toggleItalic().run()
-      }, null), e(k, {
-        icon: ae,
+      }, null), e(b, {
+        icon: ee,
         tooltip: "删除线",
         isActive: t.value.isActive("strike"),
         onClick: () => t.value?.chain().focus().toggleStrike().run()
-      }, null), e(k, {
-        icon: se,
+      }, null), e(b, {
+        icon: te,
         tooltip: "下划线",
         isActive: t.value.isActive("underline"),
         onClick: () => t.value?.chain().focus().toggleUnderline().run()
       }, null)])]
     }) : null;
   }
-}), Q1 = { class: "tiptap-editor" }, Y1 = { class: "tiptap-toolbar" }, mt = /* @__PURE__ */ c({
-  __name: "TiptapEditor",
+}), I1 = He(Be), W1 = /* @__PURE__ */ c({
+  name: "TiptapEditor",
   props: {
-    modelValue: { default: "" },
-    placeholder: { default: "请输入内容..." },
-    upload: {}
+    modelValue: {
+      type: String,
+      default: ""
+    },
+    placeholder: {
+      type: String,
+      default: "请输入内容..."
+    },
+    upload: {
+      type: Function,
+      default: void 0
+    },
+    readonly: {
+      type: Boolean,
+      default: !1
+    }
   },
   emits: ["update:modelValue"],
-  setup(t, { emit: l }) {
-    const n = Fe(_e), i = t, a = l, u = M(!1), h = M(""), m = M(null), f = M("inline"), C = (r = {}) => {
-      h.value = r.latex ?? "", m.value = r.pos ?? null, f.value = r.type ?? "inline", u.value = !0;
+  setup(t, {
+    emit: l
+  }) {
+    const n = H(!1), o = H(""), u = H(null), s = H("inline"), f = V(() => t.readonly ?? !1), g = (C = {}) => {
+      f.value || (o.value = C.latex ?? "", u.value = C.pos ?? null, s.value = C.type ?? "inline", n.value = !0);
     };
-    J("openMathDialog", C);
-    const o = ye({
-      content: i.modelValue,
-      extensions: [
-        He.configure({
-          codeBlock: !1,
-          link: {
-            openOnClick: !1,
-            enableClickSelection: !0
-          }
-        }),
-        Te.configure({
-          placeholder: i.placeholder
-        }),
-        Ze.configure({
-          lowlight: n,
-          defaultLanguage: "plaintext"
-        }),
-        Ve.configure({ types: ["heading", "paragraph"] }),
-        Ie,
-        Ee.configure({ nested: !0 }),
-        Qe.configure({
-          allowBase64: !0,
-          resize: {
-            enabled: !0,
-            directions: [
-              "top",
-              "right",
-              "bottom",
-              "left",
-              "top-right",
-              "top-left",
-              "bottom-right",
-              "bottom-left"
-            ],
-            minWidth: 50,
-            minHeight: 50,
-            alwaysPreserveAspectRatio: !1
-          }
-        }),
-        a1.configure({
-          ...i.upload ? { upload: i.upload } : {}
-        }),
-        Ne.configure({ resizable: !0 }),
-        ze,
-        Pe,
-        Oe,
-        je.configure({
-          inlineOptions: {
-            onClick: (r, s) => C({ latex: r.attrs.latex, pos: s, type: "inline" })
-          },
-          blockOptions: {
-            onClick: (r, s) => C({ latex: r.attrs.latex, pos: s, type: "block" })
-          }
-        })
-      ],
-      onUpdate: ({ editor: r }) => {
-        a("update:modelValue", r.getHTML());
+    z("openMathDialog", g), z("readonly", f);
+    const r = he({
+      content: t.modelValue,
+      editable: !t.readonly,
+      extensions: [pe.configure({
+        codeBlock: !1,
+        link: {
+          openOnClick: !1,
+          enableClickSelection: !0
+        }
+      }), ke.configure({
+        placeholder: t.placeholder
+      }), xe.configure({
+        lowlight: I1,
+        defaultLanguage: "plaintext"
+      }), be.configure({
+        types: ["heading", "paragraph"]
+      }), me, we.configure({
+        nested: !0
+      }), ze.configure({
+        allowBase64: !0,
+        resize: {
+          enabled: !0,
+          directions: ["top", "right", "bottom", "left", "top-right", "top-left", "bottom-right", "bottom-left"],
+          minWidth: 50,
+          minHeight: 50,
+          alwaysPreserveAspectRatio: !1
+        }
+      }), $e.configure({
+        ...t.upload ? {
+          upload: t.upload
+        } : {}
+      }), Te.configure({
+        resizable: !0
+      }), Ee, Fe, Ve, Ze.configure({
+        inlineOptions: {
+          onClick: (C, i) => g({
+            latex: C.attrs.latex,
+            pos: i,
+            type: "inline"
+          })
+        },
+        blockOptions: {
+          onClick: (C, i) => g({
+            latex: C.attrs.latex,
+            pos: i,
+            type: "block"
+          })
+        }
+      })],
+      onUpdate: ({
+        editor: C
+      }) => {
+        l("update:modelValue", C.getHTML());
       }
     });
-    return J("editor", o), N(() => i.modelValue, (r) => {
-      o.value && r !== o.value.getHTML() && o.value.commands.setContent(r, { emitUpdate: !1 });
-    }), (r, s) => (Z(), R("div", Q1, [
-      y("div", Y1, [
-        e(w(p1)),
-        s[1] || (s[1] = y("div", { class: "tiptap-separator" }, null, -1)),
-        e(w(g1)),
-        e(w(J1)),
-        s[2] || (s[2] = y("div", { class: "tiptap-separator" }, null, -1)),
-        e(w(B1)),
-        s[3] || (s[3] = y("div", { class: "tiptap-separator" }, null, -1)),
-        e(w(k1)),
-        s[4] || (s[4] = y("div", { class: "tiptap-separator" }, null, -1)),
-        e(w(A1)),
-        e(w(E1)),
-        e(w(_1))
-      ]),
-      e(w(Le), {
-        class: "tiptap-content",
-        editor: w(o)
-      }, null, 8, ["editor"]),
-      e(w(X1)),
-      e(w(Z1)),
-      e(w(q1)),
-      e(z1, {
-        visible: u.value,
-        "onUpdate:visible": s[0] || (s[0] = (x) => u.value = x),
-        latex: h.value,
-        pos: m.value,
-        type: f.value
-      }, null, 8, ["visible", "latex", "pos", "type"])
-    ]));
+    return z("editor", r), D(() => t.modelValue, (C) => {
+      r.value && C !== r.value.getHTML() && r.value.commands.setContent(C, {
+        emitUpdate: !1
+      });
+    }), D(() => t.readonly, (C) => {
+      r.value?.setEditable(!C);
+    }), () => e("div", {
+      class: "tiptap-editor"
+    }, [!t.readonly && e("div", {
+      class: "tiptap-toolbar"
+    }, [e(qe, null, null), e("div", {
+      class: "tiptap-separator"
+    }, null), e(Ye, null, null), e(y1, null, null), e("div", {
+      class: "tiptap-separator"
+    }, null), e(i1, null, null), e("div", {
+      class: "tiptap-separator"
+    }, null), e(t1, null, null), e("div", {
+      class: "tiptap-separator"
+    }, null), e(r1, null, null), e(d1, null, null), e(h1, null, null)]), e(ge, {
+      class: "tiptap-content",
+      editor: r.value
+    }, null), e(M1, null, null), e(v1, null, null), e(B1, null, null), e(g1, {
+      visible: n.value,
+      latex: o.value,
+      pos: u.value,
+      type: s.value,
+      "onUpdate:visible": (C) => {
+        n.value = C;
+      }
+    }, null)]);
   }
 });
 export {
-  k as IconButton,
-  Qe as ImageWithAlign,
-  mt as TiptapEditor
+  b as IconButton,
+  ze as ImageWithAlign,
+  W1 as TiptapEditor
 };