typewright 0.2.1

package/dist/react/index.js

@@ -0,0 +1,3644 @@
+import { COMMANDS, highlightToHtml, mapAnchor, applyCommand, setAlignment, removeColumn, removeRow, addColumn, addRow, cellSourceRange, collectMarkers, hiddenMarkers } from '../chunk-CZQO7TTL.js';
+import { createStreamController, pipeStream, anticipate } from '../chunk-KNEKNZXK.js';
+import { parse, renderToHtml, renderNode, parseIncremental, renderInline, walk, safeUrl } from '../chunk-M6IVEMXO.js';
+import { createSandbox, resolveTransform } from '../chunk-NJ7PJKHN.js';
+import * as React7 from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+function wrapBlock(block) {
+  return { type: "document", from: block.from, to: block.to, children: [block] };
+}
+function firstTextIn(node) {
+  if (node.nodeType === 3) return node;
+  const w = node.ownerDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT);
+  return w.nextNode() ?? null;
+}
+function lastTextIn(node) {
+  if (node.nodeType === 3) return node;
+  const w = node.ownerDocument.createTreeWalker(node, NodeFilter.SHOW_TEXT);
+  let last = null;
+  let n = w.nextNode();
+  while (n) {
+    last = n;
+    n = w.nextNode();
+  }
+  return last;
+}
+function collectFmtTags(doc) {
+  const out = [];
+  walk(doc, (n) => {
+    switch (n.type) {
+      case "emphasis":
+      case "strong":
+      case "strikethrough": {
+        const kids = n.children;
+        const first = kids[0];
+        const last = kids[kids.length - 1];
+        if (first && last) {
+          const tag = n.type === "emphasis" ? "em" : n.type === "strong" ? "strong" : "del";
+          out.push({ node: n, tag, from: first.from, to: last.to });
+        }
+        break;
+      }
+      case "inlineCode": {
+        const ticks = Math.max(1, n.ticks);
+        const from = Math.min(n.from + ticks, n.to);
+        const to = Math.max(n.to - ticks, from);
+        out.push({ node: n, tag: "code", from, to });
+        break;
+      }
+      case "link":
+      case "autolink":
+        out.push({ node: n, tag: "a", from: n.from, to: n.to, href: safeUrl(n.url) });
+        break;
+      case "image":
+        out.push({ node: n, tag: "span", className: "tw-cr-img", from: n.from, to: n.to });
+        break;
+      case "math":
+        out.push({ node: n, tag: "span", className: "tw-math-src", from: n.from, to: n.to });
+        break;
+      case "footnoteRef":
+        out.push({ node: n, tag: "sup", className: "tw-fnref", from: n.from, to: n.to });
+        break;
+    }
+    return true;
+  });
+  return out;
+}
+function tagsAt(fmts, from, to) {
+  return fmts.filter((f) => f.from <= from && to <= f.to && f.to > f.from).sort((a, b) => a.from - b.from || b.to - a.to);
+}
+function buildSegments(block, source) {
+  const doc = wrapBlock(block);
+  const markers = collectMarkers(doc, source).filter((m) => m.from >= block.from && m.to <= block.to && m.to > m.from).sort((a, b) => a.from - b.from || a.to - b.to);
+  const fmts = collectFmtTags(doc);
+  const segs = [];
+  let cur = block.from;
+  const pushContent = (from, to) => {
+    if (to > from) segs.push({ from, to, text: source.slice(from, to), kind: "content", tags: tagsAt(fmts, from, to) });
+  };
+  for (const m of markers) {
+    if (m.to <= cur) continue;
+    const from = Math.max(m.from, cur);
+    if (from > cur) pushContent(cur, from);
+    segs.push({ from, to: m.to, text: source.slice(from, m.to), kind: "marker", markerKind: m.kind, tags: tagsAt(fmts, from, m.to) });
+    cur = m.to;
+  }
+  pushContent(cur, block.to);
+  return segs;
+}
+function markerKeyLocal(from, to, blockFrom) {
+  return `${from - blockFrom}:${to - blockFrom}`;
+}
+function hiddenKeySet(block, source, sel) {
+  const doc = wrapBlock(block);
+  const set = /* @__PURE__ */ new Set();
+  if (!sel) {
+    for (const m of collectMarkers(doc, source)) {
+      if (m.from >= block.from && m.to <= block.to && m.to > m.from) set.add(markerKeyLocal(m.from, m.to, block.from));
+    }
+    return set;
+  }
+  for (const m of hiddenMarkers(doc, sel, source)) {
+    if (m.from >= block.from && m.to <= block.to && m.to > m.from) set.add(markerKeyLocal(m.from, m.to, block.from));
+  }
+  return set;
+}
+function flattenText(root) {
+  const out = [];
+  const w = root.ownerDocument.createTreeWalker(root, NodeFilter.SHOW_TEXT);
+  let n = w.nextNode();
+  while (n) {
+    out.push(n);
+    n = w.nextNode();
+  }
+  return out;
+}
+function reconstructSource(root) {
+  let s = "";
+  for (const t of flattenText(root)) s += t.data;
+  return s;
+}
+function offsetOfPoint(root, node, offset) {
+  const texts = flattenText(root);
+  let target = null;
+  let local = 0;
+  if (node.nodeType === 3) {
+    target = node;
+    local = offset;
+  } else {
+    const child = node.childNodes[offset] ?? null;
+    if (child) {
+      target = firstTextIn(child);
+      local = 0;
+      if (!target) {
+        const prev = node.childNodes[offset - 1];
+        target = prev ? lastTextIn(prev) : null;
+        local = target ? target.data.length : 0;
+      }
+    } else {
+      const prev = node.childNodes[node.childNodes.length - 1];
+      target = prev ? lastTextIn(prev) : null;
+      local = target ? target.data.length : 0;
+    }
+  }
+  if (!target) return 0;
+  let acc = 0;
+  for (const t of texts) {
+    if (t === target) return acc + Math.min(local, t.data.length);
+    acc += t.data.length;
+  }
+  return acc;
+}
+function pointAtOffset(root, offset) {
+  const texts = flattenText(root);
+  let acc = 0;
+  for (const t of texts) {
+    const len = t.data.length;
+    if (offset <= acc + len) return { node: t, offset: Math.max(0, offset - acc) };
+    acc += len;
+  }
+  const last = texts[texts.length - 1];
+  return last ? { node: last, offset: last.data.length } : { node: root, offset: 0 };
+}
+function computeSplice(oldStr, newStr) {
+  let p = 0;
+  const maxP = Math.min(oldStr.length, newStr.length);
+  while (p < maxP && oldStr.charCodeAt(p) === newStr.charCodeAt(p)) p++;
+  let s = 0;
+  const maxS = Math.min(oldStr.length - p, newStr.length - p);
+  while (s < maxS && oldStr.charCodeAt(oldStr.length - 1 - s) === newStr.charCodeAt(newStr.length - 1 - s)) s++;
+  return { from: p, to: oldStr.length - s, insert: newStr.slice(p, newStr.length - s) };
+}
+function isHidden(hidden, key) {
+  return hidden === "all" || hidden.has(key);
+}
+function paintSegments(root, segs, hidden, blockFrom) {
+  const doc = root.ownerDocument;
+  while (root.firstChild) root.removeChild(root.firstChild);
+  const stack = [];
+  for (const seg of segs) {
+    let common = 0;
+    while (common < stack.length && common < seg.tags.length && stack[common].node === seg.tags[common].node) common++;
+    stack.length = common;
+    let parent = common > 0 ? stack[common - 1].el : root;
+    for (let k = common; k < seg.tags.length; k++) {
+      const t = seg.tags[k];
+      const el = doc.createElement(t.tag);
+      if (t.href !== void 0) el.setAttribute("href", t.href);
+      if (t.className) el.className = t.className;
+      parent.appendChild(el);
+      stack.push({ node: t.node, el });
+      parent = el;
+    }
+    if (seg.kind === "marker") {
+      const span = doc.createElement("span");
+      span.className = "tw-syntax";
+      span.setAttribute("data-mark", seg.markerKind ?? "");
+      const key = markerKeyLocal(seg.from, seg.to, blockFrom);
+      span.setAttribute("data-from", String(seg.from - blockFrom));
+      span.setAttribute("data-to", String(seg.to - blockFrom));
+      span.appendChild(doc.createTextNode(seg.text));
+      if (isHidden(hidden, key)) span.classList.add("tw-syntax--hidden");
+      parent.appendChild(span);
+    } else {
+      parent.appendChild(doc.createTextNode(seg.text));
+    }
+  }
+}
+function applyReveal(root, hidden) {
+  const spans = root.querySelectorAll("span.tw-syntax[data-from]");
+  spans.forEach((span) => {
+    const key = `${span.getAttribute("data-from")}:${span.getAttribute("data-to")}`;
+    span.classList.toggle("tw-syntax--hidden", isHidden(hidden, key));
+  });
+}
+var CLICK_SETTLE_MS = 40;
+var CLICK_WINDOW_MS = 250;
+var SETTLE_MS = 140;
+function blockClass(block) {
+  let c = "tw-caret-block";
+  switch (block.type) {
+    case "heading":
+      c += ` tw-cr-heading tw-cr-h${block.level}`;
+      break;
+    case "blockquote":
+      c += " tw-cr-blockquote";
+      break;
+    case "list":
+      c += " tw-cr-list";
+      break;
+    default:
+      c += " tw-cr-paragraph";
+  }
+  return c;
+}
+function CaretRevealBlock(props) {
+  const { block, source, onChange, readOnly = false } = props;
+  const rootRef = React7.useRef(null);
+  const propsRef = React7.useRef(props);
+  propsRef.current = props;
+  const editingRef = React7.useRef(false);
+  const composingRef = React7.useRef(false);
+  const blockSrcRef = React7.useRef(source.slice(block.from, block.to));
+  const blockFromRef = React7.useRef(block.from);
+  const builtKeyRef = React7.useRef(null);
+  const lastPointerRef = React7.useRef(0);
+  const settleTimer = React7.useRef(null);
+  const revealTimer = React7.useRef(null);
+  const onChangeRef = React7.useRef(onChange);
+  onChangeRef.current = onChange;
+  const readSelection = React7.useCallback(() => {
+    const root = rootRef.current;
+    if (!root) return null;
+    const win = root.ownerDocument?.defaultView;
+    const sel = win?.getSelection();
+    if (!sel || sel.rangeCount === 0 || !sel.anchorNode || !root.contains(sel.anchorNode)) return null;
+    const base = blockFromRef.current;
+    const a = offsetOfPoint(root, sel.anchorNode, sel.anchorOffset) + base;
+    const f = sel.focusNode && root.contains(sel.focusNode) ? offsetOfPoint(root, sel.focusNode, sel.focusOffset) + base : a;
+    return { from: Math.min(a, f), to: Math.max(a, f) };
+  }, []);
+  const restoreCaret = React7.useCallback((docOffset) => {
+    const root = rootRef.current;
+    if (!root) return;
+    const win = root.ownerDocument?.defaultView;
+    if (!win) return;
+    let { node, offset } = pointAtOffset(root, docOffset - blockFromRef.current);
+    const inHidden = (n) => (n.nodeType === 3 ? n.parentElement : n)?.closest(".tw-syntax--hidden") != null;
+    if (inHidden(node)) {
+      const texts = flattenText(root);
+      const idx = texts.indexOf(node);
+      let j = idx + 1;
+      while (j < texts.length && inHidden(texts[j])) j++;
+      if (j < texts.length) {
+        node = texts[j];
+        offset = 0;
+      } else {
+        let k = idx - 1;
+        while (k >= 0 && inHidden(texts[k])) k--;
+        if (k >= 0) {
+          node = texts[k];
+          offset = texts[k].data.length;
+        }
+      }
+    }
+    try {
+      const range = root.ownerDocument.createRange();
+      range.setStart(node, Math.min(offset, node.nodeType === 3 ? node.data.length : node.childNodes.length));
+      range.collapse(true);
+      const sel = win.getSelection();
+      sel?.removeAllRanges();
+      sel?.addRange(range);
+    } catch {
+    }
+  }, []);
+  const paint = React7.useCallback((b, src, sel) => {
+    const root = rootRef.current;
+    if (!root) return;
+    const segs = buildSegments(b, src);
+    const hidden = sel ? hiddenKeySet(b, src, sel) : "all";
+    paintSegments(root, segs, hidden, b.from);
+    blockSrcRef.current = src.slice(b.from, b.to);
+    blockFromRef.current = b.from;
+    builtKeyRef.current = `${b.from}:${blockSrcRef.current}`;
+  }, []);
+  const updateReveal = React7.useCallback(() => {
+    const root = rootRef.current;
+    if (!root) return;
+    const { block: b, source: src } = propsRef.current;
+    const sel = readSelection();
+    applyReveal(root, sel ? hiddenKeySet(b, src, sel) : "all");
+  }, [readSelection]);
+  const syncModel = React7.useCallback(() => {
+    const root = rootRef.current;
+    if (!root) return;
+    const next = reconstructSource(root);
+    const prev = blockSrcRef.current;
+    if (next === prev) return;
+    const sp = computeSplice(prev, next);
+    blockSrcRef.current = next;
+    const base = blockFromRef.current;
+    onChangeRef.current({ from: base + sp.from, to: base + sp.to, insert: sp.insert });
+  }, []);
+  const settleRetokenize = React7.useCallback(() => {
+    const root = rootRef.current;
+    if (!root || composingRef.current || !editingRef.current) return;
+    const { block: b, source: src } = propsRef.current;
+    const committed = src.slice(b.from, b.to);
+    const domSrc = reconstructSource(root);
+    if (committed === domSrc) {
+      const sel = readSelection();
+      paint(b, src, sel);
+      if (sel) restoreCaret(sel.to);
+      return;
+    }
+    if (domSrc.length > committed.length && domSrc.startsWith(committed) && src.startsWith(domSrc, b.from)) {
+      const sel = readSelection();
+      paint(b, src, null);
+      if (sel) restoreCaret(Math.min(sel.to, b.to));
+    }
+  }, [paint, readSelection, restoreCaret]);
+  const scheduleSettle = React7.useCallback(() => {
+    const win = rootRef.current?.ownerDocument?.defaultView;
+    if (!win) return;
+    if (settleTimer.current != null) win.clearTimeout(settleTimer.current);
+    settleTimer.current = win.setTimeout(() => {
+      settleTimer.current = null;
+      settleRetokenize();
+    }, SETTLE_MS);
+  }, [settleRetokenize]);
+  React7.useLayoutEffect(() => {
+    if (editingRef.current) return;
+    const key = `${block.from}:${source.slice(block.from, block.to)}`;
+    if (builtKeyRef.current === key) {
+      blockSrcRef.current = source.slice(block.from, block.to);
+      blockFromRef.current = block.from;
+      return;
+    }
+    paint(block, source, null);
+  }, [block, source, readOnly, paint]);
+  React7.useEffect(() => {
+    const root = rootRef.current;
+    const doc = root?.ownerDocument;
+    if (!doc) return void 0;
+    const win = doc.defaultView;
+    const onSelectionChange = () => {
+      if (!editingRef.current || composingRef.current) return;
+      const sel = win?.getSelection();
+      if (!sel || !sel.anchorNode || !root.contains(sel.anchorNode)) return;
+      const clickInitiated = Date.now() - lastPointerRef.current < CLICK_WINDOW_MS;
+      if (revealTimer.current != null) win?.clearTimeout(revealTimer.current);
+      if (clickInitiated && win) {
+        revealTimer.current = win.setTimeout(() => {
+          revealTimer.current = null;
+          updateReveal();
+        }, CLICK_SETTLE_MS);
+      } else {
+        updateReveal();
+      }
+    };
+    doc.addEventListener("selectionchange", onSelectionChange);
+    return () => {
+      doc.removeEventListener("selectionchange", onSelectionChange);
+      if (win) {
+        if (revealTimer.current != null) win.clearTimeout(revealTimer.current);
+        if (settleTimer.current != null) win.clearTimeout(settleTimer.current);
+      }
+    };
+  }, [updateReveal]);
+  const onFocus = React7.useCallback(() => {
+    editingRef.current = true;
+    updateReveal();
+  }, [updateReveal]);
+  const onBlur = React7.useCallback(() => {
+    editingRef.current = false;
+    const win = rootRef.current?.ownerDocument?.defaultView;
+    if (win) {
+      if (settleTimer.current != null) win.clearTimeout(settleTimer.current);
+      if (revealTimer.current != null) win.clearTimeout(revealTimer.current);
+    }
+    syncModel();
+    composingRef.current = false;
+    const { block: b, source: src } = propsRef.current;
+    builtKeyRef.current = null;
+    paint(b, src, null);
+  }, [paint, syncModel]);
+  const onInput = React7.useCallback(() => {
+    if (composingRef.current) return;
+    syncModel();
+    scheduleSettle();
+  }, [syncModel, scheduleSettle]);
+  const onCompositionStart = React7.useCallback(() => {
+    composingRef.current = true;
+  }, []);
+  const onCompositionEnd = React7.useCallback(() => {
+    composingRef.current = false;
+    syncModel();
+    scheduleSettle();
+  }, [syncModel, scheduleSettle]);
+  const onPointerDown = React7.useCallback(() => {
+    lastPointerRef.current = Date.now();
+  }, []);
+  const onKeyDown = React7.useCallback((e) => {
+    if (readOnly) return;
+    if (e.key === "Enter") {
+      e.preventDefault();
+      insertPlainText(e.currentTarget, "\n");
+      return;
+    }
+    if (e.key === "Backspace") {
+      const sel = readSelection();
+      const { block: b, source: src } = propsRef.current;
+      if (sel && sel.from === sel.to && sel.from === b.from && b.from > 0 && !composingRef.current) {
+        let sepStart = b.from;
+        while (sepStart > 0 && (src[sepStart - 1] === "\n" || src[sepStart - 1] === " " || src[sepStart - 1] === "	")) sepStart--;
+        if (sepStart < b.from) {
+          e.preventDefault();
+          onChangeRef.current({ from: sepStart, to: b.from, insert: "" });
+        }
+      }
+    }
+  }, [readOnly, readSelection]);
+  const onPaste = React7.useCallback((e) => {
+    if (readOnly) return;
+    e.preventDefault();
+    const text = e.clipboardData.getData("text/plain");
+    if (text) insertPlainText(e.currentTarget, text);
+  }, [readOnly]);
+  const label = block.type === "heading" ? `Heading ${block.level}` : block.type === "blockquote" ? "Blockquote" : block.type === "list" ? "List" : "Paragraph";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: rootRef,
+      className: blockClass(block),
+      "data-typewright": "caret-block",
+      "data-block-type": block.type,
+      "data-tw-from": block.from,
+      "data-tw-to": block.to,
+      role: "textbox",
+      "aria-multiline": "true",
+      "aria-label": `${label} (Markdown, source reveals at the caret)`,
+      contentEditable: !readOnly,
+      suppressContentEditableWarning: true,
+      spellCheck: false,
+      tabIndex: readOnly ? void 0 : 0,
+      onFocus: readOnly ? void 0 : onFocus,
+      onBlur: readOnly ? void 0 : onBlur,
+      onInput: readOnly ? void 0 : onInput,
+      onCompositionStart: readOnly ? void 0 : onCompositionStart,
+      onCompositionEnd: readOnly ? void 0 : onCompositionEnd,
+      onPointerDown: readOnly ? void 0 : onPointerDown,
+      onKeyDown: readOnly ? void 0 : onKeyDown,
+      onPaste: readOnly ? void 0 : onPaste
+    }
+  );
+}
+function insertPlainText(root, text) {
+  const doc = root.ownerDocument;
+  const win = doc?.defaultView;
+  const exec = doc?.execCommand;
+  if (!text.includes("\n") && doc && typeof exec === "function") {
+    try {
+      if (exec.call(doc, "insertText", false, text)) return;
+    } catch {
+    }
+  }
+  const sel = win?.getSelection();
+  if (!sel || sel.rangeCount === 0) return;
+  const range = sel.getRangeAt(0);
+  range.deleteContents();
+  const node = doc.createTextNode(text);
+  range.insertNode(node);
+  range.setStartAfter(node);
+  range.collapse(true);
+  sel.removeAllRanges();
+  sel.addRange(range);
+  root.dispatchEvent(new Event("input", { bubbles: true }));
+}
+var CARET_REVEAL_CSS = `
+.tw-caret-block{white-space:pre-wrap;overflow-wrap:break-word;outline:none;cursor:text;border-radius:6px;padding:1px 4px;margin-left:-4px;transition:background .15s}
+.tw-mode-unified .tw-caret-block:hover{background:var(--tw-accent-soft)}
+.tw-caret-block:focus-visible{outline:2px solid var(--tw-accent);outline-offset:2px}
+.tw-caret-block.tw-cr-heading{font-weight:680;letter-spacing:-.02em;line-height:1.25}
+.tw-caret-block.tw-cr-h1{font-size:1.8em} .tw-caret-block.tw-cr-h2{font-size:1.45em} .tw-caret-block.tw-cr-h3{font-size:1.2em} .tw-caret-block.tw-cr-h4{font-size:1.05em} .tw-caret-block.tw-cr-h5{font-size:1em} .tw-caret-block.tw-cr-h6{font-size:.92em;color:var(--tw-muted)}
+.tw-caret-block.tw-cr-blockquote{border-left:3px solid var(--tw-line);padding-left:14px;color:var(--tw-muted)}
+.tw-caret-block.tw-cr-list{padding-left:6px}
+.tw-caret-block a{color:var(--tw-accent);text-decoration:none;border-bottom:1px solid var(--tw-accent-soft)}
+.tw-caret-block code{font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:.88em;background:var(--tw-chip);border:1px solid var(--tw-line);border-radius:5px;padding:1px 5px}
+.tw-caret-block .tw-cr-img{color:var(--tw-muted);font-style:italic}
+.tw-caret-block .tw-fnref{font-size:.82em;color:var(--tw-accent)}
+/* Revealed marker: subtle, monospace, "you are editing raw syntax". */
+.tw-syntax{font-family:"SF Mono",ui-monospace,Menlo,monospace;color:var(--tw-faint);opacity:.85;font-weight:400;font-style:normal}
+/* Hidden marker: collapsed out of layout, but its source chars stay in the DOM
+   (and in this component's offset mapping) \u2014 never removed from the string. */
+.tw-syntax--hidden{display:none}
+@media (prefers-reduced-motion: reduce){ .tw-caret-block{transition:none} }
+`;
+var REACT_EMOJI = ["\u{1F44D}", "\u{1F3AF}", "\u{1F440}", "\u{1F389}"];
+function CommentsSidebar(props) {
+  const {
+    threads,
+    me,
+    open,
+    onClose,
+    onReply,
+    onReact,
+    onResolve,
+    onDelete,
+    activeThreadId,
+    onSelectThread
+  } = props;
+  const activeElRef = React7.useRef(null);
+  const [flashId, setFlashId] = React7.useState(void 0);
+  React7.useEffect(() => {
+    if (!open || !activeThreadId) return;
+    activeElRef.current?.scrollIntoView({ block: "nearest", behavior: "smooth" });
+    setFlashId(activeThreadId);
+    const t = setTimeout(() => setFlashId(void 0), 1400);
+    return () => clearTimeout(t);
+  }, [open, activeThreadId]);
+  if (!open) return null;
+  const count = threads.length;
+  return /* @__PURE__ */ jsxs(
+    "aside",
+    {
+      className: "tw-comments-sidebar",
+      role: "complementary",
+      "aria-label": "Comments",
+      "data-typewright": "comments",
+      children: [
+        /* @__PURE__ */ jsxs("header", { className: "tw-comments-head", children: [
+          /* @__PURE__ */ jsx("span", { className: "tw-comments-title", children: "Comments" }),
+          /* @__PURE__ */ jsx("span", { className: "tw-comments-count", "aria-label": `${count} comment${count === 1 ? "" : "s"}`, children: count }),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "tw-comments-close",
+              "aria-label": "Close comments panel",
+              onClick: onClose,
+              children: /* @__PURE__ */ jsx("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.9", strokeLinecap: "round", children: /* @__PURE__ */ jsx("path", { d: "M6 6l12 12M18 6L6 18" }) })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "tw-comments-body", children: count === 0 ? /* @__PURE__ */ jsxs("div", { className: "tw-comments-empty", children: [
+          "No comments yet.",
+          /* @__PURE__ */ jsx("br", {}),
+          "Select text in the editor to start a thread."
+        ] }) : threads.map((thread) => /* @__PURE__ */ jsx(
+          ThreadCard,
+          {
+            thread,
+            me,
+            active: thread.id === activeThreadId,
+            flash: thread.id === flashId,
+            innerRef: thread.id === activeThreadId ? (el) => {
+              activeElRef.current = el;
+            } : void 0,
+            onReply,
+            onReact,
+            onResolve,
+            onDelete,
+            onSelect: onSelectThread
+          },
+          thread.id
+        )) })
+      ]
+    }
+  );
+}
+function ThreadCard(props) {
+  const { thread, me, active, flash, innerRef, onReply, onReact, onResolve, onDelete, onSelect } = props;
+  const [draft, setDraft] = React7.useState("");
+  const submitReply = React7.useCallback(() => {
+    const body = draft.trim();
+    if (!body) return;
+    onReply(thread.id, body);
+    setDraft("");
+  }, [draft, onReply, thread.id]);
+  const cls = [
+    "tw-comment-thread",
+    thread.resolved ? "resolved" : "",
+    active ? "tw-comment-thread--active" : "",
+    flash ? "tw-comment-thread--flash" : ""
+  ].filter(Boolean).join(" ");
+  const selectFromCard = (e) => {
+    if (!onSelect) return;
+    if (e.target.closest("button, textarea, input, a")) return;
+    onSelect(thread.id);
+  };
+  return /* @__PURE__ */ jsxs("article", { ref: innerRef, className: cls, onClick: selectFromCard, children: [
+    thread.quote ? /* @__PURE__ */ jsxs("div", { className: "tw-comment-quote", children: [
+      "\u201C",
+      thread.quote,
+      "\u201D"
+    ] }) : null,
+    /* @__PURE__ */ jsx(CommentRow, { author: thread.author, body: thread.body, createdAt: thread.createdAt }),
+    /* @__PURE__ */ jsx("div", { className: "tw-comment-reacts", children: REACT_EMOJI.map((emoji) => {
+      const users = thread.reactions?.[emoji];
+      const n = users?.length ?? 0;
+      const mine = !!(me && users?.includes(me.id));
+      return /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          className: "tw-comment-react",
+          "aria-pressed": mine,
+          "aria-label": `React ${emoji}${n ? `, ${n}` : ""}`,
+          onClick: () => onReact(thread.id, emoji),
+          children: [
+            /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: emoji }),
+            n > 0 ? /* @__PURE__ */ jsx("span", { className: "tw-comment-react-n", children: n }) : null
+          ]
+        },
+        emoji
+      );
+    }) }),
+    thread.replies.length > 0 ? /* @__PURE__ */ jsx("div", { className: "tw-comment-replies", children: thread.replies.map((r) => /* @__PURE__ */ jsx(CommentRow, { author: r.author, body: r.body, createdAt: r.createdAt }, r.id)) }) : null,
+    /* @__PURE__ */ jsxs("div", { className: "tw-comment-reply", children: [
+      /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          value: draft,
+          onChange: (e) => setDraft(e.currentTarget.value),
+          onKeyDown: (e) => {
+            if (e.key === "Enter" && !e.shiftKey) {
+              e.preventDefault();
+              submitReply();
+            }
+          },
+          placeholder: "Reply\u2026",
+          "aria-label": "Reply to thread",
+          rows: 1
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "tw-comment-btn",
+          "aria-label": "Send reply",
+          disabled: !draft.trim(),
+          onClick: submitReply,
+          children: "Send"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "tw-comment-actions", children: [
+      onDelete ? /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "tw-comment-btn tw-comment-del",
+          "aria-label": "Delete thread",
+          onClick: () => onDelete(thread.id),
+          children: "Delete"
+        }
+      ) : null,
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "tw-comment-btn",
+          "aria-label": thread.resolved ? "Reopen thread" : "Resolve thread",
+          "aria-pressed": !!thread.resolved,
+          onClick: () => onResolve(thread.id, !thread.resolved),
+          children: thread.resolved ? "Reopen" : "Resolve"
+        }
+      )
+    ] })
+  ] });
+}
+function CommentRow(props) {
+  const { author, body, createdAt } = props;
+  const when = formatWhen(createdAt);
+  return /* @__PURE__ */ jsxs("div", { className: "tw-comment-row", children: [
+    /* @__PURE__ */ jsx("span", { className: "tw-comment-av", style: { background: avatarColor(author) }, "aria-hidden": "true", children: initials(author) }),
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsxs("div", { className: "tw-comment-who", children: [
+        author,
+        when ? /* @__PURE__ */ jsx("span", { className: "tw-comment-when", children: when }) : null
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "tw-comment-text", children: body })
+    ] })
+  ] });
+}
+function initials(name) {
+  const parts = name.trim().split(/\s+/).filter(Boolean);
+  if (parts.length === 0) return "?";
+  const first = parts[0]?.[0] ?? "";
+  const last = parts.length > 1 ? parts[parts.length - 1]?.[0] ?? "" : "";
+  return (first + last).toUpperCase() || "?";
+}
+function avatarColor(name) {
+  let h = 0;
+  for (let i = 0; i < name.length; i++) h = h * 31 + name.charCodeAt(i) >>> 0;
+  return `hsl(${h % 360} 58% 60%)`;
+}
+function formatWhen(iso) {
+  if (!iso) return "";
+  const t = Date.parse(iso);
+  if (Number.isNaN(t)) return "";
+  const s = Math.max(0, (Date.now() - t) / 1e3);
+  if (s < 45) return "now";
+  const m = s / 60;
+  if (m < 45) return `${Math.round(m)}m`;
+  const hrs = m / 60;
+  if (hrs < 24) return `${Math.round(hrs)}h`;
+  const d = hrs / 24;
+  if (d < 7) return `${Math.round(d)}d`;
+  const w = d / 7;
+  if (w < 5) return `${Math.round(w)}w`;
+  return new Date(t).toLocaleDateString();
+}
+var COMMENTS_CSS = `
+.tw-comments-sidebar { --tw-fg:#1a1d20; --tw-muted:#5a6169; --tw-faint:#8b929a; --tw-bg:#ffffff; --tw-chip:#f0f1f3; --tw-line:rgba(18,22,27,.1); --tw-accent:#2f6fed; --tw-accent-soft:rgba(47,111,237,.1); position:absolute; top:0; right:0; bottom:0; width:min(340px,82vw); display:flex; flex-direction:column; box-sizing:border-box; background:var(--tw-bg); color:var(--tw-fg); border-left:1px solid var(--tw-line); font-family:-apple-system,"SF Pro Text",system-ui,sans-serif; font-size:15px; line-height:1.5; z-index:20; box-shadow:-8px 0 24px -18px rgba(0,0,0,.4); animation:tw-comments-in .26s cubic-bezier(.32,.72,0,1) both; }
+@media (prefers-color-scheme: dark) { .tw-comments-sidebar:not(.tw-theme-light) { --tw-fg:#e8eaed; --tw-muted:#a3abb2; --tw-faint:#6a727a; --tw-bg:#0f1215; --tw-chip:#1e242b; --tw-line:rgba(255,255,255,.1); --tw-accent:#6ea3ff; --tw-accent-soft:rgba(110,163,255,.14); } }
+.tw-comments-sidebar.tw-theme-dark, :root[data-theme="dark"] .tw-comments-sidebar { --tw-fg:#e8eaed; --tw-muted:#a3abb2; --tw-faint:#6a727a; --tw-bg:#0f1215; --tw-chip:#1e242b; --tw-line:rgba(255,255,255,.1); --tw-accent:#6ea3ff; --tw-accent-soft:rgba(110,163,255,.14); }
+:root[data-theme="light"] .tw-comments-sidebar { --tw-fg:#1a1d20; --tw-muted:#5a6169; --tw-faint:#8b929a; --tw-bg:#ffffff; --tw-chip:#f0f1f3; --tw-line:rgba(18,22,27,.1); --tw-accent:#2f6fed; --tw-accent-soft:rgba(47,111,237,.1); }
+@keyframes tw-comments-in { from { transform:translateX(16px); opacity:0 } to { transform:none; opacity:1 } }
+.tw-comments-head { display:flex; align-items:center; gap:8px; padding:11px 14px; border-bottom:1px solid var(--tw-line); background:color-mix(in srgb, var(--tw-bg) 80%, transparent); backdrop-filter:blur(18px) saturate(1.6); -webkit-backdrop-filter:blur(18px) saturate(1.6); position:sticky; top:0; z-index:2; }
+.tw-comments-title { font-size:14px; font-weight:660; letter-spacing:-.01em; }
+.tw-comments-count { font-size:11.5px; font-weight:640; color:var(--tw-muted); background:var(--tw-chip); border:1px solid var(--tw-line); border-radius:999px; padding:1px 8px; line-height:1.5; }
+.tw-comments-close { margin-left:auto; width:28px; height:28px; padding:0; border:1px solid transparent; background:transparent; color:var(--tw-muted); border-radius:7px; cursor:pointer; display:grid; place-items:center; transition:color .15s, background .15s; }
+.tw-comments-close:hover { color:var(--tw-fg); background:var(--tw-accent-soft); }
+.tw-comments-close:focus-visible { outline:2px solid var(--tw-accent); outline-offset:2px; }
+.tw-comments-body { flex:1; overflow-y:auto; padding:12px; }
+.tw-comments-empty { color:var(--tw-faint); font-size:13px; text-align:center; padding:34px 14px; line-height:1.55; }
+.tw-comment-thread { border:1px solid var(--tw-line); border-radius:12px; padding:12px; margin-bottom:12px; background:var(--tw-bg); transition:box-shadow .2s, border-color .2s, opacity .2s; }
+.tw-comment-thread:last-child { margin-bottom:0; }
+.tw-comment-thread.resolved { opacity:.58; }
+.tw-comment-thread--active { border-color:var(--tw-accent); }
+.tw-comment-thread--flash { animation:tw-comment-flash 1.4s ease; }
+@keyframes tw-comment-flash { 0%,100% { box-shadow:0 0 0 0 transparent } 12%,70% { box-shadow:0 0 0 3px var(--tw-accent-soft) } }
+.tw-comment-quote { font-size:12px; color:var(--tw-muted); border-left:2px solid var(--tw-accent-soft); padding:1px 0 1px 8px; margin-bottom:8px; font-style:italic; }
+.tw-comment-row { display:flex; gap:8px; margin-bottom:8px; }
+.tw-comment-av { width:24px; height:24px; border-radius:50%; display:grid; place-items:center; font-size:10px; font-weight:640; color:#0b0d0f; flex:none; }
+.tw-comment-who { font-size:12.5px; font-weight:600; }
+.tw-comment-when { font-size:11px; color:var(--tw-faint); margin-left:6px; font-weight:400; }
+.tw-comment-text { font-size:13px; color:var(--tw-fg); margin-top:1px; white-space:pre-wrap; overflow-wrap:anywhere; }
+.tw-comment-reacts { display:flex; gap:5px; flex-wrap:wrap; margin:6px 0 4px 32px; }
+.tw-comment-react { font-size:12px; border:1px solid var(--tw-line); background:var(--tw-chip); color:var(--tw-muted); border-radius:999px; padding:2px 8px; display:inline-flex; gap:4px; align-items:center; cursor:pointer; transition:border-color .15s, background .15s, color .15s; }
+.tw-comment-react:hover { border-color:var(--tw-accent); }
+.tw-comment-react[aria-pressed="true"] { border-color:var(--tw-accent); background:var(--tw-accent-soft); color:var(--tw-accent); }
+.tw-comment-react:focus-visible { outline:2px solid var(--tw-accent); outline-offset:2px; }
+.tw-comment-react-n { font-variant-numeric:tabular-nums; font-size:11px; }
+.tw-comment-replies { margin-left:32px; border-left:1px solid var(--tw-line); padding-left:10px; margin-top:6px; }
+.tw-comment-replies .tw-comment-row:last-child { margin-bottom:0; }
+.tw-comment-reply { display:flex; gap:6px; align-items:flex-end; margin:8px 0 2px 32px; }
+.tw-comment-reply textarea { flex:1; min-width:0; min-height:33px; max-height:120px; box-sizing:border-box; resize:none; background:var(--tw-bg); border:1px solid var(--tw-line); border-radius:8px; padding:7px 9px; font:inherit; font-size:12.5px; line-height:1.4; color:var(--tw-fg); outline:none; transition:border-color .15s; }
+.tw-comment-reply textarea:focus { border-color:var(--tw-accent); }
+.tw-comment-reply textarea::placeholder { color:var(--tw-faint); }
+.tw-comment-btn { border:1px solid var(--tw-line); background:var(--tw-chip); color:var(--tw-muted); border-radius:8px; padding:5px 10px; font:inherit; font-size:12px; cursor:pointer; white-space:nowrap; transition:color .15s, border-color .15s, background .15s; }
+.tw-comment-btn:hover { color:var(--tw-fg); border-color:var(--tw-accent); }
+.tw-comment-btn:focus-visible { outline:2px solid var(--tw-accent); outline-offset:2px; }
+.tw-comment-btn:disabled { opacity:.5; cursor:default; }
+.tw-comment-btn:disabled:hover { color:var(--tw-muted); border-color:var(--tw-line); }
+.tw-comment-actions { display:flex; justify-content:flex-end; align-items:center; gap:6px; margin-top:8px; }
+.tw-comment-del { margin-right:auto; }
+.tw-comment-del:hover { color:#e5484d; border-color:#e5484d; }
+@media (prefers-reduced-transparency: reduce) { .tw-comments-head { backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--tw-bg); } }
+@media (prefers-reduced-motion: reduce) { .tw-comments-sidebar, .tw-comment-thread--flash { animation:none !important; } }
+`;
+var LEVELS = [1, 2, 3, 4, 5, 6];
+var ITEM_COUNT = LEVELS.length + 4;
+var MENU_WIDTH = 250;
+var CheckIcon = /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 3, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M20 6 9 17l-5-5" }) });
+function FoldMenu(props) {
+  const {
+    open,
+    level,
+    folded,
+    anchorRect,
+    onSetLevel,
+    onToggleFold,
+    onFoldAll,
+    onUnfoldAll,
+    onCopyLink,
+    onClose
+  } = props;
+  const menuRef = React7.useRef(null);
+  const itemRefs = React7.useRef([]);
+  const focusItem = React7.useCallback((index) => {
+    const i = (index % ITEM_COUNT + ITEM_COUNT) % ITEM_COUNT;
+    itemRefs.current[i]?.focus();
+  }, []);
+  React7.useEffect(() => {
+    if (!open) return void 0;
+    const onKeyDown = (e) => {
+      if (e.key === "Escape") {
+        e.stopPropagation();
+        onClose();
+      }
+    };
+    const onPointerDown = (e) => {
+      const node = menuRef.current;
+      if (node && e.target instanceof Node && !node.contains(e.target)) onClose();
+    };
+    document.addEventListener("keydown", onKeyDown);
+    document.addEventListener("pointerdown", onPointerDown, true);
+    return () => {
+      document.removeEventListener("keydown", onKeyDown);
+      document.removeEventListener("pointerdown", onPointerDown, true);
+    };
+  }, [open, onClose]);
+  React7.useEffect(() => {
+    if (!open) return;
+    const start = level >= 1 && level <= LEVELS.length ? level - 1 : 0;
+    itemRefs.current[start]?.focus();
+  }, [open, level]);
+  if (!open) return null;
+  const onMenuKeyDown = (e) => {
+    const current = itemRefs.current.indexOf(document.activeElement);
+    switch (e.key) {
+      case "ArrowDown":
+        e.preventDefault();
+        focusItem(current < 0 ? 0 : current + 1);
+        break;
+      case "ArrowUp":
+        e.preventDefault();
+        focusItem(current < 0 ? ITEM_COUNT - 1 : current - 1);
+        break;
+      case "Home":
+        e.preventDefault();
+        focusItem(0);
+        break;
+      case "End":
+        e.preventDefault();
+        focusItem(ITEM_COUNT - 1);
+        break;
+      case "Tab":
+        e.preventDefault();
+        onClose();
+        break;
+    }
+  };
+  const run = (fn) => () => {
+    fn();
+    onClose();
+  };
+  const viewportW = typeof window === "undefined" ? MENU_WIDTH * 4 : window.innerWidth;
+  const left = anchorRect ? Math.max(8, Math.min(anchorRect.left, viewportW - MENU_WIDTH)) : 16;
+  const top = anchorRect ? anchorRect.bottom + 6 : 16;
+  const setRef = (index) => (el) => {
+    itemRefs.current[index] = el;
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: menuRef,
+      className: "tw-fold-menu",
+      role: "menu",
+      "aria-label": "Heading options",
+      "aria-orientation": "vertical",
+      style: { left, top },
+      onKeyDown: onMenuKeyDown,
+      children: [
+        LEVELS.map((l, i) => {
+          const on = level === l;
+          return /* @__PURE__ */ jsxs(
+            "button",
+            {
+              ref: setRef(i),
+              type: "button",
+              className: `tw-fold-menu-item${on ? " tw-on" : ""}`,
+              role: "menuitemradio",
+              "aria-checked": on,
+              tabIndex: -1,
+              onClick: run(() => onSetLevel(l)),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "tw-fm-chk", "aria-hidden": "true", children: CheckIcon }),
+                /* @__PURE__ */ jsx("span", { className: "tw-fm-num", "aria-hidden": "true", children: l }),
+                /* @__PURE__ */ jsxs("span", { className: "tw-fm-lab", children: [
+                  "Heading ",
+                  l
+                ] }),
+                /* @__PURE__ */ jsxs("span", { className: "tw-fm-kbd", "aria-hidden": "true", children: [
+                  "\u2318",
+                  l
+                ] })
+              ]
+            },
+            l
+          );
+        }),
+        /* @__PURE__ */ jsx("div", { className: "tw-fold-menu-sep", role: "separator" }),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            ref: setRef(LEVELS.length),
+            type: "button",
+            className: "tw-fold-menu-item",
+            role: "menuitem",
+            tabIndex: -1,
+            onClick: run(onToggleFold),
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "tw-fm-chk", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsx("span", { className: "tw-fm-lab", children: "Toggle Folding" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            ref: setRef(LEVELS.length + 1),
+            type: "button",
+            className: "tw-fold-menu-item",
+            role: "menuitem",
+            tabIndex: -1,
+            onClick: run(onFoldAll),
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "tw-fm-chk", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsx("span", { className: "tw-fm-lab", children: "Fold All Headers" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            ref: setRef(LEVELS.length + 2),
+            type: "button",
+            className: "tw-fold-menu-item",
+            role: "menuitem",
+            tabIndex: -1,
+            onClick: run(onUnfoldAll),
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "tw-fm-chk", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsx("span", { className: "tw-fm-lab", children: "Unfold All Headers" })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx("div", { className: "tw-fold-menu-sep", role: "separator" }),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            ref: setRef(LEVELS.length + 3),
+            type: "button",
+            className: "tw-fold-menu-item",
+            role: "menuitem",
+            tabIndex: -1,
+            onClick: run(onCopyLink),
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "tw-fm-chk", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsx("span", { className: "tw-fm-lab", children: "Copy Link to here" })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+var FOLDMENU_CSS = `
+.tw-fold-menu{position:fixed; z-index:100; min-width:234px; padding:6px; background:color-mix(in srgb, var(--tw-bg) 90%, transparent); backdrop-filter:blur(24px) saturate(1.7); -webkit-backdrop-filter:blur(24px) saturate(1.7); border:1px solid var(--tw-line); border-radius:14px; box-shadow:0 24px 60px -12px rgba(0,0,0,.5), 0 8px 24px -8px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.06); color:var(--tw-fg); font-family:-apple-system,"SF Pro Text",system-ui,sans-serif; animation:tw-fold-menu-in .16s cubic-bezier(.32,.72,0,1) both}
+@keyframes tw-fold-menu-in{from{opacity:0; transform:translateY(-6px) scale(.98)}to{opacity:1; transform:none}}
+.tw-fold-menu-item{display:flex; align-items:center; gap:10px; width:100%; padding:7px 9px; border:0; border-radius:9px; background:transparent; color:var(--tw-fg); font:inherit; font-size:13.5px; line-height:1.2; text-align:left; cursor:pointer; transition:background .13s}
+.tw-fold-menu-item:hover{background:var(--tw-accent-soft)}
+.tw-fold-menu-item:focus{outline:none; background:var(--tw-accent-soft)}
+.tw-fold-menu-item:focus-visible{outline:2px solid var(--tw-accent); outline-offset:-2px}
+.tw-fold-menu-item .tw-fm-chk{width:14px; height:14px; flex:none; opacity:0; color:var(--tw-accent)}
+.tw-fold-menu-item .tw-fm-chk svg{width:14px; height:14px; display:block}
+.tw-fold-menu-item.tw-on .tw-fm-chk{opacity:1}
+.tw-fold-menu-item .tw-fm-num{width:18px; height:18px; flex:none; border:1px solid var(--tw-line); border-radius:5px; display:grid; place-items:center; font-family:"SF Mono",ui-monospace,Menlo,monospace; font-size:10.5px; color:var(--tw-muted)}
+.tw-fold-menu-item .tw-fm-lab{flex:1; min-width:0}
+.tw-fold-menu-item .tw-fm-kbd{flex:none; font-family:"SF Mono",ui-monospace,Menlo,monospace; font-size:11px; color:var(--tw-faint)}
+.tw-fold-menu-sep{height:1px; margin:5px 4px; background:var(--tw-line)}
+@media (prefers-reduced-transparency: reduce){ .tw-fold-menu{background:var(--tw-bg); backdrop-filter:none; -webkit-backdrop-filter:none} }
+@media (prefers-reduced-motion: reduce){ .tw-fold-menu{animation:none !important} .tw-fold-menu-item{transition:none !important} }
+`;
+var DEBOUNCE_MS = 250;
+function frameOf(host) {
+  return host?.querySelector("iframe") ?? null;
+}
+function showFrame(iframe, height, theme) {
+  iframe.style.position = "static";
+  iframe.style.visibility = "visible";
+  iframe.style.pointerEvents = "auto";
+  iframe.style.width = "100%";
+  iframe.style.height = `${Math.max(1, Math.ceil(height ?? 0))}px`;
+  iframe.style.colorScheme = theme;
+}
+function hideFrame(iframe) {
+  iframe.style.visibility = "hidden";
+  iframe.style.height = "0";
+  iframe.style.pointerEvents = "none";
+}
+function errorText(err) {
+  if (typeof err === "string") return err;
+  if (err && typeof err === "object" && "message" in err) {
+    return String(err.message);
+  }
+  return String(err);
+}
+function SandboxIslandBase(props) {
+  const { kind, code, transform, components, sandbox, mermaidEngine, theme = "light" } = props;
+  const hostRef = React7.useRef(null);
+  const [controller, setController] = React7.useState(null);
+  const [error, setError] = React7.useState(null);
+  const themeRef = React7.useRef(theme);
+  themeRef.current = theme;
+  const needsSandbox = !(kind === "mdx" && transform === void 0);
+  const sandboxCsp = sandbox?.csp;
+  React7.useEffect(() => {
+    if (!needsSandbox) return void 0;
+    if (typeof document === "undefined") return void 0;
+    const container = hostRef.current;
+    if (!container) return void 0;
+    let ctrl = null;
+    try {
+      ctrl = createSandbox({
+        ...sandbox,
+        container,
+        mermaidEngine: kind === "mermaid" ? mermaidEngine : void 0
+      });
+    } catch (err) {
+      setError(errorText(err));
+      return void 0;
+    }
+    setController(ctrl);
+    return () => {
+      ctrl?.destroy();
+      setController(null);
+    };
+  }, [kind, needsSandbox, mermaidEngine, sandboxCsp]);
+  React7.useEffect(() => {
+    if (!controller) return void 0;
+    const iframe = frameOf(hostRef.current);
+    if (!code.trim()) {
+      setError(null);
+      if (iframe) hideFrame(iframe);
+      return void 0;
+    }
+    let canceled = false;
+    const succeed = (height) => {
+      if (canceled) return;
+      setError(null);
+      const f = frameOf(hostRef.current);
+      if (f) showFrame(f, height, themeRef.current);
+    };
+    const fail = (err) => {
+      if (canceled) return;
+      setError(errorText(err));
+      const f = frameOf(hostRef.current);
+      if (f) hideFrame(f);
+    };
+    const timer = setTimeout(() => {
+      void (async () => {
+        try {
+          if (kind === "mdx") {
+            let js;
+            try {
+              js = await resolveTransform(transform)(code);
+            } catch (err) {
+              fail(err);
+              return;
+            }
+            const result = await controller.evaluate(js, { components });
+            if (result.error) fail(result.error);
+            else succeed(result.height);
+          } else {
+            const result = await controller.renderMermaid(code);
+            if (result.error) fail(result.error);
+            else succeed(result.height);
+          }
+        } catch (err) {
+          fail(err);
+        }
+      })();
+    }, DEBOUNCE_MS);
+    return () => {
+      canceled = true;
+      clearTimeout(timer);
+    };
+  }, [controller, kind, code, transform, components]);
+  React7.useEffect(() => {
+    const iframe = frameOf(hostRef.current);
+    if (iframe && iframe.style.visibility === "visible") iframe.style.colorScheme = theme;
+  }, [theme]);
+  if (kind === "mdx" && transform === void 0) {
+    return /* @__PURE__ */ jsx("pre", { className: "tw-island-src", children: code });
+  }
+  const title = kind === "mdx" ? "Component failed" : "Diagram failed";
+  return /* @__PURE__ */ jsxs("div", { className: `tw-island tw-island-${kind}${error !== null ? " tw-island-failed" : ""}`, "data-tw-island": kind, children: [
+    /* @__PURE__ */ jsx("div", { className: "tw-island-frame", ref: hostRef, "aria-hidden": error !== null }),
+    error !== null && /* @__PURE__ */ jsxs("div", { className: "tw-island-error", role: "alert", children: [
+      /* @__PURE__ */ jsxs("div", { className: "tw-island-error-title", children: [
+        /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "\u26A0" }),
+        " ",
+        title
+      ] }),
+      /* @__PURE__ */ jsx("pre", { className: "tw-island-error-msg", children: error })
+    ] })
+  ] });
+}
+var SandboxIsland = React7.memo(SandboxIslandBase);
+var SANDBOX_ISLAND_CSS = `
+.tw-island{position:relative;margin:.6em 0;width:100%}
+.tw-island-frame{display:block;width:100%}
+.tw-island-frame iframe{display:block;border:0;width:100%;background:transparent;color-scheme:inherit}
+.tw-island-src{white-space:pre-wrap}
+.tw-island-error{border:1px solid color-mix(in srgb, #e5484d 42%, var(--tw-line));border-left:3px solid #e5484d;border-radius:9px;background:color-mix(in srgb, #e5484d 8%, var(--tw-bg));padding:9px 12px;margin:.2em 0}
+.tw-island-error-title{display:flex;align-items:center;gap:6px;font-size:12.5px;font-weight:640;color:#e5484d}
+.tw-island-error-msg{margin:5px 0 0;padding:0;border:0;background:none;font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:11.5px;line-height:1.5;color:var(--tw-muted);white-space:pre-wrap;overflow-wrap:anywhere}
+`;
+var MODE_OPTIONS = [
+  { value: "edit", label: "Edit" },
+  { value: "unified", label: "Unified" },
+  { value: "preview", label: "Preview" },
+  { value: "read", label: "Read" }
+];
+var TOOLBAR_OPTIONS = [
+  { value: "off", label: "Off" },
+  { value: "docked", label: "Docked" },
+  { value: "floating", label: "Floating" }
+];
+var THEME_OPTIONS = [
+  { value: "light", label: "Light" },
+  { value: "dark", label: "Dark" },
+  { value: "auto", label: "Auto" }
+];
+var EXTENSION_OPTIONS = [
+  { key: "gfm", label: "GitHub Flavored MD", kbd: "gfm" },
+  { key: "mdx", label: "MDX v3", kbd: "mdx" },
+  { key: "mermaid", label: "Mermaid", kbd: "mermaid" },
+  { key: "math", label: "Math (KaTeX)", kbd: "math" },
+  { key: "syntaxHighlight", label: "Syntax highlight", kbd: "syntaxHl" }
+];
+function Segmented(props) {
+  const { label, value, options, onSelect } = props;
+  return /* @__PURE__ */ jsx("div", { className: "tw-seg", role: "group", "aria-label": label, children: options.map((o) => /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      className: "tw-seg-btn",
+      "aria-pressed": o.value === value,
+      onClick: () => onSelect(o.value),
+      children: o.label
+    },
+    o.value
+  )) });
+}
+function ToggleRow(props) {
+  const { label, kbd, checked, onToggle } = props;
+  const id = React7.useId();
+  return /* @__PURE__ */ jsxs("div", { className: "tw-set-toggle", children: [
+    /* @__PURE__ */ jsxs("span", { className: "tw-set-toggle-label", id, children: [
+      label,
+      kbd ? /* @__PURE__ */ jsx("span", { className: "tw-set-toggle-kbd", children: kbd }) : null
+    ] }),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tw-sw",
+        role: "switch",
+        "aria-checked": checked,
+        "aria-labelledby": id,
+        onClick: onToggle
+      }
+    )
+  ] });
+}
+function trapTab(e, container) {
+  if (e.key !== "Tab" || !container) return;
+  const nodes = Array.from(
+    container.querySelectorAll(
+      'button, [href], input, textarea, select, [tabindex]:not([tabindex="-1"])'
+    )
+  ).filter((n) => !n.disabled && n.offsetParent !== null);
+  if (nodes.length === 0) {
+    e.preventDefault();
+    return;
+  }
+  const first = nodes[0];
+  const last = nodes[nodes.length - 1];
+  const active = document.activeElement;
+  if (e.shiftKey && active === first) {
+    e.preventDefault();
+    last.focus();
+  } else if (!e.shiftKey && active === last) {
+    e.preventDefault();
+    first.focus();
+  }
+}
+function SettingsPanel(props) {
+  const { open, onClose, state, onChange } = props;
+  const panelRef = React7.useRef(null);
+  React7.useEffect(() => {
+    if (!open) return;
+    const el = panelRef.current;
+    if (!el) return;
+    const first = el.querySelector("button, input, [tabindex]");
+    const raf = requestAnimationFrame(() => (first ?? el).focus());
+    return () => cancelAnimationFrame(raf);
+  }, [open]);
+  if (!open) return null;
+  const toolbarValue = state.toolbar === false ? "off" : state.toolbar === "floating" ? "floating" : "docked";
+  const themeClass = state.theme === "dark" ? "tw-theme-dark" : state.theme === "light" ? "tw-theme-light" : "";
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `tw-settings-overlay${themeClass ? " " + themeClass : ""}`,
+      onMouseDown: (e) => {
+        if (e.target === e.currentTarget) onClose();
+      },
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "tw-settings-panel",
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": "Editor settings",
+          tabIndex: -1,
+          ref: panelRef,
+          onKeyDown: (e) => {
+            if (e.key === "Escape") {
+              e.preventDefault();
+              onClose();
+              return;
+            }
+            trapTab(e, panelRef.current);
+          },
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "tw-settings-head", children: [
+              /* @__PURE__ */ jsx("span", { className: "tw-settings-title", children: "Settings" }),
+              /* @__PURE__ */ jsx("button", { type: "button", className: "tw-settings-close", "aria-label": "Close settings", onClick: onClose, children: "\xD7" })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "tw-settings-body", children: [
+              /* @__PURE__ */ jsxs("section", { className: "tw-set-section", children: [
+                /* @__PURE__ */ jsx("h4", { className: "tw-set-h4", children: "Mode" }),
+                /* @__PURE__ */ jsx(
+                  Segmented,
+                  {
+                    label: "Editor mode",
+                    value: state.mode,
+                    options: MODE_OPTIONS,
+                    onSelect: (mode) => onChange({ mode })
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("section", { className: "tw-set-section", children: [
+                /* @__PURE__ */ jsx("h4", { className: "tw-set-h4", children: "Toolbar" }),
+                /* @__PURE__ */ jsx(
+                  Segmented,
+                  {
+                    label: "Toolbar mode",
+                    value: toolbarValue,
+                    options: TOOLBAR_OPTIONS,
+                    onSelect: (v) => onChange({ toolbar: v === "off" ? false : v })
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("section", { className: "tw-set-section", children: [
+                /* @__PURE__ */ jsx("h4", { className: "tw-set-h4", children: "Theme" }),
+                /* @__PURE__ */ jsx(
+                  Segmented,
+                  {
+                    label: "Theme appearance",
+                    value: state.theme,
+                    options: THEME_OPTIONS,
+                    onSelect: (theme) => onChange({ theme })
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("section", { className: "tw-set-section", children: [
+                /* @__PURE__ */ jsx("h4", { className: "tw-set-h4", children: "Section folding" }),
+                /* @__PURE__ */ jsx("div", { className: "tw-toggle-list", children: /* @__PURE__ */ jsx(
+                  ToggleRow,
+                  {
+                    label: "Fold headings",
+                    checked: state.folding,
+                    onToggle: () => onChange({ folding: !state.folding })
+                  }
+                ) })
+              ] }),
+              /* @__PURE__ */ jsxs("section", { className: "tw-set-section", children: [
+                /* @__PURE__ */ jsx("h4", { className: "tw-set-h4", children: "Extensions" }),
+                /* @__PURE__ */ jsx("div", { className: "tw-toggle-list", children: EXTENSION_OPTIONS.map((ext) => /* @__PURE__ */ jsx(
+                  ToggleRow,
+                  {
+                    label: ext.label,
+                    kbd: ext.kbd,
+                    checked: !!state.extensions[ext.key],
+                    onToggle: () => onChange({
+                      extensions: { [ext.key]: !state.extensions[ext.key] }
+                    })
+                  },
+                  ext.key
+                )) })
+              ] })
+            ] })
+          ]
+        }
+      )
+    }
+  );
+}
+function fuzzyScore(query, text) {
+  const q = query.toLowerCase();
+  const t = text.toLowerCase();
+  let qi = 0;
+  let run = 0;
+  let score = 0;
+  for (let ti = 0; ti < t.length && qi < q.length; ti++) {
+    if (t[ti] === q[qi]) {
+      run++;
+      score += run * 2;
+      const prev = t[ti - 1];
+      if (ti === 0 || prev === " " || prev === "-" || prev === "/") score += 6;
+      qi++;
+    } else {
+      run = 0;
+    }
+  }
+  if (qi < q.length) return null;
+  return score - t.length * 0.1;
+}
+function CommandPalette(props) {
+  const { open, onClose, commands } = props;
+  const [query, setQuery] = React7.useState("");
+  const [highlight, setHighlight] = React7.useState(0);
+  const inputRef = React7.useRef(null);
+  const dialogRef = React7.useRef(null);
+  const activeItemRef = React7.useRef(null);
+  const { groups, flat } = React7.useMemo(() => {
+    const q = query.trim();
+    const order = [];
+    const byGroup = /* @__PURE__ */ new Map();
+    for (const cmd of commands) {
+      const score = q ? fuzzyScore(q, cmd.label) : 0;
+      if (score === null) continue;
+      const g = cmd.group ?? "";
+      let bucket = byGroup.get(g);
+      if (!bucket) {
+        bucket = [];
+        byGroup.set(g, bucket);
+        order.push(g);
+      }
+      bucket.push({ cmd, score });
+    }
+    let idx = 0;
+    const grouped = order.map((name) => {
+      const bucket = byGroup.get(name);
+      if (q) bucket.sort((a, b) => b.score - a.score);
+      return { name, items: bucket.map(({ cmd }) => ({ cmd, flatIndex: idx++ })) };
+    });
+    const flatList = [];
+    for (const gr of grouped) for (const it of gr.items) flatList.push(it.cmd);
+    return { groups: grouped, flat: flatList };
+  }, [commands, query]);
+  React7.useEffect(() => {
+    if (!open) return;
+    setQuery("");
+    setHighlight(0);
+    const raf = requestAnimationFrame(() => inputRef.current?.focus());
+    return () => cancelAnimationFrame(raf);
+  }, [open]);
+  React7.useEffect(() => {
+    setHighlight((h) => flat.length === 0 ? 0 : Math.min(h, flat.length - 1));
+  }, [flat.length]);
+  React7.useEffect(() => {
+    activeItemRef.current?.scrollIntoView({ block: "nearest" });
+  }, [highlight]);
+  if (!open) return null;
+  const runAt = (i) => {
+    const cmd = flat[i];
+    if (!cmd) return;
+    cmd.run();
+    onClose();
+  };
+  const onKeyDown = (e) => {
+    switch (e.key) {
+      case "ArrowDown":
+        e.preventDefault();
+        setHighlight((h) => flat.length === 0 ? 0 : (h + 1) % flat.length);
+        break;
+      case "ArrowUp":
+        e.preventDefault();
+        setHighlight((h) => flat.length === 0 ? 0 : (h - 1 + flat.length) % flat.length);
+        break;
+      case "Home":
+        e.preventDefault();
+        setHighlight(0);
+        break;
+      case "End":
+        e.preventDefault();
+        setHighlight(flat.length === 0 ? 0 : flat.length - 1);
+        break;
+      case "Enter":
+        e.preventDefault();
+        runAt(highlight);
+        break;
+      case "Escape":
+        e.preventDefault();
+        onClose();
+        break;
+      case "Tab":
+        trapTab(e, dialogRef.current);
+        break;
+    }
+  };
+  const activeId = flat[highlight] ? `tw-pcmd-${highlight}` : void 0;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "tw-palette-overlay",
+      onMouseDown: (e) => {
+        if (e.target === e.currentTarget) onClose();
+      },
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "tw-palette",
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-label": "Command palette",
+          ref: dialogRef,
+          onKeyDown,
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "tw-palette-input-wrap", children: [
+              /* @__PURE__ */ jsxs(
+                "svg",
+                {
+                  className: "tw-palette-search",
+                  viewBox: "0 0 24 24",
+                  fill: "none",
+                  stroke: "currentColor",
+                  strokeWidth: "1.9",
+                  strokeLinecap: "round",
+                  "aria-hidden": "true",
+                  children: [
+                    /* @__PURE__ */ jsx("circle", { cx: "11", cy: "11", r: "7" }),
+                    /* @__PURE__ */ jsx("path", { d: "m20 20-3.5-3.5" })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  ref: inputRef,
+                  className: "tw-palette-input",
+                  type: "text",
+                  role: "combobox",
+                  "aria-expanded": "true",
+                  "aria-controls": "tw-palette-list",
+                  "aria-activedescendant": activeId,
+                  "aria-autocomplete": "list",
+                  placeholder: "Type a command\u2026",
+                  spellCheck: false,
+                  value: query,
+                  onChange: (e) => setQuery(e.target.value)
+                }
+              ),
+              /* @__PURE__ */ jsx("kbd", { className: "tw-palette-esc", children: "esc" })
+            ] }),
+            /* @__PURE__ */ jsxs("ul", { className: "tw-palette-list", id: "tw-palette-list", role: "listbox", "aria-label": "Commands", children: [
+              groups.map((group) => /* @__PURE__ */ jsxs(React7.Fragment, { children: [
+                group.name ? /* @__PURE__ */ jsx("li", { className: "tw-palette-group", role: "presentation", children: group.name }) : null,
+                group.items.map((it) => /* @__PURE__ */ jsxs(
+                  "li",
+                  {
+                    id: `tw-pcmd-${it.flatIndex}`,
+                    role: "option",
+                    "aria-selected": it.flatIndex === highlight,
+                    className: `tw-palette-item${it.flatIndex === highlight ? " tw-active" : ""}`,
+                    ref: it.flatIndex === highlight ? activeItemRef : void 0,
+                    onMouseMove: () => setHighlight(it.flatIndex),
+                    onMouseDown: (e) => {
+                      e.preventDefault();
+                      runAt(it.flatIndex);
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx("span", { className: "tw-palette-label", children: it.cmd.label }),
+                      it.cmd.kbd ? /* @__PURE__ */ jsx("kbd", { className: "tw-palette-kbd", children: it.cmd.kbd }) : null
+                    ]
+                  },
+                  it.cmd.id
+                ))
+              ] }, group.name || "_")),
+              flat.length === 0 ? /* @__PURE__ */ jsx("li", { className: "tw-palette-empty", role: "presentation", children: "No matching commands" }) : null
+            ] })
+          ]
+        }
+      )
+    }
+  );
+}
+var LIGHT_TOKENS = "--tw-fg:#1a1d20;--tw-muted:#5a6169;--tw-faint:#8b929a;--tw-bg:#ffffff;--tw-chip:#f0f1f3;--tw-line:rgba(18,22,27,.1);--tw-accent:#2f6fed;--tw-accent-soft:rgba(47,111,237,.1);--tw-code-bg:#f6f7f9;";
+var DARK_TOKENS = "--tw-fg:#e8eaed;--tw-muted:#a3abb2;--tw-faint:#6a727a;--tw-bg:#0f1215;--tw-chip:#1e242b;--tw-line:rgba(255,255,255,.1);--tw-accent:#6ea3ff;--tw-accent-soft:rgba(110,163,255,.14);--tw-code-bg:#13171b;";
+var SETTINGS_CSS = `
+.tw-settings-overlay,.tw-palette-overlay{${LIGHT_TOKENS}position:fixed;inset:0;z-index:1000;display:flex;font-family:-apple-system,"SF Pro Text",system-ui,sans-serif;color:var(--tw-fg);line-height:1.5;font-size:15px}
+@media (prefers-color-scheme: dark){.tw-settings-overlay:not(.tw-theme-light),.tw-palette-overlay:not(.tw-theme-light){${DARK_TOKENS}}}
+.tw-settings-overlay.tw-theme-dark,.tw-palette-overlay.tw-theme-dark{${DARK_TOKENS}}
+:root[data-theme="dark"] .tw-settings-overlay:not(.tw-theme-light),:root[data-theme="dark"] .tw-palette-overlay:not(.tw-theme-light){${DARK_TOKENS}}
+.tw-settings-overlay.tw-theme-light,.tw-palette-overlay.tw-theme-light,:root[data-theme="light"] .tw-settings-overlay,:root[data-theme="light"] .tw-palette-overlay{${LIGHT_TOKENS}}
+
+.tw-settings-overlay{justify-content:flex-end;background:color-mix(in srgb,#0b0d0f 30%,transparent);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);animation:tw-set-fade .18s ease}
+.tw-palette-overlay{align-items:flex-start;justify-content:center;padding:14vh 16px 16px;background:color-mix(in srgb,#0b0d0f 34%,transparent);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:tw-set-fade .16s ease}
+
+.tw-settings-panel{width:340px;max-width:92vw;height:100%;box-sizing:border-box;background:var(--tw-bg);border-left:1px solid var(--tw-line);box-shadow:-18px 0 48px -20px rgba(0,0,0,.5);display:flex;flex-direction:column;outline:none;animation:tw-set-slide .26s cubic-bezier(.32,.72,0,1)}
+.tw-settings-head{display:flex;align-items:center;gap:10px;padding:15px 16px;border-bottom:1px solid var(--tw-line)}
+.tw-settings-title{flex:1;font-size:15px;font-weight:640;letter-spacing:-.01em}
+.tw-settings-close{width:28px;height:28px;flex:none;border:1px solid var(--tw-line);background:var(--tw-chip);border-radius:8px;color:var(--tw-muted);font-size:18px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:color .15s,border-color .15s}
+.tw-settings-close:hover{color:var(--tw-fg);border-color:var(--tw-accent)}
+.tw-settings-close:focus-visible{outline:2px solid var(--tw-accent);outline-offset:2px}
+.tw-settings-body{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:18px}
+.tw-set-section{display:flex;flex-direction:column;gap:8px}
+.tw-set-h4{margin:0;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--tw-faint);font-weight:600}
+.tw-toggle-list{display:flex;flex-direction:column;gap:1px}
+
+.tw-seg{display:flex;width:100%;background:color-mix(in srgb,var(--tw-chip) 60%,transparent);border:1px solid var(--tw-line);border-radius:10px;padding:3px;gap:2px}
+.tw-seg-btn{flex:1;border:0;background:transparent;color:var(--tw-muted);font-size:12.5px;font-weight:540;padding:6px 12px;border-radius:7px;cursor:pointer;white-space:nowrap;transition:color .18s,background .18s}
+.tw-seg-btn[aria-pressed="true"]{color:var(--tw-fg);background:var(--tw-bg);box-shadow:0 1px 2px rgba(0,0,0,.18)}
+.tw-seg-btn:hover:not([aria-pressed="true"]){color:var(--tw-fg)}
+.tw-seg-btn:focus-visible{outline:2px solid var(--tw-accent);outline-offset:1px}
+
+.tw-set-toggle{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 8px;border-radius:8px;transition:background .15s}
+.tw-set-toggle:hover{background:var(--tw-chip)}
+.tw-set-toggle-label{display:flex;align-items:center;gap:9px;font-size:13.5px}
+.tw-set-toggle-kbd{font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:11px;color:var(--tw-faint)}
+.tw-sw{width:38px;height:22px;flex:none;padding:0;border-radius:999px;background:var(--tw-chip);border:1px solid var(--tw-line);position:relative;cursor:pointer;transition:background .2s}
+.tw-sw::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.4);transition:transform .2s cubic-bezier(.32,.72,0,1)}
+.tw-sw[aria-checked="true"]{background:var(--tw-accent)}
+.tw-sw[aria-checked="true"]::after{transform:translateX(16px)}
+.tw-sw:focus-visible{outline:2px solid var(--tw-accent);outline-offset:2px}
+
+.tw-palette{width:560px;max-width:100%;max-height:60vh;box-sizing:border-box;background:var(--tw-bg);border:1px solid var(--tw-line);border-radius:14px;box-shadow:0 24px 64px -18px rgba(0,0,0,.55);display:flex;flex-direction:column;overflow:hidden;animation:tw-pal-in .2s cubic-bezier(.32,.72,0,1)}
+.tw-palette-input-wrap{display:flex;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid var(--tw-line)}
+.tw-palette-search{width:17px;height:17px;flex:none;color:var(--tw-faint)}
+.tw-palette-input{flex:1;min-width:0;border:0;background:transparent;outline:none;color:var(--tw-fg);font-size:15px;font-family:inherit}
+.tw-palette-input::placeholder{color:var(--tw-faint)}
+.tw-palette-esc{flex:none;font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:11px;color:var(--tw-faint);border:1px solid var(--tw-line);border-radius:5px;padding:2px 6px}
+.tw-palette-list{list-style:none;margin:0;padding:6px;overflow:auto;flex:1}
+.tw-palette-group{padding:8px 10px 4px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--tw-faint);font-weight:600}
+.tw-palette-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;cursor:pointer;color:var(--tw-fg)}
+.tw-palette-item.tw-active{background:var(--tw-accent-soft)}
+.tw-palette-label{flex:1;min-width:0;font-size:13.5px}
+.tw-palette-kbd{flex:none;font-family:"SF Mono",ui-monospace,Menlo,monospace;font-size:11px;color:var(--tw-muted);background:var(--tw-chip);border:1px solid var(--tw-line);border-radius:5px;padding:2px 6px}
+.tw-palette-item.tw-active .tw-palette-kbd{color:var(--tw-accent)}
+.tw-palette-empty{padding:22px;text-align:center;color:var(--tw-faint);font-size:13px}
+
+@keyframes tw-set-fade{from{opacity:0}to{opacity:1}}
+@keyframes tw-set-slide{from{transform:translateX(18px);opacity:.4}to{transform:none;opacity:1}}
+@keyframes tw-pal-in{from{transform:translateY(-8px) scale(.98);opacity:0}to{transform:none;opacity:1}}
+@media (prefers-reduced-motion: reduce){.tw-settings-overlay,.tw-palette-overlay,.tw-settings-panel,.tw-palette,.tw-sw::after{animation:none !important;transition:none !important}}
+@media (prefers-reduced-transparency: reduce){.tw-settings-overlay{backdrop-filter:none;-webkit-backdrop-filter:none;background:color-mix(in srgb,#0b0d0f 60%,transparent)}.tw-palette-overlay{backdrop-filter:none;-webkit-backdrop-filter:none;background:color-mix(in srgb,#0b0d0f 64%,transparent)}}
+`;
+var cellKey = (row, col) => `${row}:${col}`;
+function caretToEnd(el) {
+  const sel = typeof window !== "undefined" ? window.getSelection() : null;
+  if (!sel) return;
+  const range = document.createRange();
+  range.selectNodeContents(el);
+  range.collapse(false);
+  sel.removeAllRanges();
+  sel.addRange(range);
+}
+function caretAtEdge(el) {
+  const sel = typeof window !== "undefined" ? window.getSelection() : null;
+  if (!sel || sel.rangeCount === 0) return { start: true, end: true };
+  const range = sel.getRangeAt(0);
+  if (!el.contains(range.startContainer)) return { start: false, end: false };
+  const pre = document.createRange();
+  pre.selectNodeContents(el);
+  pre.setEnd(range.startContainer, range.startOffset);
+  const before = pre.toString().length;
+  const total = el.textContent?.length ?? 0;
+  return { start: range.collapsed && before === 0, end: range.collapsed && before === total };
+}
+function Svg({ children }) {
+  return /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "15", height: "15", fill: "none", stroke: "currentColor", strokeWidth: 1.8, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children });
+}
+var ICON = {
+  addRow: /* @__PURE__ */ jsxs(Svg, { children: [
+    /* @__PURE__ */ jsx("rect", { x: "3", y: "4", width: "18", height: "7", rx: "1.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M12 15v6M9 18h6" })
+  ] }),
+  addCol: /* @__PURE__ */ jsxs(Svg, { children: [
+    /* @__PURE__ */ jsx("rect", { x: "4", y: "3", width: "7", height: "18", rx: "1.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M15 12h6M18 9v6" })
+  ] }),
+  delRow: /* @__PURE__ */ jsxs(Svg, { children: [
+    /* @__PURE__ */ jsx("rect", { x: "3", y: "4", width: "18", height: "7", rx: "1.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M9 18h6" })
+  ] }),
+  delCol: /* @__PURE__ */ jsxs(Svg, { children: [
+    /* @__PURE__ */ jsx("rect", { x: "4", y: "3", width: "7", height: "18", rx: "1.5" }),
+    /* @__PURE__ */ jsx("path", { d: "M15 12h6" })
+  ] }),
+  alignL: /* @__PURE__ */ jsx(Svg, { children: /* @__PURE__ */ jsx("path", { d: "M4 6h16M4 12h10M4 18h13" }) }),
+  alignC: /* @__PURE__ */ jsx(Svg, { children: /* @__PURE__ */ jsx("path", { d: "M4 6h16M7 12h10M6 18h12" }) }),
+  alignR: /* @__PURE__ */ jsx(Svg, { children: /* @__PURE__ */ jsx("path", { d: "M4 6h16M10 12h10M7 18h13" }) })
+};
+function TableGrid(props) {
+  const { table, source, onChange, onExit, readOnly = false } = props;
+  const ncols = Math.max(1, table.header.length);
+  const lastRow = table.rows.length;
+  const wrapRef = React7.useRef(null);
+  const cellRefs = React7.useRef(/* @__PURE__ */ new Map());
+  const [selected, setSelected] = React7.useState(null);
+  const [pendingFocus, setPendingFocus] = React7.useState(null);
+  const [pendingOp, setPendingOp] = React7.useState(null);
+  const getCell = React7.useCallback(
+    (row, col) => row === 0 ? table.header[col] : table.rows[row - 1]?.[col],
+    [table]
+  );
+  React7.useLayoutEffect(() => {
+    const paint = (row, col, cell) => {
+      const el = cellRefs.current.get(cellKey(row, col));
+      if (!el || el === document.activeElement) return;
+      el.innerHTML = cell ? renderInline(cell.children) : "";
+    };
+    for (let c = 0; c < ncols; c++) paint(0, c, table.header[c]);
+    table.rows.forEach((row, ri) => {
+      for (let c = 0; c < ncols; c++) paint(ri + 1, c, row[c]);
+    });
+  }, [table, source, ncols, readOnly]);
+  React7.useEffect(() => {
+    if (!pendingOp || readOnly) {
+      if (pendingOp) setPendingOp(null);
+      return;
+    }
+    const op = pendingOp;
+    setPendingOp(null);
+    let result;
+    switch (op.kind) {
+      case "add-row":
+        result = addRow(source, table, op.row + 1);
+        break;
+      case "add-col":
+        result = addColumn(source, table, op.col + 1);
+        break;
+      case "del-row":
+        result = removeRow(source, table, op.row);
+        break;
+      case "del-col":
+        result = removeColumn(source, table, op.col);
+        break;
+      case "align":
+        result = setAlignment(source, table, op.col, op.align);
+        break;
+      default:
+        return;
+    }
+    const insert = result.text.slice(table.from, result.text.length - source.length + table.to);
+    const oldBlock = source.slice(table.from, table.to);
+    if (insert !== oldBlock) {
+      onChange({ from: table.from, to: table.to, insert });
+    }
+  }, [pendingOp, table, source, onChange, readOnly]);
+  React7.useEffect(() => {
+    if (!pendingFocus) return;
+    const el = cellRefs.current.get(cellKey(pendingFocus.row, pendingFocus.col));
+    setPendingFocus(null);
+    if (el) el.focus();
+  }, [pendingFocus, table]);
+  const commitCell = React7.useCallback(
+    (row, col) => {
+      const el = cellRefs.current.get(cellKey(row, col));
+      const cell = getCell(row, col);
+      const range = cellSourceRange(table, row, col);
+      if (!el || !cell || !range) return;
+      const oldText = source.slice(range.from, range.to);
+      const next = (el.textContent ?? "").replace(/\r?\n/g, " ");
+      if (next !== oldText) {
+        onChange({ from: range.from, to: range.to, insert: next });
+      } else {
+        el.innerHTML = renderInline(cell.children);
+      }
+    },
+    [table, source, onChange, getCell]
+  );
+  const onCellFocus = React7.useCallback(
+    (row, col) => {
+      if (readOnly) return;
+      const cell = getCell(row, col);
+      const el = cellRefs.current.get(cellKey(row, col));
+      setSelected({ row, col });
+      if (el && cell) {
+        const raw = source.slice(cell.from, cell.to);
+        if (el.textContent !== raw) el.textContent = raw;
+        caretToEnd(el);
+      }
+    },
+    [readOnly, getCell, source]
+  );
+  const nextCell = React7.useCallback(
+    (row, col) => {
+      if (col < ncols - 1) return { row, col: col + 1 };
+      if (row < lastRow) return { row: row + 1, col: 0 };
+      return null;
+    },
+    [ncols, lastRow]
+  );
+  const prevCell = React7.useCallback(
+    (row, col) => {
+      if (col > 0) return { row, col: col - 1 };
+      if (row > 0) return { row: row - 1, col: ncols - 1 };
+      return null;
+    },
+    [ncols]
+  );
+  const exitPastEdge = React7.useCallback(
+    (row, col, dir) => {
+      cellRefs.current.get(cellKey(row, col))?.blur();
+      onExit?.(dir);
+    },
+    [onExit]
+  );
+  const onCellKeyDown = React7.useCallback(
+    (e, row, col) => {
+      if (readOnly) return;
+      const el = e.currentTarget;
+      switch (e.key) {
+        case "Enter": {
+          if (e.shiftKey) return;
+          e.preventDefault();
+          if (row < lastRow) setPendingFocus({ row: row + 1, col });
+          else exitPastEdge(row, col, "down");
+          return;
+        }
+        case "Tab": {
+          e.preventDefault();
+          const target = e.shiftKey ? prevCell(row, col) : nextCell(row, col);
+          if (target) setPendingFocus(target);
+          else exitPastEdge(row, col, e.shiftKey ? "up" : "down");
+          return;
+        }
+        case "ArrowUp": {
+          e.preventDefault();
+          if (row > 0) setPendingFocus({ row: row - 1, col });
+          else exitPastEdge(row, col, "up");
+          return;
+        }
+        case "ArrowDown": {
+          e.preventDefault();
+          if (row < lastRow) setPendingFocus({ row: row + 1, col });
+          else exitPastEdge(row, col, "down");
+          return;
+        }
+        case "ArrowLeft": {
+          if (!caretAtEdge(el).start) return;
+          e.preventDefault();
+          const target = prevCell(row, col);
+          if (target) setPendingFocus(target);
+          else exitPastEdge(row, col, "up");
+          return;
+        }
+        case "ArrowRight": {
+          if (!caretAtEdge(el).end) return;
+          e.preventDefault();
+          const target = nextCell(row, col);
+          if (target) setPendingFocus(target);
+          else exitPastEdge(row, col, "down");
+          return;
+        }
+        default:
+          return;
+      }
+    },
+    [readOnly, lastRow, nextCell, prevCell, exitPastEdge]
+  );
+  const onWrapBlur = React7.useCallback(
+    (e) => {
+      const next = e.relatedTarget;
+      if (next && wrapRef.current?.contains(next)) return;
+      setSelected(null);
+    },
+    []
+  );
+  const sel = selected ? { row: Math.min(selected.row, lastRow), col: Math.min(selected.col, ncols - 1) } : null;
+  const colAlign = (col) => table.align[col] ?? null;
+  const cellProps = (row, col) => {
+    const align = colAlign(col);
+    const isSel = sel !== null && sel.row === row && sel.col === col;
+    const p = {
+      ref: (el) => {
+        if (el) cellRefs.current.set(cellKey(row, col), el);
+        else cellRefs.current.delete(cellKey(row, col));
+      },
+      className: `tw-tg-cell${isSel ? " tw-tg-sel" : ""}`,
+      role: readOnly ? void 0 : "gridcell",
+      style: align ? { textAlign: align } : void 0,
+      contentEditable: readOnly ? void 0 : true,
+      suppressContentEditableWarning: true,
+      spellCheck: false
+    };
+    if (!readOnly) {
+      p.onFocus = () => onCellFocus(row, col);
+      p.onBlur = () => commitCell(row, col);
+      p.onKeyDown = (e) => onCellKeyDown(e, row, col);
+    }
+    return p;
+  };
+  const runOp = (op) => {
+    if (readOnly) return;
+    setPendingOp(op);
+  };
+  const showToolbar = !readOnly && sel !== null;
+  const toolbar = showToolbar ? /* @__PURE__ */ jsxs("div", { className: "tw-tg-toolbar", role: "toolbar", "aria-label": "Table", children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tw-tg-btn",
+        title: "Add row",
+        "aria-label": "Add row",
+        onClick: () => runOp({ kind: "add-row", row: sel.row, col: sel.col }),
+        children: ICON.addRow
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tw-tg-btn",
+        title: "Add column",
+        "aria-label": "Add column",
+        onClick: () => runOp({ kind: "add-col", row: sel.row, col: sel.col }),
+        children: ICON.addCol
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tw-tg-btn",
+        title: "Delete row",
+        "aria-label": "Delete row",
+        disabled: sel.row === 0 || lastRow === 0,
+        onClick: () => runOp({ kind: "del-row", row: sel.row, col: sel.col }),
+        children: ICON.delRow
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tw-tg-btn",
+        title: "Delete column",
+        "aria-label": "Delete column",
+        disabled: ncols <= 1,
+        onClick: () => runOp({ kind: "del-col", row: sel.row, col: sel.col }),
+        children: ICON.delCol
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { className: "tw-tg-sep", "aria-hidden": "true" }),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tw-tg-btn",
+        title: "Align left",
+        "aria-label": "Align left",
+        "aria-pressed": colAlign(sel.col) === "left",
+        onClick: () => runOp({ kind: "align", row: sel.row, col: sel.col, align: "left" }),
+        children: ICON.alignL
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tw-tg-btn",
+        title: "Align center",
+        "aria-label": "Align center",
+        "aria-pressed": colAlign(sel.col) === "center",
+        onClick: () => runOp({ kind: "align", row: sel.row, col: sel.col, align: "center" }),
+        children: ICON.alignC
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tw-tg-btn",
+        title: "Align right",
+        "aria-label": "Align right",
+        "aria-pressed": colAlign(sel.col) === "right",
+        onClick: () => runOp({ kind: "align", row: sel.row, col: sel.col, align: "right" }),
+        children: ICON.alignR
+      }
+    )
+  ] }) : null;
+  const headerCols = Array.from({ length: ncols }, (_, c) => c);
+  return /* @__PURE__ */ jsxs("div", { className: "tw-table-grid", ref: wrapRef, onBlur: readOnly ? void 0 : onWrapBlur, children: [
+    toolbar,
+    /* @__PURE__ */ jsx("div", { className: "tw-table-grid-scroll", children: /* @__PURE__ */ jsxs("table", { className: "tw-tg-table", children: [
+      /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { children: headerCols.map((c) => /* @__PURE__ */ jsx("th", { ...cellProps(0, c) }, c)) }) }),
+      /* @__PURE__ */ jsx("tbody", { children: table.rows.map((_row, ri) => /* @__PURE__ */ jsx("tr", { children: headerCols.map((c) => /* @__PURE__ */ jsx("td", { ...cellProps(ri + 1, c) }, c)) }, ri)) })
+    ] }) })
+  ] });
+}
+var TABLEGRID_CSS = `
+.tw-table-grid{position:relative;margin:.6em 0;width:fit-content;max-width:100%}
+.tw-table-grid-scroll{overflow-x:auto;border:1px solid var(--tw-line);border-radius:10px}
+.tw-tg-table{border-collapse:collapse;font-size:14px}
+.tw-tg-table th,.tw-tg-table td{border:1px solid var(--tw-line);padding:8px 13px;text-align:left;vertical-align:top;min-width:52px}
+.tw-tg-table th{background:var(--tw-chip);font-weight:600;color:var(--tw-muted);font-size:12px;letter-spacing:.02em;text-transform:uppercase}
+.tw-tg-table td{color:var(--tw-fg)}
+.tw-tg-cell{outline:none}
+.tw-tg-cell:empty::after{content:"";display:inline-block;min-height:1.15em}
+.tw-tg-table th.tw-tg-sel,.tw-tg-table td.tw-tg-sel{box-shadow:inset 0 0 0 2px var(--tw-accent);background:var(--tw-accent-soft)}
+.tw-tg-toolbar{position:absolute;top:0;right:0;z-index:6;transform:translateY(calc(-100% - 7px));display:flex;align-items:center;gap:3px;padding:4px 5px;border:1px solid var(--tw-line);border-radius:11px;background:color-mix(in srgb, var(--tw-bg) 82%, transparent);backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);box-shadow:0 6px 20px -10px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.06);animation:tw-tg-pop .18s cubic-bezier(.32,.72,0,1)}
+@keyframes tw-tg-pop{from{opacity:0;transform:translateY(calc(-100% + 2px))}to{opacity:1;transform:translateY(calc(-100% - 7px))}}
+.tw-tg-sep{width:1px;height:18px;background:var(--tw-line);margin:0 3px}
+.tw-tg-btn{min-width:28px;height:28px;padding:0 6px;border:1px solid transparent;background:transparent;border-radius:7px;color:var(--tw-muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:color .15s,background .15s,border-color .15s}
+.tw-tg-btn:hover{color:var(--tw-fg);background:var(--tw-accent-soft)}
+.tw-tg-btn:disabled{opacity:.4;cursor:default}
+.tw-tg-btn:disabled:hover{color:var(--tw-muted);background:transparent}
+.tw-tg-btn[aria-pressed="true"]{color:var(--tw-accent);background:var(--tw-accent-soft);border-color:var(--tw-line)}
+.tw-tg-btn svg{width:15px;height:15px}
+@media (prefers-reduced-transparency: reduce){.tw-tg-toolbar{background:var(--tw-bg);backdrop-filter:none;-webkit-backdrop-filter:none}}
+@media (prefers-reduced-motion: reduce){.tw-tg-toolbar{animation:none} .tw-tg-btn{transition:none}}
+`;
+var STYLE_ID = "typewright-styles";
+function useInjectStyles() {
+  React7.useEffect(() => {
+    if (typeof document === "undefined") return;
+    if (document.getElementById(STYLE_ID)) return;
+    const el = document.createElement("style");
+    el.id = STYLE_ID;
+    el.textContent = TYPEWRIGHT_CSS + TABLEGRID_CSS + FOLDMENU_CSS + COMMENTS_CSS + SETTINGS_CSS + SANDBOX_ISLAND_CSS + CARET_REVEAL_CSS;
+    document.head.appendChild(el);
+  }, []);
+}
+function extEnabled(x, dflt = false) {
+  if (x === void 0) return dflt;
+  if (typeof x === "boolean") return x;
+  return x.enabled !== false;
+}
+function extOptions(x) {
+  if (!extEnabled(x)) return null;
+  return typeof x === "object" ? x : { enabled: true };
+}
+function fenceLang(info) {
+  return (info.trim().split(/\s+/)[0] ?? "").toLowerCase();
+}
+function isMdxIslandBlock(b, ic) {
+  return ic.mdxActive && b.type === "htmlBlock" && b.variant === "mdxFlow";
+}
+function isMermaidIslandBlock(b, ic) {
+  return ic.mermaidActive && b.type === "codeBlock" && fenceLang(b.lang) === "mermaid";
+}
+function isCaretEligible(b) {
+  return b.type === "heading" || b.type === "paragraph" || b.type === "list" || b.type === "blockquote";
+}
+function withA11yHints(html) {
+  return html.replace(/<input type="checkbox" disabled/g, '<input type="checkbox" aria-label="Task item" disabled');
+}
+var HAS_INTERACTIVE_HTML = /<a[\s>]|<input\b/i;
+function renderIsland(b, ic) {
+  if (isMdxIslandBlock(b, ic)) {
+    const code = b.value;
+    return /* @__PURE__ */ jsx(
+      SandboxIsland,
+      {
+        kind: "mdx",
+        code,
+        transform: ic.mdxTransform,
+        components: ic.mdxComponents,
+        sandbox: ic.mdxSandbox,
+        theme: ic.theme
+      }
+    );
+  }
+  if (isMermaidIslandBlock(b, ic)) {
+    const code = b.value;
+    return /* @__PURE__ */ jsx(SandboxIsland, { kind: "mermaid", code, mermaidEngine: ic.mermaidEngine, theme: ic.theme });
+  }
+  return null;
+}
+var COMMAND_IDS = new Set(COMMANDS.map((c) => c.id));
+function canonKey(raw) {
+  const toks = raw.toLowerCase().replace(/-/g, "+").split("+").map((t) => t.trim()).filter(Boolean);
+  let mod = false;
+  let alt = false;
+  let shift = false;
+  let key = "";
+  for (const t of toks) {
+    if (t === "mod" || t === "cmd" || t === "meta" || t === "ctrl" || t === "control") mod = true;
+    else if (t === "alt" || t === "option" || t === "opt") alt = true;
+    else if (t === "shift") shift = true;
+    else key = t;
+  }
+  const parts = [];
+  if (mod) parts.push("mod");
+  if (alt) parts.push("alt");
+  if (shift) parts.push("shift");
+  parts.push(key);
+  return parts.join("+");
+}
+function kbdToBinding(kbd) {
+  let key = "";
+  const mods = [];
+  for (const ch of kbd) {
+    if (ch === "\u2318" || ch === "\u2303") mods.push("mod");
+    else if (ch === "\u21E7") mods.push("shift");
+    else if (ch === "\u2325") mods.push("alt");
+    else if (ch.trim()) key += ch;
+  }
+  key = key.toLowerCase();
+  if (!key) return null;
+  return canonKey([...mods, key].join("+"));
+}
+function eventCanon(e) {
+  const parts = [];
+  if (e.metaKey || e.ctrlKey) parts.push("mod");
+  if (e.altKey) parts.push("alt");
+  if (e.shiftKey) parts.push("shift");
+  parts.push(e.key.toLowerCase());
+  return parts.join("+");
+}
+function buildKeymap(keymap) {
+  const map = /* @__PURE__ */ new Map();
+  if ((keymap?.preset ?? "default") !== "none") {
+    for (const c of COMMANDS) {
+      if (!c.kbd) continue;
+      const b = kbdToBinding(c.kbd);
+      if (b) map.set(b, c.id);
+    }
+  }
+  if (keymap?.bindings) {
+    for (const [raw, cmd] of Object.entries(keymap.bindings)) {
+      if (COMMAND_IDS.has(cmd)) map.set(canonKey(raw), cmd);
+    }
+  }
+  return map;
+}
+function normalizeComments(comments) {
+  if (!comments) return null;
+  if (comments === true) return { enabled: true, threads: [] };
+  return comments;
+}
+function normalizeSettings(settings) {
+  if (!settings) return null;
+  if (settings === true) return { enabled: true };
+  return settings;
+}
+function plainify(src) {
+  let s = src;
+  s = s.replace(/^\s*#{1,6}\s+/, "");
+  s = s.replace(/^\s*>\s?/gm, "");
+  s = s.replace(/^\s*(?:[-*+]|\d+[.)])\s+(?:\[[ xX]\]\s+)?/gm, "");
+  s = s.replace(/!?\[([^\]]*)\]\([^)]*\)/g, "$1");
+  s = s.replace(/(\*\*|__|~~|\*|_|`)/g, "");
+  return s.replace(/\s+/g, " ").trim();
+}
+function renderedCaretIndex(source, scopeFrom, cursorFrom, renderedLen) {
+  return Math.min(plainify(source.slice(scopeFrom, cursorFrom)).length, renderedLen);
+}
+function peerInitials(name) {
+  const parts = name.trim().split(/\s+/).filter(Boolean);
+  if (parts.length === 0) return "?";
+  const first = parts[0]?.[0] ?? "";
+  const last = parts.length > 1 ? parts[parts.length - 1]?.[0] ?? "" : "";
+  return (first + last).toUpperCase() || "?";
+}
+function mergeThreads(host, local) {
+  if (local.length === 0) return host;
+  const echoed = (l) => host.some((h) => h.quote === l.quote && h.body === l.body);
+  return [...host, ...local.filter((l) => !echoed(l))];
+}
+function minimizeChange(change, prevDoc) {
+  const { from, to } = change;
+  const removed = prevDoc.slice(from, to);
+  const inserted = change.insert;
+  let p = 0;
+  const maxP = Math.min(removed.length, inserted.length);
+  while (p < maxP && removed.charCodeAt(p) === inserted.charCodeAt(p)) p++;
+  let s = 0;
+  const maxS = Math.min(removed.length - p, inserted.length - p);
+  while (s < maxS && removed.charCodeAt(removed.length - 1 - s) === inserted.charCodeAt(inserted.length - 1 - s)) s++;
+  return { from: from + p, to: to - s, insert: inserted.slice(p, inserted.length - s) };
+}
+function clearDecorations(scope) {
+  scope.querySelectorAll("mark.tw-comment").forEach((mark) => {
+    const parent = mark.parentNode;
+    if (!parent) return;
+    while (mark.firstChild) parent.insertBefore(mark.firstChild, mark);
+    parent.removeChild(mark);
+  });
+  scope.querySelectorAll(".tw-remote-cursor").forEach((c) => c.remove());
+  scope.normalize();
+}
+function textNodesOf(scope) {
+  const walker = document.createTreeWalker(scope, NodeFilter.SHOW_TEXT);
+  const nodes = [];
+  let text = "";
+  let n = walker.nextNode();
+  while (n) {
+    const t = n;
+    nodes.push(t);
+    text += t.nodeValue ?? "";
+    n = walker.nextNode();
+  }
+  return { nodes, text };
+}
+function locateCharIndex(nodes, index) {
+  let pos = 0;
+  for (const node of nodes) {
+    const len = node.nodeValue?.length ?? 0;
+    if (index <= pos + len) return { node, offset: Math.max(0, index - pos) };
+    pos += len;
+  }
+  const last = nodes[nodes.length - 1];
+  return last ? { node: last, offset: last.nodeValue?.length ?? 0 } : null;
+}
+function wrapCharRange(scope, start, end, id, flash) {
+  if (end <= start) return null;
+  const { nodes } = textNodesOf(scope);
+  const segments = [];
+  let pos = 0;
+  for (const node of nodes) {
+    const len = node.nodeValue?.length ?? 0;
+    const nodeStart = pos;
+    const nodeEnd = pos + len;
+    const s = Math.max(start, nodeStart);
+    const e = Math.min(end, nodeEnd);
+    if (s < e) segments.push({ node, s: s - nodeStart, e: e - nodeStart });
+    pos = nodeEnd;
+    if (pos >= end) break;
+  }
+  let first = null;
+  for (const seg of segments) {
+    const range = document.createRange();
+    range.setStart(seg.node, seg.s);
+    range.setEnd(seg.node, seg.e);
+    const mark = document.createElement("mark");
+    mark.className = flash ? "tw-comment tw-comment-flash" : "tw-comment";
+    mark.setAttribute("data-thread", id);
+    try {
+      range.surroundContents(mark);
+    } catch {
+      continue;
+    }
+    if (!first) first = mark;
+  }
+  return first;
+}
+function insertRemoteCursor(scope, index, peer) {
+  const { nodes } = textNodesOf(scope);
+  const loc = locateCharIndex(nodes, index);
+  if (!loc) return;
+  const range = document.createRange();
+  range.setStart(loc.node, loc.offset);
+  range.collapse(true);
+  const caret = document.createElement("span");
+  caret.className = "tw-remote-cursor";
+  caret.setAttribute("data-peer", peer.name);
+  if (peer.color) caret.style.setProperty("--tw-remote", peer.color);
+  const label = document.createElement("span");
+  label.className = "tw-remote-flag";
+  label.textContent = peer.name;
+  caret.appendChild(label);
+  range.insertNode(caret);
+}
+function applyDecorations(container, source, decorations, peers, activeThreadId) {
+  clearDecorations(container);
+  const blockEls = Array.from(
+    container.querySelectorAll(".tw-block[data-tw-from], .tw-caret-block[data-tw-from]")
+  );
+  const scopes = blockEls.length > 0 ? blockEls.map((el) => ({
+    el,
+    from: Number(el.getAttribute("data-tw-from")) || 0,
+    to: Number(el.getAttribute("data-tw-to")) || 0
+  })) : [{ el: container, from: 0, to: source.length }];
+  let flashTarget = null;
+  for (const scope of scopes) {
+    if (scope.el.getAttribute("contenteditable") === "true" || scope.el.isContentEditable) continue;
+    const scopeText = scope.el.textContent ?? "";
+    for (const dec of decorations) {
+      if (dec.to <= scope.from || dec.from >= scope.to) continue;
+      const rawFrom = Math.max(dec.from, scope.from) - scope.from;
+      const rawTo = Math.min(dec.to, scope.to) - scope.from;
+      const rawSlice = source.slice(scope.from + rawFrom, scope.from + rawTo);
+      const target = plainify(rawSlice) || plainify(dec.quote);
+      if (!target) continue;
+      let at = scopeText.indexOf(target);
+      if (at < 0) at = scopeText.indexOf(dec.quote.trim());
+      if (at < 0) continue;
+      const mark = wrapCharRange(scope.el, at, at + target.length, dec.id, dec.id === activeThreadId);
+      if (mark && dec.id === activeThreadId) flashTarget = mark;
+    }
+    for (const peer of peers) {
+      const cur = peer.cursor;
+      if (!cur) continue;
+      if (cur.from < scope.from || cur.from > scope.to) continue;
+      const rendered = scope.el.textContent?.length ?? 0;
+      const idx = renderedCaretIndex(source, scope.from, cur.from, rendered);
+      insertRemoteCursor(scope.el, idx, peer);
+    }
+  }
+  if (flashTarget) flashTarget.scrollIntoView({ block: "nearest", behavior: "smooth" });
+}
+function useCollab(comments, presence, md, mode, settingsControl, visibleRev = 0) {
+  const opts = normalizeComments(comments);
+  const commentsActive = !!opts && opts.enabled !== false;
+  const peers = React7.useMemo(() => presence ?? [], [presence]);
+  const active = commentsActive || peers.length > 0;
+  const settingsPresent = !!settingsControl;
+  const shellActive = active || settingsPresent;
+  const hostThreads = opts?.threads ?? EMPTY_THREADS;
+  const me = opts?.me;
+  const contentRef = React7.useRef(null);
+  const pointerRef = React7.useRef({ x: 0, y: 0 });
+  const srcRef = React7.useRef(md);
+  srcRef.current = md;
+  const [localThreads, setLocalThreads] = React7.useState([]);
+  const [liveAnchors, setLiveAnchors] = React7.useState(
+    () => /* @__PURE__ */ new Map()
+  );
+  const [open, setOpen] = React7.useState(false);
+  const [activeThreadId, setActiveThreadId] = React7.useState(void 0);
+  const [pending, setPending] = React7.useState(null);
+  const [composing, setComposing] = React7.useState(null);
+  const threads = React7.useMemo(() => mergeThreads(hostThreads, localThreads), [hostThreads, localThreads]);
+  React7.useEffect(() => {
+    if (!commentsActive) return;
+    setLiveAnchors((prev) => {
+      const next = new Map(prev);
+      const valid = new Set(threads.map((t) => t.id));
+      for (const t of threads) if (!next.has(t.id)) next.set(t.id, t.anchor);
+      for (const id of [...next.keys()]) if (!valid.has(id)) next.delete(id);
+      return next;
+    });
+  }, [threads, commentsActive]);
+  const commentsActiveRef = React7.useRef(commentsActive);
+  commentsActiveRef.current = commentsActive;
+  const onCommit = React7.useCallback((change) => {
+    if (!commentsActiveRef.current) return;
+    const minimal = minimizeChange(change, srcRef.current);
+    setLiveAnchors((prev) => {
+      const next = /* @__PURE__ */ new Map();
+      prev.forEach((a, id) => {
+        const mapped = mapAnchor(a, minimal);
+        if (mapped) next.set(id, mapped);
+      });
+      return next;
+    });
+  }, []);
+  const onPointer = React7.useCallback((x, y) => {
+    pointerRef.current = { x, y };
+  }, []);
+  const onSourceSelect = React7.useCallback(
+    (docFrom, docTo, quote) => {
+      if (!commentsActive || docFrom >= docTo || !quote.trim()) {
+        setPending(null);
+        return;
+      }
+      const { x, y } = pointerRef.current;
+      setPending({ anchor: { from: docFrom, to: docTo }, quote, x, y });
+    },
+    [commentsActive]
+  );
+  React7.useEffect(() => {
+    if (!commentsActive) return void 0;
+    const onMouseUp = (e) => {
+      pointerRef.current = { x: e.clientX, y: e.clientY };
+      const container = contentRef.current;
+      if (!container) return;
+      const sel = window.getSelection();
+      if (!sel || sel.rangeCount === 0 || sel.isCollapsed) return;
+      const quote = sel.toString();
+      if (!quote.trim()) return;
+      const range = sel.getRangeAt(0);
+      const anchorNode = range.commonAncestorContainer;
+      if (!(anchorNode instanceof Node) || !container.contains(anchorNode)) return;
+      const host = anchorNode instanceof Element ? anchorNode : anchorNode.parentElement;
+      if (host?.closest(".tw-selpop, .tw-composer, .tw-comments-sidebar")) return;
+      const blockEl = host?.closest(".tw-block[data-tw-from], .tw-caret-block[data-tw-from]");
+      const from = blockEl ? Number(blockEl.getAttribute("data-tw-from")) || 0 : 0;
+      const to = blockEl ? Number(blockEl.getAttribute("data-tw-to")) || 0 : srcRef.current.length;
+      const blockSrc = srcRef.current.slice(from, to);
+      const idx = blockSrc.indexOf(quote.trim());
+      const anchor = idx >= 0 ? { from: from + idx, to: from + idx + quote.trim().length } : { from, to };
+      const rect = range.getBoundingClientRect();
+      setPending({
+        anchor,
+        quote: quote.trim(),
+        x: rect.left + rect.width / 2,
+        y: rect.top
+      });
+    };
+    document.addEventListener("mouseup", onMouseUp);
+    return () => document.removeEventListener("mouseup", onMouseUp);
+  }, [commentsActive]);
+  const decorations = React7.useMemo(() => {
+    if (!commentsActive) return [];
+    const out = [];
+    for (const t of threads) {
+      if (t.resolved) continue;
+      const pos = liveAnchors.get(t.id) ?? t.anchor;
+      out.push({ id: t.id, from: pos.from, to: pos.to, quote: t.quote ?? "" });
+    }
+    return out;
+  }, [threads, liveAnchors, commentsActive]);
+  React7.useLayoutEffect(() => {
+    const container = contentRef.current;
+    if (!container || !active) return;
+    applyDecorations(container, md, decorations, peers, activeThreadId);
+  }, [md, decorations, peers, activeThreadId, active, mode, visibleRev, open]);
+  React7.useEffect(() => {
+    const container = contentRef.current;
+    if (!container || !commentsActive) return void 0;
+    const onClick = (e) => {
+      const mark = e.target?.closest?.("mark.tw-comment");
+      const id = mark?.getAttribute("data-thread");
+      if (!id) return;
+      e.preventDefault();
+      e.stopPropagation();
+      setActiveThreadId(id);
+      setOpen(true);
+    };
+    container.addEventListener("click", onClick, true);
+    return () => container.removeEventListener("click", onClick, true);
+  }, [commentsActive]);
+  const createThread = React7.useCallback(
+    (sel, body) => {
+      const id = `tw-comment-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 6)}`;
+      opts?.onCreate?.({ anchor: sel.anchor, quote: sel.quote, body });
+      const thread = {
+        id,
+        anchor: sel.anchor,
+        quote: sel.quote,
+        author: me?.name ?? "You",
+        body,
+        createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+        replies: []
+      };
+      setLocalThreads((prev) => [...prev, thread]);
+      setLiveAnchors((prev) => new Map(prev).set(id, sel.anchor));
+      setActiveThreadId(id);
+      setOpen(true);
+      setComposing(null);
+      setPending(null);
+      window.getSelection()?.removeAllRanges();
+    },
+    [opts, me]
+  );
+  const overlay = shellActive ? /* @__PURE__ */ jsxs(Fragment, { children: [
+    (peers.length > 0 || commentsActive || settingsPresent) && /* @__PURE__ */ jsxs("div", { className: "tw-collab-bar", children: [
+      peers.length > 0 && /* @__PURE__ */ jsx("div", { className: "tw-presence", "aria-label": "Collaborators", children: peers.map((p) => /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: "tw-presence-av",
+          style: { background: p.color ?? "#888" },
+          title: p.name,
+          "aria-label": p.name,
+          children: peerInitials(p.name)
+        },
+        p.id
+      )) }),
+      commentsActive && /* @__PURE__ */ jsxs(
+        "button",
+        {
+          type: "button",
+          className: `tw-comments-toggle${open ? " tw-on" : ""}`,
+          "aria-label": open ? "Hide comments" : "Show comments",
+          "aria-expanded": open,
+          onClick: () => setOpen((o) => !o),
+          children: [
+            /* @__PURE__ */ jsx("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.9", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z" }) }),
+            /* @__PURE__ */ jsx("span", { className: "tw-comments-toggle-n", children: threads.length })
+          ]
+        }
+      ),
+      settingsControl
+    ] }),
+    commentsActive && pending && !composing && /* @__PURE__ */ jsx("div", { className: "tw-selpop show", style: { left: clampX(pending.x), top: Math.max(8, pending.y - 44) }, role: "menu", children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "tw-selpop-btn",
+        onMouseDown: (e) => e.preventDefault(),
+        onClick: () => {
+          setComposing(pending);
+          setPending(null);
+        },
+        children: "\u{1F4AC} Comment"
+      }
+    ) }),
+    commentsActive && composing && /* @__PURE__ */ jsx(
+      Composer,
+      {
+        selection: composing,
+        onSubmit: (body) => createThread(composing, body),
+        onCancel: () => {
+          setComposing(null);
+          window.getSelection()?.removeAllRanges();
+        }
+      }
+    ),
+    commentsActive && /* @__PURE__ */ jsx(
+      CommentsSidebar,
+      {
+        threads,
+        me,
+        open,
+        onClose: () => setOpen(false),
+        onReply: (threadId, body) => opts?.onReply?.(threadId, body),
+        onReact: (threadId, emoji) => opts?.onReact?.(threadId, emoji),
+        onResolve: (threadId, resolved) => opts?.onResolve?.(threadId, resolved),
+        onDelete: opts?.onDelete ? (threadId) => opts?.onDelete?.(threadId) : void 0,
+        activeThreadId,
+        onSelectThread: (threadId) => setActiveThreadId(threadId)
+      }
+    )
+  ] }) : null;
+  return {
+    commentsActive,
+    active,
+    shellActive,
+    sidebarOpen: open && commentsActive,
+    peers,
+    threads,
+    contentRef,
+    onCommit,
+    onSourceSelect,
+    onPointer,
+    overlay
+  };
+}
+var EMPTY_THREADS = [];
+function clampX(x) {
+  const w = typeof window === "undefined" ? 1024 : window.innerWidth;
+  return Math.max(8, Math.min(x, w - 288));
+}
+function Composer(props) {
+  const { selection, onSubmit, onCancel } = props;
+  const [body, setBody] = React7.useState("");
+  const taRef = React7.useRef(null);
+  React7.useEffect(() => {
+    taRef.current?.focus();
+  }, []);
+  const submit = () => {
+    const v = body.trim();
+    if (v) onSubmit(v);
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "tw-composer show",
+      style: { left: clampX(selection.x), top: Math.max(8, selection.y - 8) },
+      onMouseDown: (e) => e.stopPropagation(),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "tw-composer-quote", children: [
+          "\u201C",
+          selection.quote,
+          "\u201D"
+        ] }),
+        /* @__PURE__ */ jsx(
+          "textarea",
+          {
+            ref: taRef,
+            value: body,
+            placeholder: "Add a comment\u2026",
+            "aria-label": "Comment",
+            onChange: (e) => setBody(e.currentTarget.value),
+            onKeyDown: (e) => {
+              if (e.key === "Escape") {
+                e.preventDefault();
+                onCancel();
+              } else if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
+                e.preventDefault();
+                submit();
+              }
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "tw-composer-row", children: [
+          /* @__PURE__ */ jsx("button", { type: "button", className: "tw-composer-btn", onClick: onCancel, children: "Cancel" }),
+          /* @__PURE__ */ jsx("button", { type: "button", className: "tw-composer-btn tw-composer-primary", disabled: !body.trim(), onClick: submit, children: "Comment" })
+        ] })
+      ]
+    }
+  );
+}
+var TypewrightEditor = React7.forwardRef(
+  function TypewrightEditor2(props, forwardedRef) {
+    useInjectStyles();
+    const {
+      value,
+      defaultValue,
+      onChange,
+      onSelectionChange,
+      onModeChange,
+      mode: modeProp = "unified",
+      unifiedReveal = "block",
+      extensions,
+      folding,
+      keymap,
+      comments,
+      presence,
+      settings,
+      readOnly = false,
+      placeholder = "Write Markdown\u2026",
+      theme,
+      toolbar,
+      overscan,
+      className,
+      style
+    } = props;
+    const [modeState, setModeState] = React7.useState(modeProp);
+    const lastModeProp = React7.useRef(modeProp);
+    if (modeProp !== lastModeProp.current) {
+      lastModeProp.current = modeProp;
+      setModeState(modeProp);
+    }
+    const mode = modeState;
+    const setMode = React7.useCallback(
+      (m) => {
+        setModeState(m);
+        onModeChange?.(m);
+      },
+      [onModeChange]
+    );
+    const settingsOpts = React7.useMemo(() => normalizeSettings(settings), [settings]);
+    const settingsActive = !!settingsOpts && settingsOpts.enabled !== false;
+    const [toolbarOverride, setToolbarOverride] = React7.useState(void 0);
+    const [themeOverride, setThemeOverride] = React7.useState(void 0);
+    const [foldingOverride, setFoldingOverride] = React7.useState(void 0);
+    const [extensionsOverride, setExtensionsOverride] = React7.useState({});
+    const [settingsOpen, setSettingsOpen] = React7.useState(false);
+    const [paletteOpen, setPaletteOpen] = React7.useState(false);
+    const settingsControl = settingsActive ? /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: `tw-settings-gear${settingsOpen ? " tw-on" : ""}`,
+        "aria-label": settingsOpen ? "Hide settings" : "Show settings",
+        "aria-expanded": settingsOpen,
+        onClick: () => setSettingsOpen((o) => !o),
+        children: /* @__PURE__ */ jsxs("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+          /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "3" }),
+          /* @__PURE__ */ jsx("path", { d: "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z" })
+        ] })
+      }
+    ) : null;
+    React7.useEffect(() => {
+      if (!settingsActive) return void 0;
+      const onKey = (e) => {
+        if ((e.metaKey || e.ctrlKey) && !e.altKey && !e.shiftKey && (e.key === "k" || e.key === "K")) {
+          e.preventDefault();
+          e.stopPropagation();
+          setPaletteOpen(true);
+        }
+      };
+      document.addEventListener("keydown", onKey, true);
+      return () => document.removeEventListener("keydown", onKey, true);
+    }, [settingsActive]);
+    const effExtensions = React7.useMemo(
+      () => ({ ...extensions, ...extensionsOverride }),
+      [extensions, extensionsOverride]
+    );
+    const mathOn = extEnabled(effExtensions.math);
+    const highlightOn = extEnabled(effExtensions.syntaxHighlight);
+    const mdxOpts = React7.useMemo(() => extOptions(effExtensions.mdx), [effExtensions.mdx]);
+    const mermaidOpts = React7.useMemo(
+      () => extOptions(effExtensions.mermaid),
+      [effExtensions.mermaid]
+    );
+    const mathOpts = React7.useMemo(() => extOptions(effExtensions.math), [effExtensions.math]);
+    const parseOpts = React7.useMemo(
+      () => ({ footnotes: true, defLists: true, math: mathOn }),
+      [mathOn]
+    );
+    const renderOpts = React7.useMemo(
+      () => ({ highlight: highlightOn ? highlightToHtml : void 0, math: mathOpts?.render }),
+      [highlightOn, mathOpts]
+    );
+    const keymapBindings = React7.useMemo(() => buildKeymap(keymap), [keymap]);
+    const mdxIslandActive = !!mdxOpts && mdxOpts.transform !== void 0;
+    const [mermaidEngineSrc, setMermaidEngineSrc] = React7.useState(void 0);
+    React7.useEffect(() => {
+      const getEngine = mermaidOpts?.getEngine;
+      if (!getEngine) {
+        setMermaidEngineSrc(void 0);
+        return void 0;
+      }
+      let canceled = false;
+      Promise.resolve().then(() => getEngine()).then((src) => {
+        if (!canceled && typeof src === "string") setMermaidEngineSrc(src);
+      }).catch(() => {
+        if (!canceled) setMermaidEngineSrc(void 0);
+      });
+      return () => {
+        canceled = true;
+      };
+    }, [mermaidOpts]);
+    const mermaidIslandActive = !!mermaidOpts && !!mermaidOpts.getEngine && mermaidEngineSrc !== void 0;
+    const isControlled = value !== void 0;
+    const [internal, setInternal] = React7.useState(defaultValue ?? "");
+    const md = isControlled ? value ?? "" : internal;
+    const mdRef = React7.useRef(md);
+    mdRef.current = md;
+    const lastCommitRef = React7.useRef(null);
+    const [visibleRev, setVisibleRev] = React7.useState(0);
+    const bumpVisible = React7.useCallback(() => setVisibleRev((r) => r + 1), []);
+    const collab = useCollab(comments, presence, md, mode, settingsControl, visibleRev);
+    const { onCommit } = collab;
+    const commitValue = React7.useCallback(
+      (next, change) => {
+        lastCommitRef.current = { prev: mdRef.current, change, next };
+        if (!isControlled) setInternal(next);
+        onChange?.(next, change);
+        onCommit(change);
+      },
+      [isControlled, onChange, onCommit]
+    );
+    const activeSource = React7.useRef(null);
+    const register = React7.useCallback((api) => {
+      if (api || activeSource.current) activeSource.current = api;
+    }, []);
+    const applyCmd = React7.useCallback((cmd) => {
+      activeSource.current?.apply(cmd);
+    }, []);
+    React7.useImperativeHandle(forwardedRef, () => ({ applyCommand: applyCmd, setMode }), [applyCmd, setMode]);
+    const foldOpts = folding && typeof folding === "object" ? folding : null;
+    const foldingEnabled = folding === void 0 ? true : foldOpts ? foldOpts.enabled !== false : folding !== false;
+    const showGutter = foldOpts ? foldOpts.showGutter !== false : true;
+    const persistKey = foldOpts ? foldOpts.persistKey : void 0;
+    const effFolding = foldingOverride ?? foldingEnabled;
+    const effAppearance = themeOverride ?? (theme?.appearance ?? "auto");
+    const effToolbar = toolbarOverride ?? toolbar;
+    const islands = React7.useMemo(
+      () => ({
+        mdxActive: mdxIslandActive,
+        mdxTransform: mdxOpts?.transform,
+        mdxComponents: mdxOpts?.components,
+        mdxSandbox: mdxOpts?.sandbox,
+        mermaidActive: mermaidIslandActive,
+        mermaidEngine: mermaidEngineSrc,
+        theme: effAppearance === "dark" ? "dark" : "light"
+      }),
+      [mdxIslandActive, mdxOpts, mermaidIslandActive, mermaidEngineSrc, effAppearance]
+    );
+    const rootClass = ["tw-editor", `tw-mode-${mode}`, effAppearance !== "auto" ? `tw-theme-${effAppearance}` : "", className].filter(Boolean).join(" ");
+    const toolbarMode = effToolbar === "floating" ? "floating" : "docked";
+    const showToolbar = !!effToolbar && !readOnly && (mode === "edit" || mode === "unified");
+    const toolbarEl = showToolbar ? /* @__PURE__ */ jsx(Toolbar, { mode: toolbarMode, onCommand: applyCmd }) : null;
+    const shellClass = [
+      "tw-editor-shell",
+      effAppearance !== "auto" ? `tw-theme-${effAppearance}` : "",
+      collab.sidebarOpen ? "tw-comments-open" : ""
+    ].filter(Boolean).join(" ");
+    const shell = (content) => collab.shellActive ? /* @__PURE__ */ jsxs("div", { className: shellClass, onMouseUp: (e) => collab.onPointer(e.clientX, e.clientY), children: [
+      content,
+      collab.overlay
+    ] }) : content;
+    const settingsState = {
+      mode,
+      toolbar: effToolbar ?? false,
+      folding: effFolding,
+      theme: effAppearance,
+      extensions: {
+        // gfm is `boolean | Partial<GfmFeatures>` (no `enabled` field): any object
+        // presence counts as on. The rest carry an `enabled` flag → extEnabled.
+        gfm: effExtensions.gfm !== void 0 && effExtensions.gfm !== false,
+        mdx: extEnabled(effExtensions.mdx),
+        mermaid: extEnabled(effExtensions.mermaid),
+        math: extEnabled(effExtensions.math),
+        syntaxHighlight: extEnabled(effExtensions.syntaxHighlight)
+      }
+    };
+    const applySettingsPatch = React7.useCallback(
+      (patch) => {
+        if (patch.mode !== void 0) setMode(patch.mode);
+        if (patch.toolbar !== void 0) setToolbarOverride(patch.toolbar);
+        if (patch.folding !== void 0) setFoldingOverride(patch.folding);
+        if (patch.theme !== void 0) setThemeOverride(patch.theme);
+        if (patch.extensions !== void 0) {
+          setExtensionsOverride((prev) => ({ ...prev, ...patch.extensions }));
+        }
+      },
+      [setMode]
+    );
+    const paletteCommands = React7.useMemo(() => {
+      const built = COMMANDS.map((c) => ({ id: c.id, label: c.label, kbd: c.kbd, group: c.group, run: () => applyCmd(c.id) }));
+      const host = (settingsOpts?.commands ?? []).map((c) => ({ id: c.id, label: c.label, run: c.run }));
+      return [...built, ...host];
+    }, [applyCmd, settingsOpts]);
+    const settingsSurfaces = settingsActive ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(SettingsPanel, { open: settingsOpen, onClose: () => setSettingsOpen(false), state: settingsState, onChange: applySettingsPatch }),
+      /* @__PURE__ */ jsx(CommandPalette, { open: paletteOpen, onClose: () => setPaletteOpen(false), commands: paletteCommands })
+    ] }) : null;
+    const finish = (content) => settingsActive ? /* @__PURE__ */ jsxs(Fragment, { children: [
+      shell(content),
+      settingsSurfaces
+    ] }) : shell(content);
+    if (mode === "edit") {
+      return finish(
+        /* @__PURE__ */ jsxs("div", { className: rootClass, style, "data-typewright": "edit", children: [
+          toolbarEl,
+          /* @__PURE__ */ jsx(
+            SourceArea,
+            {
+              value: md,
+              readOnly,
+              placeholder,
+              onChange: (next, change) => commitValue(next, change),
+              onSelect: onSelectionChange,
+              register,
+              bindings: keymapBindings,
+              commentBase: collab.commentsActive ? 0 : void 0,
+              onCommentSelect: collab.commentsActive ? collab.onSourceSelect : void 0,
+              full: true
+            }
+          )
+        ] })
+      );
+    }
+    if (mode === "read") {
+      const readDoc = parse(md, parseOpts);
+      const hasIslands = (islands.mdxActive || islands.mermaidActive) && readDoc.children.some((b) => isMdxIslandBlock(b, islands) || isMermaidIslandBlock(b, islands));
+      if (!hasIslands) {
+        const html = renderToHtml(readDoc, renderOpts);
+        return finish(
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: rootClass,
+              style,
+              "data-typewright": "read",
+              ref: collab.active ? collab.contentRef : void 0,
+              dangerouslySetInnerHTML: { __html: withA11yHints(html) || `<p class="tw-placeholder">${escapeText(placeholder)}</p>` }
+            }
+          )
+        );
+      }
+      return finish(
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: rootClass,
+            style,
+            "data-typewright": "read",
+            ref: collab.active ? collab.contentRef : void 0,
+            children: readDoc.children.map((b, i) => {
+              if (b.type === "footnoteDef") return null;
+              const island = renderIsland(b, islands);
+              if (island) return /* @__PURE__ */ jsx(React7.Fragment, { children: island }, `${i}-${b.from}`);
+              return /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "tw-block",
+                  "data-tw-from": b.from,
+                  "data-tw-to": b.to,
+                  dangerouslySetInnerHTML: { __html: withA11yHints(renderNode(b, renderOpts)) }
+                },
+                `${i}-${b.from}`
+              );
+            })
+          }
+        )
+      );
+    }
+    const caretReveal = mode === "unified" && unifiedReveal === "caret" && !readOnly;
+    return finish(
+      /* @__PURE__ */ jsx(
+        UnifiedEditor,
+        {
+          md,
+          mdRef,
+          rootClass,
+          style,
+          readOnly,
+          caretReveal,
+          placeholder,
+          foldingEnabled: effFolding,
+          showGutter,
+          persistKey,
+          commitValue,
+          register,
+          toolbar: toolbarEl,
+          parseOpts,
+          renderOpts,
+          bindings: keymapBindings,
+          islands,
+          contentRef: collab.active ? collab.contentRef : void 0,
+          commentsActive: collab.commentsActive,
+          onCommentSelect: collab.commentsActive ? collab.onSourceSelect : void 0,
+          overscan,
+          lastCommitRef,
+          onVisibleChange: collab.active ? bumpVisible : void 0
+        }
+      )
+    );
+  }
+);
+var TB_GROUPS = [
+  [
+    { cmd: "bold", label: "Bold  \u2318B", text: "B", cls: "b" },
+    { cmd: "italic", label: "Italic  \u2318I", text: "I", cls: "i" },
+    { cmd: "strikethrough", label: "Strikethrough", text: "S", cls: "s" },
+    { cmd: "inlineCode", label: "Inline code  \u2318E", text: "\u2039\u203A" },
+    { cmd: "link", label: "Link  \u2318K", text: "\u2197" }
+  ],
+  [
+    { cmd: "heading1", label: "Heading 1", text: "H1" },
+    { cmd: "heading2", label: "Heading 2", text: "H2" },
+    { cmd: "bulletList", label: "Bullet list", text: "\u2022" },
+    { cmd: "orderedList", label: "Numbered list", text: "1." },
+    { cmd: "taskList", label: "Task list", text: "\u2611" },
+    { cmd: "quote", label: "Blockquote", text: "\u275D" }
+  ],
+  [
+    { cmd: "horizontalRule", label: "Divider", text: "\u2015" },
+    { cmd: "codeBlock", label: "Code block", text: "{ }" },
+    { cmd: "table", label: "Table", text: "\u25A6" }
+  ]
+];
+function Toolbar({ mode, onCommand }) {
+  return /* @__PURE__ */ jsx("div", { className: `tw-toolbar tw-toolbar-${mode}`, role: "toolbar", "aria-label": "Formatting", children: TB_GROUPS.map((group, gi) => /* @__PURE__ */ jsxs(React7.Fragment, { children: [
+    gi > 0 && /* @__PURE__ */ jsx("span", { className: "tw-tb-sep", "aria-hidden": "true" }),
+    group.map((it) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: `tw-tb-btn${it.cls ? " tw-tb-" + it.cls : ""}`,
+        title: it.label,
+        "aria-label": it.label,
+        "data-cmd": it.cmd,
+        onMouseDown: (e) => e.preventDefault(),
+        onClick: () => onCommand(it.cmd),
+        children: it.text
+      },
+      it.cmd
+    ))
+  ] }, gi)) });
+}
+var VIRT_THRESHOLD = 150;
+var VIRT_EST_BLOCK = 40;
+var VIRT_OVERSCAN_BLOCKS = 6;
+var VIRT_INITIAL = 50;
+function getScrollParent(el) {
+  let node = el.parentElement;
+  while (node) {
+    const s = getComputedStyle(node);
+    if (/(auto|scroll|overlay)/.test(s.overflowY + " " + s.overflow)) return node;
+    node = node.parentElement;
+  }
+  return null;
+}
+function UnifiedEditor(props) {
+  const { md, mdRef, rootClass, style, readOnly, placeholder, foldingEnabled, showGutter, persistKey, commitValue, register, toolbar, parseOpts, renderOpts, bindings, islands, caretReveal, contentRef, commentsActive, onCommentSelect, overscan, lastCommitRef, onVisibleChange } = props;
+  const [active, setActive] = React7.useState(null);
+  const [draft, setDraft] = React7.useState("");
+  const [folds, setFolds] = React7.useState(
+    () => persistKey ? loadFoldSet(persistKey) : /* @__PURE__ */ new Set()
+  );
+  const [typing, setTyping] = React7.useState(false);
+  const [foldMenuFor, setFoldMenuFor] = React7.useState(null);
+  const [foldMenuRect, setFoldMenuRect] = React7.useState(null);
+  const activeRef = React7.useRef(null);
+  const draftRef = React7.useRef("");
+  activeRef.current = active;
+  draftRef.current = draft;
+  const rowEls = React7.useRef(/* @__PURE__ */ new Map());
+  const flipFrom = React7.useRef(null);
+  const captureFlip = React7.useCallback(() => {
+    const m = /* @__PURE__ */ new Map();
+    rowEls.current.forEach((el, k) => m.set(k, el.getBoundingClientRect().top));
+    flipFrom.current = m;
+  }, []);
+  React7.useLayoutEffect(() => {
+    const from = flipFrom.current;
+    if (!from) return;
+    flipFrom.current = null;
+    rowEls.current.forEach((el, k) => {
+      const prev = from.get(k);
+      if (prev == null) return;
+      const dy = prev - el.getBoundingClientRect().top;
+      if (Math.abs(dy) > 0.5) {
+        el.style.transition = "none";
+        el.style.transform = `translateY(${dy}px)`;
+        requestAnimationFrame(() => {
+          el.style.transition = "transform .3s cubic-bezier(.32,.72,0,1)";
+          el.style.transform = "";
+        });
+      }
+    });
+  });
+  const prevParse = React7.useRef(null);
+  const doc = React7.useMemo(() => {
+    const prev = prevParse.current;
+    const lc = lastCommitRef?.current ?? null;
+    let result;
+    if (prev && lc && prev.opts === parseOpts && lc.next === md && lc.prev === prev.src && lc.prev !== md) {
+      result = parseIncremental(prev.doc, prev.src, lc.change, md, parseOpts);
+    } else {
+      result = parse(md, parseOpts);
+    }
+    prevParse.current = { src: md, opts: parseOpts, doc: result };
+    return result;
+  }, [md, parseOpts, lastCommitRef]);
+  const blocks = doc.children;
+  const blocksRef = React7.useRef(blocks);
+  blocksRef.current = blocks;
+  const foldsRef = React7.useRef(folds);
+  foldsRef.current = folds;
+  const commitFolds = React7.useCallback(
+    (next) => {
+      setFolds(next);
+      if (persistKey) saveFoldSet(persistKey, next);
+    },
+    [persistKey]
+  );
+  const toggleFold = React7.useCallback(
+    (i) => {
+      const key = headingKeyMap(blocksRef.current, mdRef.current).get(i);
+      if (!key) return;
+      const next = new Set(foldsRef.current);
+      if (next.has(key)) next.delete(key);
+      else next.add(key);
+      commitFolds(next);
+    },
+    [commitFolds, mdRef]
+  );
+  const foldAll = React7.useCallback(() => {
+    const next = /* @__PURE__ */ new Set();
+    headingKeyMap(blocksRef.current, mdRef.current).forEach((key) => next.add(key));
+    commitFolds(next);
+  }, [commitFolds, mdRef]);
+  const unfoldAll = React7.useCallback(() => commitFolds(/* @__PURE__ */ new Set()), [commitFolds]);
+  const setHeadingLevel = React7.useCallback(
+    (i, level) => {
+      const b = blocksRef.current[i];
+      if (!b || b.type !== "heading") return;
+      const src = mdRef.current;
+      const marker = "#".repeat(level) + " ";
+      const change = { from: b.from, to: b.contentFrom, insert: marker };
+      const next = src.slice(0, change.from) + marker + src.slice(change.to);
+      if (next !== src) {
+        commitValue(next, change);
+        mdRef.current = next;
+      }
+    },
+    [mdRef, commitValue]
+  );
+  const copyHeadingLink = React7.useCallback(
+    (i) => {
+      const b = blocksRef.current[i];
+      if (!b || b.type !== "heading") return;
+      const slug = slugify(mdRef.current.slice(b.contentFrom, b.to));
+      try {
+        void navigator.clipboard?.writeText("#" + slug);
+      } catch {
+      }
+    },
+    [mdRef]
+  );
+  const handleTableChange = React7.useCallback(
+    (change) => {
+      const src = mdRef.current;
+      const next = src.slice(0, change.from) + change.insert + src.slice(change.to);
+      if (next !== src) {
+        commitValue(next, { from: change.from, to: change.to, insert: change.insert });
+        mdRef.current = next;
+      }
+    },
+    [mdRef, commitValue]
+  );
+  const commit = React7.useCallback(() => {
+    const a = activeRef.current;
+    const src = mdRef.current;
+    activeRef.current = null;
+    setActive(null);
+    if (a === null) return { next: src, change: null };
+    const b = parse(src, parseOpts).children[a];
+    if (!b) return { next: src, change: null };
+    const next = src.slice(0, b.from) + draftRef.current + src.slice(b.to);
+    const change = { from: b.from, to: b.to, insert: draftRef.current };
+    if (next !== src) commitValue(next, change);
+    mdRef.current = next;
+    return { next, change };
+  }, [mdRef, commitValue, parseOpts]);
+  const activate = React7.useCallback(
+    (clickedFrom) => {
+      if (readOnly) return;
+      captureFlip();
+      const { next, change } = commit();
+      let mapped = clickedFrom;
+      if (change && clickedFrom >= change.to) {
+        mapped = clickedFrom + (change.insert.length - (change.to - change.from));
+      }
+      const nextBlocks = parse(next, parseOpts).children;
+      let idx = nextBlocks.findIndex((bl) => mapped >= bl.from && mapped < bl.to);
+      if (idx < 0) idx = nextBlocks.findIndex((bl) => bl.from === mapped);
+      const b = nextBlocks[idx];
+      if (b) {
+        const d = next.slice(b.from, b.to);
+        draftRef.current = d;
+        setDraft(d);
+        activeRef.current = idx;
+        setActive(idx);
+      }
+    },
+    [commit, readOnly, captureFlip, parseOpts]
+  );
+  const foldedHeadings = React7.useMemo(() => {
+    const set = /* @__PURE__ */ new Set();
+    if (!foldingEnabled) return set;
+    headingKeyMap(blocks, md).forEach((key, idx) => {
+      if (folds.has(key)) set.add(idx);
+    });
+    return set;
+  }, [blocks, md, folds, foldingEnabled]);
+  const hidden = React7.useMemo(() => {
+    const set = /* @__PURE__ */ new Set();
+    if (!foldingEnabled) return set;
+    for (let i = 0; i < blocks.length; i++) {
+      const b = blocks[i];
+      if (b.type === "heading" && foldedHeadings.has(i)) {
+        for (let j = i + 1; j < blocks.length; j++) {
+          const n = blocks[j];
+          if (n.type === "heading" && n.level <= b.level) break;
+          set.add(j);
+        }
+      }
+    }
+    return set;
+  }, [blocks, foldedHeadings, foldingEnabled]);
+  const visible = React7.useMemo(() => {
+    const arr = [];
+    for (let i = 0; i < blocks.length; i++) if (!hidden.has(i)) arr.push({ b: blocks[i], i });
+    return arr;
+  }, [blocks, hidden]);
+  const virtualize = visible.length > VIRT_THRESHOLD;
+  const overscanPx = Math.max(overscan ?? VIRT_OVERSCAN_BLOCKS, 0) * VIRT_EST_BLOCK;
+  const heights = React7.useRef(/* @__PURE__ */ new Map());
+  const heightOf = (b) => heights.current.get(b.from) ?? VIRT_EST_BLOCK;
+  const virtInnerRef = React7.useRef(null);
+  const virtScrollRef = React7.useRef(null);
+  const scrollerRef = React7.useRef(null);
+  const [ownScroller, setOwnScroller] = React7.useState(false);
+  const [range, setRange] = React7.useState({ start: 0, end: 0 });
+  const computeRange = () => {
+    const n = visible.length;
+    const scroller = scrollerRef.current;
+    const content = virtInnerRef.current;
+    if (!scroller || !content || n === 0) return { start: 0, end: Math.min(n, VIRT_INITIAL) };
+    const scRect = scroller.getBoundingClientRect();
+    const coRect = content.getBoundingClientRect();
+    const contentOffset = scroller.scrollTop + (coRect.top - scRect.top);
+    const winTop = scroller.scrollTop - contentOffset - overscanPx;
+    const winBottom = scroller.scrollTop - contentOffset + scroller.clientHeight + overscanPx;
+    let cum = 0;
+    let start2 = -1;
+    let end2 = 0;
+    for (let k = 0; k < n; k++) {
+      const top = cum;
+      const bottom = cum + heightOf(visible[k].b);
+      if (bottom > winTop && top < winBottom) {
+        if (start2 < 0) start2 = k;
+        end2 = k + 1;
+      }
+      cum = bottom;
+      if (top >= winBottom) break;
+    }
+    if (start2 < 0) {
+      start2 = 0;
+      end2 = 0;
+    }
+    const a = activeRef.current;
+    if (a !== null) {
+      const av = visible.findIndex((v) => v.i === a);
+      if (av >= 0) {
+        if (av < start2) start2 = av;
+        if (av + 1 > end2) end2 = av + 1;
+      }
+    }
+    return { start: start2, end: end2 };
+  };
+  const computeRangeRef = React7.useRef(computeRange);
+  computeRangeRef.current = computeRange;
+  const setRangeIfChanged = React7.useCallback((r) => {
+    setRange((prev) => prev.start === r.start && prev.end === r.end ? prev : r);
+  }, []);
+  React7.useLayoutEffect(() => {
+    if (!virtualize) return;
+    const content = virtInnerRef.current;
+    if (!content) return;
+    let scroller;
+    if (ownScroller) {
+      scroller = virtScrollRef.current;
+    } else {
+      scroller = getScrollParent(content);
+      if (!scroller) {
+        setOwnScroller(true);
+        return;
+      }
+    }
+    if (!scroller) return;
+    scrollerRef.current = scroller;
+    let raf = 0;
+    const onScroll = () => {
+      if (raf) return;
+      raf = requestAnimationFrame(() => {
+        raf = 0;
+        setRangeIfChanged(computeRangeRef.current());
+      });
+    };
+    scroller.addEventListener("scroll", onScroll, { passive: true });
+    const ro = typeof ResizeObserver !== "undefined" ? new ResizeObserver(onScroll) : null;
+    ro?.observe(scroller);
+    if (typeof window !== "undefined") window.addEventListener("resize", onScroll);
+    setRangeIfChanged(computeRangeRef.current());
+    return () => {
+      scroller.removeEventListener("scroll", onScroll);
+      ro?.disconnect();
+      if (typeof window !== "undefined") window.removeEventListener("resize", onScroll);
+      if (raf) cancelAnimationFrame(raf);
+    };
+  }, [virtualize, ownScroller, setRangeIfChanged]);
+  React7.useLayoutEffect(() => {
+    if (!virtualize) return;
+    rowEls.current.forEach((el, idx) => {
+      const b = blocks[idx];
+      if (!b) return;
+      const h = el.offsetHeight;
+      if (h > 0) heights.current.set(b.from, h);
+    });
+    setRangeIfChanged(computeRangeRef.current());
+  });
+  React7.useLayoutEffect(() => {
+    if (virtualize) onVisibleChange?.();
+  }, [range.start, range.end, virtualize, onVisibleChange]);
+  if (readOnly && !md.trim()) {
+    return /* @__PURE__ */ jsx("div", { className: rootClass, style, "data-typewright": "unified", ref: contentRef, children: /* @__PURE__ */ jsx("p", { className: "tw-placeholder", children: placeholder }) });
+  }
+  if (!md.trim() || typing) {
+    return /* @__PURE__ */ jsxs("div", { className: rootClass, style, "data-typewright": "unified", ref: contentRef, children: [
+      toolbar,
+      /* @__PURE__ */ jsx(
+        SourceArea,
+        {
+          value: md,
+          full: true,
+          placeholder,
+          register,
+          bindings,
+          commentBase: commentsActive ? 0 : void 0,
+          onCommentSelect: commentsActive ? onCommentSelect : void 0,
+          onFocus: () => setTyping(true),
+          onBlur: () => setTyping(false),
+          onChange: (next, change) => commitValue(next, change)
+        }
+      )
+    ] });
+  }
+  const renderRow = (i, b) => {
+    const isHeading = b.type === "heading";
+    const folded = isHeading && foldedHeadings.has(i);
+    const islandEl = renderIsland(b, islands);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "tw-row",
+        "data-block-type": b.type,
+        ref: (el) => {
+          if (el) rowEls.current.set(i, el);
+          else rowEls.current.delete(i);
+        },
+        children: [
+          foldingEnabled && b.type === "heading" && !readOnly && showGutter && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: `tw-fold${folded ? " tw-folded" : ""}`,
+                "aria-label": folded ? "Unfold section" : "Fold section",
+                "aria-expanded": !folded,
+                onClick: () => toggleFold(i),
+                children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", width: "12", height: "12", fill: "none", stroke: "currentColor", strokeWidth: "2.4", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" }) })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: "tw-fold-more",
+                "aria-label": "Heading options",
+                "aria-haspopup": "menu",
+                "aria-expanded": foldMenuFor === i,
+                onClick: (e) => {
+                  setFoldMenuRect(e.currentTarget.getBoundingClientRect());
+                  setFoldMenuFor(i);
+                },
+                children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", width: "13", height: "13", fill: "currentColor", stroke: "none", "aria-hidden": "true", children: [
+                  /* @__PURE__ */ jsx("circle", { cx: "5", cy: "12", r: "1.7" }),
+                  /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "1.7" }),
+                  /* @__PURE__ */ jsx("circle", { cx: "19", cy: "12", r: "1.7" })
+                ] })
+              }
+            ),
+            foldMenuFor === i && /* @__PURE__ */ jsx(
+              FoldMenu,
+              {
+                open: true,
+                level: b.level,
+                folded,
+                anchorRect: foldMenuRect,
+                onSetLevel: (n) => setHeadingLevel(i, n),
+                onToggleFold: () => toggleFold(i),
+                onFoldAll: foldAll,
+                onUnfoldAll: unfoldAll,
+                onCopyLink: () => copyHeadingLink(i),
+                onClose: () => setFoldMenuFor(null)
+              }
+            )
+          ] }),
+          active === i && !readOnly ? /* @__PURE__ */ jsx(
+            SourceArea,
+            {
+              value: draft,
+              autoFocus: true,
+              register,
+              bindings,
+              commentBase: commentsActive ? b.from : void 0,
+              onCommentSelect: commentsActive ? onCommentSelect : void 0,
+              onChange: (next) => setDraft(next),
+              onBlur: () => {
+                captureFlip();
+                commit();
+              },
+              onEscape: () => {
+                captureFlip();
+                commit();
+              }
+            }
+          ) : islandEl ? islandEl : b.type === "table" && !readOnly ? (
+            // A table is edited in its grid, not via a click-to-reveal source
+            // textarea; the grid emits already-scoped splices we apply verbatim.
+            /* @__PURE__ */ jsx(TableGrid, { table: b, source: mdRef.current, onChange: handleTableChange, readOnly })
+          ) : caretReveal && isCaretEligible(b) ? (
+            // Caret-level reveal (SPEC §5.2): edited in place via a managed
+            // contentEditable that emits scoped splices — same commit path as
+            // the table grid (apply the splice + commit → anchors/folds/parse
+            // all keep working). Opt-in; never on the default block path.
+            /* @__PURE__ */ jsx(CaretRevealBlock, { block: b, source: mdRef.current, onChange: handleTableChange, readOnly })
+          ) : (() => {
+            const html = withA11yHints(renderNode(b, renderOpts));
+            const hasInteractive = HAS_INTERACTIVE_HTML.test(html);
+            return /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: "tw-block",
+                role: readOnly || hasInteractive ? void 0 : "button",
+                "aria-label": !readOnly && hasInteractive ? "Edit block source" : void 0,
+                tabIndex: readOnly ? void 0 : 0,
+                "data-tw-from": b.from,
+                "data-tw-to": b.to,
+                onMouseDown: (e) => {
+                  if (readOnly) return;
+                  if (commentsActive) return;
+                  e.preventDefault();
+                  activate(b.from);
+                },
+                onClick: () => {
+                  if (readOnly || !commentsActive) return;
+                  const sel = window.getSelection();
+                  if (sel && !sel.isCollapsed && sel.toString().trim()) return;
+                  activate(b.from);
+                },
+                onKeyDown: (e) => {
+                  if (!readOnly && (e.key === "Enter" || e.key === " ")) {
+                    e.preventDefault();
+                    activate(b.from);
+                  }
+                },
+                dangerouslySetInnerHTML: { __html: html }
+              }
+            );
+          })(),
+          folded && /* @__PURE__ */ jsxs("button", { type: "button", className: "tw-foldchip", onClick: () => toggleFold(i), children: [
+            "\u2026 ",
+            foldedSummary(blocks, i)
+          ] })
+        ]
+      },
+      `${i}-${b.from}`
+    );
+  };
+  if (!virtualize) {
+    return /* @__PURE__ */ jsxs("div", { className: rootClass, style, "data-typewright": "unified", ref: contentRef, children: [
+      toolbar,
+      blocks.map((b, i) => hidden.has(i) ? null : renderRow(i, b))
+    ] });
+  }
+  const start = Math.min(range.start, visible.length);
+  const end = Math.min(range.end, visible.length);
+  let topPx = 0;
+  for (let k = 0; k < start; k++) topPx += heightOf(visible[k].b);
+  let bottomPx = 0;
+  for (let k = end; k < visible.length; k++) bottomPx += heightOf(visible[k].b);
+  return /* @__PURE__ */ jsxs("div", { className: rootClass, style, "data-typewright": "unified", ref: contentRef, children: [
+    toolbar,
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: virtScrollRef,
+        className: ownScroller ? "tw-virt-scroll" : void 0,
+        style: ownScroller ? { overflow: "auto", maxHeight: "70vh" } : void 0,
+        children: /* @__PURE__ */ jsxs("div", { ref: virtInnerRef, className: "tw-virt-content", children: [
+          /* @__PURE__ */ jsx("div", { className: "tw-virt-spacer", "aria-hidden": "true", style: { height: topPx } }),
+          visible.slice(start, end).map(({ b, i }) => renderRow(i, b)),
+          /* @__PURE__ */ jsx("div", { className: "tw-virt-spacer", "aria-hidden": "true", style: { height: bottomPx } })
+        ] })
+      }
+    )
+  ] });
+}
+var FOLD_STORE_PREFIX = "typewright-folds:";
+function slugify(text) {
+  return text.trim().toLowerCase().replace(/\s+/g, "-").replace(/[^a-z0-9-]/g, "");
+}
+function headingKeyMap(blocks, src) {
+  const seen = /* @__PURE__ */ new Map();
+  const out = /* @__PURE__ */ new Map();
+  blocks.forEach((b, i) => {
+    if (b.type !== "heading") return;
+    const base = slugify(src.slice(b.contentFrom, b.to)) || "section";
+    const n = seen.get(base) ?? 0;
+    seen.set(base, n + 1);
+    out.set(i, n === 0 ? base : `${base}-${n}`);
+  });
+  return out;
+}
+function loadFoldSet(persistKey) {
+  const set = /* @__PURE__ */ new Set();
+  if (typeof window === "undefined") return set;
+  let raw = null;
+  try {
+    raw = window.localStorage.getItem(FOLD_STORE_PREFIX + persistKey);
+  } catch {
+    return set;
+  }
+  if (!raw) return set;
+  let keys;
+  try {
+    keys = JSON.parse(raw);
+  } catch {
+    return set;
+  }
+  if (!Array.isArray(keys)) return set;
+  for (const k of keys) if (typeof k === "string") set.add(k);
+  return set;
+}
+function saveFoldSet(persistKey, folds) {
+  if (typeof window === "undefined") return;
+  try {
+    window.localStorage.setItem(FOLD_STORE_PREFIX + persistKey, JSON.stringify([...folds]));
+  } catch {
+  }
+}
+function foldedSummary(blocks, idx) {
+  const b = blocks[idx];
+  let lines = 0;
+  let subs = 0;
+  for (let j = idx + 1; j < blocks.length; j++) {
+    const n = blocks[j];
+    if (n.type === "heading" && n.level <= b.level) break;
+    if (n.type === "heading") subs++;
+    lines++;
+  }
+  return `${lines} block${lines === 1 ? "" : "s"}${subs ? ` \xB7 ${subs} subsection${subs === 1 ? "" : "s"}` : ""}`;
+}
+function SourceArea(props) {
+  const { value, onChange, onBlur, onEscape, onFocus, onSelect, autoFocus, readOnly, placeholder, full, register, bindings, commentBase, onCommentSelect } = props;
+  const ref = React7.useRef(null);
+  const pendingSel = React7.useRef(null);
+  const apply = React7.useCallback(
+    (cmd) => {
+      const el = ref.current;
+      if (!el) return;
+      const val = el.value;
+      const r = applyCommand(val, { from: el.selectionStart, to: el.selectionEnd }, cmd);
+      pendingSel.current = [r.selection.from, r.selection.to];
+      onChange(r.text, { from: 0, to: val.length, insert: r.text });
+    },
+    [onChange]
+  );
+  React7.useEffect(() => {
+    if (pendingSel.current && ref.current) {
+      ref.current.selectionStart = pendingSel.current[0];
+      ref.current.selectionEnd = pendingSel.current[1];
+      pendingSel.current = null;
+    }
+  });
+  const autoGrow = (el) => {
+    if (full) return;
+    el.style.height = "auto";
+    el.style.height = `${el.scrollHeight}px`;
+  };
+  return /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      ref,
+      className: `tw-source${full ? " tw-source-full" : ""}`,
+      value,
+      placeholder,
+      readOnly,
+      autoFocus,
+      spellCheck: false,
+      rows: full ? void 0 : 1,
+      onChange: (e) => {
+        onChange(e.target.value, { from: 0, to: value.length, insert: e.target.value });
+        autoGrow(e.currentTarget);
+      },
+      onFocus: (e) => {
+        autoGrow(e.currentTarget);
+        onFocus?.();
+        register?.({ apply });
+      },
+      onBlur: () => {
+        onBlur?.();
+      },
+      onSelect: (e) => {
+        const el = e.currentTarget;
+        const from = el.selectionStart;
+        const to = el.selectionEnd;
+        onSelect?.({ main: { from, to }, ranges: [{ from, to }] });
+        if (onCommentSelect && commentBase !== void 0 && from !== to) {
+          onCommentSelect(commentBase + from, commentBase + to, el.value.slice(from, to));
+        }
+      },
+      onKeyDown: (e) => {
+        if (e.key === "Escape" && onEscape) {
+          e.preventDefault();
+          onEscape();
+          return;
+        }
+        const cmd = bindings?.get(eventCanon(e));
+        if (cmd) {
+          e.preventDefault();
+          apply(cmd);
+        }
+      }
+    }
+  );
+}
+function escapeText(s) {
+  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+}
+var TYPEWRIGHT_CSS = `
+.tw-editor { --tw-fg:#1a1d20; --tw-muted:#5a6169; --tw-faint:#8b929a; --tw-bg:#ffffff; --tw-chip:#f0f1f3; --tw-line:rgba(18,22,27,.1); --tw-accent:#2f6fed; --tw-accent-soft:rgba(47,111,237,.1); --tw-code-bg:#f6f7f9; font-family:-apple-system,"SF Pro Text",system-ui,sans-serif; color:var(--tw-fg); line-height:1.6; font-size:15px; }
+@media (prefers-color-scheme: dark) { .tw-editor:not(.tw-theme-light) { --tw-fg:#e8eaed; --tw-muted:#a3abb2; --tw-faint:#6a727a; --tw-bg:#0f1215; --tw-chip:#1e242b; --tw-line:rgba(255,255,255,.1); --tw-accent:#6ea3ff; --tw-accent-soft:rgba(110,163,255,.14); --tw-code-bg:#13171b; } }
+.tw-editor.tw-theme-dark { --tw-fg:#e8eaed; --tw-muted:#a3abb2; --tw-faint:#6a727a; --tw-bg:#0f1215; --tw-chip:#1e242b; --tw-line:rgba(255,255,255,.1); --tw-accent:#6ea3ff; --tw-accent-soft:rgba(110,163,255,.14); --tw-code-bg:#13171b; }
+.tw-editor { background:var(--tw-bg); border-radius:10px; }
+.tw-editor h1,.tw-editor h2,.tw-editor h3,.tw-editor h4,.tw-editor h5,.tw-editor h6 { font-weight:680; letter-spacing:-.02em; margin:.7em 0 .3em; line-height:1.25; }
+.tw-editor h1{font-size:1.8em} .tw-editor h2{font-size:1.45em} .tw-editor h3{font-size:1.2em} .tw-editor h4{font-size:1.05em}
+.tw-editor p{margin:.5em 0} .tw-editor ul,.tw-editor ol{margin:.4em 0; padding-left:1.5em} .tw-editor li{margin:.15em 0}
+.tw-editor a{color:var(--tw-accent); text-decoration:none; border-bottom:1px solid var(--tw-accent-soft)}
+.tw-editor code{font-family:"SF Mono",ui-monospace,Menlo,monospace; font-size:.88em; background:var(--tw-chip); border:1px solid var(--tw-line); border-radius:5px; padding:1px 5px}
+.tw-editor pre{background:var(--tw-code-bg); border:1px solid var(--tw-line); border-radius:9px; padding:12px 14px; overflow-x:auto; margin:.6em 0}
+.tw-editor pre code{background:none; border:0; padding:0; font-size:13px; line-height:1.55}
+.tw-editor blockquote{border-left:3px solid var(--tw-line); margin:.6em 0; padding:.1em 0 .1em 14px; color:var(--tw-muted)}
+.tw-editor table{border-collapse:collapse; margin:.6em 0; font-size:.95em} .tw-editor th,.tw-editor td{border:1px solid var(--tw-line); padding:6px 12px} .tw-editor th{background:var(--tw-chip)}
+.tw-editor hr{border:0; border-top:1px solid var(--tw-line); margin:1em 0}
+.tw-editor img{max-width:100%}
+.tw-editor input[type=checkbox]{margin-right:6px; vertical-align:middle}
+.tw-placeholder{color:var(--tw-faint)}
+.tw-mode-preview,.tw-mode-read,.tw-mode-unified{padding:14px 18px}
+.tw-mode-edit{padding:0}
+.tw-toolbar{display:flex; align-items:center; justify-content:center; gap:3px; flex-wrap:wrap; padding:5px 7px; margin-bottom:9px; border:1px solid var(--tw-line); border-radius:12px; background:color-mix(in srgb, var(--tw-bg) 80%, transparent); backdrop-filter:blur(18px) saturate(1.6); -webkit-backdrop-filter:blur(18px) saturate(1.6); position:sticky; top:0; z-index:5; box-shadow:0 4px 14px -8px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.06)}
+.tw-toolbar-floating{max-height:0; padding-top:0; padding-bottom:0; margin-bottom:0; opacity:0; overflow:hidden; border-color:transparent; box-shadow:none; transform:translateY(-7px); transition:max-height .28s cubic-bezier(.32,.72,0,1), opacity .2s, margin .28s cubic-bezier(.32,.72,0,1), padding .28s, transform .24s cubic-bezier(.32,.72,0,1)}
+.tw-editor:hover .tw-toolbar-floating,.tw-editor:focus-within .tw-toolbar-floating{max-height:84px; padding-top:5px; padding-bottom:5px; margin-bottom:9px; opacity:1; border-color:var(--tw-line); box-shadow:0 4px 14px -8px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.06); transform:none}
+.tw-tb-sep{width:1px; height:18px; background:var(--tw-line); margin:0 3px}
+.tw-tb-btn{min-width:28px; height:28px; padding:0 7px; border:1px solid transparent; background:transparent; border-radius:7px; color:var(--tw-muted); font-size:13px; line-height:1; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:color .15s,background .15s}
+.tw-tb-btn:hover{color:var(--tw-fg); background:var(--tw-accent-soft)}
+.tw-tb-b{font-weight:800} .tw-tb-i{font-style:italic; font-family:Georgia,serif} .tw-tb-s{text-decoration:line-through}
+.tw-row{transition:transform .3s cubic-bezier(.32,.72,0,1)}
+@keyframes tw-stream-in{from{opacity:0; transform:translateY(7px)}to{opacity:1; transform:none}}
+.tw-streamblk.tw-stream-in{animation:tw-stream-in .3s cubic-bezier(.32,.72,0,1) both}
+.tw-row{position:relative; display:flex; align-items:flex-start; gap:2px}
+.tw-block{flex:1; min-width:0; border-radius:6px; cursor:text; padding:1px 4px; margin-left:-4px; transition:background .15s}
+.tw-mode-unified .tw-block:hover,.tw-mode-preview .tw-block:hover{background:var(--tw-accent-soft)}
+.tw-block:focus-visible{outline:2px solid var(--tw-accent); outline-offset:2px}
+.tw-block>:first-child{margin-top:.15em} .tw-block>:last-child{margin-bottom:.15em}
+.tw-fold{flex:none; width:20px; height:24px; margin-top:.35em; border:0; background:none; color:var(--tw-faint); border-radius:5px; display:grid; place-items:center; cursor:pointer; opacity:.55; transition:opacity .15s,color .15s,transform .15s}
+.tw-fold:hover{opacity:1; color:var(--tw-accent)} .tw-fold.tw-folded svg{transform:rotate(-90deg)}
+.tw-fold-more{flex:none; width:18px; height:24px; margin-top:.35em; border:0; background:none; color:var(--tw-faint); border-radius:5px; display:grid; place-items:center; cursor:pointer; opacity:0; transition:opacity .15s,color .15s}
+.tw-row:hover .tw-fold-more,.tw-fold-more:focus-visible,.tw-fold-more[aria-expanded="true"]{opacity:.6}
+.tw-fold-more:hover,.tw-fold-more[aria-expanded="true"]{opacity:1; color:var(--tw-accent)}
+.tw-foldchip{margin-left:6px; font-size:12.5px; color:var(--tw-faint); background:none; border:1px dashed var(--tw-line); border-radius:7px; padding:2px 9px; cursor:pointer}
+.tw-foldchip:hover{color:var(--tw-muted); border-color:var(--tw-accent)}
+.tw-source{width:100%; box-sizing:border-box; font-family:"SF Mono",ui-monospace,Menlo,monospace; font-size:13.5px; line-height:1.6; color:var(--tw-fg); background:var(--tw-accent-soft); border:1px solid var(--tw-accent); border-radius:7px; padding:6px 9px; resize:none; outline:none}
+.tw-source-full{min-height:280px; height:100%; background:var(--tw-bg); border:0; border-radius:0; padding:16px 18px; font-size:14px}
+.tw-caret{display:inline-block; width:2px; height:1.05em; background:var(--tw-accent); vertical-align:text-bottom; margin-left:1px; border-radius:1px; animation:tw-blink 1.06s steps(1) infinite}
+@keyframes tw-blink{50%{opacity:0}}
+.tw-pending{opacity:.62; border-bottom:1.5px dashed var(--tw-accent); border-radius:1px}
+.tw-pending-strong{font-weight:680} .tw-pending-em{font-style:italic} .tw-pending-code{font-family:"SF Mono",ui-monospace,monospace}
+.tw-skeleton{border:1px solid var(--tw-line); border-radius:10px; padding:12px; margin:.6em 0; background:linear-gradient(100deg, var(--tw-chip) 30%, var(--tw-code-bg) 50%, var(--tw-chip) 70%); background-size:200% 100%; animation:tw-shimmer 1.3s infinite}
+.tw-skeleton-label{font-family:"SF Mono",ui-monospace,monospace; font-size:11px; color:var(--tw-accent)}
+.tw-skeleton-bar{height:8px; border-radius:4px; background:var(--tw-line); margin-top:9px} .tw-skeleton-bar.two{width:70%} .tw-skeleton-bar.three{width:45%}
+@keyframes tw-shimmer{to{background-position:-200% 0}}
+@media (prefers-reduced-motion: reduce){ .tw-caret,.tw-skeleton,.tw-streamblk.tw-stream-in,.tw-row{animation:none !important; transition:none !important} }
+.tw-editor .tw-tok-keyword{color:#cf222e} .tw-editor .tw-tok-string{color:#0a3069} .tw-editor .tw-tok-comment{color:#6e7781; font-style:italic} .tw-editor .tw-tok-number{color:#0550ae} .tw-editor .tw-tok-punct{color:var(--tw-muted)} .tw-editor .tw-tok-fn{color:#8250df} .tw-editor .tw-tok-type{color:#953800} .tw-editor .tw-tok-prop{color:#116329}
+@media (prefers-color-scheme: dark){ .tw-editor:not(.tw-theme-light) .tw-tok-keyword{color:#ff7b72} .tw-editor:not(.tw-theme-light) .tw-tok-string{color:#a5d6ff} .tw-editor:not(.tw-theme-light) .tw-tok-comment{color:#8b949e} .tw-editor:not(.tw-theme-light) .tw-tok-number{color:#79c0ff} .tw-editor:not(.tw-theme-light) .tw-tok-fn{color:#d2a8ff} .tw-editor:not(.tw-theme-light) .tw-tok-type{color:#ffa657} .tw-editor:not(.tw-theme-light) .tw-tok-prop{color:#7ee787} }
+.tw-editor.tw-theme-dark .tw-tok-keyword{color:#ff7b72} .tw-editor.tw-theme-dark .tw-tok-string{color:#a5d6ff} .tw-editor.tw-theme-dark .tw-tok-comment{color:#8b949e} .tw-editor.tw-theme-dark .tw-tok-number{color:#79c0ff} .tw-editor.tw-theme-dark .tw-tok-fn{color:#d2a8ff} .tw-editor.tw-theme-dark .tw-tok-type{color:#ffa657} .tw-editor.tw-theme-dark .tw-tok-prop{color:#7ee787}
+.tw-editor .tw-math-src{font-family:"SF Mono",ui-monospace,Menlo,monospace; font-size:.9em; background:var(--tw-code-bg); border:1px solid var(--tw-line); border-radius:5px; padding:1px 5px}
+.tw-editor div.tw-math-src{display:block; padding:8px 12px; margin:.6em 0; text-align:center; overflow-x:auto}
+.tw-editor .tw-footnotes{border-top:1px solid var(--tw-line); margin-top:1.4em; padding-top:.6em; font-size:.9em; color:var(--tw-muted)}
+.tw-editor .tw-fnref{font-size:.82em} .tw-editor .tw-fnref a{color:var(--tw-accent); border-bottom:0} .tw-editor .tw-fn-back{color:var(--tw-accent); border-bottom:0; margin-left:4px; text-decoration:none}
+.tw-editor dl{margin:.5em 0} .tw-editor dt{font-weight:680; margin-top:.4em} .tw-editor dd{margin:.15em 0 .35em 1.4em; color:var(--tw-muted)}
+/* ---- Collaboration: shell, comment highlights, presence, popup, composer ---- */
+.tw-editor-shell{ --tw-fg:#1a1d20; --tw-muted:#5a6169; --tw-faint:#8b929a; --tw-bg:#ffffff; --tw-chip:#f0f1f3; --tw-line:rgba(18,22,27,.1); --tw-accent:#2f6fed; --tw-accent-soft:rgba(47,111,237,.1); --tw-code-bg:#f6f7f9; position:relative; font-family:-apple-system,"SF Pro Text",system-ui,sans-serif }
+@media (prefers-color-scheme: dark){ .tw-editor-shell:not(.tw-theme-light){ --tw-fg:#e8eaed; --tw-muted:#a3abb2; --tw-faint:#6a727a; --tw-bg:#0f1215; --tw-chip:#1e242b; --tw-line:rgba(255,255,255,.1); --tw-accent:#6ea3ff; --tw-accent-soft:rgba(110,163,255,.14); --tw-code-bg:#13171b } }
+.tw-editor-shell.tw-theme-dark{ --tw-fg:#e8eaed; --tw-muted:#a3abb2; --tw-faint:#6a727a; --tw-bg:#0f1215; --tw-chip:#1e242b; --tw-line:rgba(255,255,255,.1); --tw-accent:#6ea3ff; --tw-accent-soft:rgba(110,163,255,.14); --tw-code-bg:#13171b }
+.tw-editor-shell.tw-comments-open>.tw-editor{margin-right:min(340px,82vw); transition:margin .26s cubic-bezier(.32,.72,0,1)}
+.tw-collab-bar{position:absolute; top:8px; right:10px; z-index:22; display:flex; align-items:center; gap:8px; pointer-events:none}
+.tw-collab-bar>*{pointer-events:auto}
+.tw-presence{display:flex; align-items:center}
+.tw-presence-av{width:26px; height:26px; border-radius:50%; display:grid; place-items:center; font-size:11px; font-weight:640; color:#0b0d0f; border:2px solid var(--tw-bg); margin-left:-7px; box-shadow:0 1px 3px rgba(0,0,0,.3)}
+.tw-presence-av:first-child{margin-left:0}
+.tw-comments-toggle{display:inline-flex; align-items:center; gap:6px; height:28px; padding:0 9px; border:1px solid var(--tw-line); border-radius:9px; background:color-mix(in srgb, var(--tw-bg) 82%, transparent); backdrop-filter:blur(16px) saturate(1.5); -webkit-backdrop-filter:blur(16px) saturate(1.5); color:var(--tw-muted); font:inherit; font-size:12.5px; cursor:pointer; transition:color .15s, border-color .15s, background .15s}
+.tw-comments-toggle:hover{color:var(--tw-fg); border-color:var(--tw-accent)}
+.tw-comments-toggle.tw-on{color:var(--tw-accent); border-color:var(--tw-accent); background:var(--tw-accent-soft)}
+.tw-comments-toggle:focus-visible{outline:2px solid var(--tw-accent); outline-offset:2px}
+.tw-comments-toggle svg{width:15px; height:15px; flex:none}
+.tw-comments-toggle-n{font-variant-numeric:tabular-nums; font-size:11px; font-weight:640; background:var(--tw-chip); border-radius:999px; padding:0 6px; line-height:1.6}
+.tw-settings-gear{display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; flex:none; border:1px solid var(--tw-line); border-radius:9px; background:color-mix(in srgb, var(--tw-bg) 82%, transparent); backdrop-filter:blur(16px) saturate(1.5); -webkit-backdrop-filter:blur(16px) saturate(1.5); color:var(--tw-muted); cursor:pointer; transition:color .15s, border-color .15s, background .15s}
+.tw-settings-gear:hover{color:var(--tw-fg); border-color:var(--tw-accent)}
+.tw-settings-gear.tw-on{color:var(--tw-accent); border-color:var(--tw-accent); background:var(--tw-accent-soft)}
+.tw-settings-gear:focus-visible{outline:2px solid var(--tw-accent); outline-offset:2px}
+.tw-settings-gear svg{width:15px; height:15px; flex:none}
+.tw-comment{background:var(--tw-accent-soft); border-bottom:2px solid var(--tw-accent); border-radius:3px; padding:0 1px; cursor:pointer}
+.tw-comment:hover{background:color-mix(in srgb, var(--tw-accent) 24%, transparent)}
+@keyframes tw-comment-hl-flash{0%,100%{background:var(--tw-accent-soft)} 25%,70%{background:color-mix(in srgb, var(--tw-accent) 38%, transparent)}}
+.tw-comment-flash{animation:tw-comment-hl-flash 1.4s ease}
+.tw-remote-cursor{position:relative; display:inline-block; width:0; border-left:2px solid var(--tw-remote, var(--tw-accent)); margin:0 -1px; vertical-align:text-bottom; height:1.05em}
+.tw-remote-flag{position:absolute; top:-1.15em; left:-1px; white-space:nowrap; font-size:9.5px; line-height:1.3; font-weight:640; color:#0b0d0f; background:var(--tw-remote, var(--tw-accent)); border-radius:4px 4px 4px 0; padding:0 4px; opacity:0; transform:translateY(2px); transition:opacity .15s, transform .15s; pointer-events:none}
+.tw-remote-cursor:hover .tw-remote-flag{opacity:1; transform:none}
+.tw-selpop{position:fixed; z-index:120; display:flex; align-items:center; gap:3px; padding:4px; background:color-mix(in srgb, var(--tw-bg) 86%, transparent); backdrop-filter:blur(22px) saturate(1.7); -webkit-backdrop-filter:blur(22px) saturate(1.7); border:1px solid var(--tw-line); border-radius:11px; box-shadow:0 12px 34px -10px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06); opacity:0; transform:translateY(4px); transition:opacity .14s, transform .14s cubic-bezier(.32,.72,0,1)}
+.tw-selpop.show{opacity:1; transform:none}
+.tw-selpop-btn{height:27px; padding:0 10px; border:0; border-radius:8px; background:transparent; color:var(--tw-accent); font:inherit; font-size:12.5px; font-weight:560; cursor:pointer; white-space:nowrap}
+.tw-selpop-btn:hover{background:var(--tw-accent-soft)}
+.tw-composer{position:fixed; z-index:121; width:268px; padding:10px; background:color-mix(in srgb, var(--tw-bg) 90%, transparent); backdrop-filter:blur(22px) saturate(1.7); -webkit-backdrop-filter:blur(22px) saturate(1.7); border:1px solid var(--tw-line); border-radius:13px; box-shadow:0 20px 48px -12px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.06); color:var(--tw-fg); opacity:0; transform:translateY(6px) scale(.98); transition:opacity .16s, transform .16s cubic-bezier(.32,.72,0,1)}
+.tw-composer.show{opacity:1; transform:none}
+.tw-composer-quote{font-size:11.5px; color:var(--tw-muted); font-style:italic; border-left:2px solid var(--tw-accent-soft); padding-left:7px; margin-bottom:8px; overflow-wrap:anywhere}
+.tw-composer textarea{width:100%; box-sizing:border-box; height:62px; resize:none; background:var(--tw-bg); border:1px solid var(--tw-line); border-radius:9px; padding:8px 9px; font:inherit; font-size:13px; color:var(--tw-fg); outline:none; transition:border-color .15s}
+.tw-composer textarea:focus{border-color:var(--tw-accent)}
+.tw-composer textarea::placeholder{color:var(--tw-faint)}
+.tw-composer-row{display:flex; justify-content:flex-end; gap:6px; margin-top:8px}
+.tw-composer-btn{border:1px solid var(--tw-line); background:var(--tw-chip); color:var(--tw-muted); border-radius:8px; padding:5px 11px; font:inherit; font-size:12px; cursor:pointer; transition:color .15s, border-color .15s, background .15s}
+.tw-composer-btn:hover{color:var(--tw-fg); border-color:var(--tw-accent)}
+.tw-composer-btn:focus-visible{outline:2px solid var(--tw-accent); outline-offset:2px}
+.tw-composer-primary{background:var(--tw-accent); border-color:var(--tw-accent); color:#fff}
+.tw-composer-primary:hover{color:#fff; filter:brightness(1.06)}
+.tw-composer-btn:disabled{opacity:.5; cursor:default}
+@media (prefers-reduced-transparency: reduce){ .tw-selpop,.tw-composer,.tw-comments-toggle,.tw-settings-gear{backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--tw-bg)} }
+@media (prefers-reduced-motion: reduce){ .tw-selpop,.tw-composer,.tw-comment-flash,.tw-editor-shell.tw-comments-open>.tw-editor{animation:none !important; transition:none !important} }
+`;
+function StreamingPreview(props) {
+  useInjectStyles();
+  const {
+    text: controlledText,
+    stream,
+    anticipate: ant = true,
+    smooth,
+    componentFallback,
+    className,
+    style
+  } = props;
+  const [streamed, setStreamed] = React7.useState("");
+  const value = controlledText !== void 0 ? controlledText : streamed;
+  const containerRef = React7.useRef(null);
+  React7.useEffect(() => {
+    if (!stream) return;
+    let cancelled = false;
+    setStreamed("");
+    const controller = createStreamController(
+      (t) => {
+        if (!cancelled) setStreamed(t);
+      },
+      { smooth }
+    );
+    void pipeStream(stream, controller).catch(() => {
+    });
+    return () => {
+      cancelled = true;
+      controller.reset();
+    };
+  }, [stream, smooth]);
+  React7.useEffect(() => {
+    const container = containerRef.current;
+    if (!container || typeof document === "undefined") return;
+    if (!value.trim()) {
+      container.replaceChildren();
+      return;
+    }
+    const { html } = anticipate(value, ant, componentFallback);
+    const tmp = document.createElement("div");
+    tmp.innerHTML = html;
+    const next = Array.from(tmp.children);
+    for (let i = 0; i < next.length; i++) {
+      const nb = next[i];
+      const wrapper = container.children[i];
+      if (!wrapper) {
+        const w = document.createElement("div");
+        w.className = "tw-streamblk tw-stream-in";
+        w.appendChild(nb);
+        container.appendChild(w);
+        continue;
+      }
+      const cur = wrapper.firstElementChild;
+      if (!cur || cur.outerHTML === nb.outerHTML) continue;
+      const typeChanged = cur.tagName !== nb.tagName || cur.className !== nb.className;
+      wrapper.replaceChildren(nb);
+      if (typeChanged) {
+        wrapper.classList.remove("tw-stream-in");
+        void wrapper.offsetWidth;
+        wrapper.classList.add("tw-stream-in");
+      }
+    }
+    while (container.children.length > next.length) container.lastElementChild?.remove();
+  }, [value, ant, componentFallback]);
+  const cls = ["tw-editor", "tw-streaming", className].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx("div", { ref: containerRef, className: cls, style, "data-typewright": "streaming" });
+}
+
+export { CARET_REVEAL_CSS, CaretRevealBlock, SandboxIsland, StreamingPreview, TypewrightEditor, useInjectStyles };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map