quoin-editor 1.0.0 → 1.0.2

package/dist/comments.cjs

@@ -1,10 +1,10 @@
 'use client';"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
 
 
-var _chunkGLLXHMH2cjs = require('./chunk-GLLXHMH2.cjs');
+var _chunkXA3UEJIWcjs = require('./chunk-XA3UEJIW.cjs');
 
 
-var _chunkWXMYDXPNcjs = require('./chunk-WXMYDXPN.cjs');
+var _chunk73653CJ4cjs = require('./chunk-73653CJ4.cjs');
 
 
 
@@ -16,13 +16,13 @@ var _chunkWXMYDXPNcjs = require('./chunk-WXMYDXPN.cjs');
 
 
 
-var _chunk2VDK27IFcjs = require('./chunk-2VDK27IF.cjs');
+var _chunkCW3AFJBRcjs = require('./chunk-CW3AFJBR.cjs');
 
 
 
 
-var _chunkGTTPVJSDcjs = require('./chunk-GTTPVJSD.cjs');
-require('./chunk-OMOBMXD5.cjs');
+var _chunkP6KYXFZCcjs = require('./chunk-P6KYXFZC.cjs');
+require('./chunk-EH5KXQXY.cjs');
 
 
 
@@ -35,16 +35,15 @@ require('./chunk-OMOBMXD5.cjs');
 
 
 
+var _chunkZKVOS57Qcjs = require('./chunk-ZKVOS57Q.cjs');
+require('./chunk-6V6GGBDK.cjs');
 
-var _chunkPZ4GT5JOcjs = require('./chunk-PZ4GT5JO.cjs');
-require('./chunk-2QCRZ7OL.cjs');
 
 
 
 
 
-
-var _chunkND5XJVK2cjs = require('./chunk-ND5XJVK2.cjs');
+var _chunk4SLJNZSMcjs = require('./chunk-4SLJNZSM.cjs');
 
 // src/extensions/comments/comments-extension.tsx
 var _lucidereact = require('lucide-react');
