@portone/docx-editor 0.1.1 → 0.2.0

package/dist/schema/locks.d.ts

@@ -1,9 +1,13 @@
 /**
  * Evaluates OOXML content and deletion locks for inline controls and whole table cells. Commands
  * query these predicates before editing; `editor/plugins/lockedContent` enforces them at runtime.
+ *
+ * `transactionAllowed` is the one guard, and it answers for the protection the editor runs under
+ * (`./protection`) as well as for the locks, so that a command asking it asks both.
  */
 import type { Mark, Node as PMNode } from "prosemirror-model";
-import { PluginKey, type Selection, type Transaction } from "prosemirror-state";
+import { type EditorState, PluginKey, type Selection, type Transaction } from "prosemirror-state";
+import { type ProtectionState } from "./protection";
 /**
  * The pass that lets a transaction through the guard, which is how a lock can be lifted at all.
  * A plugin key is used as the name so that it cannot collide with a consumer's own metadata.
@@ -99,6 +103,27 @@ export declare function selectionShut(selection: Selection, doc: PMNode): boolea
  * it would have gone through.
  */
 export declare function replacementShut(selection: Selection, doc: PMNode): boolean;
+/**
+ * Whether any step of the transaction reaches a comment node: puts one in, takes one out, or
+ * rewrites the one where it stands, which is how a body, a reply and a resolution change.
+ *
+ * Every comment lives in its three nodes, so a change that reaches none of them cannot have
+ * changed a comment. That is what lets the guard settle the common transaction - typing, and
+ * nothing more - over the stretch it rewrote rather than over the whole document.
+ *
+ * A step of a kind this does not know - one a consumer brought - is answered as reaching one,
+ * since what it rewrote is not known either. The whole-document judgement then has the say, and
+ * an unknown step costs a comparison rather than a hole in the guard.
+ */
+export declare function transactionTouchesComments(tr: Transaction): boolean;
+/**
+ * Whether the protection lets this transaction through (`./protection`).
+ *
+ * The whole-document judgement is reached for only when a comment is touched at all
+ * (`transactionTouchesComments`). A change that touches none is a body edit: through under `none`,
+ * refused under `comments`, and nothing about ownership to ask.
+ */
+export declare function protectionAllowsTransaction(tr: Transaction, rules: ProtectionState): boolean;
 /**
  * Whether the guard would let this transaction through, decided and nothing else.
  *
@@ -106,7 +131,10 @@ export declare function replacementShut(selection: Selection, doc: PMNode): bool
  * (`editor/plugins/lockedContent`) - which a query about a button's state may not set off, so the
  * decision stands apart from it and every caller building an edit asks this rather than handing
  * the transaction to a state.
- * `doc` only stands in for a step the transaction kept no document for.
+ *
+ * The protection is judged before the passes and without them: a replayed edit is still an edit,
+ * and a pass that lifts a lock lifts no protection. Its judgement is over the whole change rather
+ * than step by step, which is what lets it tell a comment from everything else.
  */
-export declare function transactionAllowed(tr: Transaction, doc: PMNode): boolean;
+export declare function transactionAllowed(tr: Transaction, state: EditorState): boolean;
 export {};

package/dist/schema/locks.js

@@ -1,5 +1,7 @@
 // src/schema/locks.ts
