@gxp-dev/mod-ui 2.0.0 → 2.0.3

package/dist/components/compositions/elements/editor/HtmlEditor.vue2.js

@@ -1,8 +1,43 @@
-import { defineComponent as s, useModel as u, computed as a, openBlock as c, createBlock as m, unref as b, withCtx as h, createElementVNode as l, normalizeClass as f, mergeModels as v } from "vue";
-import g from "../../../ui/field-frame/FieldFrame.vue.js";
-const y = { class: "grid grid-cols-1 gap-3 lg:grid-cols-2" }, x = ["id", "name", "placeholder", "readonly", "disabled", "required", "rows", "value", "data-element-name"], w = ["srcdoc"], M = /* @__PURE__ */ s({
+import { defineComponent as tt, computed as I, watch as be, onBeforeUnmount as lt, onMounted as st, nextTick as nt, ref as b, openBlock as w, createBlock as M, unref as t, withCtx as s, createElementVNode as f, normalizeClass as d, createVNode as l, resolveDynamicComponent as se, createTextVNode as i, createElementBlock as Z, Fragment as ne, renderList as ce, normalizeStyle as _, toDisplayString as R, createCommentVNode as ae, withDirectives as at, vModelText as ot } from "vue";
+import { Node as rt, useEditor as it, Extension as ut, EditorContent as dt } from "@tiptap/vue-3";
+import ft from "@tiptap/starter-kit";
+import mt from "@tiptap/extension-underline";
+import vt from "@tiptap/extension-text-align";
+import { TextStyle as gt, Color as pt, BackgroundColor as bt, FontFamily as ct } from "@tiptap/extension-text-style";
+import kt from "@tiptap/extension-link";
+import xt from "@tiptap/extension-image";
+import { TableRow as wt, TableHeader as yt, TableCell as Ct, Table as ht } from "@tiptap/extension-table";
+import { Heading as $t, Heading6 as ke, Heading5 as xe, Heading4 as we, Heading3 as ye, Heading2 as Ce, Heading1 as he, AlignCenter as $e, AlignRight as He, AlignLeft as Te, X as ee, Bold as Ht, Italic as Tt, Underline as At, Strikethrough as Lt, Quote as Bt, Minus as Vt, Undo as Ut, Redo as It, Code as Mt, Type as Rt, Palette as St, Highlighter as Ft, Link2 as Et, ImageIcon as zt, ListOrdered as Ae, List as Le, Table2 as Dt, ArrowLeft as Nt, ArrowRight as Ot, Trash2 as te, ArrowUp as qt, ArrowDown as Pt, Combine as jt, Scissors as Gt } from "lucide-vue-next";
+import G from "../../../ui/dropdown-menu/DropdownMenu.vue.js";
+import "@vueuse/core";
+import "reka-ui";
+import { cn as Be } from "../../../../lib/utils.js";
+import K from "../../../ui/dropdown-menu/DropdownMenuContent.vue.js";
+import g from "../../../ui/dropdown-menu/DropdownMenuItem.vue.js";
+import S from "../../../ui/dropdown-menu/DropdownMenuLabel.vue.js";
+import H from "../../../ui/dropdown-menu/DropdownMenuSeparator.vue.js";
+import Q from "../../../ui/dropdown-menu/DropdownMenuTrigger.vue.js";
+import Ve from "../../../ui/popover/Popover.vue.js";
+import Ue from "../../../ui/popover/PopoverContent.vue.js";
+import Ie from "../../../ui/popover/PopoverTrigger.vue.js";
+import oe from "../../../ui/dialog/Dialog.vue.js";
+import re from "../../../ui/dialog/DialogContent.vue.js";
+import ie from "../../../ui/dialog/DialogFooter.vue.js";
+import ue from "../../../ui/dialog/DialogHeader.vue.js";
+import de from "../../../ui/dialog/DialogTitle.vue.js";
+import "../../../ui/button/index.js";
+import L from "../../../ui/input/Input.vue.js";
+import "../../../ui/label/index.js";
+import Kt from "../../../ui/checkbox/Checkbox.vue.js";
+import Qt from "../../../ui/field-frame/FieldFrame.vue.js";
+import m from "../../../ui/button/Button.vue.js";
+import F from "../../../ui/label/Label.vue.js";
+const Xt = ["data-element-name"], Jt = { class: "flex flex-wrap items-center gap-0.5 border-b border-border/40 px-1.5 py-1" }, Wt = { class: "flex flex-wrap items-center gap-0.5 px-1.5 py-1" }, Yt = { class: "flex items-center gap-2" }, Zt = ["value"], _t = { class: "flex items-center gap-2" }, el = ["value"], tl = { class: "px-2 pb-2" }, ll = {
+  class: "grid gap-0.5",
+  style: { "grid-template-columns": "repeat(6, 1.25rem)" }
+}, sl = ["onMouseover"], nl = { class: "grid gap-4 py-2" }, al = { class: "grid gap-1.5" }, ol = { class: "grid gap-1.5" }, rl = { class: "flex items-center gap-2" }, il = { class: "flex gap-2" }, ul = { class: "grid gap-4 py-2" }, dl = { class: "grid gap-1.5" }, fl = { class: "grid gap-1.5" }, ml = { class: "grid gap-1.5" }, Ql = /* @__PURE__ */ tt({
   __name: "HtmlEditor",
-  props: /* @__PURE__ */ v({
+  props: {
     modelValue: {},
     id: {},
     name: {},
@@ -14,59 +49,1307 @@ const y = { class: "grid grid-cols-1 gap-3 lg:grid-cols-2" }, x = ["id", "name",
     disabled: { type: Boolean },
     helpText: {},
     errors: { default: () => [] },
-    rows: { default: 12 }
-  }, {
-    modelValue: {},
-    modelModifiers: {}
-  }),
+    minHeight: { default: "14rem" }
+  },
   emits: ["update:modelValue"],
-  setup(e) {
-    const o = u(e, "modelValue"), t = a(() => o.value ?? ""), i = a(
-      () => `<!doctype html><html><body>${t.value}</body></html>`
-    );
-    function n(r) {
-      const d = r.target;
-      o.value = (d == null ? void 0 : d.value) ?? "";
-    }
-    return (r, d) => (c(), m(b(g), {
-      label: e.label,
-      required: e.required,
-      "hide-label": e.hideLabel,
-      for: e.id,
-      "help-text": e.helpText,
-      errors: e.errors,
+  setup(y, { emit: Me }) {
+    const C = y, fe = Me, Re = rt.create({
+      name: "video",
+      group: "block",
+      content: "block*",
+      addAttributes() {
+        return {
+          src: { default: null },
+          width: { default: "320" },
+          height: { default: "240" },
+          controls: {
+            default: !0,
+            parseHTML: (n) => n.hasAttribute("controls"),
+            renderHTML: (n) => n.controls ? { controls: "" } : {}
+          }
+        };
+      },
+      parseHTML() {
+        return [{ tag: "video" }];
+      },
+      renderHTML({ HTMLAttributes: n }) {
+        return ["video", n, 0];
+      }
+    }), Se = xt.extend({
+      addAttributes() {
+        return {
+          src: { default: "" },
+          alt: { default: void 0 },
+          title: { default: void 0 },
+          style: { default: void 0 }
+        };
+      }
+    }), me = [
+      { label: "Arial", value: "Arial, sans-serif" },
+      { label: "Verdana", value: "Verdana, sans-serif" },
+      { label: "Tahoma", value: "Tahoma, sans-serif" },
+      { label: "Times New Roman", value: "'Times New Roman', serif" },
+      { label: "Georgia", value: "Georgia, serif" },
+      { label: "Courier New", value: "'Courier New', monospace" }
+    ], X = I(() => !!(C.disabled || C.readonly)), r = it({
+      content: C.modelValue ?? "",
+      editable: !X.value,
+      extensions: [
+        ft,
+        mt,
+        vt.configure({ types: ["heading", "paragraph"] }),
+        gt,
+        pt,
+        bt,
+        ct.configure({ types: ["textStyle"] }),
+        kt.configure({ openOnClick: !1 }),
+        Se.configure({ inline: !1, allowBase64: !0 }),
+        ht.configure({ resizable: !0 }),
+        wt,
+        yt,
+        Ct,
+        Re,
+        // Suppress unused Extension import warning — it's used by BackgroundColor above
+        ut.create({ name: "_noop" })
+      ].filter((n) => n.name !== "_noop"),
+      editorProps: {
+        attributes: { class: "focus:outline-none" }
+      },
+      onUpdate: () => {
+        r.value && fe("update:modelValue", r.value.getHTML());
+      },
+      onSelectionUpdate: () => {
+        Fe();
+      }
+    });
+    be(
+      () => C.modelValue,
+      (n) => {
+        const e = r.value;
+        if (!e) return;
+        const u = n ?? "";
+        u !== e.getHTML() && e.commands.setContent(u, { emitUpdate: !1 });
+      }
+    ), be(X, (n) => {
+      var e;
+      (e = r.value) == null || e.setEditable(!n);
+    }), lt(() => {
+      var n;
+      (n = r.value) == null || n.destroy();
+    }), st(() => {
+      nt(() => {
+        const n = r.value;
+        n && C.modelValue && n.isEmpty && n.commands.setContent(C.modelValue, { emitUpdate: !1 });
+      });
+    });
+    const k = b(null), x = b("left"), E = b(null), h = b(""), $ = b("");
+    function Fe() {
+      var u;
+      const n = r.value;
+      if (!n) return;
+      k.value = null;
+      for (let p = 1; p <= 6; p++)
+        if (n.isActive("heading", { level: p })) {
+          k.value = p;
+          break;
+        }
+      n.isActive({ textAlign: "center" }) ? x.value = "center" : n.isActive({ textAlign: "right" }) ? x.value = "right" : x.value = "left", E.value = ((u = me.find((p) => n.isActive("textStyle", { fontFamily: p.value }))) == null ? void 0 : u.value) ?? null;
+      const e = n.getAttributes("textStyle");
+      h.value = typeof e.color == "string" ? e.color : "", $.value = typeof e.backgroundColor == "string" ? e.backgroundColor : "";
+    }
+    function v(n, e) {
+      const u = r.value;
+      return u ? u.isActive(n) : !1;
+    }
+    function B(n) {
+      var e;
+      (e = r.value) == null || e.chain().focus().setHeading({ level: n }).run(), k.value = n;
+    }
+    function Ee() {
+      var n;
+      (n = r.value) == null || n.chain().focus().setParagraph().run(), k.value = null;
+    }
+    const ze = I(() => {
+      switch (k.value) {
+        case 1:
+          return he;
+        case 2:
+          return Ce;
+        case 3:
+          return ye;
+        case 4:
+          return we;
+        case 5:
+          return xe;
+        case 6:
+          return ke;
+        default:
+          return $t;
+      }
+    }), De = I(() => x.value === "center" ? $e : x.value === "right" ? He : Te);
+    function le(n) {
+      var e;
+      (e = r.value) == null || e.chain().focus().setTextAlign(n).run(), x.value = n;
+    }
+    function Ne(n) {
+      var e;
+      (e = r.value) == null || e.chain().focus().unsetFontFamily().setFontFamily(n).run(), E.value = n;
+    }
+    function Oe() {
+      var n;
+      (n = r.value) == null || n.chain().focus().unsetFontFamily().run(), E.value = null;
+    }
+    function ve(n) {
+      var e, u, p, a;
+      (a = (p = (u = (e = r.value) == null ? void 0 : e.chain().focus()) == null ? void 0 : u.unsetColor()) == null ? void 0 : p.setColor(n)) == null || a.run(), h.value = n;
+    }
+    function qe() {
+      var n, e, u;
+      (u = (e = (n = r.value) == null ? void 0 : n.chain().focus()) == null ? void 0 : e.unsetColor()) == null || u.run(), h.value = "";
+    }
+    function ge(n) {
+      var e, u, p, a;
+      (a = (p = (u = (e = r.value) == null ? void 0 : e.chain().focus()) == null ? void 0 : u.unsetBackgroundColor()) == null ? void 0 : p.setBackgroundColor(n)) == null || a.run(), $.value = n;
+    }
+    function Pe() {
+      var n, e, u;
+      (u = (e = (n = r.value) == null ? void 0 : n.chain().focus()) == null ? void 0 : e.unsetBackgroundColor()) == null || u.run(), $.value = "";
+    }
+    function pe(n) {
+      var e, u;
+      n === "bullet" ? (e = r.value) == null || e.chain().focus().toggleBulletList().run() : (u = r.value) == null || u.chain().focus().toggleOrderedList().run();
+    }
+    const J = b(2), W = b(2), je = I(() => {
+      const n = [];
+      for (let e = 1; e <= 4; e++)
+        for (let u = 1; u <= 6; u++)
+          n.push({ r: e, c: u });
+      return n;
+    });
+    function Ge() {
+      var n;
+      (n = r.value) == null || n.chain().focus().insertTable({ rows: J.value, cols: W.value, withHeaderRow: !0 }).run();
+    }
+    const V = b(!1), T = b(""), A = b(""), z = b(!0), Y = b(!1);
+    function Ke() {
+      const n = r.value;
+      if (n) {
+        if (Y.value = n.isActive("link"), Y.value) {
+          n.chain().focus().extendMarkRange("link").run();
+          const e = n.getAttributes("link");
+          T.value = typeof e.href == "string" ? e.href : "", z.value = e.target === "_blank";
+          const { from: u, to: p } = n.state.selection;
+          A.value = n.state.doc.textBetween(u, p, " ");
+        } else {
+          const { from: e, to: u } = n.state.selection;
+          A.value = n.state.doc.textBetween(e, u, " "), T.value = "https://", z.value = !0;
+        }
+        A.value || (A.value = "Link"), V.value = !0;
+      }
+    }
+    function Qe() {
+      const n = r.value;
+      if (!n || !T.value) return;
+      n.isActive("link") && n.chain().focus().unsetLink().run();
+      const e = z.value ? "_blank" : "_self", { from: u, to: p } = n.state.selection;
+      u === p ? n.chain().focus().insertContent(`<a href="${T.value}" target="${e}">${A.value}</a>`).run() : n.chain().focus().extendMarkRange("link").setLink({ href: T.value, target: e }).run(), V.value = !1;
+    }
+    function Xe() {
+      var n;
+      (n = r.value) == null || n.chain().focus().extendMarkRange("link").unsetLink().run(), V.value = !1;
+    }
+    const D = b(!1), U = b(""), N = b(""), O = b(""), q = b(!1);
+    function Je() {
+      const n = r.value;
+      if (n) {
+        if (q.value = n.isActive("image"), q.value) {
+          const e = n.getAttributes("image");
+          U.value = typeof e.src == "string" ? e.src : "", N.value = typeof e.alt == "string" ? e.alt : "", O.value = typeof e.style == "string" ? e.style : "";
+        } else
+          U.value = "", N.value = "", O.value = "width: auto; height: auto; max-width: 100%;";
+        D.value = !0;
+      }
+    }
+    function We() {
+      const n = r.value;
+      if (!n || !U.value) return;
+      const e = {
+        src: U.value,
+        alt: N.value || void 0,
+        style: O.value || void 0
+      };
+      q.value ? n.chain().focus().updateAttributes("image", e).run() : n.chain().focus().setImage(e).run(), D.value = !1;
+    }
+    const P = b(!1), j = b("");
+    function Ye() {
+      r.value && (j.value = r.value.getHTML(), P.value = !0);
+    }
+    function Ze() {
+      r.value && (r.value.commands.setContent(j.value), fe("update:modelValue", j.value), P.value = !1);
+    }
+    const _e = I(() => C.errors.length > 0), et = I(() => ({ minHeight: C.minHeight }));
+    function c(n) {
+      return Be("h-7 w-7 p-0 shrink-0", n ? "bg-muted text-foreground" : "text-muted-foreground");
+    }
+    return (n, e) => (w(), M(t(Qt), {
+      label: y.label,
+      required: y.required,
+      "hide-label": y.hideLabel,
+      for: y.id,
+      "help-text": y.helpText,
+      errors: y.errors,
       "data-testid": "html-editor"
     }, {
-      default: h(() => [
-        l("div", y, [
-          l("textarea", {
-            id: e.id,
-            name: e.name ?? void 0,
-            placeholder: e.placeholder ?? "<!-- type HTML here -->",
-            readonly: e.readonly,
-            disabled: e.disabled,
-            required: e.required,
-            rows: e.rows,
-            value: t.value,
-            "data-element-name": e.name ?? void 0,
-            "data-testid": "html-editor-source",
-            class: f(["font-mono text-sm rounded-md border border-input bg-background px-3 py-2 shadow-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50", e.errors.length ? "border-destructive ring-destructive" : ""]),
-            onInput: n
-          }, null, 42, x),
-          l("iframe", {
-            srcdoc: i.value,
-            sandbox: "",
-            "data-testid": "html-editor-preview",
-            class: "min-h-[12rem] rounded-md border bg-background",
-            title: "HTML preview"
-          }, null, 8, w)
-        ])
-      ]),
+      default: s(() => {
+        var u, p;
+        return [
+          f("div", {
+            class: d(t(Be)(
+              "rounded-md border border-input bg-background shadow-sm overflow-hidden",
+              _e.value ? "border-destructive ring-1 ring-destructive" : "",
+              X.value ? "opacity-60" : ""
+            )),
+            "data-element-name": y.name ?? void 0
+          }, [
+            f("div", {
+              class: d(["flex flex-col border-b bg-muted/30", X.value ? "pointer-events-none" : ""]),
+              role: "toolbar",
+              "aria-label": "HTML formatting",
+              "data-testid": "html-editor-toolbar"
+            }, [
+              f("div", Jt, [
+                l(t(G), null, {
+                  default: s(() => [
+                    l(t(Q), { "as-child": "" }, {
+                      default: s(() => [
+                        l(t(m), {
+                          type: "button",
+                          variant: "ghost",
+                          class: d(c(k.value !== null)),
+                          title: "Heading"
+                        }, {
+                          default: s(() => [
+                            (w(), M(se(ze.value), { class: "h-4 w-4" }))
+                          ]),
+                          _: 1
+                        }, 8, ["class"])
+                      ]),
+                      _: 1
+                    }),
+                    l(t(K), {
+                      align: "start",
+                      class: "w-44"
+                    }, {
+                      default: s(() => [
+                        l(t(S), { class: "text-xs uppercase text-muted-foreground" }, {
+                          default: s(() => [...e[46] || (e[46] = [
+                            i("Heading", -1)
+                          ])]),
+                          _: 1
+                        }),
+                        l(t(H)),
+                        l(t(g), {
+                          class: d(k.value === 1 ? "bg-muted" : ""),
+                          onClick: e[0] || (e[0] = (a) => B(1))
+                        }, {
+                          default: s(() => [
+                            l(t(he), { class: "mr-2 h-4 w-4" }),
+                            e[47] || (e[47] = i("Heading 1 ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"]),
+                        l(t(g), {
+                          class: d(k.value === 2 ? "bg-muted" : ""),
+                          onClick: e[1] || (e[1] = (a) => B(2))
+                        }, {
+                          default: s(() => [
+                            l(t(Ce), { class: "mr-2 h-4 w-4" }),
+                            e[48] || (e[48] = i("Heading 2 ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"]),
+                        l(t(g), {
+                          class: d(k.value === 3 ? "bg-muted" : ""),
+                          onClick: e[2] || (e[2] = (a) => B(3))
+                        }, {
+                          default: s(() => [
+                            l(t(ye), { class: "mr-2 h-4 w-4" }),
+                            e[49] || (e[49] = i("Heading 3 ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"]),
+                        l(t(g), {
+                          class: d(k.value === 4 ? "bg-muted" : ""),
+                          onClick: e[3] || (e[3] = (a) => B(4))
+                        }, {
+                          default: s(() => [
+                            l(t(we), { class: "mr-2 h-4 w-4" }),
+                            e[50] || (e[50] = i("Heading 4 ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"]),
+                        l(t(g), {
+                          class: d(k.value === 5 ? "bg-muted" : ""),
+                          onClick: e[4] || (e[4] = (a) => B(5))
+                        }, {
+                          default: s(() => [
+                            l(t(xe), { class: "mr-2 h-4 w-4" }),
+                            e[51] || (e[51] = i("Heading 5 ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"]),
+                        l(t(g), {
+                          class: d(k.value === 6 ? "bg-muted" : ""),
+                          onClick: e[5] || (e[5] = (a) => B(6))
+                        }, {
+                          default: s(() => [
+                            l(t(ke), { class: "mr-2 h-4 w-4" }),
+                            e[52] || (e[52] = i("Heading 6 ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"]),
+                        l(t(H)),
+                        l(t(g), { onClick: Ee }, {
+                          default: s(() => [
+                            l(t(ee), { class: "mr-2 h-4 w-4" }),
+                            e[53] || (e[53] = i("Clear heading ", -1))
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }),
+                e[54] || (e[54] = f("div", { class: "mx-0.5 h-5 w-px bg-border/60 shrink-0" }, null, -1)),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(v("bold"))),
+                  title: "Bold",
+                  onClick: e[6] || (e[6] = (a) => {
+                    var o;
+                    return (o = t(r)) == null ? void 0 : o.chain().focus().toggleBold().run();
+                  })
+                }, {
+                  default: s(() => [
+                    l(t(Ht), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class"]),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(v("italic"))),
+                  title: "Italic",
+                  onClick: e[7] || (e[7] = (a) => {
+                    var o;
+                    return (o = t(r)) == null ? void 0 : o.chain().focus().toggleItalic().run();
+                  })
+                }, {
+                  default: s(() => [
+                    l(t(Tt), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class"]),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(v("underline"))),
+                  title: "Underline",
+                  onClick: e[8] || (e[8] = (a) => {
+                    var o;
+                    return (o = t(r)) == null ? void 0 : o.chain().focus().toggleUnderline().run();
+                  })
+                }, {
+                  default: s(() => [
+                    l(t(At), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class"]),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(v("strike"))),
+                  title: "Strikethrough",
+                  onClick: e[9] || (e[9] = (a) => {
+                    var o;
+                    return (o = t(r)) == null ? void 0 : o.chain().focus().toggleStrike().run();
+                  })
+                }, {
+                  default: s(() => [
+                    l(t(Lt), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class"]),
+                e[55] || (e[55] = f("div", { class: "mx-0.5 h-5 w-px bg-border/60 shrink-0" }, null, -1)),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(v("blockquote"))),
+                  title: "Blockquote",
+                  onClick: e[10] || (e[10] = (a) => {
+                    var o;
+                    return (o = t(r)) == null ? void 0 : o.chain().focus().toggleBlockquote().run();
+                  })
+                }, {
+                  default: s(() => [
+                    l(t(Bt), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class"]),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(!1)),
+                  title: "Horizontal rule",
+                  onClick: e[11] || (e[11] = (a) => {
+                    var o;
+                    return (o = t(r)) == null ? void 0 : o.chain().focus().setHorizontalRule().run();
+                  })
+                }, {
+                  default: s(() => [
+                    l(t(Vt), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class"]),
+                e[56] || (e[56] = f("div", { class: "flex-1" }, null, -1)),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(!1)),
+                  title: "Undo",
+                  disabled: !((u = t(r)) != null && u.can().chain().focus().undo().run()),
+                  onClick: e[12] || (e[12] = (a) => {
+                    var o;
+                    return (o = t(r)) == null ? void 0 : o.chain().focus().undo().run();
+                  })
+                }, {
+                  default: s(() => [
+                    l(t(Ut), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class", "disabled"]),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(!1)),
+                  title: "Redo",
+                  disabled: !((p = t(r)) != null && p.can().chain().focus().redo().run()),
+                  onClick: e[13] || (e[13] = (a) => {
+                    var o;
+                    return (o = t(r)) == null ? void 0 : o.chain().focus().redo().run();
+                  })
+                }, {
+                  default: s(() => [
+                    l(t(It), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class", "disabled"]),
+                e[57] || (e[57] = f("div", { class: "mx-0.5 h-5 w-px bg-border/60 shrink-0" }, null, -1)),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(!1)),
+                  title: "Edit HTML source",
+                  onClick: Ye
+                }, {
+                  default: s(() => [
+                    l(t(Mt), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class"])
+              ]),
+              f("div", Wt, [
+                l(t(G), null, {
+                  default: s(() => [
+                    l(t(Q), { "as-child": "" }, {
+                      default: s(() => [
+                        l(t(m), {
+                          type: "button",
+                          variant: "ghost",
+                          class: d(c(x.value !== "left")),
+                          title: "Text alignment"
+                        }, {
+                          default: s(() => [
+                            (w(), M(se(De.value), { class: "h-4 w-4" }))
+                          ]),
+                          _: 1
+                        }, 8, ["class"])
+                      ]),
+                      _: 1
+                    }),
+                    l(t(K), {
+                      align: "start",
+                      class: "w-36"
+                    }, {
+                      default: s(() => [
+                        l(t(g), {
+                          class: d(x.value === "left" ? "bg-muted" : ""),
+                          onClick: e[14] || (e[14] = (a) => le("left"))
+                        }, {
+                          default: s(() => [
+                            l(t(Te), { class: "mr-2 h-4 w-4" }),
+                            e[58] || (e[58] = i("Left ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"]),
+                        l(t(g), {
+                          class: d(x.value === "center" ? "bg-muted" : ""),
+                          onClick: e[15] || (e[15] = (a) => le("center"))
+                        }, {
+                          default: s(() => [
+                            l(t($e), { class: "mr-2 h-4 w-4" }),
+                            e[59] || (e[59] = i("Center ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"]),
+                        l(t(g), {
+                          class: d(x.value === "right" ? "bg-muted" : ""),
+                          onClick: e[16] || (e[16] = (a) => le("right"))
+                        }, {
+                          default: s(() => [
+                            l(t(He), { class: "mr-2 h-4 w-4" }),
+                            e[60] || (e[60] = i("Right ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"])
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }),
+                e[81] || (e[81] = f("div", { class: "mx-0.5 h-5 w-px bg-border/60 shrink-0" }, null, -1)),
+                l(t(G), null, {
+                  default: s(() => [
+                    l(t(Q), { "as-child": "" }, {
+                      default: s(() => [
+                        l(t(m), {
+                          type: "button",
+                          variant: "ghost",
+                          class: d(c(E.value !== null)),
+                          title: "Font family"
+                        }, {
+                          default: s(() => [
+                            l(t(Rt), { class: "h-4 w-4" })
+                          ]),
+                          _: 1
+                        }, 8, ["class"])
+                      ]),
+                      _: 1
+                    }),
+                    l(t(K), {
+                      align: "start",
+                      class: "w-52"
+                    }, {
+                      default: s(() => [
+                        l(t(S), { class: "text-xs uppercase text-muted-foreground" }, {
+                          default: s(() => [...e[61] || (e[61] = [
+                            i("Font family", -1)
+                          ])]),
+                          _: 1
+                        }),
+                        l(t(H)),
+                        (w(), Z(ne, null, ce(me, (a) => l(t(g), {
+                          key: a.value,
+                          class: d(E.value === a.value ? "bg-muted" : ""),
+                          style: _(`font-family: ${a.value}`),
+                          onClick: (o) => Ne(a.value)
+                        }, {
+                          default: s(() => [
+                            i(R(a.label), 1)
+                          ]),
+                          _: 2
+                        }, 1032, ["class", "style", "onClick"])), 64)),
+                        l(t(H)),
+                        l(t(g), { onClick: Oe }, {
+                          default: s(() => [
+                            l(t(ee), { class: "mr-2 h-4 w-4" }),
+                            e[62] || (e[62] = i("Use default ", -1))
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }),
+                l(t(Ve), null, {
+                  default: s(() => [
+                    l(t(Ie), { "as-child": "" }, {
+                      default: s(() => [
+                        l(t(m), {
+                          type: "button",
+                          variant: "ghost",
+                          class: d(c(!!h.value)),
+                          title: "Text color"
+                        }, {
+                          default: s(() => [
+                            l(t(St), {
+                              class: "h-4 w-4",
+                              style: _(h.value ? { color: h.value } : {})
+                            }, null, 8, ["style"])
+                          ]),
+                          _: 1
+                        }, 8, ["class"])
+                      ]),
+                      _: 1
+                    }),
+                    l(t(Ue), {
+                      class: "w-52 p-3",
+                      align: "start"
+                    }, {
+                      default: s(() => [
+                        e[64] || (e[64] = f("p", { class: "mb-2 text-xs font-medium text-muted-foreground" }, "Text color", -1)),
+                        f("div", Yt, [
+                          f("input", {
+                            type: "color",
+                            value: h.value || "#000000",
+                            class: "h-8 w-8 cursor-pointer rounded border border-input p-0.5",
+                            onInput: e[17] || (e[17] = (a) => ve(a.target.value))
+                          }, null, 40, Zt),
+                          l(t(L), {
+                            "model-value": h.value,
+                            placeholder: "#000000",
+                            class: "h-7 font-mono text-xs",
+                            maxlength: "7",
+                            onBlur: e[18] || (e[18] = (a) => ve(a.target.value))
+                          }, null, 8, ["model-value"])
+                        ]),
+                        l(t(m), {
+                          type: "button",
+                          variant: "ghost",
+                          size: "sm",
+                          class: "mt-2 w-full text-xs",
+                          onClick: qe
+                        }, {
+                          default: s(() => [
+                            l(t(ee), { class: "mr-1 h-3 w-3" }),
+                            e[63] || (e[63] = i("Clear color ", -1))
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }),
+                l(t(Ve), null, {
+                  default: s(() => [
+                    l(t(Ie), { "as-child": "" }, {
+                      default: s(() => [
+                        l(t(m), {
+                          type: "button",
+                          variant: "ghost",
+                          class: d(c(!!$.value)),
+                          title: "Highlight color"
+                        }, {
+                          default: s(() => [
+                            l(t(Ft), {
+                              class: "h-4 w-4",
+                              style: _($.value ? { color: $.value } : {})
+                            }, null, 8, ["style"])
+                          ]),
+                          _: 1
+                        }, 8, ["class"])
+                      ]),
+                      _: 1
+                    }),
+                    l(t(Ue), {
+                      class: "w-52 p-3",
+                      align: "start"
+                    }, {
+                      default: s(() => [
+                        e[66] || (e[66] = f("p", { class: "mb-2 text-xs font-medium text-muted-foreground" }, "Highlight color", -1)),
+                        f("div", _t, [
+                          f("input", {
+                            type: "color",
+                            value: $.value || "#ffff00",
+                            class: "h-8 w-8 cursor-pointer rounded border border-input p-0.5",
+                            onInput: e[19] || (e[19] = (a) => ge(a.target.value))
+                          }, null, 40, el),
+                          l(t(L), {
+                            "model-value": $.value,
+                            placeholder: "#ffff00",
+                            class: "h-7 font-mono text-xs",
+                            maxlength: "7",
+                            onBlur: e[20] || (e[20] = (a) => ge(a.target.value))
+                          }, null, 8, ["model-value"])
+                        ]),
+                        l(t(m), {
+                          type: "button",
+                          variant: "ghost",
+                          size: "sm",
+                          class: "mt-2 w-full text-xs",
+                          onClick: Pe
+                        }, {
+                          default: s(() => [
+                            l(t(ee), { class: "mr-1 h-3 w-3" }),
+                            e[65] || (e[65] = i("Clear highlight ", -1))
+                          ]),
+                          _: 1
+                        })
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }),
+                e[82] || (e[82] = f("div", { class: "mx-0.5 h-5 w-px bg-border/60 shrink-0" }, null, -1)),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(v("link"))),
+                  title: "Insert / edit link",
+                  onClick: Ke
+                }, {
+                  default: s(() => [
+                    l(t(Et), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class"]),
+                l(t(m), {
+                  type: "button",
+                  variant: "ghost",
+                  class: d(c(v("image"))),
+                  title: "Insert / edit image",
+                  onClick: Je
+                }, {
+                  default: s(() => [
+                    l(t(zt), { class: "h-4 w-4" })
+                  ]),
+                  _: 1
+                }, 8, ["class"]),
+                e[83] || (e[83] = f("div", { class: "mx-0.5 h-5 w-px bg-border/60 shrink-0" }, null, -1)),
+                l(t(G), null, {
+                  default: s(() => [
+                    l(t(Q), { "as-child": "" }, {
+                      default: s(() => [
+                        l(t(m), {
+                          type: "button",
+                          variant: "ghost",
+                          class: d(c(v("bulletList") || v("orderedList"))),
+                          title: "Lists"
+                        }, {
+                          default: s(() => [
+                            (w(), M(se(v("orderedList") ? t(Ae) : t(Le)), { class: "h-4 w-4" }))
+                          ]),
+                          _: 1
+                        }, 8, ["class"])
+                      ]),
+                      _: 1
+                    }),
+                    l(t(K), {
+                      align: "start",
+                      class: "w-40"
+                    }, {
+                      default: s(() => [
+                        l(t(g), {
+                          class: d(v("bulletList") ? "bg-muted" : ""),
+                          onClick: e[21] || (e[21] = (a) => pe("bullet"))
+                        }, {
+                          default: s(() => [
+                            l(t(Le), { class: "mr-2 h-4 w-4" }),
+                            e[67] || (e[67] = i("Bullet list ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"]),
+                        l(t(g), {
+                          class: d(v("orderedList") ? "bg-muted" : ""),
+                          onClick: e[22] || (e[22] = (a) => pe("ordered"))
+                        }, {
+                          default: s(() => [
+                            l(t(Ae), { class: "mr-2 h-4 w-4" }),
+                            e[68] || (e[68] = i("Ordered list ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["class"])
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                }),
+                e[84] || (e[84] = f("div", { class: "mx-0.5 h-5 w-px bg-border/60 shrink-0" }, null, -1)),
+                l(t(G), null, {
+                  default: s(() => [
+                    l(t(Q), { "as-child": "" }, {
+                      default: s(() => [
+                        l(t(m), {
+                          type: "button",
+                          variant: "ghost",
+                          class: d(c(v("table"))),
+                          title: "Table"
+                        }, {
+                          default: s(() => [
+                            l(t(Dt), { class: "h-4 w-4" })
+                          ]),
+                          _: 1
+                        }, 8, ["class"])
+                      ]),
+                      _: 1
+                    }),
+                    l(t(K), {
+                      align: "start",
+                      class: "w-52"
+                    }, {
+                      default: s(() => [
+                        v("table") ? ae("", !0) : (w(), Z(ne, { key: 0 }, [
+                          l(t(S), { class: "text-xs uppercase text-muted-foreground" }, {
+                            default: s(() => [
+                              i(" Insert " + R(J.value) + "×" + R(W.value) + " table ", 1)
+                            ]),
+                            _: 1
+                          }),
+                          f("div", tl, [
+                            f("div", ll, [
+                              (w(!0), Z(ne, null, ce(je.value, (a) => (w(), Z("button", {
+                                key: `${a.r}-${a.c}`,
+                                type: "button",
+                                class: d(["h-5 w-5 rounded-sm border transition-colors", a.r <= J.value && a.c <= W.value ? "bg-primary border-primary" : "bg-muted/50 border-border hover:bg-muted"]),
+                                onMouseover: (o) => {
+                                  J.value = a.r, W.value = a.c;
+                                },
+                                onClick: Ge
+                              }, null, 42, sl))), 128))
+                            ])
+                          ]),
+                          l(t(H))
+                        ], 64)),
+                        l(t(S), { class: "text-xs uppercase text-muted-foreground" }, {
+                          default: s(() => [...e[69] || (e[69] = [
+                            i("Column", -1)
+                          ])]),
+                          _: 1
+                        }),
+                        l(t(g), {
+                          disabled: !v("table"),
+                          onClick: e[23] || (e[23] = (a) => {
+                            var o;
+                            return (o = t(r)) == null ? void 0 : o.chain().focus().addColumnBefore().run();
+                          })
+                        }, {
+                          default: s(() => [
+                            l(t(Nt), { class: "mr-2 h-4 w-4" }),
+                            e[70] || (e[70] = i("Add before ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["disabled"]),
+                        l(t(g), {
+                          disabled: !v("table"),
+                          onClick: e[24] || (e[24] = (a) => {
+                            var o;
+                            return (o = t(r)) == null ? void 0 : o.chain().focus().addColumnAfter().run();
+                          })
+                        }, {
+                          default: s(() => [
+                            l(t(Ot), { class: "mr-2 h-4 w-4" }),
+                            e[71] || (e[71] = i("Add after ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["disabled"]),
+                        l(t(g), {
+                          disabled: !v("table"),
+                          onClick: e[25] || (e[25] = (a) => {
+                            var o;
+                            return (o = t(r)) == null ? void 0 : o.chain().focus().deleteColumn().run();
+                          })
+                        }, {
+                          default: s(() => [
+                            l(t(te), { class: "mr-2 h-4 w-4" }),
+                            e[72] || (e[72] = i("Delete column ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["disabled"]),
+                        l(t(H)),
+                        l(t(S), { class: "text-xs uppercase text-muted-foreground" }, {
+                          default: s(() => [...e[73] || (e[73] = [
+                            i("Row", -1)
+                          ])]),
+                          _: 1
+                        }),
+                        l(t(g), {
+                          disabled: !v("table"),
+                          onClick: e[26] || (e[26] = (a) => {
+                            var o;
+                            return (o = t(r)) == null ? void 0 : o.chain().focus().addRowBefore().run();
+                          })
+                        }, {
+                          default: s(() => [
+                            l(t(qt), { class: "mr-2 h-4 w-4" }),
+                            e[74] || (e[74] = i("Add before ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["disabled"]),
+                        l(t(g), {
+                          disabled: !v("table"),
+                          onClick: e[27] || (e[27] = (a) => {
+                            var o;
+                            return (o = t(r)) == null ? void 0 : o.chain().focus().addRowAfter().run();
+                          })
+                        }, {
+                          default: s(() => [
+                            l(t(Pt), { class: "mr-2 h-4 w-4" }),
+                            e[75] || (e[75] = i("Add after ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["disabled"]),
+                        l(t(g), {
+                          disabled: !v("table"),
+                          onClick: e[28] || (e[28] = (a) => {
+                            var o;
+                            return (o = t(r)) == null ? void 0 : o.chain().focus().deleteRow().run();
+                          })
+                        }, {
+                          default: s(() => [
+                            l(t(te), { class: "mr-2 h-4 w-4" }),
+                            e[76] || (e[76] = i("Delete row ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["disabled"]),
+                        l(t(H)),
+                        l(t(S), { class: "text-xs uppercase text-muted-foreground" }, {
+                          default: s(() => [...e[77] || (e[77] = [
+                            i("Cell", -1)
+                          ])]),
+                          _: 1
+                        }),
+                        l(t(g), {
+                          disabled: !v("table"),
+                          onClick: e[29] || (e[29] = (a) => {
+                            var o;
+                            return (o = t(r)) == null ? void 0 : o.chain().focus().mergeCells().run();
+                          })
+                        }, {
+                          default: s(() => [
+                            l(t(jt), { class: "mr-2 h-4 w-4" }),
+                            e[78] || (e[78] = i("Merge cells ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["disabled"]),
+                        l(t(g), {
+                          disabled: !v("table"),
+                          onClick: e[30] || (e[30] = (a) => {
+                            var o;
+                            return (o = t(r)) == null ? void 0 : o.chain().focus().splitCell().run();
+                          })
+                        }, {
+                          default: s(() => [
+                            l(t(Gt), { class: "mr-2 h-4 w-4" }),
+                            e[79] || (e[79] = i("Split cell ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["disabled"]),
+                        l(t(H)),
+                        l(t(g), {
+                          disabled: !v("table"),
+                          class: "text-destructive focus:text-destructive",
+                          onClick: e[31] || (e[31] = (a) => {
+                            var o;
+                            return (o = t(r)) == null ? void 0 : o.chain().focus().deleteTable().run();
+                          })
+                        }, {
+                          default: s(() => [
+                            l(t(te), { class: "mr-2 h-4 w-4" }),
+                            e[80] || (e[80] = i("Delete table ", -1))
+                          ]),
+                          _: 1
+                        }, 8, ["disabled"])
+                      ]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                })
+              ])
+            ], 2),
+            t(r) ? (w(), M(t(dt), {
+              key: 0,
+              editor: t(r),
+              style: _(et.value),
+              class: "html-editor-content prose prose-sm max-w-none px-3 py-2 dark:prose-invert [&_.ProseMirror]:min-h-full [&_.ProseMirror]:outline-none",
+              "data-testid": "html-editor-content",
+              onClick: e[32] || (e[32] = (a) => {
+                var o;
+                return (o = t(r)) == null ? void 0 : o.chain().focus().run();
+              })
+            }, null, 8, ["editor", "style"])) : ae("", !0)
+          ], 10, Xt),
+          l(t(oe), {
+            open: V.value,
+            "onUpdate:open": e[37] || (e[37] = (a) => V.value = a)
+          }, {
+            default: s(() => [
+              l(t(re), { class: "max-w-md" }, {
+                default: s(() => [
+                  l(t(ue), null, {
+                    default: s(() => [
+                      l(t(de), null, {
+                        default: s(() => [
+                          i(R(Y.value ? "Edit link" : "Insert link"), 1)
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  }),
+                  f("div", nl, [
+                    f("div", al, [
+                      l(t(F), { for: "html-editor-link-url" }, {
+                        default: s(() => [...e[85] || (e[85] = [
+                          i("URL", -1)
+                        ])]),
+                        _: 1
+                      }),
+                      l(t(L), {
+                        id: "html-editor-link-url",
+                        modelValue: T.value,
+                        "onUpdate:modelValue": e[33] || (e[33] = (a) => T.value = a),
+                        placeholder: "https://example.com"
+                      }, null, 8, ["modelValue"])
+                    ]),
+                    f("div", ol, [
+                      l(t(F), { for: "html-editor-link-text" }, {
+                        default: s(() => [...e[86] || (e[86] = [
+                          i("Link text", -1)
+                        ])]),
+                        _: 1
+                      }),
+                      l(t(L), {
+                        id: "html-editor-link-text",
+                        modelValue: A.value,
+                        "onUpdate:modelValue": e[34] || (e[34] = (a) => A.value = a),
+                        placeholder: "Link text"
+                      }, null, 8, ["modelValue"])
+                    ]),
+                    f("div", rl, [
+                      l(t(Kt), {
+                        id: "html-editor-link-target",
+                        checked: z.value,
+                        "onUpdate:checked": e[35] || (e[35] = (a) => z.value = !!a)
+                      }, null, 8, ["checked"]),
+                      l(t(F), {
+                        for: "html-editor-link-target",
+                        class: "cursor-pointer font-normal"
+                      }, {
+                        default: s(() => [...e[87] || (e[87] = [
+                          i("Open in new tab", -1)
+                        ])]),
+                        _: 1
+                      })
+                    ])
+                  ]),
+                  l(t(ie), { class: "flex-row items-center justify-between gap-2" }, {
+                    default: s(() => [
+                      Y.value ? (w(), M(t(m), {
+                        key: 0,
+                        type: "button",
+                        variant: "destructive",
+                        size: "sm",
+                        onClick: Xe
+                      }, {
+                        default: s(() => [
+                          l(t(te), { class: "mr-1.5 h-3.5 w-3.5" }),
+                          e[88] || (e[88] = i("Remove link ", -1))
+                        ]),
+                        _: 1
+                      })) : ae("", !0),
+                      f("div", il, [
+                        l(t(m), {
+                          type: "button",
+                          variant: "outline",
+                          size: "sm",
+                          onClick: e[36] || (e[36] = (a) => V.value = !1)
+                        }, {
+                          default: s(() => [...e[89] || (e[89] = [
+                            i("Cancel", -1)
+                          ])]),
+                          _: 1
+                        }),
+                        l(t(m), {
+                          type: "button",
+                          size: "sm",
+                          onClick: Qe
+                        }, {
+                          default: s(() => [...e[90] || (e[90] = [
+                            i("Apply", -1)
+                          ])]),
+                          _: 1
+                        })
+                      ])
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }, 8, ["open"]),
+          l(t(oe), {
+            open: D.value,
+            "onUpdate:open": e[42] || (e[42] = (a) => D.value = a)
+          }, {
+            default: s(() => [
+              l(t(re), { class: "max-w-md" }, {
+                default: s(() => [
+                  l(t(ue), null, {
+                    default: s(() => [
+                      l(t(de), null, {
+                        default: s(() => [
+                          i(R(q.value ? "Edit image" : "Insert image"), 1)
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  }),
+                  f("div", ul, [
+                    f("div", dl, [
+                      l(t(F), { for: "html-editor-img-url" }, {
+                        default: s(() => [...e[91] || (e[91] = [
+                          i("Image URL", -1)
+                        ])]),
+                        _: 1
+                      }),
+                      l(t(L), {
+                        id: "html-editor-img-url",
+                        modelValue: U.value,
+                        "onUpdate:modelValue": e[38] || (e[38] = (a) => U.value = a),
+                        placeholder: "https://example.com/image.jpg"
+                      }, null, 8, ["modelValue"])
+                    ]),
+                    f("div", fl, [
+                      l(t(F), { for: "html-editor-img-alt" }, {
+                        default: s(() => [...e[92] || (e[92] = [
+                          i("Alt text", -1)
+                        ])]),
+                        _: 1
+                      }),
+                      l(t(L), {
+                        id: "html-editor-img-alt",
+                        modelValue: N.value,
+                        "onUpdate:modelValue": e[39] || (e[39] = (a) => N.value = a),
+                        placeholder: "Describe the image"
+                      }, null, 8, ["modelValue"])
+                    ]),
+                    f("div", ml, [
+                      l(t(F), { for: "html-editor-img-style" }, {
+                        default: s(() => [...e[93] || (e[93] = [
+                          i(" Style ", -1),
+                          f("span", { class: "ml-1 text-xs font-normal text-muted-foreground" }, "(optional)", -1)
+                        ])]),
+                        _: 1
+                      }),
+                      l(t(L), {
+                        id: "html-editor-img-style",
+                        modelValue: O.value,
+                        "onUpdate:modelValue": e[40] || (e[40] = (a) => O.value = a),
+                        placeholder: "width: 100%; height: auto;"
+                      }, null, 8, ["modelValue"])
+                    ])
+                  ]),
+                  l(t(ie), null, {
+                    default: s(() => [
+                      l(t(m), {
+                        type: "button",
+                        variant: "outline",
+                        size: "sm",
+                        onClick: e[41] || (e[41] = (a) => D.value = !1)
+                      }, {
+                        default: s(() => [...e[94] || (e[94] = [
+                          i("Cancel", -1)
+                        ])]),
+                        _: 1
+                      }),
+                      l(t(m), {
+                        type: "button",
+                        size: "sm",
+                        onClick: We
+                      }, {
+                        default: s(() => [
+                          i(R(q.value ? "Update" : "Insert"), 1)
+                        ]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }, 8, ["open"]),
+          l(t(oe), {
+            open: P.value,
+            "onUpdate:open": e[45] || (e[45] = (a) => P.value = a)
+          }, {
+            default: s(() => [
+              l(t(re), { class: "max-w-3xl" }, {
+                default: s(() => [
+                  l(t(ue), null, {
+                    default: s(() => [
+                      l(t(de), null, {
+                        default: s(() => [...e[95] || (e[95] = [
+                          i("Edit HTML source", -1)
+                        ])]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  }),
+                  at(f("textarea", {
+                    "onUpdate:modelValue": e[43] || (e[43] = (a) => j.value = a),
+                    class: "h-96 w-full resize-y rounded-md border border-input bg-background p-3 font-mono text-xs focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                    spellcheck: "false",
+                    "data-testid": "html-editor-source"
+                  }, null, 512), [
+                    [ot, j.value]
+                  ]),
+                  l(t(ie), null, {
+                    default: s(() => [
+                      l(t(m), {
+                        type: "button",
+                        variant: "outline",
+                        size: "sm",
+                        onClick: e[44] || (e[44] = (a) => P.value = !1)
+                      }, {
+                        default: s(() => [...e[96] || (e[96] = [
+                          i("Cancel", -1)
+                        ])]),
+                        _: 1
+                      }),
+                      l(t(m), {
+                        type: "button",
+                        size: "sm",
+                        onClick: Ze
+                      }, {
+                        default: s(() => [...e[97] || (e[97] = [
+                          i("Apply changes", -1)
+                        ])]),
+                        _: 1
+                      })
+                    ]),
+                    _: 1
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            _: 1
+          }, 8, ["open"])
+        ];
+      }),
       _: 1
     }, 8, ["label", "required", "hide-label", "for", "help-text", "errors"]));
   }
 });
 export {
-  M as default
+  Ql as default
 };
 //# sourceMappingURL=HtmlEditor.vue2.js.map