@@ -55,7 +54,7 @@ function addRegion(anchors, block, region, inline2) {
   let position = 0;
   for (const node of inline2) {
     const from = position;
-    position += _chunkND5XJVK2cjs.nodeLength.call(void 0, node);
+    position += _chunk4SLJNZSMcjs.nodeLength.call(void 0, node);
     for (const id of idsOf(node)) {
       const ranges = _nullishCoalesce(anchors.get(id), () => ( []));
       const last = ranges[ranges.length - 1];
@@ -82,25 +81,25 @@ function commentAnchors(doc) {
 var atomLabel = (node) => node.kind === "atom" ? _nullishCoalesce(node.attrs.label, () => ( "")) : "";
 function anchorText(doc, ranges) {
   return ranges.map(({ block, region, from, to }) => {
-    const inline2 = _nullishCoalesce(_optionalChain([_chunkND5XJVK2cjs.blockById.call(void 0, doc, block), 'optionalAccess', _8 => _8.regions, 'access', _9 => _9[region]]), () => ( []));
-    return _chunkND5XJVK2cjs.inlineText.call(void 0, _chunkND5XJVK2cjs.sliceInline.call(void 0, inline2, from, to), atomLabel);
+    const inline2 = _nullishCoalesce(_optionalChain([_chunk4SLJNZSMcjs.blockById.call(void 0, doc, block), 'optionalAccess', _8 => _8.regions, 'access', _9 => _9[region]]), () => ( []));
+    return _chunk4SLJNZSMcjs.inlineText.call(void 0, _chunk4SLJNZSMcjs.sliceInline.call(void 0, inline2, from, to), atomLabel);
   }).join(" ");
 }
 function commentIdsAt(doc, { block, region, offset }) {
-  const inline2 = _nullishCoalesce(_optionalChain([_chunkND5XJVK2cjs.blockById.call(void 0, doc, block), 'optionalAccess', _10 => _10.regions, 'access', _11 => _11[region]]), () => ( []));
+  const inline2 = _nullishCoalesce(_optionalChain([_chunk4SLJNZSMcjs.blockById.call(void 0, doc, block), 'optionalAccess', _10 => _10.regions, 'access', _11 => _11[region]]), () => ( []));
   const ids = /* @__PURE__ */ new Set();
   let position = 0;
   for (const node of inline2) {
-    const end = position + _chunkND5XJVK2cjs.nodeLength.call(void 0, node);
+    const end = position + _chunk4SLJNZSMcjs.nodeLength.call(void 0, node);
     if (position <= offset && offset <= end && end > position) idsOf(node).forEach((id) => ids.add(id));
     position = end;
   }
   return [...ids].sort();
 }
 function threadRemoval(state, id) {
-  const tr = new (0, _chunkPZ4GT5JOcjs.Transaction)(state).setOrigin("command");
+  const tr = new (0, _chunkZKVOS57Qcjs.Transaction)(state).setOrigin("command");
   for (const { block, region, from, to } of _nullishCoalesce(commentAnchors(state.doc).get(id), () => ( []))) {
-    tr.step(_chunkPZ4GT5JOcjs.removeMarkStep.call(void 0, block, region, from, to, { type: "comment", attrs: { id } }));
+    tr.step(_chunkZKVOS57Qcjs.removeMarkStep.call(void 0, block, region, from, to, { type: "comment", attrs: { id } }));
   }
   return tr;
 }
@@ -111,14 +110,14 @@ function mapPendingRanges(tr, ranges, state) {
     const from = tr.mapPos({ block: range.block, region: range.region, offset: range.from }, 1);
     const to = tr.mapPos({ block: range.block, region: range.region, offset: range.to }, -1);
     const { index } = state.doc;
-    if (!index.has(from.block) || !index.has(to.block) || _chunkPZ4GT5JOcjs.comparePos.call(void 0, state.doc, from, to) >= 0) return [];
-    return _chunkPZ4GT5JOcjs.markRanges.call(void 0, { ...state, selection: _chunkPZ4GT5JOcjs.textSelection.call(void 0, from, to) });
+    if (!index.has(from.block) || !index.has(to.block) || _chunkZKVOS57Qcjs.comparePos.call(void 0, state.doc, from, to) >= 0) return [];
+    return _chunkZKVOS57Qcjs.markRanges.call(void 0, { ...state, selection: _chunkZKVOS57Qcjs.textSelection.call(void 0, from, to) });
   });
 }
 
 // src/extensions/comments/comments-plugin.ts
-var isEnded = (ended, id, current) => ended.some((thread) => thread.id === id && thread.seen === current);
-var commentsKey = _chunkPZ4GT5JOcjs.createPluginKey.call(void 0, "comments");
+var isEnded = (ended, id, current) => ended.some((thread) => thread.id === id && _optionalChain([thread, 'access', _12 => _12.seen, 'optionalAccess', _13 => _13.resolved]) === _optionalChain([current, 'optionalAccess', _14 => _14.resolved]));
+var commentsKey = _chunkZKVOS57Qcjs.createPluginKey.call(void 0, "comments");
 var COMMENTS = "comments";
 var IDLE = { pending: [], active: null, open: null, ended: [] };
 function act(value, action) {
@@ -138,10 +137,12 @@ function act(value, action) {
       return value.open === null ? value : { ...value, active: null, open: null };
     case "forget": {
       const active = value.active === action.id ? null : value.active;
-      const open = _optionalChain([value, 'access', _12 => _12.open, 'optionalAccess', _13 => _13.ids, 'access', _14 => _14.includes, 'call', _15 => _15(action.id)]) ? null : value.open;
+      const open = _optionalChain([value, 'access', _15 => _15.open, 'optionalAccess', _16 => _16.ids, 'access', _17 => _17.includes, 'call', _18 => _18(action.id)]) ? null : value.open;
       const ended = [...value.ended.filter(({ id }) => id !== action.id), { id: action.id, seen: action.seen }];
       return { ...value, active, open, ended };
     }
+    case "caught":
+      return { ...value, ended: action.kept };
   }
 }
 function afterEdit(tr, value, state) {
@@ -149,11 +150,13 @@ function afterEdit(tr, value, state) {
   const pending = value.pending.map((anchor) => ({ ...anchor, ranges: mapPendingRanges(tr, anchor.ranges, state) }));
   return { ...value, pending };
 }
+var WRITER_MOVES = ["input", "history", "drop"];
 function afterMove(tr, value, state) {
   const { open } = value;
-  if (open === null || open.focus || !tr.selectionSet || _chunkPZ4GT5JOcjs.foreignOrigins.includes(tr.origin)) return value;
-  const anchors = commentAnchors(state.doc);
-  return open.ids.some((id) => anchors.has(id)) ? value : { ...value, active: null, open: null };
+  if (open === null || open.focus || !tr.selectionSet || !WRITER_MOVES.includes(tr.origin)) return value;
+  const { selection } = state;
+  const here = _optionalChain([selection, 'optionalAccess', _19 => _19.kind]) === "text" ? commentIdsAt(state.doc, selection.head) : [];
+  return open.ids.some((id) => here.includes(id)) ? value : { ...value, active: null, open: null };
 }
 var commentsPlugin = {
   key: commentsKey,
@@ -167,26 +170,26 @@ var commentsPlugin = {
 
 // src/extensions/comments/comment-create.ts
 var nextKey = 0;
-var hasCommentableText = (state) => _optionalChain([state, 'access', _16 => _16.selection, 'optionalAccess', _17 => _17.kind]) === "text" && _chunkPZ4GT5JOcjs.markRanges.call(void 0, state).length > 0;
+var hasCommentableText = (state) => _optionalChain([state, 'access', _20 => _20.selection, 'optionalAccess', _21 => _21.kind]) === "text" && _chunkZKVOS57Qcjs.markRanges.call(void 0, state).length > 0;
 var requestComment = (state, dispatch) => {
   const { selection } = state;
-  if (_optionalChain([selection, 'optionalAccess', _18 => _18.kind]) !== "text" || _chunkPZ4GT5JOcjs.getPluginState.call(void 0, state, commentsKey).pending.length > 0) return false;
-  const ranges = _chunkPZ4GT5JOcjs.markRanges.call(void 0, state);
+  if (_optionalChain([selection, 'optionalAccess', _22 => _22.kind]) !== "text" || _chunkZKVOS57Qcjs.getPluginState.call(void 0, state, commentsKey).pending.length > 0) return false;
+  const ranges = _chunkZKVOS57Qcjs.markRanges.call(void 0, state);
   if (ranges.length === 0) return false;
   if (dispatch === void 0) return true;
   const pending = { key: ++nextKey, ranges, selection };
   const action = { type: "pending", pending };
-  dispatch(new (0, _chunkPZ4GT5JOcjs.Transaction)(state).setMeta(COMMENTS, action).setMeta("addToHistory", false));
+  dispatch(new (0, _chunkZKVOS57Qcjs.Transaction)(state).setMeta(COMMENTS, action).setMeta("addToHistory", false));
   return true;
 };
 function settledTransaction(editor, key, id) {
-  const pending = _chunkPZ4GT5JOcjs.getPluginState.call(void 0, editor.state, commentsKey).pending.find((anchor) => anchor.key === key);
+  const pending = _chunkZKVOS57Qcjs.getPluginState.call(void 0, editor.state, commentsKey).pending.find((anchor) => anchor.key === key);
   const tr = editor.createTransaction().setOrigin("command");
-  const ranges = id === null ? [] : _nullishCoalesce(_optionalChain([pending, 'optionalAccess', _19 => _19.ranges]), () => ( []));
+  const ranges = id === null ? [] : _nullishCoalesce(_optionalChain([pending, 'optionalAccess', _23 => _23.ranges]), () => ( []));
   for (const { block, region, from, to } of ranges) {
-    tr.step(_chunkPZ4GT5JOcjs.addMarkStep.call(void 0, block, region, from, to, { type: "comment", attrs: { id } }));
+    tr.step(_chunkZKVOS57Qcjs.addMarkStep.call(void 0, block, region, from, to, { type: "comment", attrs: { id } }));
   }
-  const untouched = pending !== void 0 && _chunkPZ4GT5JOcjs.sameSelection.call(void 0, editor.state.selection, pending.selection);
+  const untouched = pending !== void 0 && _chunkZKVOS57Qcjs.sameSelection.call(void 0, editor.state.selection, pending.selection);
   const open = id !== null && ranges.length > 0 && untouched ? { ids: [id], focus: true } : void 0;
   const action = { type: "settled", key, open };
   return tr.setMeta(COMMENTS, action);
@@ -197,7 +200,7 @@ function create(editor, pending, onCreate, link) {
     if (link.mounts === 0) return;
     const tr = settledTransaction(editor, pending.key, id);
     editor.dispatch(tr);
-    if (id === null) link.report(_chunk2VDK27IFcjs.toError.call(void 0, error));
+    if (id === null) link.report(_chunkCW3AFJBRcjs.toError.call(void 0, error));
     else if (!tr.docChanged) link.report(new Error(`Comment thread ${id} has no text: it was deleted meanwhile`));
   };
   new Promise((resolve) => resolve(onCreate(input))).then(
@@ -207,30 +210,30 @@ function create(editor, pending, onCreate, link) {
 }
 function watchCreates(editor, onCreate, link) {
   return editor.subscribe((_, tr) => {
-    const action = _optionalChain([tr, 'optionalAccess', _20 => _20.getMeta, 'call', _21 => _21(COMMENTS)]);
-    if (_optionalChain([action, 'optionalAccess', _22 => _22.type]) === "pending") create(editor, action.pending, onCreate, link);
+    const action = _optionalChain([tr, 'optionalAccess', _24 => _24.getMeta, 'call', _25 => _25(COMMENTS)]);
+    if (_optionalChain([action, 'optionalAccess', _26 => _26.type]) === "pending") create(editor, action.pending, onCreate, link);
   });
 }
 
 // src/extensions/comments/comment-open.ts
 function openIds(state, threads, ids) {
-  const { ended } = _chunkPZ4GT5JOcjs.getPluginState.call(void 0, state, commentsKey);
+  const { ended } = _chunkZKVOS57Qcjs.getPluginState.call(void 0, state, commentsKey);
   return ids.filter((id) => {
     const thread = threads.find(id);
-    return _optionalChain([thread, 'optionalAccess', _23 => _23.resolved]) === false && !isEnded(ended, id, thread);
+    return _optionalChain([thread, 'optionalAccess', _27 => _27.resolved]) === false && !isEnded(ended, id, thread);
   });
 }
 function commentsTransaction(state, action) {
-  return new (0, _chunkPZ4GT5JOcjs.Transaction)(state).setMeta(COMMENTS, action).setMeta("addToHistory", false);
+  return new (0, _chunkZKVOS57Qcjs.Transaction)(state).setMeta(COMMENTS, action).setMeta("addToHistory", false);
 }
 function commentCommand(threads) {
   return (state, dispatch) => {
     if (requestComment(state, dispatch)) return true;
     const { selection } = state;
-    if (_optionalChain([selection, 'optionalAccess', _24 => _24.kind]) !== "text" || !_chunkPZ4GT5JOcjs.isCollapsed.call(void 0, selection)) return false;
+    if (_optionalChain([selection, 'optionalAccess', _28 => _28.kind]) !== "text" || !_chunkZKVOS57Qcjs.isCollapsed.call(void 0, selection)) return false;
     const ids = openIds(state, threads, commentIdsAt(state.doc, selection.head));
     if (ids.length === 0) return false;
-    _optionalChain([dispatch, 'optionalCall', _25 => _25(commentsTransaction(state, { type: "open", open: { ids, focus: true } }))]);
+    _optionalChain([dispatch, 'optionalCall', _29 => _29(commentsTransaction(state, { type: "open", open: { ids, focus: true } }))]);
     return true;
   };
 }
@@ -309,9 +312,9 @@ function place(controller, box, gap) {
   root.style.setProperty(HEIGHT, `${bottom}px`);
 }
 function useBlockAligned(controller, box, gap, key) {
-  _chunkGTTPVJSDcjs.useIsomorphicLayoutEffect.call(void 0, () => {
+  _chunkP6KYXFZCcjs.useIsomorphicLayoutEffect.call(void 0, () => {
     const element = box.current;
-    const view = _optionalChain([element, 'optionalAccess', _26 => _26.ownerDocument, 'access', _27 => _27.defaultView]);
+    const view = _optionalChain([element, 'optionalAccess', _30 => _30.ownerDocument, 'access', _31 => _31.defaultView]);
     if (!element || !view) return void 0;
     const update = () => place(controller, element, gap);
     update();
@@ -328,7 +331,7 @@ function useBlockAligned(controller, box, gap, key) {
       view.cancelAnimationFrame(frame);
       unsubscribe();
       observer.disconnect();
-      _optionalChain([element, 'access', _28 => _28.parentElement, 'optionalAccess', _29 => _29.style, 'access', _30 => _30.removeProperty, 'call', _31 => _31(HEIGHT)]);
+      _optionalChain([element, 'access', _32 => _32.parentElement, 'optionalAccess', _33 => _33.style, 'access', _34 => _34.removeProperty, 'call', _35 => _35(HEIGHT)]);
     };
   }, [controller, box, gap, key]);
 }
@@ -339,7 +342,7 @@ var GAP = 4;
 function groupsOf(entries) {
   const groups = /* @__PURE__ */ new Map();
   for (const { thread, ranges } of entries) {
-    const block = _nullishCoalesce(_optionalChain([ranges, 'access', _32 => _32[0], 'optionalAccess', _33 => _33.block]), () => ( ""));
+    const block = _nullishCoalesce(_optionalChain([ranges, 'access', _36 => _36[0], 'optionalAccess', _37 => _37.block]), () => ( ""));
     groups.set(block, [..._nullishCoalesce(groups.get(block), () => ( [])), thread.id]);
   }
   const removed = groups.get("");
@@ -356,7 +359,7 @@ function CommentMarkers({ env, box, entries, onOpen }) {
       "data-rail-item": "",
       "data-block": block,
       "aria-label": env.labels.showComments(ids.length),
-      className: _chunk2VDK27IFcjs.cn.call(void 0, "quoin-comments-marker", _chunk2VDK27IFcjs.FOCUS_RING),
+      className: _chunkCW3AFJBRcjs.cn.call(void 0, "quoin-comments-marker", _chunkCW3AFJBRcjs.FOCUS_RING),
       onClick: (event) => onOpen(ids[0], event.currentTarget),
       children: [
         /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.MessageSquare, { "aria-hidden": "true" }),
@@ -379,13 +382,13 @@ async function called(link, call) {
     await call();
     return true;
   } catch (error) {
-    link.report(_chunk2VDK27IFcjs.toError.call(void 0, error));
+    link.report(_chunkCW3AFJBRcjs.toError.call(void 0, error));
     return false;
   }
 }
 async function endThread(editor, link, call, id, threads) {
   if (!await called(link, () => call(id)) || link.mounts === 0) return false;
-  const action = { type: "forget", id, seen: _optionalChain([threads, 'optionalAccess', _34 => _34.find, 'call', _35 => _35(id)]) };
+  const action = { type: "forget", id, seen: _optionalChain([threads, 'optionalAccess', _38 => _38.find, 'call', _39 => _39(id)]) };
   editor.dispatch(threadRemoval(editor.state, id).setMeta(COMMENTS, action));
   return true;
 }
@@ -396,9 +399,9 @@ function sendReply(link, call, id, body) {
 // src/extensions/comments/CommentAvatar.tsx
 
 
-var initials = (name) => name.trim().split(/\s+/).slice(0, 2).map((word) => _nullishCoalesce(_optionalChain([Array, 'access', _36 => _36.from, 'call', _37 => _37(word), 'access', _38 => _38[0], 'optionalAccess', _39 => _39.toUpperCase, 'call', _40 => _40()]), () => ( ""))).join("");
+var initials = (name) => name.trim().split(/\s+/).slice(0, 2).map((word) => _nullishCoalesce(_optionalChain([Array, 'access', _40 => _40.from, 'call', _41 => _41(word), 'access', _42 => _42[0], 'optionalAccess', _43 => _43.toUpperCase, 'call', _44 => _44()]), () => ( ""))).join("");
 function CommentAvatar({ author }) {
-  const picture = _chunkGLLXHMH2cjs.webAddress.call(void 0, author.avatarUrl);
+  const picture = _chunkXA3UEJIWcjs.webAddress.call(void 0, author.avatarUrl);
   const [failed, setFailed] = _react.useState.call(void 0, null);
   if (picture !== null && picture !== failed) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -484,7 +487,7 @@ function ReplyBox({ env, threadId, first }) {
       }
     ),
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _chunk2VDK27IFcjs.Button,
+      _chunkCW3AFJBRcjs.Button,
       {
         type: "submit",
         variant: "ghost",
@@ -501,7 +504,7 @@ function ReplyBox({ env, threadId, first }) {
 
 function ThreadView({ env, id, thread, onEnded }) {
   const { controller, host, labels, link } = env;
-  const readOnly = _chunkGTTPVJSDcjs.useReadOnly.call(void 0, controller);
+  const readOnly = _chunkP6KYXFZCcjs.useReadOnly.call(void 0, controller);
   const [busy, setBusy] = _react.useState.call(void 0, false);
   const alive = _react.useRef.call(void 0, true);
   const root = _react.useRef.call(void 0, null);
@@ -511,14 +514,14 @@ function ThreadView({ env, id, thread, onEnded }) {
       alive.current = false;
     };
   }, []);
-  const comments = _nullishCoalesce(_optionalChain([thread, 'optionalAccess', _41 => _41.comments]), () => ( []));
+  const comments = _nullishCoalesce(_optionalChain([thread, 'optionalAccess', _45 => _45.comments]), () => ( []));
   const end = async (call) => {
     if (busy) return;
     setBusy(true);
     const ended = await endThread(controller.editor, link, call, id, host.threads);
     if (alive.current) setBusy(false);
     const active = document.activeElement;
-    const stayed = active === null || active === document.body || _optionalChain([root, 'access', _42 => _42.current, 'optionalAccess', _43 => _43.contains, 'call', _44 => _44(active)]) === true;
+    const stayed = active === null || active === document.body || _optionalChain([root, 'access', _46 => _46.current, 'optionalAccess', _47 => _47.contains, 'call', _48 => _48(active)]) === true;
     if (ended && stayed) onEnded();
   };
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { ref: root, className: "flex flex-col gap-3", children: [
@@ -526,7 +529,7 @@ function ThreadView({ env, id, thread, onEnded }) {
     /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ReplyBox, { env, threadId: id, first: comments.length === 0 }),
     !readOnly && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex justify-end gap-1", children: [
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunk2VDK27IFcjs.Button,
+        _chunkCW3AFJBRcjs.Button,
         {
           type: "button",
           variant: "ghost",
@@ -537,7 +540,7 @@ function ThreadView({ env, id, thread, onEnded }) {
         }
       ),
       /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _chunk2VDK27IFcjs.Button,
+        _chunkCW3AFJBRcjs.Button,
         {
           type: "button",
           variant: "ghost",
@@ -560,7 +563,7 @@ function ThreadCard({ env, entry, active, expanded, onToggle }) {
   const [first] = thread.comments;
   const removed = ranges.length === 0;
   const backToHeader = () => {
-    if (_optionalChain([header, 'access', _45 => _45.current, 'optionalAccess', _46 => _46.isConnected])) header.current.focus();
+    if (_optionalChain([header, 'access', _49 => _49.current, 'optionalAccess', _50 => _50.isConnected])) header.current.focus();
     else controller.focus();
   };
   const onKeyDown = (event) => {
@@ -568,7 +571,7 @@ function ThreadCard({ env, entry, active, expanded, onToggle }) {
     event.preventDefault();
     event.stopPropagation();
     onToggle(null);
-    _optionalChain([header, 'access', _47 => _47.current, 'optionalAccess', _48 => _48.focus, 'call', _49 => _49()]);
+    _optionalChain([header, 'access', _51 => _51.current, 'optionalAccess', _52 => _52.focus, 'call', _53 => _53()]);
   };
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "quoin-comments-card", "data-active": active || void 0, onKeyDown, children: [
     /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
@@ -577,7 +580,7 @@ function ThreadCard({ env, entry, active, expanded, onToggle }) {
         ref: header,
         type: "button",
         "aria-expanded": expanded,
-        className: _chunk2VDK27IFcjs.cn.call(void 0, "flex w-full flex-col items-start gap-1 rounded-sm text-start", _chunk2VDK27IFcjs.FOCUS_RING),
+        className: _chunkCW3AFJBRcjs.cn.call(void 0, "flex w-full flex-col items-start gap-1 rounded-sm text-start", _chunkCW3AFJBRcjs.FOCUS_RING),
         onClick: () => onToggle(expanded ? null : thread.id),
         children: [
           /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: removed ? "text-xs text-muted-foreground italic" : "quoin-comments-quote", children: removed ? labels.textRemoved : anchorText2 }),
@@ -597,10 +600,10 @@ function ThreadCard({ env, entry, active, expanded, onToggle }) {
 // src/extensions/comments/CommentsRail.tsx
 
 var GAP2 = 8;
-var layoutKey = (entries, value) => `${value.active} ${value.open !== null} ${entries.map(({ thread, ranges }) => `${thread.id}:${_optionalChain([ranges, 'access', _50 => _50[0], 'optionalAccess', _51 => _51.block])}`)}`;
+var layoutKey = (entries, value) => `${value.active} ${value.open !== null} ${entries.map(({ thread, ranges }) => `${thread.id}:${_optionalChain([ranges, 'access', _54 => _54[0], 'optionalAccess', _55 => _55.block])}`)}`;
 function CommentsRail({ env, box, entries, value, onToggle }) {
   useBlockAligned(env.controller, box, GAP2, layoutKey(entries, value));
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ref: box, className: "quoin-comments-rail", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "ul", { "aria-label": env.labels.comments, children: entries.map((entry) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "li", { "data-rail-item": "", "data-block": _nullishCoalesce(_optionalChain([entry, 'access', _52 => _52.ranges, 'access', _53 => _53[0], 'optionalAccess', _54 => _54.block]), () => ( "")), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { ref: box, className: "quoin-comments-rail", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "ul", { "aria-label": env.labels.comments, children: entries.map((entry) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "li", { "data-rail-item": "", "data-block": _nullishCoalesce(_optionalChain([entry, 'access', _56 => _56.ranges, 'access', _57 => _57[0], 'optionalAccess', _58 => _58.block]), () => ( "")), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     ThreadCard,
     {
       env,
@@ -622,7 +625,7 @@ function CommentsSheet({ env, entries, value, onToggle, onClose, returnFocus })
   const content = _react.useRef.call(void 0, null);
   const outside = _react.useRef.call(void 0, false);
   const focusOpened = (event) => {
-    const opened = _optionalChain([content, 'access', _55 => _55.current, 'optionalAccess', _56 => _56.querySelector, 'call', _57 => _57('[aria-expanded="true"]')]);
+    const opened = _optionalChain([content, 'access', _59 => _59.current, 'optionalAccess', _60 => _60.querySelector, 'call', _61 => _61('[aria-expanded="true"]')]);
     if (!opened) return;
     event.preventDefault();
     opened.focus();
@@ -652,7 +655,7 @@ function CommentsSheet({ env, entries, value, onToggle, onClose, returnFocus })
           children: [
             /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "flex items-center justify-between gap-2", children: [
               /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogPrimitive.Title, { className: "text-sm font-semibold", children: labels.comments }),
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2VDK27IFcjs.Button, { type: "button", variant: "ghost", size: "icon-sm", "aria-label": labels.close, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.XIcon, {}) }) })
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogPrimitive.Close, { asChild: true, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCW3AFJBRcjs.Button, { type: "button", variant: "ghost", size: "icon-sm", "aria-label": labels.close, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _lucidereact.XIcon, {}) }) })
             ] }),
             /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "ul", { "aria-label": labels.comments, className: "flex flex-col gap-2", children: entries.map((entry) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "li", { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
               ThreadCard,
@@ -679,7 +682,7 @@ function railEntries(doc, threads, ended = []) {
     const ranges = _nullishCoalesce(anchors.get(thread.id), () => ( NONE));
     return { thread, ranges, anchorText: anchorText(doc, ranges) };
   });
-  const place2 = ({ ranges: [first] }) => first === void 0 ? [Infinity, 0] : [_chunkND5XJVK2cjs.indexOfBlock.call(void 0, doc, first.block), first.from];
+  const place2 = ({ ranges: [first] }) => first === void 0 ? [Infinity, 0] : [_chunk4SLJNZSMcjs.indexOfBlock.call(void 0, doc, first.block), first.from];
   return entries.map((entry, order) => ({ entry, order, at: place2(entry) })).sort((a, b) => a.at[0] - b.at[0] || a.at[1] - b.at[1] || a.order - b.order).map(({ entry }) => entry);
 }
 
@@ -707,23 +710,23 @@ function ThreadChooser({ env, choices, onChoose }) {
 
 var docOf = (state) => state.doc;
 function focusIsOurs(controller, content) {
-  const active = _nullishCoalesce(_optionalChain([content, 'optionalAccess', _58 => _58.ownerDocument, 'access', _59 => _59.activeElement]), () => ( null));
-  return active === null || active === active.ownerDocument.body || _chunkWXMYDXPNcjs.ownsNode.call(void 0, controller, active);
+  const active = _nullishCoalesce(_optionalChain([content, 'optionalAccess', _62 => _62.ownerDocument, 'access', _63 => _63.activeElement]), () => ( null));
+  return active === null || active === active.ownerDocument.body || _chunk73653CJ4cjs.ownsNode.call(void 0, controller, active);
 }
 function ThreadPopover({ env, open, threads, onChoose, onClose }) {
   const { controller, labels } = env;
-  const doc = _chunkGTTPVJSDcjs.useEditorState.call(void 0, controller, docOf);
+  const doc = _chunkP6KYXFZCcjs.useEditorState.call(void 0, controller, docOf);
   const anchors = commentAnchors(doc);
   const { ids } = open;
-  const first = ids.map((id) => _optionalChain([anchors, 'access', _60 => _60.get, 'call', _61 => _61(id), 'optionalAccess', _62 => _62[0]])).find(Boolean);
+  const first = ids.map((id) => _optionalChain([anchors, 'access', _64 => _64.get, 'call', _65 => _65(id), 'optionalAccess', _66 => _66[0]])).find(Boolean);
   const latest = _react.useRef.call(void 0, first);
-  _chunkGTTPVJSDcjs.useIsomorphicLayoutEffect.call(void 0, () => {
+  _chunkP6KYXFZCcjs.useIsomorphicLayoutEffect.call(void 0, () => {
     if (first) latest.current = first;
   });
   const anchor = _react.useMemo.call(void 0, 
     () => ({
-      current: _chunk2VDK27IFcjs.virtualAnchor.call(void 0, 
-        () => latest.current ? _chunk2VDK27IFcjs.rangeRect.call(void 0, controller, latest.current) : null,
+      current: _chunkCW3AFJBRcjs.virtualAnchor.call(void 0, 
+        () => latest.current ? _chunkCW3AFJBRcjs.rangeRect.call(void 0, controller, latest.current) : null,
         () => latest.current && controller.registry.get(latest.current.block, latest.current.region)
       )
     }),
@@ -731,12 +734,12 @@ function ThreadPopover({ env, open, threads, onChoose, onClose }) {
   );
   const content = _react.useRef.call(void 0, null);
   const focusField = () => {
-    const target = _optionalChain([content, 'access', _63 => _63.current, 'optionalAccess', _64 => _64.querySelector, 'call', _65 => _65(`[${REPLY_FIELD}], button`)]);
-    if (focusIsOurs(controller, content.current) && !_optionalChain([content, 'access', _66 => _66.current, 'optionalAccess', _67 => _67.contains, 'call', _68 => _68(content.current.ownerDocument.activeElement)])) {
-      _optionalChain([target, 'optionalAccess', _69 => _69.focus, 'call', _70 => _70()]);
+    const target = _optionalChain([content, 'access', _67 => _67.current, 'optionalAccess', _68 => _68.querySelector, 'call', _69 => _69(`[${REPLY_FIELD}], button`)]);
+    if (focusIsOurs(controller, content.current) && !_optionalChain([content, 'access', _70 => _70.current, 'optionalAccess', _71 => _71.contains, 'call', _72 => _72(content.current.ownerDocument.activeElement)])) {
+      _optionalChain([target, 'optionalAccess', _73 => _73.focus, 'call', _74 => _74()]);
     }
   };
-  _chunkGTTPVJSDcjs.useIsomorphicLayoutEffect.call(void 0, () => {
+  _chunkP6KYXFZCcjs.useIsomorphicLayoutEffect.call(void 0, () => {
     if (open.focus) focusField();
   }, [open]);
   if (first === void 0 && latest.current === void 0) return null;
@@ -751,13 +754,13 @@ function ThreadPopover({ env, open, threads, onChoose, onClose }) {
   const onEscape = (event) => {
     event.preventDefault();
     event.stopPropagation();
-    const inside = _nullishCoalesce(_optionalChain([content, 'access', _71 => _71.current, 'optionalAccess', _72 => _72.contains, 'call', _73 => _73(content.current.ownerDocument.activeElement)]), () => ( false));
+    const inside = _nullishCoalesce(_optionalChain([content, 'access', _75 => _75.current, 'optionalAccess', _76 => _76.contains, 'call', _77 => _77(content.current.ownerDocument.activeElement)]), () => ( false));
     onClose();
     if (inside) backToText();
   };
-  const choices = ids.map((id) => ({ id, anchorText: textOf(id), preview: _nullishCoalesce(_optionalChain([threads, 'access', _74 => _74.find, 'call', _75 => _75(id), 'optionalAccess', _76 => _76.comments, 'access', _77 => _77[0], 'optionalAccess', _78 => _78.body]), () => ( "")) }));
+  const choices = ids.map((id) => ({ id, anchorText: textOf(id), preview: _nullishCoalesce(_optionalChain([threads, 'access', _78 => _78.find, 'call', _79 => _79(id), 'optionalAccess', _80 => _80.comments, 'access', _81 => _81[0], 'optionalAccess', _82 => _82.body]), () => ( "")) }));
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    _chunk2VDK27IFcjs.Popover,
+    _chunkCW3AFJBRcjs.Popover,
     {
       open: true,
       modal: false,
@@ -765,9 +768,9 @@ function ThreadPopover({ env, open, threads, onChoose, onClose }) {
         if (!next) onClose();
       },
       children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2VDK27IFcjs.PopoverAnchor, { virtualRef: anchor }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkCW3AFJBRcjs.PopoverAnchor, { virtualRef: anchor }),
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-          _chunk2VDK27IFcjs.PopoverContent,
+          _chunkCW3AFJBRcjs.PopoverContent,
           {
             ref: content,
             "aria-label": gone ? labels.textRemoved : single ? labels.thread(textOf(ids[0])) : labels.threadsHere,
@@ -797,7 +800,7 @@ function idsUnder(root, target) {
   while (element !== null && root.contains(element)) {
     const id = element.getAttribute("data-comment");
     if (id) ids.push(id);
-    element = _nullishCoalesce(_optionalChain([element, 'access', _79 => _79.parentElement, 'optionalAccess', _80 => _80.closest, 'call', _81 => _81("[data-comment]")]), () => ( null));
+    element = _nullishCoalesce(_optionalChain([element, 'access', _83 => _83.parentElement, 'optionalAccess', _84 => _84.closest, 'call', _85 => _85("[data-comment]")]), () => ( null));
   }
   return ids;
 }
@@ -805,7 +808,7 @@ function useAnchorClicks(controller, threads) {
   _react.useEffect.call(void 0, () => {
     const onClick = (event) => {
       const root = controller.root;
-      if (root === null || event.defaultPrevented || !_optionalChain([root, 'access', _82 => _82.ownerDocument, 'access', _83 => _83.getSelection, 'call', _84 => _84(), 'optionalAccess', _85 => _85.isCollapsed])) return;
+      if (root === null || event.defaultPrevented || !_optionalChain([root, 'access', _86 => _86.ownerDocument, 'access', _87 => _87.getSelection, 'call', _88 => _88(), 'optionalAccess', _89 => _89.isCollapsed])) return;
       const { editor } = controller;
       const ids = openIds(editor.state, threads, idsUnder(root, event.target));
       if (ids.length === 0) return;
@@ -819,10 +822,10 @@ function useAnchorClicks(controller, threads) {
 // src/extensions/comments/use-canvas-wide.ts
 
 var WIDE_CANVAS = 800;
-function useCanvasWide(box) {
-  const [wide, setWide] = _react.useState.call(void 0, false);
-  _chunkGTTPVJSDcjs.useIsomorphicLayoutEffect.call(void 0, () => {
-    const canvas = _optionalChain([box, 'access', _86 => _86.current, 'optionalAccess', _87 => _87.parentElement]);
+function useCanvasWide(box, initial) {
+  const [wide, setWide] = _react.useState.call(void 0, initial);
+  _chunkP6KYXFZCcjs.useIsomorphicLayoutEffect.call(void 0, () => {
+    const canvas = _optionalChain([box, 'access', _90 => _90.current, 'optionalAccess', _91 => _91.parentElement]);
     if (!canvas) return void 0;
     const measure = () => setWide(canvas.offsetWidth >= WIDE_CANVAS);
     measure();
@@ -841,21 +844,21 @@ function useThreads(threads) {
 
 // src/extensions/comments/CommentsOverlay.tsx
 
-var commentsOf = (state) => _chunkPZ4GT5JOcjs.getPluginState.call(void 0, state, commentsKey);
+var commentsOf = (state) => _chunkZKVOS57Qcjs.getPluginState.call(void 0, state, commentsKey);
 var docOf2 = (state) => state.doc;
 function CommentsOverlay({ controller, host, labels }) {
-  const { onError } = _chunk2VDK27IFcjs.useQuoin.call(void 0, );
+  const { onError } = _chunkCW3AFJBRcjs.useQuoin.call(void 0, );
   const link = linkOf(controller.editor);
-  _chunkGTTPVJSDcjs.useIsomorphicLayoutEffect.call(void 0, () => {
+  _chunkP6KYXFZCcjs.useIsomorphicLayoutEffect.call(void 0, () => {
     link.report = onError;
   }, [link, onError]);
   useAnchorClicks(controller, host.threads);
   const threads = useThreads(host.threads);
-  const value = _chunkGTTPVJSDcjs.useEditorState.call(void 0, controller, commentsOf);
-  const doc = _chunkGTTPVJSDcjs.useEditorState.call(void 0, controller, docOf2);
+  const value = _chunkP6KYXFZCcjs.useEditorState.call(void 0, controller, commentsOf);
+  const doc = _chunkP6KYXFZCcjs.useEditorState.call(void 0, controller, docOf2);
   const entries = _react.useMemo.call(void 0, () => railEntries(doc, threads, value.ended), [doc, threads, value.ended]);
   const box = _react.useRef.call(void 0, null);
-  const wide = useCanvasWide(box);
+  const wide = useCanvasWide(box, host.initialLayout === "wide");
   const [sheet, setSheet] = _react.useState.call(void 0, false);
   const opener = _react.useRef.call(void 0, null);
   _react.useEffect.call(void 0, () => {
@@ -873,7 +876,7 @@ function CommentsOverlay({ controller, host, labels }) {
     setSheet(true);
   };
   const returnFocus = () => {
-    if (_optionalChain([opener, 'access', _88 => _88.current, 'optionalAccess', _89 => _89.isConnected])) opener.current.focus();
+    if (_optionalChain([opener, 'access', _92 => _92.current, 'optionalAccess', _93 => _93.isConnected])) opener.current.focus();
     else controller.focus();
   };
   const closeSheet = () => {
@@ -912,15 +915,24 @@ var ACTIVE = { class: "quoin-comment-active" };
 var inline = (ranges, attrs) => ranges.map((range) => ({ kind: "inline", ...range, attrs }));
 var drawn = /* @__PURE__ */ new WeakMap();
 function commentsDecorations(state) {
-  const value = _chunkPZ4GT5JOcjs.getPluginState.call(void 0, state, commentsKey);
+  const value = _chunkZKVOS57Qcjs.getPluginState.call(void 0, state, commentsKey);
   const last = drawn.get(value);
-  if (_optionalChain([last, 'optionalAccess', _90 => _90.doc]) === state.doc) return last.decorations;
+  if (_optionalChain([last, 'optionalAccess', _94 => _94.doc]) === state.doc) return last.decorations;
   const active = value.active === null ? [] : _nullishCoalesce(commentAnchors(state.doc).get(value.active), () => ( []));
   const decorations = [...value.pending.flatMap(({ ranges }) => inline(ranges, PENDING)), ...inline(active, ACTIVE)];
   drawn.set(value, { doc: state.doc, decorations });
   return decorations;
 }
 
+// src/extensions/comments/watch-ended.ts
+function watchEnded(editor, threads) {
+  return threads.subscribe(() => {
+    const { ended } = _chunkZKVOS57Qcjs.getPluginState.call(void 0, editor.state, commentsKey);
+    const kept = ended.filter(({ id }) => isEnded(ended, id, threads.find(id)));
+    if (kept.length < ended.length) editor.dispatch(commentsTransaction(editor.state, { type: "caught", kept }));
+  });
+}
+
 // src/extensions/comments/comments-extension.tsx
 
 var commentItem = (labels) => ({
@@ -928,7 +940,7 @@ var commentItem = (labels) => ({
   title: labels.comment,
   icon: _lucidereact.MessageSquarePlus,
   shortcut: "Mod-Alt-m",
-  available: (state) => hasCommentableText(state) && _chunkPZ4GT5JOcjs.getPluginState.call(void 0, state, commentsKey).pending.length === 0,
+  available: (state) => hasCommentableText(state) && _chunkZKVOS57Qcjs.getPluginState.call(void 0, state, commentsKey).pending.length === 0,
   // Focus goes back to the text first: the button leaves the toolbar while the thread is being asked for.
   run: (controller) => {
     controller.focus();
@@ -942,7 +954,7 @@ function commentsExtension(options) {
     return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CommentsOverlay, { controller, host, labels });
   }
   const ui = { bubbleItems: [commentItem(labels)], overlays: [Overlay] };
-  return _chunkPZ4GT5JOcjs.defineExtension.call(void 0, {
+  return _chunkZKVOS57Qcjs.defineExtension.call(void 0, {
     name: "comments",
     plugins: [commentsPlugin],
     decorations: commentsDecorations,
@@ -950,10 +962,13 @@ function commentsExtension(options) {
     // One watcher per editor however many views mount it at once, so the host is asked once per thread.
     onMount(editor) {
       const link = linkOf(editor);
-      if (link.mounts++ === 0) link.stopWatching = watchCreates(editor, host.onCreate, link);
+      if (link.mounts++ === 0) {
+        const stops = [watchCreates(editor, host.onCreate, link), watchEnded(editor, host.threads)];
+        link.stopWatching = () => stops.forEach((stop) => stop());
+      }
       return () => {
         if (--link.mounts > 0) return;
-        _optionalChain([link, 'access', _91 => _91.stopWatching, 'optionalCall', _92 => _92()]);
+        _optionalChain([link, 'access', _95 => _95.stopWatching, 'optionalCall', _96 => _96()]);
         link.stopWatching = null;
       };
     },