-import { PluginKey } from "prosemirror-state";
+import {
+  PluginKey
+} from "prosemirror-state";
 import {
   AddMarkStep,
   AddNodeMarkStep,
@@ -10,6 +12,11 @@ import {
   ReplaceStep
 } from "prosemirror-transform";
 import { docxSchema } from "./index.js";
+import {
+  isCommentNode,
+  protectionAllows
+} from "./protection.js";
+import { protectionOf } from "./protectionState.js";
 var unlockAllowed = new PluginKey("docxEditorUnlockAllowed");
 var historyReplay = new PluginKey("docxEditorHistoryReplay");
 var OPEN = { contents: false, deletion: false };
@@ -188,11 +195,53 @@ function stepAllowed(step, doc) {
 function carriesPass(tr) {
   return tr.getMeta(unlockAllowed) === true || tr.getMeta(historyReplay) === true;
 }
-function transactionAllowed(tr, doc) {
+function rangeHoldsComment(doc, from, to) {
+  let found = false;
+  doc.nodesBetween(from, to, (node) => {
+    if (found) return false;
+    if (isCommentNode(node)) found = true;
+    return !found;
+  });
+  return found;
+}
+function transactionTouchesComments(tr) {
+  return tr.steps.some((step, index) => {
+    const before = tr.docs[index];
+    const after = tr.docs[index + 1] ?? tr.doc;
+    if (step instanceof AttrStep || step instanceof AddNodeMarkStep || step instanceof RemoveNodeMarkStep) {
+      const node = before.nodeAt(step.pos);
+      return node !== null && isCommentNode(node);
+    }
+    if (!(step instanceof ReplaceStep || step instanceof ReplaceAroundStep || step instanceof AddMarkStep || step instanceof RemoveMarkStep)) {
+      return true;
+    }
+    let touched = false;
+    step.getMap().forEach((oldStart, oldEnd, newStart, newEnd) => {
+      touched ||= rangeHoldsComment(before, oldStart, oldEnd) || rangeHoldsComment(after, newStart, newEnd);
+    });
+    return touched;
+  });
+}
+function protectionAllowsTransaction(tr, rules) {
+  switch (rules.protection) {
+    case "readOnly":
+      return false;
+    case "none":
+      return !transactionTouchesComments(tr) || protectionAllows(tr.before, tr.doc, rules);
+    case "comments":
+      return transactionTouchesComments(tr) && protectionAllows(tr.before, tr.doc, rules);
+    default: {
+      const unmodelled = rules.protection;
+      return unmodelled;
+    }
+  }
+}
+function transactionAllowed(tr, state) {
   if (!tr.docChanged) return true;
+  if (!protectionAllowsTransaction(tr, protectionOf(state))) return false;
   if (carriesPass(tr)) return true;
   return tr.steps.every(
-    (step, index) => stepAllowed(step, tr.docs[index] ?? doc)
+    (step, index) => stepAllowed(step, tr.docs[index] ?? state.doc)
   );
 }
 export {
@@ -203,9 +252,11 @@ export {
   insideLockedCell,
   isLockedCell,
   lockedMarkOf,
+  protectionAllowsTransaction,
   rangeTouchesLocked,
   replacementShut,
   selectionShut,
   transactionAllowed,
+  transactionTouchesComments,
   unlockAllowed
 };

package/dist/schema/protection.d.ts

@@ -0,0 +1,77 @@
+/**
+ * The protection an editor runs under: what the document as a whole may receive, over and above
+ * the locks its own controls carry (`./locks`).
+ *
+ * The levels are named after OOXML `ST_DocProtect`, the enumeration `w:documentProtection/@w:edit`
+ * takes (ECMA-376 Part 1 §17.15.1.29): `readOnly` takes no edit at all, `comments` takes comments
+ * and nothing else, `none` takes every body edit. No level lifts the ownership rule over comments:
+ * whose comment may be edited is `editableComments`' question at every level, `none` included.
+ * `trackedChanges` and `forms`, the two values of the enumeration not modelled yet, would be added
+ * here.
+ *
+ * The protection is editor state rather than document state: it is the reader's standing, not the
+ * file's, so nothing here is written to or read from OOXML. `editor/plugins/documentProtection`
+ * holds it in the state and `./protectionState` reads it back; the guard (`transactionAllowed` in
+ * `./locks`) asks the judgements here. They take documents alone, so that the `./core` entry can
+ * make the same judgement over a file without an editor.
+ */
+import { type Node as PMNode } from "prosemirror-model";
+export type EditingProtection = "none" | "readOnly" | "comments";
+/**
+ * Whose comments may be edited or deleted. `own` is a comment carrying no recognised identity, or
+ * the very identity comments are being written under; `all` is every comment there is, which is
+ * the standing of a moderator.
+ */
+export type EditableComments = "own" | "all";
+export interface ProtectionState {
+    protection: EditingProtection;
+    /** The identity comments are written under. Null where nobody is writing any, a reader above all */
+    authorId: string | null;
+    editableComments: EditableComments;
+}
+/** Whether this node is one of the three a comment stands in the story as */
+export declare function isCommentNode(node: PMNode): boolean;
+/** Whether the two documents differ in nothing but their comments */
+export declare function changesOnlyComments(before: PMNode, after: PMNode): boolean;
+/**
+ * Whether a comment written under this identity may be edited or deleted.
+ *
+ * A comment carrying no recognised identity belongs to nobody in particular and stays open to
+ * everyone, which is what every comment was before identities were recorded and what a comment
+ * made in Word is; one carrying an identity is its author's alone.
+ */
+export declare function commentOwned(rules: ProtectionState, authorId: string | null): boolean;
+/**
+ * Whether every comment and reply that was already there kept the identity it was written under.
+ *
+ * An identity is not an edit anyone may make, its own author included: a comment rewritten into
+ * another author's name would be that author's to edit from then on, and one rewritten into
+ * nobody's would be everyone's. Only a comment that appears carries an identity chosen for it.
+ */
+export declare function commentIdentitiesKept(before: PMNode, after: PMNode): boolean;
+/**
+ * Whether every comment edited, moved or taken away between the two documents belonged to whoever
+ * did it. Adding a comment, replying, and settling a thread as resolved or open belong to
+ * everyone.
+ *
+ * Moving a comment onto other text is an edit of that comment rather than of the body, since the
+ * body reads the same afterwards, and it is the owner's to make.
+ * A root taken away takes its replies with it whoever wrote them: a thread hangs off its root,
+ * and the root's owner may take the thread down.
+ */
+export declare function commentEditsOwned(before: PMNode, after: PMNode, rules: ProtectionState): boolean;
+/**
+ * Whether the protection lets a document go from `before` to `after`.
+ *
+ * Ownership is judged only over a change that is nothing but comments. A body edit that sweeps a
+ * comment away with the text it was anchored to is a body edit, and the standing to make one is
+ * the protection's question; under `comments` no such edit goes through in the first place.
+ */
+export declare function protectionAllows(before: PMNode, after: PMNode, rules: ProtectionState): boolean;
+/**
+ * Whether every comment and reply that appeared between the two documents was written under this
+ * identity, and every one that was already there kept the identity it was written under. The
+ * editor takes an addition from anyone, since it writes the author itself; a server taking a file
+ * back does not, since the file could claim any author.
+ */
+export declare function commentAdditionsBy(before: PMNode, after: PMNode, authorId: string): boolean;

package/dist/schema/protection.js

@@ -0,0 +1,170 @@
+// src/schema/protection.ts
+import { Fragment } from "prosemirror-model";
+var COMMENT_NODES = /* @__PURE__ */ new Set([
+  "commentStart",
+  "commentEnd",
+  "commentReference"
+]);
+function isCommentNode(node) {
+  return COMMENT_NODES.has(node.type.name);
+}
+function withoutComments(node) {
+  if (node.isLeaf) return node;
+  const kept = [];
+  node.forEach((child) => {
+    if (!isCommentNode(child)) kept.push(withoutComments(child));
+  });
+  return node.copy(Fragment.fromArray(kept));
+}
+function changesOnlyComments(before, after) {
+  return withoutComments(before).eq(withoutComments(after));
+}
+function stringOrNull(value) {
+  return typeof value === "string" ? value : null;
+}
+function bodyOf(attrs) {
+  return {
+    authorId: stringOrNull(attrs.authorId),
+    author: stringOrNull(attrs.author),
+    initials: stringOrNull(attrs.initials),
+    date: stringOrNull(attrs.date),
+    text: stringOrNull(attrs.text) ?? ""
+  };
+}
+function replyBodies(value) {
+  const replies = /* @__PURE__ */ new Map();
+  if (!Array.isArray(value)) return replies;
+  for (const entry of value) {
+    if (typeof entry !== "object" || entry === null) continue;
+    const reply = entry;
+    const id = stringOrNull(reply.id);
+    if (id === null) continue;
+    replies.set(id, bodyOf(reply));
+  }
+  return replies;
+}
+function threadsIn(doc) {
+  const threads = /* @__PURE__ */ new Map();
+  doc.descendants((node) => {
+    if (node.type.name !== "commentReference") return true;
+    const id = stringOrNull(node.attrs.id);
+    if (id === null || threads.has(id)) return true;
+    threads.set(id, {
+      ...bodyOf(node.attrs),
+      replies: replyBodies(node.attrs.replies)
+    });
+    return true;
+  });
+  return threads;
+}
+function commentOwned(rules, authorId) {
+  if (rules.editableComments === "all") return true;
+  return authorId === null || authorId === rules.authorId;
+}
+function commentAnchors(doc) {
+  const markers = /* @__PURE__ */ new Map();
+  const visit = (node, start) => {
+    if (isCommentNode(node)) {
+      const id = stringOrNull(node.attrs.id);
+      if (id !== null) {
+        const at = markers.get(id) ?? [];
+        at.push(`${node.type.name}@${start}`);
+        markers.set(id, at);
+      }
+      return 0;
+    }
+    if (node.isLeaf) return node.nodeSize;
+    let content = 0;
+    node.forEach((child) => {
+      content += visit(child, start + 1 + content);
+    });
+    return content + 2;
+  };
+  visit(doc, -1);
+  return new Map(
+    Array.from(markers, ([id, at]) => [id, at.join(" ")])
+  );
+}
+function sameIdentity(was, now) {
+  return was.authorId === now.authorId && was.author === now.author;
+}
+function sameWords(was, now) {
+  return was.text === now.text && was.initials === now.initials && was.date === now.date;
+}
+function commentIdentitiesKept(before, after) {
+  const now = threadsIn(after);
+  for (const [id, thread] of threadsIn(before)) {
+    const current = now.get(id);
+    if (current === void 0) continue;
+    if (!sameIdentity(thread, current)) return false;
+    for (const [replyId, reply] of thread.replies) {
+      const currentReply = current.replies.get(replyId);
+      if (currentReply !== void 0 && !sameIdentity(reply, currentReply)) {
+        return false;
+      }
+    }
+  }
+  return true;
+}
+function commentEditsOwned(before, after, rules) {
+  if (!commentIdentitiesKept(before, after)) return false;
+  if (rules.editableComments === "all") return true;
+  const now = threadsIn(after);
+  const anchoredBefore = commentAnchors(before);
+  const anchoredAfter = commentAnchors(after);
+  for (const [id, thread] of threadsIn(before)) {
+    const current = now.get(id);
+    const changed = current === void 0 || !sameWords(thread, current) || anchoredBefore.get(id) !== anchoredAfter.get(id);
+    if (changed && !commentOwned(rules, thread.authorId)) return false;
+    if (current === void 0) continue;
+    for (const [replyId, reply] of thread.replies) {
+      const currentReply = current.replies.get(replyId);
+      const replyChanged = currentReply === void 0 || !sameWords(reply, currentReply);
+      if (replyChanged && !commentOwned(rules, reply.authorId)) return false;
+    }
+  }
+  return true;
+}
+function protectionAllows(before, after, rules) {
+  switch (rules.protection) {
+    case "readOnly":
+      return false;
+    case "comments":
+      return changesOnlyComments(before, after) && commentEditsOwned(before, after, rules);
+    case "none":
+      return !changesOnlyComments(before, after) || commentEditsOwned(before, after, rules);
+    default: {
+      const unmodelled = rules.protection;
+      return unmodelled;
+    }
+  }
+}
+function commentAdditionsBy(before, after, authorId) {
+  if (!commentIdentitiesKept(before, after)) return false;
+  const was = threadsIn(before);
+  for (const [id, thread] of threadsIn(after)) {
+    const earlier = was.get(id);
+    if (earlier === void 0) {
+      if (thread.authorId !== authorId) return false;
+      for (const reply of thread.replies.values()) {
+        if (reply.authorId !== authorId) return false;
+      }
+      continue;
+    }
+    for (const [replyId, reply] of thread.replies) {
+      if (!earlier.replies.has(replyId) && reply.authorId !== authorId) {
+        return false;
+      }
+    }
+  }
+  return true;
+}
+export {
+  changesOnlyComments,
+  commentAdditionsBy,
+  commentEditsOwned,
+  commentIdentitiesKept,
+  commentOwned,
+  isCommentNode,
+  protectionAllows
+};

package/dist/schema/protectionState.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Where the protection (`./protection`) stands in an editor state, and the questions commands ask
+ * of it. Kept apart from the judgements so that those stay free of editor state for the `./core`
+ * entry.
+ */
+import { type EditorState, PluginKey } from "prosemirror-state";
+import type { EditingProtection, ProtectionState } from "./protection";
+/** What a state built without the protection plugin runs under, which is what every consumer had before it existed */
+export declare const UNPROTECTED: ProtectionState;
+export declare const protectionKey: PluginKey<ProtectionState>;
+export declare function protectionOf(state: EditorState): ProtectionState;
+export declare function editingProtection(state: EditorState): EditingProtection;
+/**
+ * Whether the protection shuts every edit to the body, comments aside.
+ *
+ * This is the question a command that changes text, formatting or structure asks before it reports
+ * that it applies, the way it asks the lock predicates (`./locks`): a command reporting true and
+ * then being refused by the guard draws a live control that swallows the click.
+ */
+export declare function editsShut(state: EditorState): boolean;

package/dist/schema/protectionState.js

@@ -0,0 +1,37 @@
+// src/schema/protectionState.ts
+import { PluginKey } from "prosemirror-state";
+var UNPROTECTED = {
+  protection: "none",
+  authorId: null,
+  editableComments: "own"
+};
+var protectionKey = new PluginKey(
+  "docxEditorProtection"
+);
+function protectionOf(state) {
+  return protectionKey.getState(state) ?? UNPROTECTED;
+}
+function editingProtection(state) {
+  return protectionOf(state).protection;
+}
+function editsShut(state) {
+  const protection = editingProtection(state);
+  switch (protection) {
+    case "none":
+      return false;
+    case "readOnly":
+    case "comments":
+      return true;
+    default: {
+      const unmodelled = protection;
+      return unmodelled;
+    }
+  }
+}
+export {
+  UNPROTECTED,
+  editingProtection,
+  editsShut,
+  protectionKey,
+  protectionOf
+};

package/dist/table/cellFormatting.js

@@ -9,6 +9,7 @@ import {
   toCellFormat
 } from "../model/format.js";
 import { isLockedCell, transactionAllowed } from "../schema/locks.js";
+import { editsShut } from "../schema/protectionState.js";
 import { cellDefaultsAt, tableCellSources } from "./gridBorders.js";
 function text(value) {
   return typeof value === "string" ? value : null;
@@ -59,7 +60,7 @@ function cellFormatCommand(edit) {
     const changes = planChanges(rect, edit);
     if (changes.length === 0) return false;
     const transaction = applyChanges(state.tr, rect.tableStart, changes);
-    if (!transactionAllowed(transaction, state.doc)) return false;
+    if (!transactionAllowed(transaction, state)) return false;
     dispatch?.(transaction);
     return true;
   };
@@ -118,6 +119,7 @@ function cellFormats(state) {
   return selectedCells(state).map((cell) => toCellFormat(cell.attrs.format));
 }
 function canSetCellFormatting(state) {
+  if (editsShut(state)) return false;
   const cells = selectedCells(state);
   return cells.length > 0 && cells.every((cell) => !isLockedCell(cell));
 }

package/dist/table/commands.js

@@ -21,7 +21,7 @@ function isInTable(state) {
 function toCommand(build) {
   return (state, dispatch) => {
     const tr = build(state);
-    if (!tr || !transactionAllowed(tr, state.doc)) return false;
+    if (!tr || !transactionAllowed(tr, state)) return false;
     dispatch?.(tr);
     return true;
   };

package/dist/table/merge.js

@@ -26,11 +26,11 @@ function cellAt(rect, row, col) {
 }
 function canMergeCells(state) {
   const tr = buildMergeCellsTransaction(state);
-  return tr !== null && transactionAllowed(tr, state.doc);
+  return tr !== null && transactionAllowed(tr, state);
 }
 function canSplitCell(state) {
   const tr = buildSplitCellTransaction(state);
-  return tr !== null && transactionAllowed(tr, state.doc);
+  return tr !== null && transactionAllowed(tr, state);
 }
 function coveredWidthSum(rect, type) {
   let sum = 0;

package/dist/ui/CommentsPanel.d.ts

@@ -5,11 +5,11 @@ import { type CommentAuthor } from "../editor/commands/commentCommands";
 export interface CommentsPanelProps {
     view: EditorView;
     state: EditorState;
-    readOnly: boolean;
     composerOpen: boolean;
-    author: CommentAuthor;
+    /** Whose comments the composers write. Null for a reader, who is offered none */
+    author: CommentAuthor | null;
     closeComposer: () => void;
     scrollContainer: HTMLElement | null;
     allCommentsOpen: boolean;
 }
-export declare function CommentsPanel({ view, state, readOnly, composerOpen, author, closeComposer, scrollContainer, allCommentsOpen, }: CommentsPanelProps): ReactElement;
+export declare function CommentsPanel({ view, state, composerOpen, author, closeComposer, scrollContainer, allCommentsOpen, }: CommentsPanelProps): ReactElement;

package/dist/ui/CommentsPanel.js

@@ -12,6 +12,8 @@ import {
   updateComment,
   updateCommentReply
 } from "../editor/commands/commentCommands.js";
+import { commentOwned } from "../schema/protection.js";
+import { protectionOf } from "../schema/protectionState.js";
 import { editorClassNames } from "../styles/classNames.js";
 import { CommentComposer, FocusedTextarea } from "./comments/CommentComposer.js";
 import {
@@ -41,7 +43,6 @@ function sameTarget(left, right) {
 function CommentsPanel({
   view,
   state,
-  readOnly,
   composerOpen,
   author,
   closeComposer,
@@ -49,6 +50,9 @@ function CommentsPanel({
   allCommentsOpen
 }) {
   const comments = useMemo(() => documentComments(state), [state.doc]);
+  const rules = protectionOf(state);
+  const writer = author != null && rules.protection !== "readOnly" ? author : null;
+  const owned = (authorId) => writer !== null && commentOwned(rules, authorId);
   const panel = useRef(null);
   const [editing, setEditing] = useState(null);
   const [draft, setDraft] = useState("");
@@ -108,7 +112,7 @@ function CommentsPanel({
             className: editorClassNames.commentsCanvas,
             style: { height: allCommentsOpen ? void 0 : `${canvasHeight}px` },
             children: [
-              composerOpen && !readOnly && /* @__PURE__ */ jsx(
+              composerOpen && writer !== null && /* @__PURE__ */ jsx(
                 "div",
                 {
                   className: editorClassNames.commentPosition,
@@ -119,7 +123,7 @@ function CommentsPanel({
                   children: /* @__PURE__ */ jsx(
                     CommentComposer,
                     {
-                      author,
+                      author: writer,
                       label: "Comment text",
                       submitLabel: "Comment",
                       onClose: closeComposer,
@@ -127,8 +131,9 @@ function CommentsPanel({
                         view,
                         addComment({
                           text,
-                          author: author.name,
-                          initials: author.initials
+                          author: writer.name,
+                          authorId: writer.id,
+                          initials: writer.initials
                         })
                       )
                     }
@@ -137,7 +142,8 @@ function CommentsPanel({
               ),
               visible.map((comment) => {
                 const rootTarget = { commentId: comment.id, replyId: null };
-                const rootEditing = !readOnly && sameTarget(editing, rootTarget);
+                const rootOwned = owned(comment.authorId);
+                const rootEditing = rootOwned && sameTarget(editing, rootTarget);
                 return /* @__PURE__ */ jsx(
                   "article",
                   {
@@ -160,8 +166,8 @@ function CommentsPanel({
                             ]
                           }
                         ),
-                        !readOnly && !rootEditing && /* @__PURE__ */ jsxs("div", { className: editorClassNames.commentIconActions, children: [
-                          !comment.resolved && /* @__PURE__ */ jsx(
+                        writer !== null && !rootEditing && /* @__PURE__ */ jsxs("div", { className: editorClassNames.commentIconActions, children: [
+                          rootOwned && !comment.resolved && /* @__PURE__ */ jsx(
                             "button",
                             {
                               type: "button",
@@ -190,7 +196,7 @@ function CommentsPanel({
                               children: comment.resolved ? /* @__PURE__ */ jsx(RotateCcw, { size: 16, "aria-hidden": "true" }) : /* @__PURE__ */ jsx(Check, { size: 16, "aria-hidden": "true" })
                             }
                           ),
-                          !comment.resolved && /* @__PURE__ */ jsx(
+                          rootOwned && !comment.resolved && /* @__PURE__ */ jsx(
                             "button",
                             {
                               type: "button",
@@ -209,7 +215,7 @@ function CommentsPanel({
                           value: draft,
                           onChange: setDraft
                         }
-                      ) : readOnly || comment.resolved ? /* @__PURE__ */ jsx("p", { className: editorClassNames.commentBody, children: comment.text }) : /* @__PURE__ */ jsx(
+                      ) : writer === null || comment.resolved ? /* @__PURE__ */ jsx("p", { className: editorClassNames.commentBody, children: comment.text }) : /* @__PURE__ */ jsx(
                         "button",
                         {
                           type: "button",
@@ -222,7 +228,7 @@ function CommentsPanel({
                           children: comment.text
                         }
                       ),
-                      !readOnly && /* @__PURE__ */ jsx("div", { className: editorClassNames.commentActions, children: rootEditing ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                      rootEditing && /* @__PURE__ */ jsxs("div", { className: editorClassNames.commentActions, children: [
                         /* @__PURE__ */ jsx("button", { type: "button", onClick: () => setEditing(null), children: "Cancel" }),
                         /* @__PURE__ */ jsx(
                           "button",
@@ -234,13 +240,14 @@ function CommentsPanel({
                             children: "Save"
                           }
                         )
-                      ] }) : null }),
+                      ] }),
                       comment.replies.map((reply) => {
                         const target = {
                           commentId: comment.id,
                           replyId: reply.id
                         };
-                        const isEditing = !readOnly && sameTarget(editing, target);
+                        const replyOwned = owned(reply.authorId);
+                        const isEditing = replyOwned && sameTarget(editing, target);
                         return /* @__PURE__ */ jsxs(
                           "div",
                           {
@@ -258,7 +265,7 @@ function CommentsPanel({
                                   onChange: setDraft
                                 }
                               ) : /* @__PURE__ */ jsx("p", { className: editorClassNames.commentBody, children: reply.text }),
-                              !readOnly && !comment.resolved && /* @__PURE__ */ jsx("div", { className: editorClassNames.commentActions, children: isEditing ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                              replyOwned && !comment.resolved && /* @__PURE__ */ jsx("div", { className: editorClassNames.commentActions, children: isEditing ? /* @__PURE__ */ jsxs(Fragment, { children: [
                                 /* @__PURE__ */ jsx(
                                   "button",
                                   {
@@ -313,10 +320,10 @@ function CommentsPanel({
                           reply.id
                         );
                       }),
-                      replying === comment.id && !readOnly && !comment.resolved && /* @__PURE__ */ jsx(
+                      replying === comment.id && writer !== null && !comment.resolved && /* @__PURE__ */ jsx(
                         CommentComposer,
                         {
-                          author,
+                          author: writer,
                           label: "Reply text",
                           submitLabel: "Reply",
                           onClose: () => setReplying(null),
@@ -324,8 +331,9 @@ function CommentsPanel({
                             view,
                             addCommentReply(comment.id, {
                               text,
-                              author: author.name,
-                              initials: author.initials
+                              author: writer.name,
+                              authorId: writer.id,
+                              initials: writer.initials
                             })
                           )
                         }