@w100n/documents 0.15.1 → 0.16.1

package/dist/{TextEditor-D6QH2B7O.js → TextEditor-BF6HCNHL.js}

@@ -4,7 +4,7 @@ import {
 } from "./chunk-QDH7EZAF.js";
 import {
   useLive
-} from "./chunk-XR42B3F5.js";
+} from "./chunk-NPVH2YDI.js";
 import {
   a4,
   align,
@@ -13,7 +13,6 @@ import {
   clear,
   decide,
   entries,
-  fromMarkdown,
   indent,
   kit,
   letter,
@@ -23,19 +22,23 @@ import {
   replace,
   searching,
   spacing,
-  suggesting,
+  suggesting
+} from "./chunk-GN3ZOD36.js";
+import {
+  fromMarkdown,
   toMarkdown,
   track
-} from "./chunk-BGH36LAR.js";
+} from "./chunk-EQLBYW42.js";
 import {
   rove,
   useRestore
 } from "./chunk-TDP6OJET.js";
+import "./chunk-LZYITB56.js";
 import {
   mathml,
   readDocx,
   writeDocx
-} from "./chunk-CAPICJ6B.js";
+} from "./chunk-ZAVXCH7V.js";
 import "./chunk-ISOOUYLI.js";
 
 // src/editor/TextEditor.tsx
@@ -103,7 +106,7 @@ import {
   WifiOff,
   X
 } from "lucide-react";
-import { Fragment as Fragment2, useEffect, useRef as useRef2, useState as useState2 } from "react";
+import { Fragment as Fragment2, useEffect, useRef as useRef3, useState as useState3 } from "react";
 import { createPortal } from "react-dom";
 
 // src/viewers/DocxView.tsx
@@ -156,8 +159,70 @@ function DocxView({ bytes, onOutline, failed }) {
   ] });
 }
 
