@synopackageland/ui 0.17.9 → 0.17.11

package/dist/rich-text.js

@@ -0,0 +1,1075 @@
+import { defineComponent as At, computed as M, ref as q, watch as G, useId as St, reactive as zt, onMounted as Et, onBeforeUnmount as Bt, openBlock as p, createElementBlock as y, mergeProps as Tt, createElementVNode as B, unref as l, Fragment as Q, renderList as Z, withModifiers as F, normalizeClass as E, createBlock as T, resolveDynamicComponent as we, withCtx as I, createVNode as _, createCommentVNode as C, createTextVNode as Ge, toDisplayString as ee, normalizeStyle as It, shallowRef as Rt } from "vue";
+import { useEditor as Ht, EditorContent as qt } from "@tiptap/vue-3";
+import { BubbleMenu as Ft } from "@tiptap/vue-3/menus";
+import { Bold as Nt, Italic as Ut, Link as Vt, List as Dt, ListOrdered as Ot, Heading2 as jt, Heading3 as Kt, Code as Gt, TextQuote as Qt, SquareCode as Wt, Strikethrough as Jt, ImagePlus as Qe, AtSign as We, Ellipsis as Xt, Unlink as Je, X as Me, RotateCw as Yt, CaseSensitive as Zt, SendHorizontal as ea } from "@lucide/vue";
+import { richTextParts as ta, useUiText as aa, useUploadQueue as ra, DropdownMenu as ia, Input as Xe, Button as Ye, IconButton as te, MentionList as na, Spinner as Ze, UploadQueue as oa, isUnsupportedPicture as la, isPicture as sa } from "./index.js";
+import { Extension as Ce, mergeAttributes as tt, Node as ua } from "@tiptap/core";
+import da from "@tiptap/starter-kit";
+import { Placeholder as ca } from "@tiptap/extensions";
+import fa from "@tiptap/extension-mention";
+import { Plugin as pa } from "@tiptap/pm/state";
+const ma = /^(?:https?:\/\/[^\s/]|mailto:[^\s@]+@)/i;
+function va(a) {
+  return ua.create({
+    name: "fileImage",
+    group: "block",
+    atom: !0,
+    draggable: !0,
+    selectable: !0,
+    addAttributes() {
+      return {
+        id: { default: null, parseHTML: (o) => o.getAttribute("data-file-id"), renderHTML: (o) => o.id ? { "data-file-id": o.id } : {} },
+        alt: { default: "", parseHTML: (o) => o.getAttribute("alt") ?? "" },
+        upload: { default: null, rendered: !1 },
+        progress: { default: 0, rendered: !1 },
+        src: { default: null, rendered: !1 }
+      };
+    },
+    // Only an image this editor made is taken back from the clipboard; any other is handled by the paste code.
+    parseHTML: () => [{ tag: "img[data-file-id]" }],
+    renderHTML: ({ HTMLAttributes: o }) => ["img", tt(o)],
+    addNodeView() {
+      return ({ node: o }) => {
+        let i = o;
+        const u = document.createElement("div");
+        u.className = "relative my-1 flex w-fit max-w-full overflow-hidden rounded-[var(--ui-radius-md)] border border-[var(--ui-border-subtle)] bg-[var(--ui-surface-subtle)] [&.ProseMirror-selectednode]:shadow-[var(--ui-shadow-focus)]", u.setAttribute("data-ui-rich-editor-image", ""), u.contentEditable = "false";
+        const n = () => {
+          const { id: s, alt: A, upload: k, src: h } = i.attrs, m = s ? a.file(s) : void 0, v = i.attrs.progress < 0 ? "failed" : i.attrs.progress, c = h ?? m?.preview ?? m?.url ?? m?.thumb;
+          if (u.replaceChildren(), u.style.background = m?.dominant ?? "", u.dataset.state = v === "failed" ? "failed" : k ? "uploading" : m?.state ?? (c ? "ready" : "missing"), c) {
+            const f = document.createElement("img");
+            f.src = c, f.alt = A || m?.name || "", f.draggable = !1, f.className = `block max-h-80 max-w-full object-contain ${k ? "opacity-60" : ""}`, m?.width && m.height && (f.style.aspectRatio = `${m.width} / ${m.height}`), u.append(f);
+          } else {
+            const f = document.createElement("span");
+            f.className = "flex h-24 min-w-40 items-center justify-center px-3 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-secondary)]", f.textContent = a.labels.missing, u.append(f);
+          }
+          if (k) {
+            const f = document.createElement("span");
+            f.className = "absolute inset-x-0 bottom-0 h-1 bg-[var(--ui-surface-subtle)]", f.setAttribute("role", "progressbar"), f.setAttribute("aria-label", v === "failed" ? a.labels.failed : a.labels.uploading);
+            const x = document.createElement("span");
+            x.className = v === "failed" ? "block h-full w-full bg-[var(--ui-danger)]" : "block h-full bg-[var(--ui-primary)] transition-[width]", v !== "failed" && (x.style.width = `${Math.round((v ?? 0) * 100)}%`, f.setAttribute("aria-valuenow", String(Math.round((v ?? 0) * 100)))), f.append(x), u.append(f);
+          }
+        };
+        return n(), {
+          dom: u,
+          update: (s) => s.type !== i.type ? !1 : (i = s, n(), !0),
+          ignoreMutation: () => !0
+        };
+      };
+    }
+  });
+}
+const ba = Ce.create({
+  name: "listDepth",
+  priority: 1e3,
+  addKeyboardShortcuts() {
+    return {
+      Tab: ({ editor: a }) => {
+        const { $from: o } = a.state.selection;
+        let i = 0;
+        for (let u = o.depth; u > 0; u--) o.node(u).type.name === "listItem" && i++;
+        return i >= 2;
+      }
+    };
+  }
+}), ha = Ce.create({
+  name: "imeBackspaceGuard",
+  addProseMirrorPlugins() {
+    const a = this.editor;
+    return [new pa({
+      filterTransaction: (o) => !a.view.composing || o.docChanged || o.selectionSet || o.storedMarksSet || Object.keys(o.meta).length > 0
+    })];
+  }
+});
+function ga(a) {
+  return [
+    da.configure({
+      heading: a.headings ? { levels: [2, 3] } : !1,
+      horizontalRule: !1,
+      underline: !1,
+      trailingNode: !1,
+      link: {
+        openOnClick: !1,
+        autolink: !0,
+        linkOnPaste: !0,
+        defaultProtocol: "https",
+        protocols: [],
+        isAllowedUri: (o) => ma.test(o),
+        HTMLAttributes: { rel: "noopener noreferrer", target: null }
+      }
+    }),
+    ca.configure({ placeholder: a.placeholder }),
+    ba,
+    ha,
+    va(a.image),
+    fa.configure({
+      HTMLAttributes: { class: "font-semibold text-[var(--ui-primary)]" },
+      renderText: ({ node: o }) => `@${o.attrs.label ?? o.attrs.id}`,
+      renderHTML: ({ node: o, options: i }) => ["span", tt({ "data-type": "mention", "data-id": o.attrs.id }, i.HTMLAttributes), `@${o.attrs.label ?? o.attrs.id}`],
+      suggestion: { char: "@", ...a.mention }
+    }),
+    Ce.create({
+      name: "editorKeys",
+      addKeyboardShortcuts() {
+        const o = () => !this.editor.view.composing;
+        return {
+          "Mod-Enter": () => o() && (a.submit?.() ?? !1),
+          "Mod-k": () => o() && a.link(),
+          Escape: () => o() && a.escape()
+        };
+      }
+    })
+  ];
+}
+function ya(a, o = {}) {
+  const i = [], u = ta(a, { people: o.people, headings: o.headings }).flatMap((n) => at(n, o, i));
+  return { doc: { type: "doc", content: u.length ? u : [{ type: "paragraph" }] }, images: i };
+}
+function at(a, o, i) {
+  if (a.type === "code") return [{ type: "codeBlock", content: a.text ? [{ type: "text", text: a.text }] : void 0 }];
+  if (a.type === "quote") return [{ type: "blockquote", content: a.blocks.flatMap((s) => at(s, o, i)) }];
+  if (a.type === "list") return [it(a, o, i)];
+  const u = (s) => a.type === "heading" ? { type: "heading", attrs: { level: a.level }, content: s } : { type: "paragraph", content: s }, n = rt(a.parts, u, o, i);
+  return o.imagesApart && a.parts.some((s) => s.type === "image") && n.every((s) => !s.content) ? [] : n;
+}
+function rt(a, o, i, u) {
+  const n = [];
+  let s = [];
+  const A = (k = !1) => {
+    for (; s.at(-1)?.type === "hardBreak"; ) s.pop();
+    for (; s[0]?.type === "hardBreak"; ) s.shift();
+    (s.length || k) && n.push(o(s.length ? s : [])), s = [];
+  };
+  for (const k of a) {
+    if (k.type !== "image") {
+      s.push(...ka(k));
+      continue;
+    }
+    if (i.imagesApart) {
+      u.push({ id: k.id, alt: k.alt });
+      continue;
+    }
+    A(), n.push({ type: "fileImage", attrs: { id: k.id, alt: k.alt } });
+  }
+  return A(!n.length), n.map((k) => k.content?.length === 0 ? { ...k, content: void 0 } : k);
+}
+function it(a, o, i) {
+  return {
+    type: a.ordered ? "orderedList" : "bulletList",
+    attrs: a.ordered ? { start: a.start } : void 0,
+    content: a.items.map((u) => ({
+      type: "listItem",
+      content: [
+        ...rt(u.parts, (n) => ({ type: "paragraph", content: n }), o, i),
+        ...u.list ? [it(u.list, o, i)] : []
+      ]
+    }))
+  };
+}
+function ka(a) {
+  if (a.type === "mention") return [{ type: "mention", attrs: { id: a.id, label: a.label } }];
+  if (a.type === "code") return [{ type: "text", text: a.text, marks: [{ type: "code" }] }];
+  const o = [];
+  a.strong && o.push({ type: "bold" }), a.em && o.push({ type: "italic" }), a.strike && o.push({ type: "strike" }), a.type === "link" && o.push({ type: "link", attrs: { href: a.href } });
+  const i = [];
+  return a.text.split(`
+`).forEach((u, n) => {
+    n && i.push({ type: "hardBreak" }), u && i.push(o.length ? { type: "text", text: u, marks: o } : { type: "text", text: u });
+  }), i;
+}
+function xa(a, o = {}) {
+  const i = o.blockSeparator ?? `
+
+`;
+  return nt(a.content ?? [], "", i).replace(/\s+$/, "");
+}
+function nt(a, o, i) {
+  const u = [];
+  for (const n of a) {
+    const s = wa(n, o);
+    s !== null && u.push(s);
+  }
+  return u.join(i);
+}
+function wa(a, o, i) {
+  switch (a.type) {
+    case "paragraph":
+      return _e(a.content ?? [], o);
+    case "heading":
+      return `${"#".repeat(a.attrs?.level === 3 ? 3 : 2)} ${_e(a.content ?? [], o)}`;
+    case "bulletList":
+    case "orderedList":
+      return st(a, 0);
+    case "blockquote":
+      return nt(a.content ?? [], "", `
+
+`).split(`
+`).map((u) => u ? `> ${u}` : ">").join(`
+`);
+    case "codeBlock": {
+      const u = (a.content ?? []).map((s) => s.text ?? "").join(""), n = "`".repeat(Math.max(2, ...Array.from(u.matchAll(/`+/g), (s) => s[0].length)) + 1);
+      return `${n}
+${u}
+${n}`;
+    }
+    case "fileImage":
+      return a.attrs?.id ? lt(a) : null;
+    default:
+      return null;
+  }
+}
+const ot = (a) => a.replace(/\n/g, " ").replace(/[\\[\]]/g, "\\$&"), lt = (a) => `![${ot(String(a.attrs?.alt ?? ""))}](file:${a.attrs.id})`, Ma = (a) => a.replace(/[\\*`[\]]/g, "\\$&").replace(/~(?=~)/g, "\\~").replace(/&(?=(?:lt|gt|amp|nbsp);)/g, "\\&"), _a = /^([ \t]*)(?:(#|>|-(?=[ \t]))|(\d{1,9})(?=[.)][ \t]))/gm, Ca = (a) => a.replace(_a, (o, i, u, n) => u ? `${i}\\${u}` : `${i}${n}\\`);
+function st(a, o) {
+  const i = a.type === "orderedList", u = Number(a.attrs?.start ?? 1) || 1, n = "  ".repeat(Math.min(o, 1)), s = [];
+  return (a.content ?? []).forEach((A, k) => {
+    const h = i ? `${u + k}. ` : "- ", m = n + " ".repeat(h.length);
+    let v = !0;
+    for (const c of A.content ?? []) {
+      if (c.type === "bulletList" || c.type === "orderedList") {
+        s.push(st(c, o + 1));
+        continue;
+      }
+      const f = c.type === "fileImage" ? c.attrs?.id ? lt(c) : "" : c.type === "paragraph" || c.type === "heading" ? _e(c.content ?? [], m) : "";
+      !f && !v || (s.push(v ? `${n}${h}${f}` : `${m}${f}`), v = !1);
+    }
+    v && s.push(`${n}${h}`.trimEnd());
+  }), s.join(`
+`);
+}
+const et = [["bold", "**"], ["italic", "*"], ["strike", "~~"]], $a = /^(?:https?:\/\/[^\s/]|mailto:[^\s@]+@)/i;
+function _e(a, o) {
+  const i = [];
+  for (let h = 0; h < a.length; h++) {
+    const m = a[h];
+    if (m.type === "hardBreak") {
+      i.push({ lineBreak: !0 });
+      continue;
+    }
+    if (m.type === "mention") {
+      i.push({ marks: /* @__PURE__ */ new Set(), raw: `@[${m.attrs?.id}]` });
+      continue;
+    }
+    if (m.type !== "text" || !m.text) continue;
+    const v = new Set((m.marks ?? []).map((f) => f.type)), c = m.marks?.find((f) => f.type === "link")?.attrs?.href;
+    if (c && $a.test(c)) {
+      let f = m.text;
+      const x = new Set(v);
+      for (; a[h + 1]?.type === "text" && a[h + 1].marks?.some((z) => z.type === "link" && z.attrs?.href === c); ) {
+        const z = a[++h];
+        f += z.text;
+        const N = new Set((z.marks ?? []).map(($) => $.type));
+        for (const $ of x) N.has($) || x.delete($);
+      }
+      x.delete("link"), x.delete("code"), i.push({ marks: x, raw: `[${ot(f.trim()) || c}](${c})` });
+      continue;
+    }
+    if (v.has("code")) {
+      v.delete("code"), i.push({ marks: v, raw: `\`${m.text.replace(/`/g, "ˋ")}\`` });
+      continue;
+    }
+    i.push({ marks: v, raw: Ma(m.text) });
+  }
+  let u = "", n = [], s = "";
+  const A = (h) => {
+    const m = n.findIndex((v) => !h.has(v));
+    if (!(m < 0)) {
+      for (const v of n.slice(m).reverse()) u += et.find(([c]) => c === v)[1];
+      n = n.slice(0, m);
+    }
+  }, k = (h, m) => {
+    let v = 0;
+    for (let c = h; c < i.length; c++) {
+      const f = i[c];
+      if ("lineBreak" in f || !f.marks.has(m)) break;
+      v++;
+    }
+    return v;
+  };
+  return i.forEach((h, m) => {
+    if ("lineBreak" in h) {
+      A(/* @__PURE__ */ new Set()), u += s + `
+` + o, s = "";
+      return;
+    }
+    const v = /^\s*/.exec(h.raw)[0], c = h.raw.slice(v.length).trimEnd();
+    if (!c) {
+      s += h.raw;
+      return;
+    }
+    A(h.marks), u += s + v, s = h.raw.slice(v.length + c.length);
+    const f = et.filter(([x]) => h.marks.has(x) && !n.includes(x)).sort((x, z) => k(m, z[0]) - k(m, x[0]));
+    for (const [x, z] of f)
+      u += z, n.push(x);
+    u += c;
+  }), A(/* @__PURE__ */ new Set()), Ca(u + s).replace(/\s+$/, "");
+}
+const Pa = ["data-variant", "data-over"], La = ["aria-label"], Aa = ["aria-label", "title", "aria-pressed", "disabled", "data-ui-rich-tool", "onClick"], Sa = ["aria-label", "title", "disabled"], za = {
+  key: 1,
+  class: "flex items-center gap-1.5 border-b border-[var(--ui-border-subtle)] px-2 py-1.5",
+  "data-ui-rich-link-row": ""
+}, Ea = ["aria-label"], Ba = ["aria-label", "title", "aria-pressed", "onClick"], Ta = ["aria-label"], Ia = ["data-ui-rich-attachment"], Ra = ["src", "alt"], Ha = {
+  key: 0,
+  class: "absolute inset-0 flex items-center justify-center bg-[color-mix(in_srgb,var(--ui-danger)_35%,transparent)]"
+}, qa = {
+  key: 1,
+  class: "absolute inset-0 flex items-center justify-center"
+}, Fa = ["aria-label", "onClick"], Na = {
+  key: 4,
+  class: "flex items-center gap-1.5 border-t border-[var(--ui-border-subtle)] px-2 py-1.5",
+  "data-ui-rich-link-row": ""
+}, Ua = ["aria-label"], Va = ["aria-label", "title", "aria-pressed", "disabled", "data-ui-rich-tool", "onClick"], Da = {
+  key: 6,
+  class: "flex min-w-0 items-center gap-0.5 px-1 pb-1",
+  "data-ui-rich-actions": ""
+}, Oa = ["aria-label", "title", "disabled"], ja = ["aria-label", "title", "disabled"], Ka = ["aria-label", "title", "aria-pressed", "aria-expanded", "disabled"], Ga = ["aria-label", "title", "disabled"], Qa = {
+  key: 7,
+  class: "flex flex-col gap-2 border-t border-[var(--ui-border-subtle)] px-3 py-2"
+}, Wa = {
+  "aria-live": "polite",
+  class: "empty:hidden",
+  "data-ui-rich-notes": ""
+}, oe = Rt(null), lr = /* @__PURE__ */ At({
+  inheritAttrs: !1,
+  __name: "RichTextEditor",
+  props: {
+    modelValue: { default: "" },
+    variant: { default: "full" },
+    headings: { type: Boolean, default: void 0 },
+    placeholder: { default: "" },
+    disabled: { type: Boolean, default: !1 },
+    invalid: { type: Boolean, default: !1 },
+    id: { default: void 0 },
+    ariaLabel: { default: void 0 },
+    maxlength: { default: void 0 },
+    maxImages: { default: void 0 },
+    upload: { type: Function, default: void 0 },
+    files: { type: Function, default: void 0 },
+    candidates: { default: () => [] },
+    filter: { type: Boolean, default: !0 },
+    loading: { type: Boolean, default: !1 },
+    sending: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue", "submit", "search", "pending"],
+  setup(a, { emit: o }) {
+    const i = a, u = o, n = aa(), s = M(() => i.variant === "compact"), A = M(() => i.headings ?? !s.value), k = M(() => i.maxImages ?? (s.value ? 20 : 50)), h = typeof window < "u" && window.matchMedia?.("(pointer: coarse)").matches, v = typeof navigator < "u" && /Mac|iPhone|iPad/.test(navigator.platform) ? "⌘" : "Ctrl+", c = q([]), f = /* @__PURE__ */ new Set(), x = q([]);
+    let z;
+    function N(...e) {
+      clearTimeout(z), x.value = e, e.length && (z = setTimeout(() => {
+        x.value = [];
+      }, 8e3));
+    }
+    const $ = ra((e, t) => i.upload(e, t), {
+      onDone: (e) => ut(e),
+      onFailed: (e) => ue(e.key, -1)
+    }), U = M(() => $.tasks.filter((e) => e.status !== "done" && e.status !== "canceled")), le = M(() => U.value.length);
+    G(() => $.tasks.map((e) => e.status === "uploading" && e.size ? e.loaded / e.size : -2), (e) => {
+      e.forEach((t, r) => {
+        t >= 0 && ue($.tasks[r].key, t);
+      });
+    }), G(le, (e) => u("pending", e));
+    function ut(e) {
+      const t = c.value.find((r) => r.task === e.key);
+      t && (t.id = e.result, t.task = void 0), de(e.key, (r, d) => g.value?.view.dispatch(g.value.state.tr.setNodeMarkup(r, void 0, { ...d, id: e.result, upload: null, progress: 1 }))), $.remove(e.key), Y();
+    }
+    const se = /* @__PURE__ */ new Map();
+    function ue(e, t) {
+      const r = t < 0 ? -1 : Math.floor(t * 20) / 20;
+      se.get(e) !== r && (se.set(e, r), de(e, (d, w) => g.value?.view.dispatch(g.value.state.tr.setNodeMarkup(d, void 0, { ...w, progress: r }).setMeta("addToHistory", !1))));
+    }
+    function de(e, t) {
+      g.value?.state.doc.descendants((r, d) => {
+        if (!(r.type.name !== "fileImage" || r.attrs.upload !== e))
+          return t(d, r.attrs), !1;
+      });
+    }
+    function dt() {
+      if (s.value) return c.value.length;
+      let e = 0;
+      return g.value?.state.doc.descendants((t) => {
+        t.type.name === "fileImage" && e++;
+      }), e;
+    }
+    const ct = (e) => e.split(".").pop()?.toUpperCase() ?? "";
+    function ae(e, t) {
+      if (!i.upload || i.disabled || !e.length) return;
+      const r = [], d = [];
+      let w = k.value - dt();
+      for (const L of e)
+        la(L) ? r.push(n("{name}: {kind} images are not supported; on an iPhone, set Settings > Camera > Formats to Most Compatible", { name: L.name, kind: ct(L.name) || "HEIC" })) : sa(L) ? w <= 0 ? r.push(n("You can add up to {count} images", { count: k.value })) : (d.push(L), w--) : r.push(n("{name} is not a JPEG, PNG, WebP or GIF image", { name: L.name }));
+      if (N(...new Set(r)), !d.length) return;
+      const Ve = $.add(d).map((L, je) => {
+        const Ke = URL.createObjectURL(d[je]);
+        return f.add(Ke), { key: L.key, name: d[je].name, src: Ke };
+      });
+      if (s.value) {
+        c.value.push(...Ve.map((L) => ({ key: L.key, task: L.key, name: L.name, alt: "", src: L.src }))), Y();
+        return;
+      }
+      const De = Ve.map((L) => ({ type: "fileImage", attrs: { upload: L.key, src: L.src, alt: "", progress: 0 } })), Oe = g.value?.chain().focus();
+      t === void 0 ? Oe?.insertContent(De).run() : Oe?.insertContentAt(t, De).run();
+    }
+    function ft(e) {
+      e.task && $.remove(e.task), c.value = c.value.filter((t) => t.key !== e.key), Y();
+    }
+    function ce(e) {
+      se.delete(e), ue(e, 0), $.retry(e);
+    }
+    function $e(e) {
+      $.remove(e), c.value = c.value.filter((t) => t.task !== e), de(e, (t, r) => {
+        g.value?.view.dispatch(g.value.state.tr.delete(t, t + 1));
+      }), Y();
+    }
+    const Pe = q();
+    function Le() {
+      Pe.value?.click();
+    }
+    function pt(e) {
+      const t = e.target;
+      ae(Array.from(t.files ?? [])), t.value = "";
+    }
+    const fe = [];
+    function mt(e) {
+      const t = new DOMParser().parseFromString(e, "text/html");
+      let r = !1;
+      for (const d of Array.from(t.querySelectorAll("img"))) {
+        if (d.hasAttribute("data-file-id")) continue;
+        const w = d.getAttribute("src") ?? "";
+        /^data:image\//i.test(w) || w && new URL(w, location.href).origin === location.origin && !/^data:/i.test(w) ? fe.push(w) : r = !0, d.remove();
+      }
+      return r && N(n("Images from other websites are not pasted; save them first and add them as files")), fe.length && setTimeout(vt), t.body.innerHTML;
+    }
+    async function vt() {
+      const e = fe.splice(0), t = [];
+      for (const [r, d] of e.entries())
+        try {
+          const w = await (await fetch(d)).blob();
+          t.push(new File([w], `pasted-${r + 1}.${w.type.split("/")[1] ?? "png"}`, { type: w.type }));
+        } catch {
+        }
+      ae(t);
+    }
+    const pe = St(), b = zt({
+      open: !1,
+      query: "",
+      active: 0,
+      reference: null,
+      command: null
+    }), W = M(() => {
+      const e = b.query.toLocaleLowerCase();
+      return i.filter && e ? i.candidates.filter((t) => [t.label, t.id, t.description ?? ""].some((r) => r.toLocaleLowerCase().includes(e))) : i.candidates;
+    });
+    G(() => W.value.length, (e) => {
+      b.active >= e && (b.active = 0);
+    });
+    function Ae(e) {
+      const t = e.clientRect;
+      b.reference = t ? { getBoundingClientRect: () => t() ?? new DOMRect() } : null, b.command = (r) => e.command(r), !(e.editor.view.composing && b.open) && ((b.query !== e.query || !b.open) && (b.query = e.query, b.active = 0, u("search", e.query)), b.open = !0);
+    }
+    function Se(e) {
+      b.command?.({ id: e.id, label: e.label }), b.open = !1;
+    }
+    function bt({ event: e }) {
+      if (e.isComposing || e.keyCode === 229) return !1;
+      const t = W.value.length;
+      if (e.key === "ArrowDown" && t) b.active = (b.active + 1) % t;
+      else if (e.key === "ArrowUp" && t) b.active = (b.active - 1 + t) % t;
+      else if ((e.key === "Enter" || e.key === "Tab") && t) Se(W.value[b.active]);
+      else if (e.key === "Escape") b.open = !1;
+      else return !1;
+      return !0;
+    }
+    const ht = (e) => `${pe}-${e}`, S = () => g.value.chain().focus(), P = (e, t) => g.value?.isActive(e, t) ?? !1, gt = [
+      { key: "bold", label: "Bold", icon: Nt, shortcut: `${v}B`, active: () => P("bold"), run: () => S().toggleBold().run() },
+      { key: "italic", label: "Italic", icon: Ut, shortcut: `${v}I`, active: () => P("italic"), run: () => S().toggleItalic().run() },
+      { key: "link", label: "Link", icon: Vt, shortcut: `${v}K`, active: () => P("link"), run: () => He() },
+      { key: "bulletList", label: "Bulleted list", icon: Dt, active: () => P("bulletList"), run: () => S().toggleBulletList().run() },
+      { key: "orderedList", label: "Numbered list", icon: Ot, active: () => P("orderedList"), run: () => S().toggleOrderedList().run() },
+      { key: "h2", label: "Heading", icon: jt, active: () => P("heading", { level: 2 }), run: () => S().toggleHeading({ level: 2 }).run(), full: !0 },
+      { key: "h3", label: "Subheading", icon: Kt, active: () => P("heading", { level: 3 }), run: () => S().toggleHeading({ level: 3 }).run(), full: !0 },
+      { key: "code", label: "Code", icon: Gt, active: () => P("code"), run: () => S().toggleCode().run() },
+      { key: "quote", label: "Quote", icon: Qt, active: () => P("blockquote"), run: () => S().toggleBlockquote().run() },
+      { key: "codeBlock", label: "Code block", icon: Wt, active: () => P("codeBlock"), run: () => S().toggleCodeBlock().run() },
+      { key: "strike", label: "Strikethrough", icon: Jt, active: () => P("strike"), run: () => S().toggleStrike().run() }
+    ], re = M(() => gt.filter((e) => !e.full || A.value)), yt = ["bold", "italic", "link", "code", "bulletList"], kt = M(() => re.value.filter((e) => yt.includes(e.key))), V = (e) => e.shortcut ? `${n(e.label)} (${e.shortcut})` : n(e.label), me = /* @__PURE__ */ Symbol("rich-text-editor"), J = M(() => oe.value === me);
+    function ze() {
+      oe.value = J.value ? null : me, g.value?.commands.focus();
+    }
+    const ve = q(), be = q(1 / 0);
+    let he;
+    const ge = 34, ie = M(() => [
+      ...re.value.map((e) => ({ key: e.key, label: e.label, icon: e.icon, action: e })),
+      ...i.upload ? [{ key: "image", label: "Add image", icon: Qe, action: void 0 }] : [],
+      { key: "mention", label: "Mention someone", icon: We, action: void 0 }
+    ]), Ee = M(() => ie.value.length * ge <= be.value ? ie.value.length : Math.max(1, Math.floor((be.value - ge) / ge))), xt = M(() => ie.value.slice(0, Ee.value)), Be = M(() => ie.value.slice(Ee.value).map((e) => ({ key: e.key, label: n(e.label), icon: e.icon })));
+    function Te(e) {
+      if (e === "image") return Le();
+      if (e === "mention") return Ie();
+      re.value.find((t) => t.key === e)?.run();
+    }
+    function Ie() {
+      const e = g.value;
+      if (!e) return;
+      const { $from: t } = e.state.selection, r = t.parent.textBetween(Math.max(0, t.parentOffset - 1), t.parentOffset, `
+`, " ");
+      S().insertContent(r && !/\s/.test(r) ? " @" : "@").run();
+    }
+    const Re = /^(?:https?:\/\/[^\s/]|mailto:[^\s@]+@)/i, D = q(!1), O = q(""), ne = q();
+    function He() {
+      return O.value = g.value?.getAttributes("link").href ?? "", D.value = !0, setTimeout(() => (ne.value?.$el?.querySelector("input") ?? ne.value?.$el)?.focus?.()), !0;
+    }
+    function wt(e) {
+      const t = e.trim();
+      return !t || Re.test(t) ? t : /^[^\s@/]+@[^\s@]+\.[^\s@]+$/.test(t) ? `mailto:${t}` : /^[^\s]+\.[^\s]+$/.test(t) ? `https://${t}` : t;
+    }
+    function ye() {
+      const e = wt(O.value);
+      if (!e) return ke();
+      if (!Re.test(e)) return N(n("Links start with http://, https:// or mailto:"));
+      g.value.state.selection.empty && !P("link") ? S().insertContent({ type: "text", text: e, marks: [{ type: "link", attrs: { href: e } }] }).run() : S().extendMarkRange("link").setLink({ href: e }).run(), j();
+    }
+    function ke() {
+      S().extendMarkRange("link").unsetLink().run(), j();
+    }
+    function j() {
+      D.value = !1, g.value?.commands.focus();
+    }
+    function qe(e) {
+      e.isComposing || e.keyCode === 229 || (e.key === "Enter" ? (e.preventDefault(), ye()) : e.key === "Escape" && (e.preventDefault(), e.stopPropagation(), j()));
+    }
+    let X = i.modelValue;
+    function Mt() {
+      const e = g.value?.getJSON() ?? {}, t = xa(e, s.value ? { blockSeparator: `
+` } : {});
+      if (!s.value) return t;
+      const r = c.value.filter((d) => d.id).map((d) => `![${d.alt.replace(/[[\]\n]/g, " ")}](file:${d.id})`);
+      return [t, r.join(`
+`)].filter(Boolean).join(`
+
+`);
+    }
+    function Y() {
+      const e = Mt();
+      e !== X && (X = e, u("update:modelValue", e));
+    }
+    function Fe(e) {
+      const { doc: t, images: r } = ya(e, { people: i.candidates, headings: A.value, imagesApart: s.value });
+      for (const d of c.value) d.task && $.remove(d.task);
+      return c.value = r.map((d) => ({ key: d.id, id: d.id, name: i.files?.(d.id)?.name ?? d.alt, alt: d.alt })), t;
+    }
+    const g = Ht({
+      content: Fe(i.modelValue),
+      editable: !i.disabled,
+      extensions: ga({
+        headings: A.value,
+        placeholder: i.placeholder,
+        image: { file: (e) => i.files?.(e), labels: { uploading: n("Uploading"), failed: n("Upload failed"), missing: n("File is missing") } },
+        mention: {
+          items: () => [],
+          allowSpaces: !1,
+          render: () => ({ onStart: Ae, onUpdate: Ae, onExit: () => {
+            b.open = !1;
+          }, onKeyDown: bt })
+        },
+        submit: () => s.value ? (Ue(), !0) : !1,
+        link: He,
+        escape: () => {
+          if (D.value) j();
+          else if (J.value) ze();
+          else return !1;
+          return !0;
+        }
+      }),
+      editorProps: {
+        attributes: {
+          class: "outline-none",
+          role: "textbox",
+          "aria-multiline": "true",
+          "data-ui-rich-editor-content": ""
+        },
+        transformPastedHTML: mt,
+        handlePaste: (e, t) => {
+          const r = Array.from(t.clipboardData?.files ?? []);
+          if (!r.length || !i.upload) return !1;
+          const d = t.clipboardData?.getData("text/html") ?? "";
+          return d && new DOMParser().parseFromString(d, "text/html").body.textContent?.trim() ? !1 : (t.preventDefault(), ae(r), !0);
+        },
+        handleDrop: (e, t, r, d) => {
+          const w = Array.from(t.dataTransfer?.files ?? []);
+          return d || !w.length || !i.upload ? !1 : (t.preventDefault(), ae(w, e.posAtCoords({ left: t.clientX, top: t.clientY })?.pos), !0);
+        }
+      },
+      onUpdate: () => Y()
+    });
+    G(() => i.modelValue, (e) => {
+      e === X || !g.value || (X = e, g.value.commands.setContent(Fe(e), { emitUpdate: !1 }));
+    }), G(() => i.disabled, (e) => g.value?.setEditable(!e));
+    const _t = M(() => i.maxlength === void 0 ? 0 : Array.from(i.modelValue).length), K = M(() => (i.maxlength ?? 0) - _t.value), R = M(() => i.maxlength !== void 0 && K.value < 0), xe = M(() => i.maxlength !== void 0 && K.value <= i.maxlength * 0.1), Ct = M(() => !i.modelValue.trim()), Ne = M(() => !i.disabled && !i.sending && !Ct.value && !R.value && !le.value), $t = M(() => ({
+      id: i.id,
+      "aria-label": i.ariaLabel ?? (i.placeholder || void 0),
+      "aria-invalid": i.invalid || R.value ? "true" : void 0,
+      "aria-disabled": i.disabled ? "true" : void 0,
+      "aria-autocomplete": "list",
+      "aria-controls": b.open ? pe : void 0,
+      "aria-activedescendant": b.open && W.value.length ? ht(b.active) : void 0
+    }));
+    G([g, $t], ([e, t]) => {
+      const r = e?.view.dom;
+      if (r)
+        for (const [d, w] of Object.entries(t))
+          w === void 0 ? r.removeAttribute(d) : r.setAttribute(d, String(w));
+    }, { immediate: !0 });
+    function Ue() {
+      if (!Ne.value) {
+        le.value && N(n("Wait for the images to finish uploading"));
+        return;
+      }
+      u("submit", X);
+    }
+    const Pt = ({ from: e, to: t }) => !h && e !== t && !D.value && !!g.value?.isEditable && !P("codeBlock") && !P("fileImage");
+    Et(() => {
+      typeof ResizeObserver > "u" || !ve.value || (he = new ResizeObserver(([e]) => {
+        be.value = e.contentRect.width;
+      }), he.observe(ve.value));
+    }), Bt(() => {
+      he?.disconnect(), $.cancelAll(), clearTimeout(z), oe.value === me && (oe.value = null);
+      for (const e of f) URL.revokeObjectURL(e);
+    });
+    const H = "relative flex size-8 shrink-0 items-center justify-center rounded-[var(--ui-radius-sm)] border-0 bg-transparent p-0 text-[var(--ui-text-secondary)] outline-none hover:bg-[var(--ui-surface-hover)] hover:text-[var(--ui-text)] focus-visible:shadow-[var(--ui-shadow-focus)] disabled:pointer-events-none disabled:text-[var(--ui-text-disabled)] aria-pressed:bg-[var(--ui-primary-soft)] aria-pressed:text-[var(--ui-primary)] [@media(pointer:coarse)]:size-11", Lt = [
+      "min-w-0 text-[length:var(--ui-font-size)] leading-5 text-[var(--ui-text)] [overflow-wrap:anywhere]",
+      "[&_.ProseMirror]:outline-none [&_.ProseMirror]:whitespace-pre-wrap [&_.ProseMirror_p]:m-0 [&_.ProseMirror>*+*]:mt-2",
+      "[&_.ProseMirror_h2]:m-0 [&_.ProseMirror_h2]:text-[1.25em] [&_.ProseMirror_h2]:font-semibold [&_.ProseMirror_h3]:m-0 [&_.ProseMirror_h3]:text-[1.1em] [&_.ProseMirror_h3]:font-semibold",
+      "[&_.ProseMirror_ul]:m-0 [&_.ProseMirror_ul]:list-disc [&_.ProseMirror_ul]:ps-5 [&_.ProseMirror_ol]:m-0 [&_.ProseMirror_ol]:list-decimal [&_.ProseMirror_ol]:ps-5",
+      "[&_.ProseMirror_blockquote]:m-0 [&_.ProseMirror_blockquote]:border-s-[3px] [&_.ProseMirror_blockquote]:border-[var(--ui-border-strong)] [&_.ProseMirror_blockquote]:ps-3 [&_.ProseMirror_blockquote]:text-[var(--ui-text-secondary)]",
+      "[&_.ProseMirror_pre]:m-0 [&_.ProseMirror_pre]:rounded-[var(--ui-radius-md)] [&_.ProseMirror_pre]:bg-[var(--ui-surface-subtle)] [&_.ProseMirror_pre]:px-3 [&_.ProseMirror_pre]:py-2 [&_.ProseMirror_pre]:font-[family-name:var(--ui-font-mono)] [&_.ProseMirror_pre]:text-[0.92em]",
+      "[&_.ProseMirror_:not(pre)>code]:rounded-[var(--ui-radius-sm)] [&_.ProseMirror_:not(pre)>code]:bg-[var(--ui-surface-subtle)] [&_.ProseMirror_:not(pre)>code]:px-1 [&_.ProseMirror_:not(pre)>code]:font-[family-name:var(--ui-font-mono)] [&_.ProseMirror_:not(pre)>code]:text-[0.92em]",
+      "[&_.ProseMirror_a]:text-[var(--ui-primary)] [&_.ProseMirror_a]:underline [&_.ProseMirror_a]:underline-offset-2",
+      "[&_.is-editor-empty:first-child]:before:pointer-events-none [&_.is-editor-empty:first-child]:before:float-start [&_.is-editor-empty:first-child]:before:h-0 [&_.is-editor-empty:first-child]:before:text-[var(--ui-text-muted)] [&_.is-editor-empty:first-child]:before:content-[attr(data-placeholder)]"
+    ];
+    return (e, t) => (p(), y("div", Tt(e.$attrs, {
+      class: [
+        "flex min-w-0 flex-col rounded-[var(--ui-radius-control)] border bg-[var(--ui-surface)] transition-[border-color,box-shadow] duration-[var(--ui-motion-fast)] focus-within:shadow-[var(--ui-shadow-focus)]",
+        a.invalid || R.value ? "border-[var(--ui-danger)]" : "border-[var(--ui-border)] focus-within:border-[var(--ui-primary)]",
+        a.disabled && "bg-[var(--ui-surface-subtle)] text-[var(--ui-text-disabled)]"
+      ],
+      "data-variant": a.variant,
+      "data-over": R.value ? "" : void 0,
+      "data-ui-rich-editor": "",
+      "data-syno-pkg-land-ui": ""
+    }), [
+      B("input", {
+        ref_key: "picker",
+        ref: Pe,
+        type: "file",
+        class: "sr-only",
+        tabindex: "-1",
+        "aria-hidden": "true",
+        accept: "image/jpeg,image/png,image/webp,image/gif",
+        multiple: "",
+        onChange: pt
+      }, null, 544),
+      s.value ? C("", !0) : (p(), y("div", {
+        key: 0,
+        ref_key: "toolbar",
+        ref: ve,
+        role: "toolbar",
+        "aria-label": l(n)("Formatting"),
+        class: "sticky top-0 z-[1] flex min-w-0 items-center gap-0.5 overflow-hidden rounded-t-[var(--ui-radius-control)] border-b border-[var(--ui-border-subtle)] bg-[var(--ui-surface)] px-1 py-1",
+        "data-ui-rich-toolbar": ""
+      }, [
+        (p(!0), y(Q, null, Z(xt.value, (r) => (p(), y("button", {
+          key: r.key,
+          type: "button",
+          class: E(H),
+          "aria-label": r.action ? V(r.action) : l(n)(r.label),
+          title: r.action ? V(r.action) : l(n)(r.label),
+          "aria-pressed": r.action?.active ? r.action.active() : void 0,
+          disabled: a.disabled,
+          "data-ui-rich-tool": r.key,
+          onMousedown: t[0] || (t[0] = F(() => {
+          }, ["prevent"])),
+          onClick: (d) => Te(r.key)
+        }, [
+          (p(), T(we(r.icon), {
+            class: "size-4",
+            "aria-hidden": "true"
+          }))
+        ], 40, Aa))), 128)),
+        Be.value.length ? (p(), T(l(ia), {
+          key: 0,
+          items: Be.value,
+          align: "end",
+          onSelect: Te
+        }, {
+          trigger: I(() => [
+            B("button", {
+              type: "button",
+              class: E(H),
+              "aria-label": l(n)("More"),
+              title: l(n)("More"),
+              disabled: a.disabled,
+              "data-ui-rich-more": "",
+              onMousedown: t[1] || (t[1] = F(() => {
+              }, ["prevent"]))
+            }, [
+              _(l(Xt), {
+                class: "size-4",
+                "aria-hidden": "true"
+              })
+            ], 40, Sa)
+          ]),
+          _: 1
+        }, 8, ["items"])) : C("", !0)
+      ], 8, La)),
+      D.value && !s.value ? (p(), y("div", za, [
+        _(l(Xe), {
+          ref_key: "linkInput",
+          ref: ne,
+          modelValue: O.value,
+          "onUpdate:modelValue": t[2] || (t[2] = (r) => O.value = r),
+          size: "sm",
+          class: "min-w-0 flex-1",
+          type: "url",
+          inputmode: "url",
+          "aria-label": l(n)("Link address"),
+          placeholder: "https://",
+          onKeydown: qe
+        }, null, 8, ["modelValue", "aria-label"]),
+        _(l(Ye), {
+          size: "sm",
+          variant: "primary",
+          onClick: ye
+        }, {
+          default: I(() => [
+            Ge(ee(l(n)("Apply")), 1)
+          ]),
+          _: 1
+        }),
+        P("link") ? (p(), T(l(te), {
+          key: 0,
+          size: "sm",
+          label: l(n)("Remove link"),
+          onClick: ke
+        }, {
+          default: I(() => [
+            _(l(Je), {
+              class: "size-4",
+              "aria-hidden": "true"
+            })
+          ]),
+          _: 1
+        }, 8, ["label"])) : C("", !0),
+        _(l(te), {
+          size: "sm",
+          label: l(n)("Close"),
+          onClick: j
+        }, {
+          default: I(() => [
+            _(l(Me), {
+              class: "size-4",
+              "aria-hidden": "true"
+            })
+          ]),
+          _: 1
+        }, 8, ["label"])
+      ])) : C("", !0),
+      _(l(qt), {
+        editor: l(g),
+        class: E([Lt, s.value ? "max-h-[calc(8lh+16px)] overflow-y-auto px-2.5 py-2" : "min-h-32 px-3 py-2.5"])
+      }, null, 8, ["editor", "class"]),
+      _(l(na), {
+        id: l(pe),
+        open: b.open,
+        reference: b.reference,
+        people: W.value,
+        active: b.active,
+        loading: a.loading,
+        boundary: l(g)?.view.dom,
+        onChoose: Se,
+        onHover: t[3] || (t[3] = (r) => {
+          b.active = r;
+        }),
+        onClose: t[4] || (t[4] = (r) => b.open = !1)
+      }, null, 8, ["id", "open", "reference", "people", "active", "loading", "boundary"]),
+      l(g) ? (p(), T(l(Ft), {
+        key: 2,
+        editor: l(g),
+        "should-show": Pt,
+        options: { placement: "top", offset: 6 }
+      }, {
+        default: I(() => [
+          B("div", {
+            role: "toolbar",
+            "aria-label": l(n)("Formatting"),
+            class: "flex items-center gap-0.5 rounded-[var(--ui-radius-md)] border border-[var(--ui-border)] bg-[var(--ui-surface-raised)] p-0.5 shadow-[var(--ui-shadow-menu)]",
+            "data-ui-rich-bubble": ""
+          }, [
+            (p(!0), y(Q, null, Z(kt.value, (r) => (p(), y("button", {
+              key: r.key,
+              type: "button",
+              class: E(H),
+              "aria-label": V(r),
+              title: V(r),
+              "aria-pressed": r.active?.(),
+              onMousedown: t[5] || (t[5] = F(() => {
+              }, ["prevent"])),
+              onClick: (d) => r.run()
+            }, [
+              (p(), T(we(r.icon), {
+                class: "size-4",
+                "aria-hidden": "true"
+              }))
+            ], 40, Ba))), 128))
+          ], 8, Ea)
+        ]),
+        _: 1
+      }, 8, ["editor"])) : C("", !0),
+      s.value && c.value.length ? (p(), y("ul", {
+        key: 3,
+        class: "m-0 flex list-none flex-wrap gap-2 px-2.5 pb-2 pt-0.5",
+        "aria-label": l(n)("Images"),
+        "data-ui-rich-attachments": ""
+      }, [
+        (p(!0), y(Q, null, Z(c.value, (r) => (p(), y("li", {
+          key: r.key,
+          class: "relative",
+          "data-ui-rich-attachment": r.id ?? ""
+        }, [
+          B("div", {
+            class: "relative flex size-16 items-center justify-center overflow-hidden rounded-[var(--ui-radius-md)] border border-[var(--ui-border-subtle)] bg-[var(--ui-surface-subtle)]",
+            style: It({ background: a.files?.(r.id ?? "")?.dominant })
+          }, [
+            r.src ?? a.files?.(r.id ?? "")?.thumb ? (p(), y("img", {
+              key: 0,
+              src: r.src ?? a.files?.(r.id ?? "")?.thumb,
+              alt: r.name,
+              class: E(["size-full object-cover", r.task && "opacity-60"]),
+              draggable: "false"
+            }, null, 10, Ra)) : C("", !0),
+            r.task ? (p(), y(Q, { key: 1 }, [
+              l($).tasks.find((d) => d.key === r.task)?.status === "failed" ? (p(), y("span", Ha, [
+                _(l(te), {
+                  size: "sm",
+                  variant: "secondary",
+                  label: l(n)("Retry {name}", { name: r.name }),
+                  onClick: (d) => ce(r.task)
+                }, {
+                  default: I(() => [
+                    _(l(Yt), {
+                      class: "size-4",
+                      "aria-hidden": "true"
+                    })
+                  ]),
+                  _: 1
+                }, 8, ["label", "onClick"])
+              ])) : (p(), y("span", qa, [
+                _(l(Ze), {
+                  size: 20,
+                  inline: "",
+                  label: l(n)("Uploading")
+                }, null, 8, ["label"])
+              ]))
+            ], 64)) : C("", !0)
+          ], 4),
+          B("button", {
+            type: "button",
+            class: "absolute -end-1.5 -top-1.5 flex size-5 items-center justify-center rounded-full border border-[var(--ui-surface)] bg-[var(--ui-text-secondary)] p-0 text-[var(--ui-surface)] outline-none hover:bg-[var(--ui-text)] focus-visible:shadow-[var(--ui-shadow-focus)] after:absolute after:-inset-3 [@media(pointer:fine)]:after:hidden",
+            "aria-label": l(n)("Remove {name}", { name: r.name }),
+            "data-ui-rich-attachment-remove": "",
+            onClick: (d) => ft(r)
+          }, [
+            _(l(Me), {
+              class: "size-3",
+              "aria-hidden": "true"
+            })
+          ], 8, Fa)
+        ], 8, Ia))), 128))
+      ], 8, Ta)) : C("", !0),
+      D.value && s.value ? (p(), y("div", Na, [
+        _(l(Xe), {
+          ref_key: "linkInput",
+          ref: ne,
+          modelValue: O.value,
+          "onUpdate:modelValue": t[6] || (t[6] = (r) => O.value = r),
+          size: "sm",
+          class: "min-w-0 flex-1",
+          type: "url",
+          inputmode: "url",
+          "aria-label": l(n)("Link address"),
+          placeholder: "https://",
+          onKeydown: qe
+        }, null, 8, ["modelValue", "aria-label"]),
+        _(l(Ye), {
+          size: "sm",
+          variant: "primary",
+          onClick: ye
+        }, {
+          default: I(() => [
+            Ge(ee(l(n)("Apply")), 1)
+          ]),
+          _: 1
+        }),
+        P("link") ? (p(), T(l(te), {
+          key: 0,
+          size: "sm",
+          label: l(n)("Remove link"),
+          onClick: ke
+        }, {
+          default: I(() => [
+            _(l(Je), {
+              class: "size-4",
+              "aria-hidden": "true"
+            })
+          ]),
+          _: 1
+        }, 8, ["label"])) : C("", !0),
+        _(l(te), {
+          size: "sm",
+          label: l(n)("Close"),
+          onClick: j
+        }, {
+          default: I(() => [
+            _(l(Me), {
+              class: "size-4",
+              "aria-hidden": "true"
+            })
+          ]),
+          _: 1
+        }, 8, ["label"])
+      ])) : C("", !0),
+      s.value && J.value ? (p(), y("div", {
+        key: 5,
+        role: "toolbar",
+        "aria-label": l(n)("Formatting"),
+        class: "flex min-w-0 items-center gap-0.5 overflow-x-auto border-t border-[var(--ui-border-subtle)] px-1 py-0.5",
+        "data-ui-rich-format-row": ""
+      }, [
+        (p(!0), y(Q, null, Z(re.value, (r) => (p(), y("button", {
+          key: r.key,
+          type: "button",
+          class: E(H),
+          "aria-label": V(r),
+          title: V(r),
+          "aria-pressed": r.active?.(),
+          disabled: a.disabled,
+          "data-ui-rich-tool": r.key,
+          onMousedown: t[7] || (t[7] = F(() => {
+          }, ["prevent"])),
+          onClick: (d) => r.run()
+        }, [
+          (p(), T(we(r.icon), {
+            class: "size-4",
+            "aria-hidden": "true"
+          }))
+        ], 40, Va))), 128))
+      ], 8, Ua)) : C("", !0),
+      s.value ? (p(), y("div", Da, [
+        a.upload ? (p(), y("button", {
+          key: 0,
+          type: "button",
+          class: E(H),
+          "aria-label": l(n)("Add image"),
+          title: l(n)("Add image"),
+          disabled: a.disabled,
+          "data-ui-rich-tool": "image",
+          onMousedown: t[8] || (t[8] = F(() => {
+          }, ["prevent"])),
+          onClick: Le
+        }, [
+          _(l(Qe), {
+            class: "size-4",
+            "aria-hidden": "true"
+          })
+        ], 40, Oa)) : C("", !0),
+        B("button", {
+          type: "button",
+          class: E(H),
+          "aria-label": l(n)("Mention someone"),
+          title: l(n)("Mention someone"),
+          disabled: a.disabled,
+          "data-ui-rich-tool": "mention",
+          onMousedown: t[9] || (t[9] = F(() => {
+          }, ["prevent"])),
+          onClick: Ie
+        }, [
+          _(l(We), {
+            class: "size-4",
+            "aria-hidden": "true"
+          })
+        ], 40, ja),
+        B("button", {
+          type: "button",
+          class: E(H),
+          "aria-label": l(n)("Formatting"),
+          title: l(n)("Formatting"),
+          "aria-pressed": J.value,
+          "aria-expanded": J.value,
+          disabled: a.disabled,
+          "data-ui-rich-format-toggle": "",
+          onMousedown: t[10] || (t[10] = F(() => {
+          }, ["prevent"])),
+          onClick: ze
+        }, [
+          _(l(Zt), {
+            class: "size-4",
+            "aria-hidden": "true"
+          })
+        ], 40, Ka),
+        t[14] || (t[14] = B("span", { class: "flex-1" }, null, -1)),
+        xe.value ? (p(), y("span", {
+          key: 1,
+          "aria-live": "polite",
+          class: E(["px-1 text-[length:var(--ui-font-size-sm)] tabular-nums", R.value ? "text-[var(--ui-danger-text)]" : "text-[var(--ui-text-secondary)]"]),
+          "data-ui-rich-count": ""
+        }, ee(R.value ? l(n)("{count} characters over the limit", { count: -K.value }) : l(n)("{count} characters left", { count: K.value })), 3)) : C("", !0),
+        B("button", {
+          type: "button",
+          class: E([H, "text-[var(--ui-primary)] disabled:text-[var(--ui-text-disabled)]"]),
+          "aria-label": `${l(n)("Send")} (${l(v)}Enter)`,
+          title: `${l(n)("Send")} (${l(v)}Enter)`,
+          disabled: !Ne.value,
+          "data-ui-rich-send": "",
+          onMousedown: t[11] || (t[11] = F(() => {
+          }, ["prevent"])),
+          onClick: Ue
+        }, [
+          a.sending ? (p(), T(l(Ze), {
+            key: 0,
+            size: 16,
+            inline: "",
+            label: l(n)("Sending")
+          }, null, 8, ["label"])) : (p(), T(l(ea), {
+            key: 1,
+            class: "size-4 rtl:-scale-x-100",
+            "aria-hidden": "true"
+          }))
+        ], 42, Ga)
+      ])) : C("", !0),
+      !s.value && (xe.value || U.value.length) ? (p(), y("div", Qa, [
+        xe.value ? (p(), y("span", {
+          key: 0,
+          "aria-live": "polite",
+          class: E(["self-end text-[length:var(--ui-font-size-sm)] tabular-nums", R.value ? "text-[var(--ui-danger-text)]" : "text-[var(--ui-text-secondary)]"]),
+          "data-ui-rich-count": ""
+        }, ee(R.value ? l(n)("{count} characters over the limit", { count: -K.value }) : l(n)("{count} characters left", { count: K.value })), 3)) : C("", !0),
+        U.value.length ? (p(), T(l(oa), {
+          key: 1,
+          tasks: U.value,
+          onRetry: ce,
+          onCancel: $e,
+          onRetryAll: t[12] || (t[12] = (r) => U.value.forEach((d) => d.status === "failed" && ce(d.key))),
+          onCancelAll: t[13] || (t[13] = (r) => U.value.forEach((d) => $e(d.key)))
+        }, null, 8, ["tasks"])) : C("", !0)
+      ])) : C("", !0),
+      B("div", Wa, [
+        (p(!0), y(Q, null, Z(x.value, (r) => (p(), y("p", {
+          key: r,
+          class: "m-0 border-t border-[var(--ui-border-subtle)] px-3 py-1.5 text-[length:var(--ui-font-size-sm)] text-[var(--ui-danger-text)]"
+        }, ee(r), 1))), 128))
+      ])
+    ], 16, Pa));
+  }
+});
+export {
+  lr as RichTextEditor,
+  xa as docToMarkdown,
+  ya as markdownToDoc
+};