+// src/editor/Mentions.tsx
+import { useRef as useRef2, useState as useState2 } from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var tagged = (body, people) => people.filter((p) => body.toLocaleLowerCase().includes(`@${p.name.toLocaleLowerCase()}`));
+function Mentions({ value, onChange, onSend, people, label, placeholder, autoFocus }) {
+  const field = useRef2(null);
+  const [caret, setCaret] = useState2(0);
+  const [at, setAt] = useState2(0);
+  const [shut, setShut] = useState2(false);
+  const typed = /(?:^|\s)@([\p{L}\p{N}.'-]*)$/u.exec(value.slice(0, caret));
+  const query = typed?.[1].toLocaleLowerCase() ?? "";
+  const found = typed && !shut ? people.filter((p) => p.name.toLocaleLowerCase().split(/\s+/).some((w) => w.startsWith(query)) || p.name.toLocaleLowerCase().startsWith(query)).slice(0, 6) : [];
+  const choose = (p) => {
+    const start = caret - query.length - 1;
+    const next = `${value.slice(0, start)}@${p.name} ${value.slice(caret)}`;
+    const end = start + p.name.length + 2;
+    onChange(next);
+    setCaret(end);
+    requestAnimationFrame(() => field.current?.setSelectionRange(end, end));
+  };
+  return /* @__PURE__ */ jsxs2("span", { className: "w100n-text-mentions", children: [
+    /* @__PURE__ */ jsx2(
+      "textarea",
+      {
+        ref: field,
+        autoFocus,
+        value,
+        placeholder,
+        "aria-label": label,
+        "aria-autocomplete": "list",
+        "aria-expanded": found.length > 0,
+        onChange: (e) => {
+          onChange(e.target.value);
+          setCaret(e.target.selectionStart);
+          setAt(0);
+          setShut(false);
+        },
+        onClick: (e) => setCaret(e.currentTarget.selectionStart),
+        onKeyUp: (e) => {
+          if (["ArrowLeft", "ArrowRight", "Home", "End"].includes(e.key)) setCaret(e.currentTarget.selectionStart);
+        },
+        onKeyDown: (e) => {
+          if (found.length && (e.key === "ArrowDown" || e.key === "ArrowUp")) {
+            e.preventDefault();
+            setAt((at + (e.key === "ArrowDown" ? 1 : found.length - 1)) % found.length);
+          } else if (found.length && (e.key === "Enter" || e.key === "Tab") && !e.metaKey && !e.ctrlKey) {
+            e.preventDefault();
+            choose(found[Math.min(at, found.length - 1)]);
+          } else if (found.length && e.key === "Escape") {
+            e.stopPropagation();
+            setShut(true);
+          } else if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) onSend();
+        }
+      }
+    ),
+    found.length > 0 && /* @__PURE__ */ jsx2("span", { className: "w100n-text-pop w100n-text-menu w100n-text-people-list", role: "listbox", "aria-label": label, children: found.map((p, i) => /* @__PURE__ */ jsxs2("button", { type: "button", role: "option", "aria-selected": i === Math.min(at, found.length - 1), onMouseDown: (e) => e.preventDefault(), onClick: () => choose(p), children: [
+      p.avatarUrl ? /* @__PURE__ */ jsx2("img", { className: "w100n-text-face", src: p.avatarUrl, alt: "" }) : /* @__PURE__ */ jsx2("span", { className: "w100n-text-face", "aria-hidden": true, children: p.name.slice(0, 1).toUpperCase() }),
+      /* @__PURE__ */ jsx2("span", { children: p.name })
+    ] }, p.id)) })
+  ] });
+}
+
 // src/editor/TextEditor.tsx
-import { Fragment as Fragment3, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var legal = { width: 816, height: 1344 };
 var symbols = [
   ["\xA9", "copyright"],
@@ -229,38 +294,43 @@ function TextEditor({ kind, bytes, t, language, rights, host, together, document
   const live = useLive(together ? host : void 0, documentId, kind, bytes, source.data?.doc, language, can.edit, onSaved);
   const shared = live?.ready ? live.wire : null;
   if (live?.readonly) can.edit = false;
-  const baseline = useRef2(null);
-  const anchors = useRef2(/* @__PURE__ */ new Map());
-  const scroller = useRef2(null);
-  const root = useRef2(null);
-  const [pop, setPop] = useState2(null);
-  const [dialog, setDialog] = useState2(null);
-  const field = useRef2(null);
-  const [more, setMore] = useState2(() => typeof localStorage !== "undefined" && localStorage.getItem("w100n-docs-more") === "1");
-  const [zoom, setZoom] = useState2(null);
-  const [layout, setLayout] = useState2(null);
-  const [room, setRoom] = useState2(0);
-  const [saving, setSaving] = useState2("idle");
-  const [href, setHref] = useState2("");
-  const [grid, setGrid] = useState2({ rows: 0, cols: 0 });
-  const [draft, setDraft] = useState2(null);
-  const [reply, setReply] = useState2(null);
-  const [active, setActive] = useState2(null);
-  const [resolved, setResolved] = useState2(false);
-  const [posting, setPosting] = useState2("idle");
-  const [added, setAdded] = useState2([]);
-  const [changed, setChanged] = useState2({});
-  const [editing, setEditing] = useState2(null);
-  const [dropping, setDropping] = useState2(null);
-  const [failed, setFailed] = useState2(false);
-  const [paint, setPaint] = useState2(null);
-  const [query, setQuery] = useState2("");
-  const [swap, setSwap] = useState2("");
-  const [matchCase, setMatchCase] = useState2(false);
-  const [count, setCount] = useState2({ words: 0, pages: 0 });
-  const [marg, setMarg] = useState2(null);
-  const [unsetup, setUnsetup] = useState2(false);
-  const [draft2, setDraft2] = useState2(null);
+  const baseline = useRef3(null);
+  const anchors = useRef3(/* @__PURE__ */ new Map());
+  const scroller = useRef3(null);
+  const root = useRef3(null);
+  const [pop, setPop] = useState3(null);
+  const [spot, setSpot] = useState3({ x: 0, y: 0 });
+  const touch = useRef3(false);
+  const [spell, setSpell] = useState3(() => typeof localStorage === "undefined" || localStorage.getItem("w100n-docs-spell") !== "0");
+  const [dialog, setDialog] = useState3(null);
+  const field = useRef3(null);
+  const [more, setMore] = useState3(() => typeof localStorage !== "undefined" && localStorage.getItem("w100n-docs-more") === "1");
+  const [zoom, setZoom] = useState3(null);
+  const [layout, setLayout] = useState3(null);
+  const [room, setRoom] = useState3(0);
+  const [printed, setPrinted] = useState3(null);
+  const flow = docx && !(printed ?? !(room > 0 && room < 640));
+  const [saving, setSaving] = useState3("idle");
+  const [href, setHref] = useState3("");
+  const [grid, setGrid] = useState3({ rows: 0, cols: 0 });
+  const [draft, setDraft] = useState3(null);
+  const [reply, setReply] = useState3(null);
+  const [active, setActive] = useState3(null);
+  const [resolved, setResolved] = useState3(false);
+  const [posting, setPosting] = useState3("idle");
+  const [added, setAdded] = useState3([]);
+  const [changed, setChanged] = useState3({});
+  const [editing, setEditing] = useState3(null);
+  const [dropping, setDropping] = useState3(null);
+  const [failed, setFailed] = useState3(false);
+  const [paint, setPaint] = useState3(null);
+  const [query, setQuery] = useState3("");
+  const [swap, setSwap] = useState3("");
+  const [matchCase, setMatchCase] = useState3(false);
+  const [count, setCount] = useState3({ words: 0, pages: 0 });
+  const [marg, setMarg] = useState3(null);
+  const [unsetup, setUnsetup] = useState3(false);
+  const [draft2, setDraft2] = useState3(null);
   useRestore(pop !== null);
   useRestore(editing !== null);
   useRestore(dropping !== null);
@@ -270,7 +340,7 @@ function TextEditor({ kind, bytes, t, language, rights, host, together, document
     editable: can.edit && (!live || !!shared),
     immediatelyRender: true,
     shouldRerenderOnTransaction: false,
-    editorProps: { attributes: { class: "w100n-docs-prose w100n-text-body", "aria-label": t.documentText }, transformPastedHTML: cleanPaste },
+    editorProps: { attributes: { class: "w100n-docs-prose w100n-text-body", "aria-label": t.documentText, spellcheck: String(spell), lang: language }, transformPastedHTML: cleanPaste },
     onCreate: ({ editor: made }) => {
       if (source.data && !live) baseline.current = { bytes, doc: made.state.doc, base: source.data.md && track(source.data.md, made.state.doc) };
     }
@@ -346,8 +416,8 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
   };
   const marginal = marg ?? (source.data && "marginal" in source.data ? source.data.marginal : null) ?? { header: "", footer: "", numbers: false };
   useEffect(() => {
-    if (editor && docx && source.data) editor.view.dispatch(editor.state.tr.setMeta(paging, { page, marks: { header: marginal.header, footer: marginal.footer } }));
-  }, [editor, source.data, page, marginal.header, marginal.footer]);
+    if (editor && docx && source.data) editor.view.dispatch(editor.state.tr.setMeta(paging, { page, marks: { header: marginal.header, footer: marginal.footer }, flow }));
+  }, [editor, source.data, page, marginal.header, marginal.footer, flow]);
   useEffect(() => {
     if (!shared || !docx) return;
     const map = shared.doc.getMap("setup");
@@ -361,6 +431,8 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     return () => map.unobserve(sync);
   }, [shared, docx]);
   const loaded = useLoad((signal) => host?.comments ? host.comments(documentId, { signal }) : Promise.resolve([]), [host, documentId]);
+  const crowd = useLoad((signal) => host?.people && can.comment ? host.people(documentId, { signal }) : Promise.resolve([]), [host, documentId]);
+  const people = (crowd.data ?? []).filter((p) => p.id !== host?.me.id);
   const all = [...loaded.data ?? [], ...added].flatMap((c) => c.id in changed ? changed[c.id] ?? [] : [c]).filter((c) => !c.replyTo || changed[c.replyTo] !== null);
   const open = all.filter((c) => !c.replyTo && !c.resolved);
   const threads = all.filter((c) => !c.replyTo && (resolved || !c.resolved)).sort((a, b) => a.createdAt.localeCompare(b.createdAt));
@@ -461,6 +533,18 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     watch.observe(el);
     return () => watch.disconnect();
   }, [editor, source.data]);
+  useEffect(() => {
+    const view = window.visualViewport;
+    const el = root.current;
+    if (!view || !el) return;
+    const lift = () => el.style.setProperty("--kb", `${Math.max(0, innerHeight - view.height - view.offsetTop)}px`);
+    view.addEventListener("resize", lift);
+    view.addEventListener("scroll", lift);
+    return () => {
+      view.removeEventListener("resize", lift);
+      view.removeEventListener("scroll", lift);
+    };
+  }, [editor, source.data]);
   useEffect(() => {
     const el = root.current;
     if (!el) return;
@@ -490,11 +574,20 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     const close = (e) => {
       if (!e.target.closest(".w100n-text-pop, [data-pop]")) setPop(null);
     };
+    const off = (e) => {
+      if (pop === "context" && (e.type === "scroll" || e.key === "Escape")) setPop(null);
+    };
     document.addEventListener("pointerdown", close);
-    return () => document.removeEventListener("pointerdown", close);
+    window.addEventListener("keydown", off);
+    window.addEventListener("scroll", off, true);
+    return () => {
+      document.removeEventListener("pointerdown", close);
+      window.removeEventListener("keydown", off);
+      window.removeEventListener("scroll", off, true);
+    };
   }, [pop]);
-  if (source.error) return docx ? /* @__PURE__ */ jsx2("div", { className: "w100n-docs-scroll", children: /* @__PURE__ */ jsx2(DocxView, { bytes, onOutline, failed: t.failed }) }) : /* @__PURE__ */ jsx2("div", { className: "w100n-docs-empty", children: t.failed });
-  if (!source.data || !editor || !state || live && !live.ready && !live.late && !live.denied) return /* @__PURE__ */ jsx2("div", { className: "w100n-docs-empty", children: t.loading });
+  if (source.error) return docx ? /* @__PURE__ */ jsx3("div", { className: "w100n-docs-scroll", children: /* @__PURE__ */ jsx3(DocxView, { bytes, onOutline, failed: t.failed }) }) : /* @__PURE__ */ jsx3("div", { className: "w100n-docs-empty", children: t.failed });
+  if (!source.data || !editor || !state || live && !live.ready && !live.late && !live.denied) return /* @__PURE__ */ jsx3("div", { className: "w100n-docs-empty", children: t.loading });
   const save = async (auto = false) => {
     if (live) {
       if (!can.edit || !live.ready || !live.online || !live.pending || saving === "busy") return false;
@@ -558,7 +651,7 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     const { from, to, empty } = editor.state.selection;
     if (empty || !can.comment) return;
     editor.view.dispatch(editor.state.tr.setMeta(notes, { pending: { from, to } }));
-    setDraft({ quote: editor.state.doc.textBetween(from, to, "\n", " "), body: "" });
+    setDraft({ quote: editor.state.doc.textBetween(from, to, "\n", " "), body: "", give: false });
     setPosting("idle");
     onPanel?.("comments");
   };
@@ -571,7 +664,7 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     setPosting("busy");
     try {
       const anchor = uid();
-      const made = await host.comment(documentId, { body: draft.body.trim(), quote: draft.quote, replyTo: null, anchor });
+      const made = await host.comment(documentId, { body: draft.body.trim(), quote: draft.quote, replyTo: null, anchor, assignee: draft.give ? tagged(draft.body, people)[0]?.id ?? null : null });
       anchors.current.set(made.id, anchor);
       const range = notes.getState(editor.state).pending;
       editor.view.dispatch(editor.state.tr.setMeta(notes, { pending: null, spots: [...notes.getState(editor.state).spots, ...range ? [{ id: made.id, ...range }] : []] }));
@@ -624,9 +717,9 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
   const drops = (c) => mine(c) || c.author.id.startsWith("guest:") && !!rights?.edit;
   const show = (c) => {
     setActive(c.id);
-    const spot = notes.getState(editor.state).spots.find((s) => s.id === c.id);
-    if (!spot) return;
-    const at = editor.view.domAtPos(spot.from).node;
+    const spot2 = notes.getState(editor.state).spots.find((s) => s.id === c.id);
+    if (!spot2) return;
+    const at = editor.view.domAtPos(spot2.from).node;
     (at instanceof HTMLElement ? at : at.parentElement)?.scrollIntoView({ behavior: "smooth", block: "center" });
   };
   const suggested = [...state.revs.reduce((all2, c) => {
@@ -639,7 +732,7 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     const dom = editor.view.domAtPos(at).node;
     (dom instanceof HTMLElement ? dom : dom.parentElement)?.scrollIntoView({ behavior: "smooth", block: "center" });
   };
-  const percent = zoom ?? (docx && room ? Math.max(10, Math.min(100, Math.floor((room - 24) / page.width * 100))) : 100);
+  const percent = zoom ?? (docx && room && !flow ? Math.max(10, Math.min(100, Math.floor((room - 24) / page.width * 100))) : 100);
   const zoomBy = (d) => setZoom(Math.min(200, Math.max(30, percent + d)));
   const keys = (e) => {
     if (e.defaultPrevented) return;
@@ -665,15 +758,15 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     else if (key === "]" || key === "[") act(() => indent(editor, key === "]" ? 1 : -1));
     else if (key === "\\") act(() => clear(editor));
     else if (key === "enter" && docx) act(() => editor.chain().focus().insertContent({ type: "pageBreak" }).run());
-    else if (e.shiftKey && docx && ["l", "e", "r", "j"].includes(key)) act(() => align(editor, { l: "left", e: "center", r: "right", j: "justify" }[key]));
+    else if (e.shiftKey && ["l", "e", "r", "j"].includes(key)) act(() => align(editor, { l: "left", e: "center", r: "right", j: "justify" }[key]));
   };
   const tool = (icon, label, run, pressed, disabled) => {
     const Icon = icon;
-    return /* @__PURE__ */ jsx2("button", { type: "button", "aria-label": label, title: label, "aria-pressed": pressed, disabled, onClick: () => {
+    return /* @__PURE__ */ jsx3("button", { type: "button", "aria-label": label, title: label, "aria-pressed": pressed, disabled, onClick: () => {
       run();
-    }, children: /* @__PURE__ */ jsx2(Icon, { "aria-hidden": true }) });
+    }, children: /* @__PURE__ */ jsx3(Icon, { "aria-hidden": true }) });
   };
-  const gap = /* @__PURE__ */ jsx2("span", { className: "w100n-pdf-gap" });
+  const gap = /* @__PURE__ */ jsx3("span", { className: "w100n-pdf-gap" });
   const known = source.data.styles;
   const named = (test) => {
     const name = known.find(test)?.name;
@@ -692,28 +785,28 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
   ];
   const margins = [[t.marginsNormal, [96, 96, 96, 96]], [t.marginsNarrow, [48, 48, 48, 48]], [t.marginsWide, [96, 192, 96, 192]]];
   const when = (iso) => new Intl.DateTimeFormat(language, { day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" }).format(new Date(iso));
-  const person = (c) => /* @__PURE__ */ jsxs2("header", { children: [
-    c.author.avatarUrl ? /* @__PURE__ */ jsx2("img", { className: "w100n-text-face", src: c.author.avatarUrl, alt: "" }) : /* @__PURE__ */ jsx2("span", { className: "w100n-text-face", "aria-hidden": true, children: c.author.name.slice(0, 1).toUpperCase() }),
-    /* @__PURE__ */ jsxs2("span", { className: "w100n-text-who", children: [
-      /* @__PURE__ */ jsxs2("b", { children: [
+  const person = (c) => /* @__PURE__ */ jsxs3("header", { children: [
+    c.author.avatarUrl ? /* @__PURE__ */ jsx3("img", { className: "w100n-text-face", src: c.author.avatarUrl, alt: "" }) : /* @__PURE__ */ jsx3("span", { className: "w100n-text-face", "aria-hidden": true, children: c.author.name.slice(0, 1).toUpperCase() }),
+    /* @__PURE__ */ jsxs3("span", { className: "w100n-text-who", children: [
+      /* @__PURE__ */ jsxs3("b", { children: [
         c.author.name,
-        c.author.id.startsWith("guest:") && /* @__PURE__ */ jsx2("span", { className: "w100n-docs-badge", children: t.guest })
+        c.author.id.startsWith("guest:") && /* @__PURE__ */ jsx3("span", { className: "w100n-docs-badge", children: t.guest })
       ] }),
-      /* @__PURE__ */ jsx2("small", { children: when(c.createdAt) })
+      /* @__PURE__ */ jsx3("small", { children: when(c.createdAt) })
     ] }),
-    drops(c) && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-own", onClick: (e) => e.stopPropagation(), children: [
-      mine(c) && host.editComment && /* @__PURE__ */ jsx2("button", { type: "button", "aria-label": t.editComment, title: t.editComment, onClick: () => {
+    drops(c) && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-own", onClick: (e) => e.stopPropagation(), children: [
+      mine(c) && host.editComment && /* @__PURE__ */ jsx3("button", { type: "button", "aria-label": t.editComment, title: t.editComment, onClick: () => {
         setDropping(null);
         setEditing({ id: c.id, body: c.body });
-      }, children: /* @__PURE__ */ jsx2(Pencil, { "aria-hidden": true }) }),
-      host.deleteComment && /* @__PURE__ */ jsx2("button", { type: "button", "data-tone": "red", "aria-label": t.delete, title: t.delete, onClick: () => {
+      }, children: /* @__PURE__ */ jsx3(Pencil, { "aria-hidden": true }) }),
+      host.deleteComment && /* @__PURE__ */ jsx3("button", { type: "button", "data-tone": "red", "aria-label": t.delete, title: t.delete, onClick: () => {
         setEditing(null);
         setDropping(c.id);
-      }, children: /* @__PURE__ */ jsx2(Trash2, { "aria-hidden": true }) })
+      }, children: /* @__PURE__ */ jsx3(Trash2, { "aria-hidden": true }) })
     ] })
   ] });
-  const words = (c) => editing?.id === c.id ? /* @__PURE__ */ jsxs2("div", { className: "w100n-text-reply w100n-text-edit", onClick: (e) => e.stopPropagation(), children: [
-    /* @__PURE__ */ jsx2(
+  const words = (c) => editing?.id === c.id ? /* @__PURE__ */ jsxs3("div", { className: "w100n-text-reply w100n-text-edit", onClick: (e) => e.stopPropagation(), children: [
+    /* @__PURE__ */ jsx3(
       "textarea",
       {
         autoFocus: true,
@@ -725,33 +818,33 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
         }
       }
     ),
-    /* @__PURE__ */ jsxs2("span", { className: "w100n-pdf-dialog-end", children: [
-      /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-pdf-link", onClick: () => setEditing(null), children: t.cancel }),
-      /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", disabled: !editing.body.trim() || editing.body.trim() === c.body || posting === "busy", onClick: () => void change(c.id, editing.body.trim()), children: [
-        /* @__PURE__ */ jsx2(Save, { "aria-hidden": true }),
+    /* @__PURE__ */ jsxs3("span", { className: "w100n-pdf-dialog-end", children: [
+      /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-pdf-link", onClick: () => setEditing(null), children: t.cancel }),
+      /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", disabled: !editing.body.trim() || editing.body.trim() === c.body || posting === "busy", onClick: () => void change(c.id, editing.body.trim()), children: [
+        /* @__PURE__ */ jsx3(Save, { "aria-hidden": true }),
         t.save
       ] })
     ] })
-  ] }) : dropping === c.id ? /* @__PURE__ */ jsxs2("div", { className: "w100n-text-confirm", role: "group", "aria-label": t.delete, onClick: (e) => e.stopPropagation(), children: [
-    /* @__PURE__ */ jsx2("p", { children: c.replyTo || !all.some((r) => r.replyTo === c.id) ? t.deleteAsk : t.deleteThread }),
-    /* @__PURE__ */ jsxs2("span", { className: "w100n-pdf-dialog-end", children: [
-      /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-pdf-link", autoFocus: true, onClick: () => setDropping(null), children: t.cancel }),
-      /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", "data-tone": "red", disabled: posting === "busy", onClick: () => void change(c.id, null), children: [
-        /* @__PURE__ */ jsx2(Trash2, { "aria-hidden": true }),
+  ] }) : dropping === c.id ? /* @__PURE__ */ jsxs3("div", { className: "w100n-text-confirm", role: "group", "aria-label": t.delete, onClick: (e) => e.stopPropagation(), children: [
+    /* @__PURE__ */ jsx3("p", { children: c.replyTo || !all.some((r) => r.replyTo === c.id) ? t.deleteAsk : t.deleteThread }),
+    /* @__PURE__ */ jsxs3("span", { className: "w100n-pdf-dialog-end", children: [
+      /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-pdf-link", autoFocus: true, onClick: () => setDropping(null), children: t.cancel }),
+      /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", "data-tone": "red", disabled: posting === "busy", onClick: () => void change(c.id, null), children: [
+        /* @__PURE__ */ jsx3(Trash2, { "aria-hidden": true }),
         t.delete
       ] })
     ] })
-  ] }) : /* @__PURE__ */ jsx2("p", { children: c.body });
+  ] }) : /* @__PURE__ */ jsx3("p", { children: c.body });
   const pick = (next) => setPop(pop === next ? null : next);
-  const swatches = (list, current, set, none) => /* @__PURE__ */ jsxs2("span", { className: "w100n-text-pop w100n-text-swatches", role: "group", children: [
-    /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-text-none", onClick: () => {
+  const swatches = (list, current, set, none) => /* @__PURE__ */ jsxs3("span", { className: "w100n-text-pop w100n-text-swatches", role: "group", children: [
+    /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-text-none", onClick: () => {
       set(null);
       setPop(null);
     }, children: none }),
-    list.map((c, i) => /* @__PURE__ */ jsx2("button", { type: "button", "aria-label": c, "aria-pressed": current === c, onClick: () => {
+    list.map((c, i) => /* @__PURE__ */ jsx3("button", { type: "button", "aria-label": c, "aria-pressed": current === c, onClick: () => {
       set(c);
       setPop(null);
-    }, children: /* @__PURE__ */ jsx2("i", { style: { background: c } }) }, i))
+    }, children: /* @__PURE__ */ jsx3("i", { style: { background: c } }) }, i))
   ] });
   const mod = /Mac|iPhone|iPad/.test(navigator.platform) ? "\u2318" : "Ctrl+";
   const item = (label, run, more2 = {}) => ({ label, run, ...more2 });
@@ -769,9 +862,10 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
         item(t.print, print, { keys: `${mod}P` }),
         ...docx ? ["-", item(t.pageSetup, () => setDraft2({ width: page.width, height: page.height, margins: page.margins.map(cm), ...marginal }))] : []
       ] : [],
-      ...can.edit && (file?.formats.length || file?.copy || file?.rename) ? ["-"] : [],
+      ...can.edit && (file?.formats.length || file?.copy || file?.rename || file?.template) ? ["-"] : [],
       ...(file?.formats ?? []).map((f) => item(`${t.downloadAs} ${f === "md" ? "Markdown" : f.toUpperCase()}`, () => file.download(f))),
       !!file?.copy && item(t.makeCopy, file.copy),
+      !!file?.template && item(t.saveTemplate, file.template),
       !!file?.rename && item(t.rename, file.rename)
     ]],
     ["edit", t.menuEdit, can.edit ? [
@@ -783,9 +877,13 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
       item(t.clearFormat, () => clear(editor), { keys: `${mod}\\` })
     ] : []],
     ["view", t.viewTab, [
+      docx && item(t.printLayout, () => {
+        setPrinted(flow);
+        setZoom(null);
+      }, { on: !flow }),
       item(t.zoomIn, () => zoomBy(10)),
       item(t.zoomOut, () => zoomBy(-10)),
-      docx && item(t.fitWidth, () => setZoom(null), { on: zoom === null }),
+      docx && !flow && item(t.fitWidth, () => setZoom(null), { on: zoom === null }),
       item(t.fit, () => setZoom(100)),
       "-",
       item(t.outline, () => onPanel?.("outline")),
@@ -807,8 +905,8 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
       can.comment && item(t.addComment, begin, { off: state.empty, keys: `${mod}\u2325M` }),
       "-",
       item(t.symbols, () => setDialog({ kind: "symbol", query: "" })),
-      docx && item(t.formula, () => setDialog({ kind: "formula", latex: "", at: null })),
-      docx && item(t.footnote, () => setDialog({ kind: "note", text: "", at: null }))
+      item(t.formula, () => setDialog({ kind: "formula", latex: "", at: null })),
+      item(t.footnote, () => setDialog({ kind: "note", text: "", at: null }))
     ] : []],
     ["format", t.menuFormat, can.edit ? [
       ...styles.map(([key, label, run]) => item(label, run, { on: state.style === key })),
@@ -819,12 +917,9 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
       item(t.strike, () => editor.chain().focus().toggleStrike().run(), { on: state.strike }),
       docx && item(t.superscript, () => editor.chain().focus().toggleMark("superscript").run(), { on: state.sup, keys: `${mod}.` }),
       docx && item(t.subscript, () => editor.chain().focus().toggleMark("subscript").run(), { on: state.sub, keys: `${mod},` }),
-      ...docx ? [
-        "-",
-        ...aligns.map(([, label, value]) => item(label, () => align(editor, value), { on: state.align === value })),
-        "-",
-        ...lines.map(([v, label]) => item(`${t.lineSpacing}: ${label}`, () => spacing(editor, { line: v }), { on: state.line === v }))
-      ] : [],
+      "-",
+      ...aligns.map(([, label, value]) => item(label, () => align(editor, value), { on: state.align === value })),
+      ...docx ? ["-", ...lines.map(([v, label]) => item(`${t.lineSpacing}: ${label}`, () => spacing(editor, { line: v }), { on: state.line === v }))] : [],
       "-",
       item(t.bullets, () => editor.chain().focus().toggleBulletList().run(), { on: state.bullets }),
       item(t.numbers, () => editor.chain().focus().toggleOrderedList().run(), { on: state.numbers }),
@@ -837,19 +932,55 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
       docx && can.edit && item(t.suggest, suggest, { on: state.suggest }),
       docx && can.edit && state.revs.length > 0 && item(t.acceptAll, () => decide(editor, true)),
       docx && can.edit && state.revs.length > 0 && item(t.rejectAll, () => decide(editor, false)),
-      !!host?.comments && (can.comment || open.length > 0) && item(t.comments, () => onPanel?.("comments"))
+      !!host?.comments && (can.comment || open.length > 0) && item(t.comments, () => onPanel?.("comments")),
+      can.edit && item(t.spellCheck, () => {
+        editor.view.dom.spellcheck = !spell;
+        localStorage.setItem("w100n-docs-spell", spell ? "0" : "1");
+        setSpell(!spell);
+      }, { on: spell })
     ]]
   ];
-  const menu = ([key, label, list]) => /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-    /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-text-menu-button", "data-pop": true, "aria-haspopup": "menu", "aria-expanded": pop === key, onClick: () => pick(key), children: label }),
-    pop === key && /* @__PURE__ */ jsx2("span", { className: "w100n-text-pop w100n-text-menu", role: "menu", "aria-label": label, children: list.filter((x) => x !== false).map((x, i) => x === "-" ? /* @__PURE__ */ jsx2("hr", {}, i) : /* @__PURE__ */ jsxs2("button", { type: "button", role: x.on === void 0 ? "menuitem" : "menuitemcheckbox", "aria-checked": x.on, disabled: x.off, onClick: () => {
-      setPop(null);
-      x.run();
-    }, children: [
-      /* @__PURE__ */ jsx2(Check, { "aria-hidden": true }),
-      /* @__PURE__ */ jsx2("span", { children: x.label }),
-      x.keys && /* @__PURE__ */ jsx2("kbd", { children: x.keys })
-    ] }, i)) })
+  const clip = (kind2) => {
+    editor.view.focus();
+    document.execCommand(kind2);
+  };
+  const paste = async () => {
+    const found2 = await navigator.clipboard.read().catch(() => []);
+    const html = found2.find((c) => c.types.includes("text/html"));
+    if (html) return editor.view.pasteHTML(await (await html.getType("text/html")).text());
+    const plain = found2.find((c) => c.types.includes("text/plain"));
+    if (plain) editor.view.pasteText(await (await plain.getType("text/plain")).text());
+  };
+  const table = editor.isActive("table");
+  const near = [
+    can.edit && item(t.cut, () => clip("cut"), { off: state.empty, keys: `${mod}X` }),
+    item(t.copy, () => clip("copy"), { off: state.empty, keys: `${mod}C` }),
+    can.edit && !!navigator.clipboard?.read && item(t.paste, () => void paste(), { keys: `${mod}V` }),
+    "-",
+    can.comment && item(t.addComment, begin, { off: state.empty, keys: `${mod}\u2325M` }),
+    can.edit && item(t.link, linkUp, { keys: `${mod}K` }),
+    can.edit && item(t.clearFormat, () => clear(editor), { keys: `${mod}\\` }),
+    ...can.edit && table ? [
+      "-",
+      item(t.rowAbove, () => editor.chain().focus().addRowBefore().run()),
+      item(t.rowBelow, () => editor.chain().focus().addRowAfter().run()),
+      item(t.columnLeft, () => editor.chain().focus().addColumnBefore().run()),
+      item(t.columnRight, () => editor.chain().focus().addColumnAfter().run()),
+      item(t.deleteRow, () => editor.chain().focus().deleteRow().run()),
+      item(t.deleteColumn, () => editor.chain().focus().deleteColumn().run())
+    ] : []
+  ];
+  const rows = (list) => list.filter((x) => x !== false).filter((x, i, all2) => x !== "-" || i > 0 && all2[i - 1] !== "-" && i < all2.length - 1).map((x, i) => x === "-" ? /* @__PURE__ */ jsx3("hr", {}, i) : /* @__PURE__ */ jsxs3("button", { type: "button", role: x.on === void 0 ? "menuitem" : "menuitemcheckbox", "aria-checked": x.on, disabled: x.off, onClick: () => {
+    setPop(null);
+    x.run();
+  }, children: [
+    /* @__PURE__ */ jsx3(Check, { "aria-hidden": true }),
+    /* @__PURE__ */ jsx3("span", { children: x.label }),
+    x.keys && /* @__PURE__ */ jsx3("kbd", { children: x.keys })
+  ] }, i));
+  const menu = ([key, label, list]) => /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+    /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-text-menu-button", "data-pop": true, "aria-haspopup": "menu", "aria-expanded": pop === key, onClick: () => pick(key), children: label }),
+    pop === key && /* @__PURE__ */ jsx3("span", { className: "w100n-text-pop w100n-text-menu", role: "menu", "aria-label": label, children: rows(list) })
   ] }, key);
   const seek = (next) => {
     editor.view.dispatch(editor.state.tr.setMeta(searching, next));
@@ -861,11 +992,11 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     }
   };
   const found = searching.getState(editor.state);
-  const finder = /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-    /* @__PURE__ */ jsx2("button", { type: "button", "data-pop": true, "aria-expanded": pop === "find", "aria-label": t.findReplace, title: t.findReplace, onClick: () => pick("find"), children: /* @__PURE__ */ jsx2(Search, { "aria-hidden": true }) }),
-    pop === "find" && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-pop w100n-text-find", role: "search", "aria-label": t.findReplace, children: [
-      /* @__PURE__ */ jsxs2("span", { className: "w100n-docs-row", children: [
-        /* @__PURE__ */ jsx2(
+  const finder = /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+    /* @__PURE__ */ jsx3("button", { type: "button", "data-pop": true, "aria-expanded": pop === "find", "aria-label": t.findReplace, title: t.findReplace, onClick: () => pick("find"), children: /* @__PURE__ */ jsx3(Search, { "aria-hidden": true }) }),
+    pop === "find" && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-pop w100n-text-find", role: "search", "aria-label": t.findReplace, children: [
+      /* @__PURE__ */ jsxs3("span", { className: "w100n-docs-row", children: [
+        /* @__PURE__ */ jsx3(
           "input",
           {
             autoFocus: true,
@@ -885,23 +1016,23 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
             }
           }
         ),
-        /* @__PURE__ */ jsx2("small", { "aria-live": "polite", children: query ? found?.hits.length ? `${(found.at ?? 0) + 1} / ${found.hits.length}` : t.noHits : "" }),
-        /* @__PURE__ */ jsx2("button", { type: "button", "aria-label": t.previous, title: t.previous, disabled: !found?.hits.length, onClick: () => seek({ at: found.at - 1 }), children: /* @__PURE__ */ jsx2(ChevronUp, { "aria-hidden": true }) }),
-        /* @__PURE__ */ jsx2("button", { type: "button", "aria-label": t.next, title: t.next, disabled: !found?.hits.length, onClick: () => seek({ at: found.at + 1 }), children: /* @__PURE__ */ jsx2(ChevronDown, { "aria-hidden": true }) })
+        /* @__PURE__ */ jsx3("small", { "aria-live": "polite", children: query ? found?.hits.length ? `${(found.at ?? 0) + 1} / ${found.hits.length}` : t.noHits : "" }),
+        /* @__PURE__ */ jsx3("button", { type: "button", "aria-label": t.previous, title: t.previous, disabled: !found?.hits.length, onClick: () => seek({ at: found.at - 1 }), children: /* @__PURE__ */ jsx3(ChevronUp, { "aria-hidden": true }) }),
+        /* @__PURE__ */ jsx3("button", { type: "button", "aria-label": t.next, title: t.next, disabled: !found?.hits.length, onClick: () => seek({ at: found.at + 1 }), children: /* @__PURE__ */ jsx3(ChevronDown, { "aria-hidden": true }) })
       ] }),
-      can.edit && /* @__PURE__ */ jsxs2("span", { className: "w100n-docs-row", children: [
-        /* @__PURE__ */ jsx2("input", { value: swap, placeholder: t.replaceWith, "aria-label": t.replaceWith, onChange: (e) => setSwap(e.target.value) }),
-        /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-pdf-link", disabled: !found?.hits.length, onClick: () => {
+      can.edit && /* @__PURE__ */ jsxs3("span", { className: "w100n-docs-row", children: [
+        /* @__PURE__ */ jsx3("input", { value: swap, placeholder: t.replaceWith, "aria-label": t.replaceWith, onChange: (e) => setSwap(e.target.value) }),
+        /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-pdf-link", disabled: !found?.hits.length, onClick: () => {
           replace(editor, swap, false);
           seek({});
         }, children: t.replaceOne }),
-        /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-docs-action", disabled: !found?.hits.length, onClick: () => {
+        /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-docs-action", disabled: !found?.hits.length, onClick: () => {
           replace(editor, swap, true);
           seek({});
         }, children: t.replaceAll })
       ] }),
-      /* @__PURE__ */ jsxs2("label", { className: "w100n-setup-check", children: [
-        /* @__PURE__ */ jsx2("input", { type: "checkbox", checked: matchCase, onChange: (e) => {
+      /* @__PURE__ */ jsxs3("label", { className: "w100n-setup-check", children: [
+        /* @__PURE__ */ jsx3("input", { type: "checkbox", checked: matchCase, onChange: (e) => {
           setMatchCase(e.target.checked);
           seek({ matchCase: e.target.checked, at: 0 });
         } }),
@@ -926,47 +1057,47 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     spacing(editor, { line: paint.block.line, after: paint.block.after });
     if (!paint.keep) setPaint(null);
   };
-  const fontPicker = /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-    /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-text-picker", "data-size": "mid", "data-pop": true, "aria-haspopup": "listbox", "aria-expanded": pop === "font", "aria-label": t.font, title: t.font, onClick: () => pick("font"), children: [
-      /* @__PURE__ */ jsx2("span", { style: { fontFamily: state.font ?? void 0 }, children: state.font ?? t.defaultFont }),
-      /* @__PURE__ */ jsx2(ChevronDown, { "aria-hidden": true })
+  const fontPicker = /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+    /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-text-picker", "data-size": "mid", "data-pop": true, "aria-haspopup": "listbox", "aria-expanded": pop === "font", "aria-label": t.font, title: t.font, onClick: () => pick("font"), children: [
+      /* @__PURE__ */ jsx3("span", { style: { fontFamily: state.font ?? void 0 }, children: state.font ?? t.defaultFont }),
+      /* @__PURE__ */ jsx3(ChevronDown, { "aria-hidden": true })
     ] }),
-    pop === "font" && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-pop w100n-text-styles", role: "listbox", "aria-label": t.font, children: [
-      /* @__PURE__ */ jsx2("button", { type: "button", role: "option", "aria-selected": !state.font, onClick: () => {
+    pop === "font" && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-pop w100n-text-styles", role: "listbox", "aria-label": t.font, children: [
+      /* @__PURE__ */ jsx3("button", { type: "button", role: "option", "aria-selected": !state.font, onClick: () => {
         editor.chain().focus().unsetFontFamily().run();
         setPop(null);
       }, children: t.defaultFont }),
-      faces.map((f) => /* @__PURE__ */ jsx2("button", { type: "button", role: "option", "aria-selected": state.font === f, style: { fontFamily: f }, onClick: () => {
+      faces.map((f) => /* @__PURE__ */ jsx3("button", { type: "button", role: "option", "aria-selected": state.font === f, style: { fontFamily: f }, onClick: () => {
         editor.chain().focus().setFontFamily(f).run();
         setPop(null);
       }, children: f }, f))
     ] })
   ] });
-  const sizePicker = /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-    /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-text-picker", "data-size": "small", "data-pop": true, "aria-haspopup": "listbox", "aria-expanded": pop === "size", "aria-label": t.fontSize, title: t.fontSize, onClick: () => pick("size"), children: [
+  const sizePicker = /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+    /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-text-picker", "data-size": "small", "data-pop": true, "aria-haspopup": "listbox", "aria-expanded": pop === "size", "aria-label": t.fontSize, title: t.fontSize, onClick: () => pick("size"), children: [
       state.size ? parseFloat(state.size) : t.defaultFont,
-      /* @__PURE__ */ jsx2(ChevronDown, { "aria-hidden": true })
+      /* @__PURE__ */ jsx3(ChevronDown, { "aria-hidden": true })
     ] }),
-    pop === "size" && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-pop w100n-text-styles", role: "listbox", "aria-label": t.fontSize, children: [
-      /* @__PURE__ */ jsx2("button", { type: "button", role: "option", "aria-selected": !state.size, onClick: () => {
+    pop === "size" && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-pop w100n-text-styles", role: "listbox", "aria-label": t.fontSize, children: [
+      /* @__PURE__ */ jsx3("button", { type: "button", role: "option", "aria-selected": !state.size, onClick: () => {
         editor.chain().focus().unsetFontSize().run();
         setPop(null);
       }, children: t.defaultFont }),
-      sizes.map((n) => /* @__PURE__ */ jsx2("button", { type: "button", role: "option", "aria-selected": state.size !== null && parseFloat(state.size) === n, onClick: () => {
+      sizes.map((n) => /* @__PURE__ */ jsx3("button", { type: "button", role: "option", "aria-selected": state.size !== null && parseFloat(state.size) === n, onClick: () => {
         editor.chain().focus().setFontSize(`${n}pt`).run();
         setPop(null);
       }, children: n }, n))
     ] })
   ] });
-  const spacer = /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-    /* @__PURE__ */ jsx2("button", { type: "button", "data-pop": true, "aria-expanded": pop === "spacing", "aria-label": t.lineSpacing, title: t.lineSpacing, onClick: () => pick("spacing"), children: /* @__PURE__ */ jsx2(UnfoldVertical, { "aria-hidden": true }) }),
-    pop === "spacing" && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-pop w100n-text-styles", role: "listbox", "aria-label": t.lineSpacing, children: [
-      lines.map(([v, label]) => /* @__PURE__ */ jsx2("button", { type: "button", role: "option", "aria-selected": state.line === v, onClick: () => {
+  const spacer = /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+    /* @__PURE__ */ jsx3("button", { type: "button", "data-pop": true, "aria-expanded": pop === "spacing", "aria-label": t.lineSpacing, title: t.lineSpacing, onClick: () => pick("spacing"), children: /* @__PURE__ */ jsx3(UnfoldVertical, { "aria-hidden": true }) }),
+    pop === "spacing" && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-pop w100n-text-styles", role: "listbox", "aria-label": t.lineSpacing, children: [
+      lines.map(([v, label]) => /* @__PURE__ */ jsx3("button", { type: "button", role: "option", "aria-selected": state.line === v, onClick: () => {
         spacing(editor, { line: v });
         setPop(null);
       }, children: label }, v)),
-      /* @__PURE__ */ jsx2("hr", {}),
-      /* @__PURE__ */ jsx2("button", { type: "button", role: "option", "aria-selected": false, onClick: () => {
+      /* @__PURE__ */ jsx3("hr", {}),
+      /* @__PURE__ */ jsx3("button", { type: "button", role: "option", "aria-selected": false, onClick: () => {
         spacing(editor, { after: state.after === 0 ? 8 : 0 });
         setPop(null);
       }, children: state.after === 0 ? t.spaceAfter : t.noSpaceAfter })
@@ -989,18 +1120,18 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     setDraft2(null);
   };
   const zooms = [50, 75, 90, 100, 125, 150, 200];
-  const zoomer = /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-    /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-text-picker", "data-size": "small", "data-pop": true, "aria-haspopup": "listbox", "aria-expanded": pop === "zoom", "aria-label": t.zoom, title: t.zoom, onClick: () => pick("zoom"), children: [
+  const zoomer = /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+    /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-text-picker", "data-size": "small", "data-pop": true, "aria-haspopup": "listbox", "aria-expanded": pop === "zoom", "aria-label": t.zoom, title: t.zoom, onClick: () => pick("zoom"), children: [
       percent,
       "%",
-      /* @__PURE__ */ jsx2(ChevronDown, { "aria-hidden": true })
+      /* @__PURE__ */ jsx3(ChevronDown, { "aria-hidden": true })
     ] }),
-    pop === "zoom" && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-pop w100n-text-styles", role: "listbox", "aria-label": t.zoom, children: [
-      docx && /* @__PURE__ */ jsx2("button", { type: "button", role: "option", "aria-selected": zoom === null, onClick: () => {
+    pop === "zoom" && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-pop w100n-text-styles", role: "listbox", "aria-label": t.zoom, children: [
+      docx && /* @__PURE__ */ jsx3("button", { type: "button", role: "option", "aria-selected": zoom === null, onClick: () => {
         setZoom(null);
         setPop(null);
       }, children: t.fitWidth }),
-      zooms.map((z) => /* @__PURE__ */ jsxs2("button", { type: "button", role: "option", "aria-selected": zoom === z, onClick: () => {
+      zooms.map((z) => /* @__PURE__ */ jsxs3("button", { type: "button", role: "option", "aria-selected": zoom === z, onClick: () => {
         setZoom(z);
         setPop(null);
       }, children: [
@@ -1010,9 +1141,9 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     ] })
   ] });
   const Aligned = aligns.find(([, , value]) => value === state.align)?.[0] ?? AlignLeft;
-  const aligner = /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-    /* @__PURE__ */ jsx2("button", { type: "button", "data-pop": true, "aria-expanded": pop === "align", "aria-label": t.align, title: t.align, onClick: () => pick("align"), children: /* @__PURE__ */ jsx2(Aligned, { "aria-hidden": true }) }),
-    pop === "align" && /* @__PURE__ */ jsx2("span", { className: "w100n-text-pop", role: "group", "aria-label": t.align, children: /* @__PURE__ */ jsx2("span", { className: "w100n-text-tools", children: aligns.map(([icon, label, value], i) => /* @__PURE__ */ jsx2(Fragment2, { children: tool(icon, label, () => {
+  const aligner = /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+    /* @__PURE__ */ jsx3("button", { type: "button", "data-pop": true, "aria-expanded": pop === "align", "aria-label": t.align, title: t.align, onClick: () => pick("align"), children: /* @__PURE__ */ jsx3(Aligned, { "aria-hidden": true }) }),
+    pop === "align" && /* @__PURE__ */ jsx3("span", { className: "w100n-text-pop", role: "group", "aria-label": t.align, children: /* @__PURE__ */ jsx3("span", { className: "w100n-text-tools", children: aligns.map(([icon, label, value], i) => /* @__PURE__ */ jsx3(Fragment2, { children: tool(icon, label, () => {
       align(editor, value);
       setPop(null);
     }, state.align === value) }, i)) }) })
@@ -1021,13 +1152,13 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     localStorage.setItem("w100n-docs-more", more ? "" : "1");
     setMore(!more);
   };
-  const main = can.edit ? /* @__PURE__ */ jsxs2(Fragment3, { children: [
-    /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-      /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-text-picker", "data-size": "mid", "data-pop": true, "aria-haspopup": "listbox", "aria-expanded": pop === "style", "aria-label": t.paragraphStyle, title: t.paragraphStyle, onClick: () => pick("style"), children: [
+  const main = can.edit ? /* @__PURE__ */ jsxs3(Fragment3, { children: [
+    /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+      /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-text-picker", "data-size": "mid", "data-pop": true, "aria-haspopup": "listbox", "aria-expanded": pop === "style", "aria-label": t.paragraphStyle, title: t.paragraphStyle, onClick: () => pick("style"), children: [
         styles.find(([key]) => key === state.style)?.[1] ?? t.normal,
-        /* @__PURE__ */ jsx2(ChevronDown, { "aria-hidden": true })
+        /* @__PURE__ */ jsx3(ChevronDown, { "aria-hidden": true })
       ] }),
-      pop === "style" && /* @__PURE__ */ jsx2("span", { className: "w100n-text-pop w100n-text-styles", role: "listbox", "aria-label": t.paragraphStyle, children: styles.map(([key, label, run]) => /* @__PURE__ */ jsx2(
+      pop === "style" && /* @__PURE__ */ jsx3("span", { className: "w100n-text-pop w100n-text-styles", role: "listbox", "aria-label": t.paragraphStyle, children: styles.map(([key, label, run]) => /* @__PURE__ */ jsx3(
         "button",
         {
           type: "button",
@@ -1048,48 +1179,48 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     tool(Italic, t.italic, () => editor.chain().focus().toggleItalic().run(), state.italic),
     docx ? tool(Underline, t.underline, () => editor.chain().focus().toggleUnderline().run(), state.underline) : tool(Strikethrough, t.strike, () => editor.chain().focus().toggleStrike().run(), state.strike),
     !docx && tool(Code, t.code, () => editor.chain().focus().toggleCode().run(), state.code),
-    docx && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-      /* @__PURE__ */ jsxs2("button", { type: "button", "data-pop": true, "aria-expanded": pop === "color", "aria-label": t.textColour, title: t.textColour, onClick: () => pick("color"), children: [
-        /* @__PURE__ */ jsx2(Baseline, { "aria-hidden": true }),
-        /* @__PURE__ */ jsx2("i", { className: "w100n-text-bar", style: { background: state.color ?? "currentColor" } })
+    docx && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+      /* @__PURE__ */ jsxs3("button", { type: "button", "data-pop": true, "aria-expanded": pop === "color", "aria-label": t.textColour, title: t.textColour, onClick: () => pick("color"), children: [
+        /* @__PURE__ */ jsx3(Baseline, { "aria-hidden": true }),
+        /* @__PURE__ */ jsx3("i", { className: "w100n-text-bar", style: { background: state.color ?? "currentColor" } })
       ] }),
       pop === "color" && swatches(inks, state.color, (c) => c ? editor.chain().focus().setColor(c).run() : editor.chain().focus().unsetColor().run(), t.automatic)
     ] }),
     gap,
-    docx && aligner,
+    aligner,
     tool(List, t.bullets, () => editor.chain().focus().toggleBulletList().run(), state.bullets),
     tool(ListOrdered, t.numbers, () => editor.chain().focus().toggleOrderedList().run(), state.numbers),
     !docx && tool(ListChecks, t.tasks, () => editor.chain().focus().toggleTaskList().run(), state.tasks),
     gap,
-    /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-      /* @__PURE__ */ jsx2("button", { type: "button", "data-pop": true, "aria-expanded": pop === "link", "aria-pressed": state.link, "aria-label": t.link, title: t.link, onClick: () => pop === "link" ? setPop(null) : linkUp(), children: /* @__PURE__ */ jsx2(Link, { "aria-hidden": true }) }),
-      pop === "link" && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-pop w100n-text-form", children: [
-        /* @__PURE__ */ jsx2("input", { autoFocus: true, value: href, placeholder: t.linkAddress, "aria-label": t.linkAddress, onChange: (e) => setHref(e.target.value), onKeyDown: (e) => {
+    /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+      /* @__PURE__ */ jsx3("button", { type: "button", "data-pop": true, "aria-expanded": pop === "link", "aria-pressed": state.link, "aria-label": t.link, title: t.link, onClick: () => pop === "link" ? setPop(null) : linkUp(), children: /* @__PURE__ */ jsx3(Link, { "aria-hidden": true }) }),
+      pop === "link" && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-pop w100n-text-form", children: [
+        /* @__PURE__ */ jsx3("input", { autoFocus: true, value: href, placeholder: t.linkAddress, "aria-label": t.linkAddress, onChange: (e) => setHref(e.target.value), onKeyDown: (e) => {
           if (e.key === "Enter") putLink();
         } }),
-        /* @__PURE__ */ jsxs2("span", { className: "w100n-docs-row", children: [
-          state.link && /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-pdf-link", onClick: () => {
+        /* @__PURE__ */ jsxs3("span", { className: "w100n-docs-row", children: [
+          state.link && /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-pdf-link", onClick: () => {
             editor.chain().focus().extendMarkRange("link").unsetLink().run();
             setPop(null);
           }, children: [
-            /* @__PURE__ */ jsx2(Link2Off, { "aria-hidden": true }),
+            /* @__PURE__ */ jsx3(Link2Off, { "aria-hidden": true }),
             t.unlink
           ] }),
-          /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", disabled: !href.trim(), onClick: putLink, children: [
-            /* @__PURE__ */ jsx2(Link, { "aria-hidden": true }),
+          /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", disabled: !href.trim(), onClick: putLink, children: [
+            /* @__PURE__ */ jsx3(Link, { "aria-hidden": true }),
             t.apply
           ] })
         ] })
       ] })
     ] }),
     can.comment && tool(MessageSquarePlus, t.addComment, begin, void 0, state.empty),
-    /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-      /* @__PURE__ */ jsx2("button", { type: "button", "data-pop": true, "aria-expanded": pop === "image", "aria-label": t.image, title: t.image, onClick: () => {
+    /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+      /* @__PURE__ */ jsx3("button", { type: "button", "data-pop": true, "aria-expanded": pop === "image", "aria-label": t.image, title: t.image, onClick: () => {
         setHref("");
         pick("image");
-      }, children: /* @__PURE__ */ jsx2(ImagePlus, { "aria-hidden": true }) }),
-      pop === "image" && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-pop w100n-text-form", children: [
-        /* @__PURE__ */ jsx2(
+      }, children: /* @__PURE__ */ jsx3(ImagePlus, { "aria-hidden": true }) }),
+      pop === "image" && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-pop w100n-text-form", children: [
+        /* @__PURE__ */ jsx3(
           "input",
           {
             autoFocus: true,
@@ -1105,10 +1236,10 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
             }
           }
         ),
-        /* @__PURE__ */ jsxs2("span", { className: "w100n-docs-row", children: [
-          docx && /* @__PURE__ */ jsxs2("label", { className: "w100n-pdf-link", children: [
+        /* @__PURE__ */ jsxs3("span", { className: "w100n-docs-row", children: [
+          docx && /* @__PURE__ */ jsxs3("label", { className: "w100n-pdf-link", children: [
             t.chooseFile,
-            /* @__PURE__ */ jsx2("input", { type: "file", accept: "image/png,image/jpeg,image/gif", hidden: true, onChange: (e) => {
+            /* @__PURE__ */ jsx3("input", { type: "file", accept: "image/png,image/jpeg,image/gif", hidden: true, onChange: (e) => {
               const file2 = e.target.files?.[0];
               if (!file2) return;
               const reader = new FileReader();
@@ -1119,62 +1250,62 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
               reader.readAsDataURL(file2);
             } })
           ] }),
-          /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", disabled: !href.trim(), onClick: () => {
+          /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", disabled: !href.trim(), onClick: () => {
             editor.chain().focus().setImage({ src: href.trim() }).run();
             setPop(null);
           }, children: [
-            /* @__PURE__ */ jsx2(ImagePlus, { "aria-hidden": true }),
+            /* @__PURE__ */ jsx3(ImagePlus, { "aria-hidden": true }),
             t.put
           ] })
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-      /* @__PURE__ */ jsx2("button", { type: "button", "data-pop": true, "aria-expanded": pop === "table", "aria-label": t.table, title: t.table, onClick: () => pick("table"), children: /* @__PURE__ */ jsx2(Table, { "aria-hidden": true }) }),
-      pop === "table" && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-pop w100n-text-grid", role: "group", "aria-label": t.table, onPointerLeave: () => setGrid({ rows: 0, cols: 0 }), children: [
-        /* @__PURE__ */ jsx2("span", { children: Array.from({ length: 48 }, (_, i) => {
-          const rows = Math.floor(i / 8) + 1;
+    /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+      /* @__PURE__ */ jsx3("button", { type: "button", "data-pop": true, "aria-expanded": pop === "table", "aria-label": t.table, title: t.table, onClick: () => pick("table"), children: /* @__PURE__ */ jsx3(Table, { "aria-hidden": true }) }),
+      pop === "table" && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-pop w100n-text-grid", role: "group", "aria-label": t.table, onPointerLeave: () => setGrid({ rows: 0, cols: 0 }), children: [
+        /* @__PURE__ */ jsx3("span", { children: Array.from({ length: 48 }, (_, i) => {
+          const rows2 = Math.floor(i / 8) + 1;
           const cols = i % 8 + 1;
-          return /* @__PURE__ */ jsx2(
+          return /* @__PURE__ */ jsx3(
             "button",
             {
               type: "button",
-              "aria-label": `${rows} \xD7 ${cols}`,
-              "data-on": rows <= grid.rows && cols <= grid.cols,
-              onPointerEnter: () => setGrid({ rows, cols }),
+              "aria-label": `${rows2} \xD7 ${cols}`,
+              "data-on": rows2 <= grid.rows && cols <= grid.cols,
+              onPointerEnter: () => setGrid({ rows: rows2, cols }),
               onClick: () => {
-                editor.chain().focus().insertTable({ rows, cols, withHeaderRow: true }).run();
+                editor.chain().focus().insertTable({ rows: rows2, cols, withHeaderRow: true }).run();
                 setPop(null);
               }
             },
             i
           );
         }) }),
-        /* @__PURE__ */ jsx2("small", { children: grid.rows ? `${grid.rows} \xD7 ${grid.cols}` : t.table })
+        /* @__PURE__ */ jsx3("small", { children: grid.rows ? `${grid.rows} \xD7 ${grid.cols}` : t.table })
       ] })
     ] }),
     gap,
-    /* @__PURE__ */ jsx2("button", { type: "button", "aria-expanded": more, "aria-label": more ? t.fewerTools : t.moreTools, title: more ? t.fewerTools : t.moreTools, onClick: widen, children: more ? /* @__PURE__ */ jsx2(ChevronDown, { "aria-hidden": true }) : /* @__PURE__ */ jsx2(ChevronUp, { "aria-hidden": true }) })
-  ] }) : /* @__PURE__ */ jsxs2(Fragment3, { children: [
-    /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-text-word", onClick: () => onPanel?.("outline"), children: [
-      /* @__PURE__ */ jsx2(ListTree, { "aria-hidden": true }),
+    /* @__PURE__ */ jsx3("button", { type: "button", "aria-expanded": more, "aria-label": more ? t.fewerTools : t.moreTools, title: more ? t.fewerTools : t.moreTools, onClick: widen, children: more ? /* @__PURE__ */ jsx3(ChevronDown, { "aria-hidden": true }) : /* @__PURE__ */ jsx3(ChevronUp, { "aria-hidden": true }) })
+  ] }) : /* @__PURE__ */ jsxs3(Fragment3, { children: [
+    /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-text-word", onClick: () => onPanel?.("outline"), children: [
+      /* @__PURE__ */ jsx3(ListTree, { "aria-hidden": true }),
       t.outline
     ] }),
-    can.comment && /* @__PURE__ */ jsxs2(Fragment3, { children: [
-      /* @__PURE__ */ jsx2("span", { className: "w100n-text-grow" }),
-      /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", disabled: state.empty, onClick: begin, children: [
-        /* @__PURE__ */ jsx2(MessageSquarePlus, { "aria-hidden": true }),
+    can.comment && /* @__PURE__ */ jsxs3(Fragment3, { children: [
+      /* @__PURE__ */ jsx3("span", { className: "w100n-text-grow" }),
+      /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", disabled: state.empty, onClick: begin, children: [
+        /* @__PURE__ */ jsx3(MessageSquarePlus, { "aria-hidden": true }),
         t.addComment
       ] })
     ] }),
-    !!host?.comments && (can.comment || open.length > 0) && /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-text-word", onClick: () => onPanel?.("comments"), children: [
-      /* @__PURE__ */ jsx2(MessagesSquare, { "aria-hidden": true }),
+    !!host?.comments && (can.comment || open.length > 0) && /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-text-word", onClick: () => onPanel?.("comments"), children: [
+      /* @__PURE__ */ jsx3(MessagesSquare, { "aria-hidden": true }),
       t.comments,
-      /* @__PURE__ */ jsx2("b", { children: open.length })
+      /* @__PURE__ */ jsx3("b", { children: open.length })
     ] })
   ] });
-  const extra = can.edit && more && /* @__PURE__ */ jsxs2(Fragment3, { children: [
-    docx && /* @__PURE__ */ jsxs2(Fragment3, { children: [
+  const extra = can.edit && more && /* @__PURE__ */ jsxs3(Fragment3, { children: [
+    docx && /* @__PURE__ */ jsxs3(Fragment3, { children: [
       fontPicker,
       sizePicker,
       gap
@@ -1182,11 +1313,11 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     docx && tool(Strikethrough, t.strike, () => editor.chain().focus().toggleStrike().run(), state.strike),
     docx && tool(Superscript, t.superscript, () => editor.chain().focus().toggleMark("superscript").run(), state.sup),
     docx && tool(Subscript, t.subscript, () => editor.chain().focus().toggleMark("subscript").run(), state.sub),
-    docx && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-      /* @__PURE__ */ jsx2("button", { type: "button", "data-pop": true, "aria-expanded": pop === "mark", "aria-pressed": state.glow, "aria-label": t.highlight, title: t.highlight, onClick: () => pick("mark"), children: /* @__PURE__ */ jsx2(Highlighter, { "aria-hidden": true }) }),
+    docx && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+      /* @__PURE__ */ jsx3("button", { type: "button", "data-pop": true, "aria-expanded": pop === "mark", "aria-pressed": state.glow, "aria-label": t.highlight, title: t.highlight, onClick: () => pick("mark"), children: /* @__PURE__ */ jsx3(Highlighter, { "aria-hidden": true }) }),
       pop === "mark" && swatches(glows, null, (c) => c ? editor.chain().focus().setHighlight({ color: c }).run() : editor.chain().focus().unsetHighlight().run(), t.noColour)
     ] }),
-    docx && /* @__PURE__ */ jsxs2(Fragment3, { children: [
+    docx && /* @__PURE__ */ jsxs3(Fragment3, { children: [
       gap,
       spacer
     ] }),
@@ -1194,24 +1325,24 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     tool(ListIndentIncrease, t.indent, () => indent(editor, 1)),
     docx && tool(ListChecks, t.tasks, () => editor.chain().focus().toggleTaskList().run(), state.tasks),
     gap,
-    /* @__PURE__ */ jsx2("button", { type: "button", "aria-label": t.painter, title: paint ? t.painterHint : t.painter, "aria-pressed": !!paint, onClick: () => take(false), onDoubleClick: () => take(true), children: /* @__PURE__ */ jsx2(PaintRoller, { "aria-hidden": true }) }),
+    /* @__PURE__ */ jsx3("button", { type: "button", "aria-label": t.painter, title: paint ? t.painterHint : t.painter, "aria-pressed": !!paint, onClick: () => take(false), onDoubleClick: () => take(true), children: /* @__PURE__ */ jsx3(PaintRoller, { "aria-hidden": true }) }),
     tool(RemoveFormatting, t.clearFormat, () => clear(editor)),
-    docx && /* @__PURE__ */ jsxs2(Fragment3, { children: [
+    docx && /* @__PURE__ */ jsxs3(Fragment3, { children: [
       gap,
       tool(FilePenLine, t.suggest, suggest, state.suggest)
     ] })
   ] });
-  const context = can.edit && (state.table ? /* @__PURE__ */ jsxs2(Fragment3, { children: [
+  const context = can.edit && (state.table ? /* @__PURE__ */ jsxs3(Fragment3, { children: [
     tool(BetweenHorizontalStart, t.rowAbove, () => editor.chain().focus().addRowBefore().run()),
     tool(BetweenHorizontalEnd, t.rowBelow, () => editor.chain().focus().addRowAfter().run()),
     tool(BetweenVerticalStart, t.columnLeft, () => editor.chain().focus().addColumnBefore().run()),
     tool(BetweenVerticalEnd, t.columnRight, () => editor.chain().focus().addColumnAfter().run()),
     tool(PanelTop, t.headerRow, () => editor.chain().focus().toggleHeaderRow().run()),
     docx && tool(TableCellsMerge, t.mergeCells, () => editor.chain().focus().mergeOrSplit().run()),
-    docx && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-anchor", children: [
-      /* @__PURE__ */ jsxs2("button", { type: "button", "data-pop": true, "aria-expanded": pop === "fill", "aria-label": t.cellFill, title: t.cellFill, onClick: () => pick("fill"), children: [
-        /* @__PURE__ */ jsx2(PaintBucket, { "aria-hidden": true }),
-        /* @__PURE__ */ jsx2("i", { className: "w100n-text-bar", style: { background: state.fill ?? "transparent" } })
+    docx && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-anchor", children: [
+      /* @__PURE__ */ jsxs3("button", { type: "button", "data-pop": true, "aria-expanded": pop === "fill", "aria-label": t.cellFill, title: t.cellFill, onClick: () => pick("fill"), children: [
+        /* @__PURE__ */ jsx3(PaintBucket, { "aria-hidden": true }),
+        /* @__PURE__ */ jsx3("i", { className: "w100n-text-bar", style: { background: state.fill ?? "transparent" } })
       ] }),
       pop === "fill" && swatches(glows, state.fill, (c) => editor.chain().focus().setCellAttribute("background", c).run(), t.noColour)
     ] }),
@@ -1219,33 +1350,43 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
     tool(TableRowsSplit, t.deleteRow, () => editor.chain().focus().deleteRow().run()),
     tool(TableColumnsSplit, t.deleteColumn, () => editor.chain().focus().deleteColumn().run()),
     tool(Trash2, t.deleteTable, () => editor.chain().focus().deleteTable().run())
-  ] }) : state.img && /* @__PURE__ */ jsx2(Fragment3, { children: [[Image, t.wrapInline, "inline"], [PanelLeft, t.wrapLeft, "left"], [PanelRight, t.wrapRight, "right"]].map(([icon, label, value]) => /* @__PURE__ */ jsx2(Fragment2, { children: tool(icon, label, () => editor.chain().focus().updateAttributes("image", { wrap: value === "inline" ? null : value }).run(), state.img === value) }, value)) }));
-  const status = (can.edit || live) && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-end", children: [
-    live && (live.ready ? !live.online : live.late || live.denied) && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-live", title: live.denied ? void 0 : t.offlineHint, children: [
-      /* @__PURE__ */ jsx2(WifiOff, { "aria-hidden": true }),
+  ] }) : state.img && /* @__PURE__ */ jsx3(Fragment3, { children: [[Image, t.wrapInline, "inline"], [PanelLeft, t.wrapLeft, "left"], [PanelRight, t.wrapRight, "right"]].map(([icon, label, value]) => /* @__PURE__ */ jsx3(Fragment2, { children: tool(icon, label, () => editor.chain().focus().updateAttributes("image", { wrap: value === "inline" ? null : value }).run(), state.img === value) }, value)) }));
+  const status = (can.edit || live) && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-end", children: [
+    live && (live.ready ? !live.online : live.late || live.denied) && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-live", title: live.denied ? void 0 : t.offlineHint, children: [
+      /* @__PURE__ */ jsx3(WifiOff, { "aria-hidden": true }),
       live.denied ? t.liveOff : t.offline
     ] }),
-    state.suggest && /* @__PURE__ */ jsx2("span", { className: "w100n-docs-badge", children: t.suggesting }),
-    can.edit && saving === "failed" && /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-text-saved", title: `${t.save} (${mod}S)`, onClick: () => void save(), children: [
-      /* @__PURE__ */ jsx2(CloudAlert, { "aria-hidden": true }),
-      /* @__PURE__ */ jsx2("span", { children: t.saveFailed })
+    state.suggest && /* @__PURE__ */ jsx3("span", { className: "w100n-docs-badge", children: t.suggesting }),
+    can.edit && saving === "failed" && /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-text-saved", title: `${t.save} (${mod}S)`, onClick: () => void save(), children: [
+      /* @__PURE__ */ jsx3(CloudAlert, { "aria-hidden": true }),
+      /* @__PURE__ */ jsx3("span", { children: t.saveFailed })
     ] }),
-    live && live.people.length > 0 && /* @__PURE__ */ jsx2("span", { className: "w100n-text-people", role: "group", "aria-label": t.people, children: live.people.map((p) => /* @__PURE__ */ jsx2("span", { className: "w100n-text-face", title: p.me ? `${p.name} (${t.you})` : p.name, style: { "--face": p.color }, children: p.avatarUrl ? /* @__PURE__ */ jsx2("img", { src: p.avatarUrl, alt: "" }) : p.name.split(/\s+/).map((w) => w[0]).join("").slice(0, 2).toUpperCase() }, p.id)) })
+    live && live.people.length > 0 && /* @__PURE__ */ jsx3("span", { className: "w100n-text-people", role: "group", "aria-label": t.people, children: live.people.map((p) => /* @__PURE__ */ jsx3("span", { className: "w100n-text-face", title: p.me ? `${p.name} (${t.you})` : p.name, style: { "--face": p.color }, children: p.avatarUrl ? /* @__PURE__ */ jsx3("img", { src: p.avatarUrl, alt: "" }) : p.name.split(/\s+/).map((w) => w[0]).join("").slice(0, 2).toUpperCase() }, p.id)) })
   ] });
-  const menubar = /* @__PURE__ */ jsx2("span", { className: "w100n-text-menus", role: "menubar", "aria-label": t.textTools, children: menus.filter(([, , list]) => list.some((x) => x && x !== "-")).map(menu) });
+  const menubar = /* @__PURE__ */ jsx3("span", { className: "w100n-text-menus", role: "menubar", "aria-label": t.textTools, children: menus.filter(([, , list]) => list.some((x) => x && x !== "-")).map(menu) });
   const keep = (e) => {
     if (e.target.closest("button")) e.preventDefault();
   };
   const sheet = docx ? { "--page-w": `${page.width}px`, "--page-h": `${page.height}px`, "--mt": `${page.margins[0]}px`, "--mr": `${page.margins[1]}px`, "--mb": `${page.margins[2]}px`, "--ml": `${page.margins[3]}px` } : void 0;
-  return /* @__PURE__ */ jsxs2("div", { ref: root, className: "w100n-text", "data-kind": kind, "data-docs-find": true, onKeyDown: keys, children: [
-    head ? /* @__PURE__ */ jsxs2(Fragment3, { children: [
-      head.menus && createPortal(/* @__PURE__ */ jsx2("div", { className: "w100n-text-ribbon w100n-text-docbar", onKeyDown: rove, onPointerDown: keep, children: menubar }), head.menus),
-      head.status && status && createPortal(/* @__PURE__ */ jsx2("div", { className: "w100n-text-ribbon w100n-text-docbar", onPointerDown: keep, children: status }), head.status)
-    ] }) : /* @__PURE__ */ jsxs2("div", { className: "w100n-text-ribbon w100n-text-top", onKeyDown: rove, onPointerDown: keep, children: [
+  return /* @__PURE__ */ jsxs3("div", { ref: root, className: "w100n-text", "data-kind": kind, "data-docs-find": true, onKeyDown: keys, children: [
+    head ? /* @__PURE__ */ jsxs3(Fragment3, { children: [
+      head.menus && createPortal(/* @__PURE__ */ jsx3("div", { className: "w100n-text-ribbon w100n-text-docbar", onKeyDown: rove, onPointerDown: keep, children: menubar }), head.menus),
+      head.status && status && createPortal(/* @__PURE__ */ jsx3("div", { className: "w100n-text-ribbon w100n-text-docbar", onPointerDown: keep, children: status }), head.status)
+    ] }) : /* @__PURE__ */ jsxs3("div", { className: "w100n-text-ribbon w100n-text-top", onKeyDown: rove, onPointerDown: keep, children: [
       menubar,
       status
     ] }),
-    /* @__PURE__ */ jsx2("div", { ref: scroller, className: "w100n-text-scroll", "data-paint": !!paint, onMouseUp: lay, onClick: (e) => {
+    /* @__PURE__ */ jsx3("div", { ref: scroller, className: "w100n-text-scroll", "data-paint": !!paint, onMouseUp: lay, onPointerDown: (e) => {
+      touch.current = e.pointerType === "touch";
+    }, onContextMenu: (e) => {
+      if (touch.current || e.shiftKey || pop === "context" || !e.target.closest(".ProseMirror")) return setPop(null);
+      e.preventDefault();
+      const at = editor.view.posAtCoords({ left: e.clientX, top: e.clientY });
+      const { from, to } = editor.state.selection;
+      if (at && (at.pos < from || at.pos > to)) editor.commands.setTextSelection(at.pos);
+      setSpot({ x: Math.min(e.clientX, innerWidth - 260), y: Math.min(e.clientY, innerHeight - 360) });
+      setPop("context");
+    }, onClick: (e) => {
       const atom = can.edit ? e.target.closest(".w100n-math, sup[data-footnote]") : null;
       if (atom) {
         const at = editor.view.posAtDOM(atom, 0);
@@ -1258,45 +1399,49 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
       if (!id) return;
       setActive(id);
       onPanel?.("comments");
-    }, children: /* @__PURE__ */ jsx2("div", { className: "w100n-text-zoomed", style: { zoom: percent / 100 }, children: /* @__PURE__ */ jsx2("div", { className: docx ? "w100n-text-sheet" : "w100n-docs-page w100n-text-column", style: sheet, children: /* @__PURE__ */ jsx2(EditorContent, { editor }) }) }) }),
-    /* @__PURE__ */ jsx2("div", { className: "w100n-text-ribbon w100n-text-corner", "data-side": "left", onPointerDown: keep, children: /* @__PURE__ */ jsxs2("div", { className: "w100n-text-tools", role: "group", "aria-label": t.zoom, children: [
+    }, children: /* @__PURE__ */ jsx3("div", { className: "w100n-text-zoomed", style: { zoom: percent / 100 }, children: /* @__PURE__ */ jsx3("div", { className: docx ? `w100n-text-sheet${flow ? " is-flow" : ""}` : "w100n-docs-page w100n-text-column", style: sheet, children: /* @__PURE__ */ jsx3(EditorContent, { editor }) }) }) }),
+    pop === "context" && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-pop w100n-text-menu w100n-text-context", role: "menu", "aria-label": t.textTools, style: { left: spot.x, top: spot.y }, onPointerDown: keep, children: [
+      rows(near),
+      spell && /* @__PURE__ */ jsx3("small", { className: "w100n-text-hint", children: t.spellHint })
+    ] }),
+    /* @__PURE__ */ jsx3("div", { className: "w100n-text-ribbon w100n-text-corner", "data-side": "left", onPointerDown: keep, children: /* @__PURE__ */ jsxs3("div", { className: "w100n-text-tools", role: "group", "aria-label": t.zoom, children: [
       tool(Minus, t.zoomOut, () => zoomBy(-10)),
       zoomer,
       tool(Plus, t.zoomIn, () => zoomBy(10))
     ] }) }),
-    /* @__PURE__ */ jsxs2("div", { className: "w100n-text-ribbon w100n-text-island", role: "toolbar", "aria-label": t.textTools, onKeyDown: rove, onPointerDown: keep, children: [
-      context && /* @__PURE__ */ jsx2("div", { className: "w100n-text-tools", role: "group", "aria-label": state.table ? t.table : t.image, children: context }),
-      extra && /* @__PURE__ */ jsx2("div", { className: "w100n-text-tools", role: "group", "aria-label": t.moreTools, children: extra }),
-      /* @__PURE__ */ jsx2("div", { className: "w100n-text-tools", role: "group", "aria-label": t.textTools, children: main })
+    /* @__PURE__ */ jsxs3("div", { className: "w100n-text-ribbon w100n-text-island", role: "toolbar", "aria-label": t.textTools, onKeyDown: rove, onPointerDown: keep, children: [
+      context && /* @__PURE__ */ jsx3("div", { className: "w100n-text-tools", role: "group", "aria-label": state.table ? t.table : t.image, children: context }),
+      extra && /* @__PURE__ */ jsx3("div", { className: "w100n-text-tools", role: "group", "aria-label": t.moreTools, children: extra }),
+      /* @__PURE__ */ jsx3("div", { className: "w100n-text-tools", role: "group", "aria-label": t.textTools, children: main })
     ] }),
-    /* @__PURE__ */ jsx2("div", { className: "w100n-text-ribbon w100n-text-corner", "data-side": "right", onPointerDown: keep, children: /* @__PURE__ */ jsxs2("div", { className: "w100n-text-tools", role: "group", "aria-label": t.findReplace, children: [
-      can.edit && /* @__PURE__ */ jsxs2(Fragment3, { children: [
+    /* @__PURE__ */ jsx3("div", { className: "w100n-text-ribbon w100n-text-corner", "data-side": "right", onPointerDown: keep, children: /* @__PURE__ */ jsxs3("div", { className: "w100n-text-tools", role: "group", "aria-label": t.findReplace, children: [
+      can.edit && /* @__PURE__ */ jsxs3(Fragment3, { children: [
         tool(Undo2, t.undo, () => editor.chain().focus().undo().run(), void 0, !state.undo),
         tool(Redo2, t.redo, () => editor.chain().focus().redo().run(), void 0, !state.redo),
         gap
       ] }),
       finder
     ] }) }),
-    dialog && /* @__PURE__ */ jsx2("div", { className: "w100n-pdf-back", onKeyDown: (e) => {
+    dialog && /* @__PURE__ */ jsx3("div", { className: "w100n-pdf-back", onKeyDown: (e) => {
       if (e.key === "Escape") {
         e.stopPropagation();
         setDialog(null);
       }
-    }, children: dialog.kind === "symbol" ? /* @__PURE__ */ jsxs2("div", { className: "w100n-pdf-dialog w100n-insert", role: "dialog", "aria-modal": true, "aria-label": t.symbols, children: [
-      /* @__PURE__ */ jsxs2("div", { className: "w100n-new-head", children: [
-        /* @__PURE__ */ jsx2("span", { className: "w100n-new-tile", "data-tone": "pink", children: /* @__PURE__ */ jsx2(Omega, { "aria-hidden": true }) }),
-        /* @__PURE__ */ jsx2("b", { className: "w100n-pdf-dialog-title", children: t.symbols }),
-        /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-docs-close", onClick: () => setDialog(null), "aria-label": t.close, title: t.close, children: /* @__PURE__ */ jsx2(X, { "aria-hidden": true }) })
+    }, children: dialog.kind === "symbol" ? /* @__PURE__ */ jsxs3("div", { className: "w100n-pdf-dialog w100n-insert", role: "dialog", "aria-modal": true, "aria-label": t.symbols, children: [
+      /* @__PURE__ */ jsxs3("div", { className: "w100n-new-head", children: [
+        /* @__PURE__ */ jsx3("span", { className: "w100n-new-tile", "data-tone": "pink", children: /* @__PURE__ */ jsx3(Omega, { "aria-hidden": true }) }),
+        /* @__PURE__ */ jsx3("b", { className: "w100n-pdf-dialog-title", children: t.symbols }),
+        /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-docs-close", onClick: () => setDialog(null), "aria-label": t.close, title: t.close, children: /* @__PURE__ */ jsx3(X, { "aria-hidden": true }) })
       ] }),
-      /* @__PURE__ */ jsxs2("label", { className: "w100n-docs-field w100n-docs-search", children: [
-        /* @__PURE__ */ jsx2(Search, { "aria-hidden": true }),
-        /* @__PURE__ */ jsx2("input", { autoFocus: true, value: dialog.query, placeholder: t.symbolSearch, "aria-label": t.symbolSearch, onChange: (e) => setDialog({ kind: "symbol", query: e.target.value }) })
+      /* @__PURE__ */ jsxs3("label", { className: "w100n-docs-field w100n-docs-search", children: [
+        /* @__PURE__ */ jsx3(Search, { "aria-hidden": true }),
+        /* @__PURE__ */ jsx3("input", { autoFocus: true, value: dialog.query, placeholder: t.symbolSearch, "aria-label": t.symbolSearch, onChange: (e) => setDialog({ kind: "symbol", query: e.target.value }) })
       ] }),
-      /* @__PURE__ */ jsx2("div", { className: "w100n-insert-grid", role: "group", "aria-label": t.symbols, children: symbols.filter(([ch, name]) => !dialog.query.trim() || name.includes(dialog.query.trim().toLowerCase()) || ch === dialog.query.trim()).map(([ch, name]) => /* @__PURE__ */ jsx2("button", { type: "button", "aria-label": name, title: name, onClick: () => {
+      /* @__PURE__ */ jsx3("div", { className: "w100n-insert-grid", role: "group", "aria-label": t.symbols, children: symbols.filter(([ch, name]) => !dialog.query.trim() || name.includes(dialog.query.trim().toLowerCase()) || ch === dialog.query.trim()).map(([ch, name]) => /* @__PURE__ */ jsx3("button", { type: "button", "aria-label": name, title: name, onClick: () => {
         editor.chain().focus().insertContent(ch).run();
         setDialog(null);
       }, children: ch }, ch)) })
-    ] }) : dialog.kind === "formula" ? /* @__PURE__ */ jsxs2("form", { className: "w100n-pdf-dialog w100n-insert", role: "dialog", "aria-modal": true, "aria-label": t.formula, onSubmit: (e) => {
+    ] }) : dialog.kind === "formula" ? /* @__PURE__ */ jsxs3("form", { className: "w100n-pdf-dialog w100n-insert", role: "dialog", "aria-modal": true, "aria-label": t.formula, onSubmit: (e) => {
       e.preventDefault();
       const latex = dialog.latex.trim();
       if (!latex) return;
@@ -1307,14 +1452,13 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
       else editor.chain().focus().insertContent({ type: "math", attrs: { latex } }).run();
       setDialog(null);
     }, children: [
-      /* @__PURE__ */ jsxs2("div", { className: "w100n-new-head", children: [
-        /* @__PURE__ */ jsx2("span", { className: "w100n-new-tile", "data-tone": "blue", children: /* @__PURE__ */ jsx2(Sigma, { "aria-hidden": true }) }),
-        /* @__PURE__ */ jsx2("b", { className: "w100n-pdf-dialog-title", children: t.formula }),
-        /* @__PURE__ */ jsx2("span", { className: "w100n-docs-badge", children: t.formulaHint }),
-        /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-docs-close", onClick: () => setDialog(null), "aria-label": t.close, title: t.close, children: /* @__PURE__ */ jsx2(X, { "aria-hidden": true }) })
+      /* @__PURE__ */ jsxs3("div", { className: "w100n-new-head", children: [
+        /* @__PURE__ */ jsx3("span", { className: "w100n-new-tile", "data-tone": "blue", children: /* @__PURE__ */ jsx3(Sigma, { "aria-hidden": true }) }),
+        /* @__PURE__ */ jsx3("b", { className: "w100n-pdf-dialog-title", children: t.formula }),
+        /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-docs-close", onClick: () => setDialog(null), "aria-label": t.close, title: t.close, children: /* @__PURE__ */ jsx3(X, { "aria-hidden": true }) })
       ] }),
-      /* @__PURE__ */ jsx2("input", { ref: field, autoFocus: true, className: "w100n-insert-latex", value: dialog.latex, "aria-label": t.formula, placeholder: "F = 900 + 12 \\\\cdot n", onChange: (e) => setDialog({ ...dialog, latex: e.target.value }) }),
-      /* @__PURE__ */ jsx2("div", { className: "w100n-insert-tools", role: "group", "aria-label": t.formula, children: helpers.map(([label, code]) => /* @__PURE__ */ jsx2("button", { type: "button", onClick: () => {
+      /* @__PURE__ */ jsx3("input", { ref: field, autoFocus: true, className: "w100n-insert-latex", value: dialog.latex, "aria-label": t.formula, placeholder: "F = 900 + 12 \\\\cdot n", onChange: (e) => setDialog({ ...dialog, latex: e.target.value }) }),
+      /* @__PURE__ */ jsx3("div", { className: "w100n-insert-tools", role: "group", "aria-label": t.formula, children: helpers.map(([label, code]) => /* @__PURE__ */ jsx3("button", { type: "button", onClick: () => {
         const el = field.current;
         const at = el.selectionStart ?? dialog.latex.length;
         const latex = dialog.latex.slice(0, at) + code + dialog.latex.slice(el.selectionEnd ?? at);
@@ -1325,15 +1469,15 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
           el.setSelectionRange(caret, caret);
         });
       }, children: label }, label)) }),
-      /* @__PURE__ */ jsx2("div", { className: "w100n-insert-preview", "aria-live": "polite", dangerouslySetInnerHTML: { __html: dialog.latex.trim() ? mathml(dialog.latex) : "" } }),
-      /* @__PURE__ */ jsxs2("span", { className: "w100n-pdf-dialog-end", children: [
-        /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-pdf-link", onClick: () => setDialog(null), children: t.cancel }),
-        /* @__PURE__ */ jsxs2("button", { type: "submit", className: "w100n-docs-action", disabled: !dialog.latex.trim(), children: [
-          /* @__PURE__ */ jsx2(Check, { "aria-hidden": true }),
+      /* @__PURE__ */ jsx3("div", { className: "w100n-insert-preview", "aria-live": "polite", dangerouslySetInnerHTML: { __html: dialog.latex.trim() ? mathml(dialog.latex) : "" } }),
+      /* @__PURE__ */ jsxs3("span", { className: "w100n-pdf-dialog-end", children: [
+        /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-pdf-link", onClick: () => setDialog(null), children: t.cancel }),
+        /* @__PURE__ */ jsxs3("button", { type: "submit", className: "w100n-docs-action", disabled: !dialog.latex.trim(), children: [
+          /* @__PURE__ */ jsx3(Check, { "aria-hidden": true }),
           dialog.at !== null ? t.update : t.put
         ] })
       ] })
-    ] }) : /* @__PURE__ */ jsxs2("form", { className: "w100n-pdf-dialog w100n-insert", role: "dialog", "aria-modal": true, "aria-label": t.footnote, onSubmit: (e) => {
+    ] }) : /* @__PURE__ */ jsxs3("form", { className: "w100n-pdf-dialog w100n-insert", role: "dialog", "aria-modal": true, "aria-label": t.footnote, onSubmit: (e) => {
       e.preventDefault();
       const text = dialog.text.trim();
       if (!text) return;
@@ -1341,15 +1485,21 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
         tr.setNodeAttribute(dialog.at, "text", text);
         return true;
       }).run();
-      else editor.chain().focus().insertContent({ type: "footnote", attrs: { id: null, text } }).run();
+      else {
+        let id = 0;
+        editor.state.doc.descendants((n) => {
+          if (n.type.name === "footnote") id = Math.max(id, Number(n.attrs.id) || 0);
+        });
+        editor.chain().focus().insertContent({ type: "footnote", attrs: { id: docx ? null : String(id + 1), text } }).run();
+      }
       setDialog(null);
     }, children: [
-      /* @__PURE__ */ jsxs2("div", { className: "w100n-new-head", children: [
-        /* @__PURE__ */ jsx2("span", { className: "w100n-new-tile", "data-tone": "violet", children: /* @__PURE__ */ jsx2(Superscript, { "aria-hidden": true }) }),
-        /* @__PURE__ */ jsx2("b", { className: "w100n-pdf-dialog-title", children: t.footnote }),
-        /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-docs-close", onClick: () => setDialog(null), "aria-label": t.close, title: t.close, children: /* @__PURE__ */ jsx2(X, { "aria-hidden": true }) })
+      /* @__PURE__ */ jsxs3("div", { className: "w100n-new-head", children: [
+        /* @__PURE__ */ jsx3("span", { className: "w100n-new-tile", "data-tone": "violet", children: /* @__PURE__ */ jsx3(Superscript, { "aria-hidden": true }) }),
+        /* @__PURE__ */ jsx3("b", { className: "w100n-pdf-dialog-title", children: t.footnote }),
+        /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-docs-close", onClick: () => setDialog(null), "aria-label": t.close, title: t.close, children: /* @__PURE__ */ jsx3(X, { "aria-hidden": true }) })
       ] }),
-      /* @__PURE__ */ jsx2(
+      /* @__PURE__ */ jsx3(
         "textarea",
         {
           autoFocus: true,
@@ -1363,40 +1513,40 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
           }
         }
       ),
-      /* @__PURE__ */ jsxs2("span", { className: "w100n-pdf-dialog-end", children: [
-        dialog.at !== null && /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-pdf-link", onClick: () => {
+      /* @__PURE__ */ jsxs3("span", { className: "w100n-pdf-dialog-end", children: [
+        dialog.at !== null && /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-pdf-link", onClick: () => {
           editor.chain().focus().deleteRange({ from: dialog.at, to: dialog.at + 1 }).run();
           setDialog(null);
         }, children: t.removeFootnote }),
-        /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-pdf-link", onClick: () => setDialog(null), children: t.cancel }),
-        /* @__PURE__ */ jsxs2("button", { type: "submit", className: "w100n-docs-action", disabled: !dialog.text.trim(), children: [
-          /* @__PURE__ */ jsx2(Check, { "aria-hidden": true }),
+        /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-pdf-link", onClick: () => setDialog(null), children: t.cancel }),
+        /* @__PURE__ */ jsxs3("button", { type: "submit", className: "w100n-docs-action", disabled: !dialog.text.trim(), children: [
+          /* @__PURE__ */ jsx3(Check, { "aria-hidden": true }),
           dialog.at !== null ? t.update : t.put
         ] })
       ] })
     ] }) }),
-    draft2 && /* @__PURE__ */ jsx2("div", { className: "w100n-pdf-back", onKeyDown: (e) => {
+    draft2 && /* @__PURE__ */ jsx3("div", { className: "w100n-pdf-back", onKeyDown: (e) => {
       if (e.key === "Escape") {
         e.stopPropagation();
         setDraft2(null);
       }
-    }, children: /* @__PURE__ */ jsxs2("form", { className: "w100n-pdf-dialog w100n-setup", role: "dialog", "aria-modal": true, "aria-label": t.pageSetup, onSubmit: (e) => {
+    }, children: /* @__PURE__ */ jsxs3("form", { className: "w100n-pdf-dialog w100n-setup", role: "dialog", "aria-modal": true, "aria-label": t.pageSetup, onSubmit: (e) => {
       e.preventDefault();
       applySetup();
     }, children: [
-      /* @__PURE__ */ jsxs2("div", { className: "w100n-new-head", children: [
-        /* @__PURE__ */ jsx2("span", { className: "w100n-new-tile", "data-tone": "blue", children: /* @__PURE__ */ jsx2(Ruler, { "aria-hidden": true }) }),
-        /* @__PURE__ */ jsx2("b", { className: "w100n-pdf-dialog-title", children: t.pageSetup }),
-        /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-docs-close", onClick: () => setDraft2(null), "aria-label": t.close, title: t.close, children: /* @__PURE__ */ jsx2(X, { "aria-hidden": true }) })
+      /* @__PURE__ */ jsxs3("div", { className: "w100n-new-head", children: [
+        /* @__PURE__ */ jsx3("span", { className: "w100n-new-tile", "data-tone": "blue", children: /* @__PURE__ */ jsx3(Ruler, { "aria-hidden": true }) }),
+        /* @__PURE__ */ jsx3("b", { className: "w100n-pdf-dialog-title", children: t.pageSetup }),
+        /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-docs-close", onClick: () => setDraft2(null), "aria-label": t.close, title: t.close, children: /* @__PURE__ */ jsx3(X, { "aria-hidden": true }) })
       ] }),
-      /* @__PURE__ */ jsx2("p", { className: "w100n-docs-caption", children: t.pageSize }),
-      /* @__PURE__ */ jsx2("div", { className: "w100n-docs-chips", role: "group", "aria-label": t.pageSize, children: [["A4", a4], ["Letter", letter], ["Legal", legal]].map(([label, size]) => {
+      /* @__PURE__ */ jsx3("p", { className: "w100n-docs-caption", children: t.pageSize }),
+      /* @__PURE__ */ jsx3("div", { className: "w100n-docs-chips", role: "group", "aria-label": t.pageSize, children: [["A4", a4], ["Letter", letter], ["Legal", legal]].map(([label, size]) => {
         const land = draft2.width > draft2.height;
         const on = Math.abs(Math.min(draft2.width, draft2.height) - size.width) < 2 && Math.abs(Math.max(draft2.width, draft2.height) - size.height) < 2;
-        return /* @__PURE__ */ jsx2("button", { type: "button", "aria-pressed": on, onClick: () => setDraft2({ ...draft2, width: land ? size.height : size.width, height: land ? size.width : size.height }), children: label }, label);
+        return /* @__PURE__ */ jsx3("button", { type: "button", "aria-pressed": on, onClick: () => setDraft2({ ...draft2, width: land ? size.height : size.width, height: land ? size.width : size.height }), children: label }, label);
       }) }),
-      /* @__PURE__ */ jsx2("p", { className: "w100n-docs-caption", children: t.orientation }),
-      /* @__PURE__ */ jsx2("div", { className: "w100n-docs-chips", role: "group", "aria-label": t.orientation, children: [[false, t.portrait], [true, t.landscape]].map(([land, label]) => /* @__PURE__ */ jsx2(
+      /* @__PURE__ */ jsx3("p", { className: "w100n-docs-caption", children: t.orientation }),
+      /* @__PURE__ */ jsx3("div", { className: "w100n-docs-chips", role: "group", "aria-label": t.orientation, children: [[false, t.portrait], [true, t.landscape]].map(([land, label]) => /* @__PURE__ */ jsx3(
         "button",
         {
           type: "button",
@@ -1408,11 +1558,11 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
         },
         label
       )) }),
-      /* @__PURE__ */ jsx2("p", { className: "w100n-docs-caption", children: t.marginsCm }),
-      /* @__PURE__ */ jsx2("div", { className: "w100n-docs-chips", role: "group", "aria-label": t.margins, children: margins.map(([label, values]) => /* @__PURE__ */ jsx2("button", { type: "button", "aria-pressed": values.every((v, n) => Math.abs(cm(v) - draft2.margins[n]) < 0.05), onClick: () => setDraft2({ ...draft2, margins: values.map(cm) }), children: label }, label)) }),
-      /* @__PURE__ */ jsx2("div", { className: "w100n-setup-grid", children: [t.mTop, t.mRight, t.mBottom, t.mLeft].map((label, n) => /* @__PURE__ */ jsxs2("label", { children: [
-        /* @__PURE__ */ jsx2("span", { children: label }),
-        /* @__PURE__ */ jsx2(
+      /* @__PURE__ */ jsx3("p", { className: "w100n-docs-caption", children: t.marginsCm }),
+      /* @__PURE__ */ jsx3("div", { className: "w100n-docs-chips", role: "group", "aria-label": t.margins, children: margins.map(([label, values]) => /* @__PURE__ */ jsx3("button", { type: "button", "aria-pressed": values.every((v, n) => Math.abs(cm(v) - draft2.margins[n]) < 0.05), onClick: () => setDraft2({ ...draft2, margins: values.map(cm) }), children: label }, label)) }),
+      /* @__PURE__ */ jsx3("div", { className: "w100n-setup-grid", children: [t.mTop, t.mRight, t.mBottom, t.mLeft].map((label, n) => /* @__PURE__ */ jsxs3("label", { children: [
+        /* @__PURE__ */ jsx3("span", { children: label }),
+        /* @__PURE__ */ jsx3(
           "input",
           {
             className: "w100n-docs-field",
@@ -1425,130 +1575,111 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
           }
         )
       ] }, n)) }),
-      /* @__PURE__ */ jsxs2("label", { className: "w100n-setup-line", children: [
-        /* @__PURE__ */ jsx2("span", { children: t.headerText }),
-        /* @__PURE__ */ jsx2("input", { className: "w100n-docs-field", value: draft2.header, onChange: (e) => setDraft2({ ...draft2, header: e.target.value }) })
+      /* @__PURE__ */ jsxs3("label", { className: "w100n-setup-line", children: [
+        /* @__PURE__ */ jsx3("span", { children: t.headerText }),
+        /* @__PURE__ */ jsx3("input", { className: "w100n-docs-field", value: draft2.header, onChange: (e) => setDraft2({ ...draft2, header: e.target.value }) })
       ] }),
-      /* @__PURE__ */ jsxs2("label", { className: "w100n-setup-line", children: [
-        /* @__PURE__ */ jsx2("span", { children: t.footerText }),
-        /* @__PURE__ */ jsx2("input", { className: "w100n-docs-field", value: draft2.footer, onChange: (e) => setDraft2({ ...draft2, footer: e.target.value }) })
+      /* @__PURE__ */ jsxs3("label", { className: "w100n-setup-line", children: [
+        /* @__PURE__ */ jsx3("span", { children: t.footerText }),
+        /* @__PURE__ */ jsx3("input", { className: "w100n-docs-field", value: draft2.footer, onChange: (e) => setDraft2({ ...draft2, footer: e.target.value }) })
       ] }),
-      /* @__PURE__ */ jsxs2("label", { className: "w100n-setup-check", children: [
-        /* @__PURE__ */ jsx2("input", { type: "checkbox", checked: draft2.numbers, onChange: (e) => setDraft2({ ...draft2, numbers: e.target.checked }) }),
+      /* @__PURE__ */ jsxs3("label", { className: "w100n-setup-check", children: [
+        /* @__PURE__ */ jsx3("input", { type: "checkbox", checked: draft2.numbers, onChange: (e) => setDraft2({ ...draft2, numbers: e.target.checked }) }),
         t.pageNumbers
       ] }),
-      /* @__PURE__ */ jsxs2("div", { className: "w100n-pdf-dialog-end", children: [
-        /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-pdf-link", onClick: () => setDraft2(null), children: t.cancel }),
-        /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", onClick: applySetup, children: [
-          /* @__PURE__ */ jsx2(Check, { "aria-hidden": true }),
+      /* @__PURE__ */ jsxs3("div", { className: "w100n-pdf-dialog-end", children: [
+        /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-pdf-link", onClick: () => setDraft2(null), children: t.cancel }),
+        /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", onClick: applySetup, children: [
+          /* @__PURE__ */ jsx3(Check, { "aria-hidden": true }),
           t.apply
         ] })
       ] })
     ] }) }),
-    slot && createPortal(/* @__PURE__ */ jsxs2("div", { className: "w100n-text-notes", children: [
-      draft && /* @__PURE__ */ jsxs2("div", { className: "w100n-text-card w100n-text-draft", children: [
-        /* @__PURE__ */ jsx2("blockquote", { children: draft.quote }),
-        /* @__PURE__ */ jsx2(
-          "textarea",
-          {
-            autoFocus: true,
-            value: draft.body,
-            placeholder: t.writeComment,
-            "aria-label": t.writeComment,
-            onChange: (e) => setDraft({ ...draft, body: e.target.value }),
-            onKeyDown: (e) => {
-              if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) void post();
-            }
-          }
-        ),
-        /* @__PURE__ */ jsxs2("span", { className: "w100n-pdf-dialog-end", children: [
-          /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-pdf-link", onClick: drop, children: t.cancel }),
-          /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", disabled: !draft.body.trim() || posting === "busy", onClick: () => void post(), children: [
-            /* @__PURE__ */ jsx2(MessageSquarePlus, { "aria-hidden": true }),
+    slot && createPortal(/* @__PURE__ */ jsxs3("div", { className: "w100n-text-notes", children: [
+      draft && /* @__PURE__ */ jsxs3("div", { className: "w100n-text-card w100n-text-draft", children: [
+        /* @__PURE__ */ jsx3("blockquote", { children: draft.quote }),
+        /* @__PURE__ */ jsx3(Mentions, { autoFocus: true, value: draft.body, placeholder: t.writeComment, label: t.writeComment, people, onChange: (body) => setDraft({ ...draft, body }), onSend: () => void post() }),
+        tagged(draft.body, people).length > 0 && /* @__PURE__ */ jsxs3("label", { className: "w100n-setup-check", children: [
+          /* @__PURE__ */ jsx3("input", { type: "checkbox", checked: draft.give, onChange: (e) => setDraft({ ...draft, give: e.target.checked }) }),
+          t.assignTo.replace("{name}", tagged(draft.body, people)[0].name)
+        ] }),
+        /* @__PURE__ */ jsxs3("span", { className: "w100n-pdf-dialog-end", children: [
+          /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-pdf-link", onClick: drop, children: t.cancel }),
+          /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", disabled: !draft.body.trim() || posting === "busy", onClick: () => void post(), children: [
+            /* @__PURE__ */ jsx3(MessageSquarePlus, { "aria-hidden": true }),
             t.post
           ] })
         ] })
       ] }),
-      suggested.length > 0 && /* @__PURE__ */ jsxs2(Fragment3, { children: [
-        /* @__PURE__ */ jsxs2("p", { className: "w100n-docs-caption", children: [
-          /* @__PURE__ */ jsx2(FilePenLine, { "aria-hidden": true }),
+      suggested.length > 0 && /* @__PURE__ */ jsxs3(Fragment3, { children: [
+        /* @__PURE__ */ jsxs3("p", { className: "w100n-docs-caption", children: [
+          /* @__PURE__ */ jsx3(FilePenLine, { "aria-hidden": true }),
           t.suggestions,
-          /* @__PURE__ */ jsx2("span", { children: suggested.length })
+          /* @__PURE__ */ jsx3("span", { children: suggested.length })
         ] }),
-        suggested.map((c, i) => /* @__PURE__ */ jsxs2("article", { className: "w100n-text-card w100n-text-change", "data-kind": c.kind, onClick: () => jump(c.from), children: [
-          /* @__PURE__ */ jsxs2("header", { children: [
-            /* @__PURE__ */ jsx2("span", { className: "w100n-text-face", "aria-hidden": true, children: (c.author || "?").slice(0, 1).toUpperCase() }),
-            /* @__PURE__ */ jsxs2("span", { className: "w100n-text-who", children: [
-              /* @__PURE__ */ jsx2("b", { children: c.author || t.someone }),
-              c.date && /* @__PURE__ */ jsx2("small", { children: when(c.date) })
+        suggested.map((c, i) => /* @__PURE__ */ jsxs3("article", { className: "w100n-text-card w100n-text-change", "data-kind": c.kind, onClick: () => jump(c.from), children: [
+          /* @__PURE__ */ jsxs3("header", { children: [
+            /* @__PURE__ */ jsx3("span", { className: "w100n-text-face", "aria-hidden": true, children: (c.author || "?").slice(0, 1).toUpperCase() }),
+            /* @__PURE__ */ jsxs3("span", { className: "w100n-text-who", children: [
+              /* @__PURE__ */ jsx3("b", { children: c.author || t.someone }),
+              c.date && /* @__PURE__ */ jsx3("small", { children: when(c.date) })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs2("p", { children: [
+          /* @__PURE__ */ jsxs3("p", { children: [
             c.kind === "insertion" ? t.added : t.removed,
             " ",
-            /* @__PURE__ */ jsx2("q", { children: c.text })
+            /* @__PURE__ */ jsx3("q", { children: c.text })
           ] }),
-          can.edit && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-actions", onClick: (e) => e.stopPropagation(), children: [
-            /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", "data-tone": "green", onClick: () => decide(editor, true, c.id), children: [
-              /* @__PURE__ */ jsx2(Check, { "aria-hidden": true }),
+          can.edit && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-actions", onClick: (e) => e.stopPropagation(), children: [
+            /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", "data-tone": "green", onClick: () => decide(editor, true, c.id), children: [
+              /* @__PURE__ */ jsx3(Check, { "aria-hidden": true }),
               t.accept
             ] }),
-            /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", "data-tone": "red", onClick: () => decide(editor, false, c.id), children: [
-              /* @__PURE__ */ jsx2(X, { "aria-hidden": true }),
+            /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", "data-tone": "red", onClick: () => decide(editor, false, c.id), children: [
+              /* @__PURE__ */ jsx3(X, { "aria-hidden": true }),
               t.reject
             ] })
           ] })
         ] }, i))
       ] }),
-      posting === "failed" && /* @__PURE__ */ jsx2("p", { className: "w100n-docs-muted", role: "alert", children: t.commentFailed }),
-      failed && /* @__PURE__ */ jsx2("p", { className: "w100n-docs-muted", role: "alert", children: t.changeFailed }),
-      /* @__PURE__ */ jsxs2("div", { className: "w100n-docs-row", children: [
-        /* @__PURE__ */ jsxs2("p", { className: "w100n-docs-caption", children: [
-          /* @__PURE__ */ jsx2(MessagesSquare, { "aria-hidden": true }),
+      posting === "failed" && /* @__PURE__ */ jsx3("p", { className: "w100n-docs-muted", role: "alert", children: t.commentFailed }),
+      failed && /* @__PURE__ */ jsx3("p", { className: "w100n-docs-muted", role: "alert", children: t.changeFailed }),
+      /* @__PURE__ */ jsxs3("div", { className: "w100n-docs-row", children: [
+        /* @__PURE__ */ jsxs3("p", { className: "w100n-docs-caption", children: [
+          /* @__PURE__ */ jsx3(MessagesSquare, { "aria-hidden": true }),
           t.comments,
-          /* @__PURE__ */ jsx2("span", { children: open.length })
+          /* @__PURE__ */ jsx3("span", { children: open.length })
         ] }),
-        /* @__PURE__ */ jsx2("span", { className: "w100n-docs-chips", children: /* @__PURE__ */ jsx2("button", { type: "button", "aria-pressed": resolved, onClick: () => setResolved(!resolved), children: t.showResolved }) })
+        /* @__PURE__ */ jsx3("span", { className: "w100n-docs-chips", children: /* @__PURE__ */ jsx3("button", { type: "button", "aria-pressed": resolved, onClick: () => setResolved(!resolved), children: t.showResolved }) })
       ] }),
-      !threads.length && !draft && /* @__PURE__ */ jsx2("p", { className: "w100n-docs-muted", children: can.comment ? t.commentHint : t.noComments }),
-      threads.map((c) => /* @__PURE__ */ jsxs2("article", { className: "w100n-text-card", "aria-current": active === c.id, "data-resolved": c.resolved, onClick: () => show(c), children: [
+      !threads.length && !draft && /* @__PURE__ */ jsx3("p", { className: "w100n-docs-muted", children: can.comment ? t.commentHint : t.noComments }),
+      threads.map((c) => /* @__PURE__ */ jsxs3("article", { className: "w100n-text-card", "aria-current": active === c.id, "data-resolved": c.resolved, onClick: () => show(c), children: [
         person(c),
-        c.quote && /* @__PURE__ */ jsx2("blockquote", { children: c.quote }),
+        c.assignee && /* @__PURE__ */ jsx3("span", { className: "w100n-text-given", "data-me": c.assignee.id === host?.me.id, children: c.assignee.id === host?.me.id ? t.assignedYou : t.assignedTo.replace("{name}", c.assignee.name) }),
+        c.quote && /* @__PURE__ */ jsx3("blockquote", { children: c.quote }),
         words(c),
-        all.filter((r) => r.replyTo === c.id).map((r) => /* @__PURE__ */ jsxs2("div", { className: "w100n-text-reply", children: [
+        all.filter((r) => r.replyTo === c.id).map((r) => /* @__PURE__ */ jsxs3("div", { className: "w100n-text-reply", children: [
           person(r),
           words(r)
         ] }, r.id)),
-        reply?.id === c.id && /* @__PURE__ */ jsxs2("div", { className: "w100n-text-reply", onClick: (e) => e.stopPropagation(), children: [
-          /* @__PURE__ */ jsx2(
-            "textarea",
-            {
-              autoFocus: true,
-              value: reply.body,
-              placeholder: t.writeComment,
-              "aria-label": t.reply,
-              onChange: (e) => setReply({ ...reply, body: e.target.value }),
-              onKeyDown: (e) => {
-                if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) void answer(c);
-              }
-            }
-          ),
-          /* @__PURE__ */ jsxs2("span", { className: "w100n-pdf-dialog-end", children: [
-            /* @__PURE__ */ jsx2("button", { type: "button", className: "w100n-pdf-link", onClick: () => setReply(null), children: t.cancel }),
-            /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", disabled: !reply.body.trim() || posting === "busy", onClick: () => void answer(c), children: [
-              /* @__PURE__ */ jsx2(Reply, { "aria-hidden": true }),
+        reply?.id === c.id && /* @__PURE__ */ jsxs3("div", { className: "w100n-text-reply", onClick: (e) => e.stopPropagation(), children: [
+          /* @__PURE__ */ jsx3(Mentions, { autoFocus: true, value: reply.body, placeholder: t.writeComment, label: t.reply, people, onChange: (body) => setReply({ ...reply, body }), onSend: () => void answer(c) }),
+          /* @__PURE__ */ jsxs3("span", { className: "w100n-pdf-dialog-end", children: [
+            /* @__PURE__ */ jsx3("button", { type: "button", className: "w100n-pdf-link", onClick: () => setReply(null), children: t.cancel }),
+            /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", disabled: !reply.body.trim() || posting === "busy", onClick: () => void answer(c), children: [
+              /* @__PURE__ */ jsx3(Reply, { "aria-hidden": true }),
               t.reply
             ] })
           ] })
         ] }),
-        can.comment && reply?.id !== c.id && /* @__PURE__ */ jsxs2("span", { className: "w100n-text-actions", onClick: (e) => e.stopPropagation(), children: [
-          c.resolved && /* @__PURE__ */ jsx2("span", { className: "w100n-docs-badge", children: t.resolved }),
-          !c.resolved && /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", onClick: () => setReply({ id: c.id, body: "" }), children: [
-            /* @__PURE__ */ jsx2(Reply, { "aria-hidden": true }),
+        can.comment && reply?.id !== c.id && /* @__PURE__ */ jsxs3("span", { className: "w100n-text-actions", onClick: (e) => e.stopPropagation(), children: [
+          c.resolved && /* @__PURE__ */ jsx3("span", { className: "w100n-docs-badge", children: t.resolved }),
+          !c.resolved && /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", onClick: () => setReply({ id: c.id, body: "" }), children: [
+            /* @__PURE__ */ jsx3(Reply, { "aria-hidden": true }),
             t.reply
           ] }),
-          host?.resolveComment && /* @__PURE__ */ jsxs2("button", { type: "button", className: "w100n-docs-action", "data-tone": "green", onClick: () => void settle(c), children: [
-            c.resolved ? /* @__PURE__ */ jsx2(RotateCcw, { "aria-hidden": true }) : /* @__PURE__ */ jsx2(Check, { "aria-hidden": true }),
+          host?.resolveComment && /* @__PURE__ */ jsxs3("button", { type: "button", className: "w100n-docs-action", "data-tone": "green", onClick: () => void settle(c), children: [
+            c.resolved ? /* @__PURE__ */ jsx3(RotateCcw, { "aria-hidden": true }) : /* @__PURE__ */ jsx3(Check, { "aria-hidden": true }),
             c.resolved ? t.reopen : t.resolve
           ] })
         ] })
@@ -1559,4 +1690,4 @@ img { max-width: 100%; } img[data-wrap='left'] { float: left; margin: 0 12pt 6pt
 export {
   TextEditor as default
 };
-//# sourceMappingURL=TextEditor-D6QH2B7O.js.map
+//# sourceMappingURL=TextEditor-BF6HCNHL.js.map