@portone/docx-editor 0.1.0

package/dist/editor/commands/comments/editing.js

@@ -0,0 +1,305 @@
+// src/editor/commands/comments/editing.ts
+import {
+  TextSelection
+} from "prosemirror-state";
+import { commentParaId } from "../../../docx/comments.js";
+import { docxSchema } from "../../../schema/index.js";
+import { transactionAllowed } from "../../../schema/locks.js";
+import {
+  reservedCommentIds,
+  reservedCommentParaIds
+} from "../../plugins/commentReservations.js";
+import { documentComments, repliesAttr, stringAttr } from "./reading.js";
+function validCommentSelection(state) {
+  const { selection } = state;
+  return selection instanceof TextSelection && !selection.empty && selection.$from.sameParent(selection.$to) && selection.$from.parent.type.name === "paragraph";
+}
+function nextCommentId(state) {
+  const taken = /* @__PURE__ */ new Set();
+  const reserve = (id) => {
+    if (!/^\d+$/.test(id)) return;
+    try {
+      taken.add(BigInt(id).toString());
+    } catch {
+      return;
+    }
+  };
+  for (const id of reservedCommentIds(state)) {
+    reserve(id);
+  }
+  state.doc.descendants((node) => {
+    if (node.type.name === "commentStart" || node.type.name === "commentEnd" || node.type.name === "commentReference") {
+      const id = stringAttr(node.attrs.id);
+      if (id !== null) reserve(id);
+    }
+    if (node.type.name === "commentReference") {
+      for (const reply of repliesAttr(node.attrs.replies)) {
+        reserve(reply.id);
+      }
+    }
+    return true;
+  });
+  let max = -1n;
+  for (const id of taken) {
+    const value = BigInt(id);
+    if (value > max) max = value;
+  }
+  return (max + 1n).toString();
+}
+function nextCommentParaId(state, seed, additional = []) {
+  const taken = new Set(
+    Array.from(reservedCommentParaIds(state), (id) => id.toUpperCase())
+  );
+  state.doc.descendants((node) => {
+    if (node.type.name !== "commentReference") return true;
+    const paraId = stringAttr(node.attrs.paraId);
+    if (paraId !== null) taken.add(paraId.toUpperCase());
+    for (const reply of repliesAttr(node.attrs.replies)) {
+      taken.add(reply.paraId.toUpperCase());
+    }
+    return true;
+  });
+  for (const paraId of additional) taken.add(paraId.toUpperCase());
+  let candidate = Number.parseInt(commentParaId(seed), 16);
+  while (taken.has(candidate.toString(16).toUpperCase().padStart(8, "0"))) {
+    candidate = candidate === 2147483647 ? 1 : candidate + 1;
+  }
+  return candidate.toString(16).toUpperCase().padStart(8, "0");
+}
+function wrapperMarksAt(state, pos, side) {
+  const resolved = state.doc.resolve(pos);
+  const adjacent = side === "before" ? resolved.nodeBefore : resolved.nodeAfter;
+  return (adjacent?.marks ?? resolved.marks()).filter(
+    (mark) => mark.type.name === "sdt" || mark.type.name === "link"
+  );
+}
+function addCommentTransaction(state, comment) {
+  if (!validCommentSelection(state) || comment.text.trim().length === 0) {
+    return null;
+  }
+  const id = nextCommentId(state);
+  const date = comment.date ?? (/* @__PURE__ */ new Date()).toISOString();
+  const paraId = nextCommentParaId(state, `comment-${id}-${date}`);
+  const { from, to } = state.selection;
+  const startMarks = wrapperMarksAt(state, from, "after");
+  const endMarks = wrapperMarksAt(state, to, "before");
+  const end = docxSchema.nodes.commentEnd.create(
+    { id, xml: null },
+    null,
+    endMarks
+  );
+  const reference = docxSchema.nodes.commentReference.create(
+    {
+      id,
+      referenceXml: null,
+      author: comment.author,
+      initials: comment.initials ?? null,
+      date,
+      text: comment.text,
+      commentXml: null,
+      imported: false,
+      paraId,
+      resolved: false,
+      extensionXml: null,
+      threadImported: true,
+      replies: []
+    },
+    null,
+    endMarks
+  );
+  const start = docxSchema.nodes.commentStart.create(
+    { id, xml: null },
+    null,
+    startMarks
+  );
+  const transaction = state.tr.insert(to, end).insert(to + 1, reference).insert(from, start);
+  return transactionAllowed(transaction, state.doc) ? transaction : null;
+}
+function canAddComment(state) {
+  return addCommentTransaction(state, {
+    text: "comment",
+    author: "Author",
+    date: "1970-01-01T00:00:00.000Z"
+  }) !== null;
+}
+function addComment(comment) {
+  return (state, dispatch) => {
+    const transaction = addCommentTransaction(state, comment);
+    if (!transaction) return false;
+    dispatch?.(transaction);
+    return true;
+  };
+}
+function updateComment(id, text) {
+  return (state, dispatch) => {
+    if (text.trim().length === 0) return false;
+    let transaction = state.tr;
+    let changed = false;
+    state.doc.descendants((node, pos) => {
+      if (node.type.name === "commentReference" && stringAttr(node.attrs.id) === id && stringAttr(node.attrs.text) !== text) {
+        transaction = transaction.setNodeMarkup(pos, null, {
+          ...node.attrs,
+          text,
+          commentXml: null,
+          imported: false
+        });
+        changed = true;
+      }
+      return true;
+    });
+    if (!changed || !transactionAllowed(transaction, state.doc)) return false;
+    dispatch?.(transaction);
+    return true;
+  };
+}
+function updateReference(id, change) {
+  return (state, dispatch) => {
+    let transaction = state.tr;
+    let changed = false;
+    state.doc.descendants((node, pos) => {
+      if (node.type.name !== "commentReference" || stringAttr(node.attrs.id) !== id) {
+        return true;
+      }
+      const attrs = change(node);
+      if (attrs !== null) {
+        transaction = transaction.setNodeMarkup(pos, null, attrs);
+        changed = true;
+      }
+      return false;
+    });
+    if (!changed || !transactionAllowed(transaction, state.doc)) return false;
+    dispatch?.(transaction);
+    return true;
+  };
+}
+function setCommentResolved(id, resolved) {
+  return (state, dispatch) => updateReference(id, (node) => {
+    if (node.attrs.resolved === resolved) return null;
+    return {
+      ...node.attrs,
+      paraId: node.attrs.threadImported === true && node.attrs.extensionXml === null ? nextCommentParaId(state, `comment-${id}`) : node.attrs.paraId,
+      resolved,
+      extensionXml: null,
+      threadImported: false,
+      imported: node.attrs.commentXml !== null && node.attrs.extensionXml === null ? false : node.attrs.imported
+    };
+  })(state, dispatch);
+}
+function addCommentReply(id, reply) {
+  return (state, dispatch) => {
+    if (reply.text.trim().length === 0) return false;
+    const replyId = nextCommentId(state);
+    const date = reply.date ?? (/* @__PURE__ */ new Date()).toISOString();
+    return updateReference(id, (node) => {
+      const parentParaId = node.attrs.threadImported === true && node.attrs.extensionXml === null ? nextCommentParaId(state, `comment-${id}`) : stringAttr(node.attrs.paraId) ?? nextCommentParaId(state, `comment-${id}`);
+      const paraId = nextCommentParaId(state, `comment-${replyId}-${date}`, [
+        parentParaId
+      ]);
+      return {
+        ...node.attrs,
+        paraId: parentParaId,
+        resolved: false,
+        extensionXml: null,
+        threadImported: false,
+        imported: node.attrs.commentXml !== null && node.attrs.extensionXml === null ? false : node.attrs.imported,
+        replies: [
+          ...repliesAttr(node.attrs.replies),
+          {
+            id: replyId,
+            author: reply.author,
+            initials: reply.initials ?? null,
+            date,
+            text: reply.text,
+            commentXml: null,
+            imported: false,
+            paraId,
+            parentParaId,
+            extensionXml: null
+          }
+        ]
+      };
+    })(state, dispatch);
+  };
+}
+function updateCommentReply(commentId, replyId, text) {
+  return updateReference(commentId, (node) => {
+    if (text.trim().length === 0) return null;
+    const replies = repliesAttr(node.attrs.replies);
+    const index = replies.findIndex((reply) => reply.id === replyId);
+    if (index < 0 || replies[index].text === text) return null;
+    return {
+      ...node.attrs,
+      replies: replies.map(
+        (reply, at) => at === index ? { ...reply, text, commentXml: null, imported: false } : reply
+      )
+    };
+  });
+}
+function removeCommentReply(commentId, replyId) {
+  return updateReference(commentId, (node) => {
+    const replies = repliesAttr(node.attrs.replies);
+    if (!replies.some((reply) => reply.id === replyId)) return null;
+    const removedIds = /* @__PURE__ */ new Set([replyId]);
+    const removedParaIds = new Set(
+      replies.filter((reply) => removedIds.has(reply.id)).map((reply) => reply.paraId)
+    );
+    let changed = true;
+    while (changed) {
+      changed = false;
+      for (const reply of replies) {
+        if (!removedIds.has(reply.id) && removedParaIds.has(reply.parentParaId)) {
+          removedIds.add(reply.id);
+          removedParaIds.add(reply.paraId);
+          changed = true;
+        }
+      }
+    }
+    return {
+      ...node.attrs,
+      replies: replies.filter((reply) => !removedIds.has(reply.id)),
+      threadImported: false
+    };
+  });
+}
+function removeComment(id) {
+  return (state, dispatch) => {
+    const positions = [];
+    state.doc.descendants((node, pos) => {
+      if ((node.type.name === "commentStart" || node.type.name === "commentEnd" || node.type.name === "commentReference") && stringAttr(node.attrs.id) === id) {
+        positions.push({ pos, size: node.nodeSize });
+      }
+      return true;
+    });
+    if (positions.length === 0) return false;
+    const transaction = state.tr;
+    for (const marker of positions.sort((a, b) => b.pos - a.pos)) {
+      transaction.delete(marker.pos, marker.pos + marker.size);
+    }
+    if (!transactionAllowed(transaction, state.doc)) return false;
+    dispatch?.(transaction);
+    return true;
+  };
+}
+function selectComment(id) {
+  return (state, dispatch) => {
+    const comment = documentComments(state).find((entry) => entry.id === id);
+    if (!comment) return false;
+    dispatch?.(
+      state.tr.setSelection(
+        TextSelection.create(state.doc, comment.from, comment.to)
+      )
+    );
+    return true;
+  };
+}
+export {
+  addComment,
+  addCommentReply,
+  canAddComment,
+  removeComment,
+  removeCommentReply,
+  selectComment,
+  setCommentResolved,
+  updateComment,
+  updateCommentReply
+};

package/dist/editor/commands/comments/model.d.ts

@@ -0,0 +1,31 @@
+/** Public comment values and shared attribute readers. */
+export interface CommentAuthor {
+    name: string;
+    initials?: string;
+}
+export interface NewComment {
+    text: string;
+    author: string;
+    initials?: string;
+    /** ISO 8601 timestamp. The current time is used when omitted. */
+    date?: string;
+}
+export interface DocumentComment {
+    id: string;
+    author: string | null;
+    initials: string | null;
+    date: string | null;
+    text: string;
+    from: number;
+    to: number;
+    referencePos: number;
+    resolved: boolean;
+    replies: readonly DocumentCommentReply[];
+}
+export interface DocumentCommentReply {
+    id: string;
+    author: string | null;
+    initials: string | null;
+    date: string | null;
+    text: string;
+}

package/dist/editor/commands/comments/reading.d.ts

@@ -0,0 +1,8 @@
+/** Reads comment threads and anchors from the editor document. */
+import type { EditorState } from "prosemirror-state";
+import type { CommentReplyData } from "../../../docx/comments";
+import type { DocumentComment } from "./model";
+export declare function stringAttr(value: unknown): string | null;
+export declare function repliesAttr(value: unknown): readonly CommentReplyData[];
+/** Comments in document order, including point comments that have no explicit range. */
+export declare function documentComments(state: EditorState): readonly DocumentComment[];

package/dist/editor/commands/comments/reading.js

@@ -0,0 +1,58 @@
+// src/editor/commands/comments/reading.ts
+function stringAttr(value) {
+  return typeof value === "string" ? value : null;
+}
+function repliesAttr(value) {
+  return Array.isArray(value) ? value : [];
+}
+function markerPositions(doc) {
+  const starts = /* @__PURE__ */ new Map();
+  const ends = /* @__PURE__ */ new Map();
+  const references = [];
+  doc.descendants((node, pos) => {
+    const id = stringAttr(node.attrs.id);
+    if (id === null) return true;
+    if (node.type.name === "commentStart" && !starts.has(id)) {
+      starts.set(id, pos);
+    } else if (node.type.name === "commentEnd" && !ends.has(id)) {
+      ends.set(id, pos);
+    } else if (node.type.name === "commentReference") {
+      references.push({ node, pos });
+    }
+    return true;
+  });
+  return { starts, ends, references };
+}
+function documentComments(state) {
+  const markers = markerPositions(state.doc);
+  return markers.references.map(({ node, pos }) => {
+    const id = stringAttr(node.attrs.id) ?? "";
+    const start = markers.starts.get(id);
+    const end = markers.ends.get(id);
+    const hasRange = start !== void 0 && end !== void 0 && start < end;
+    const point = start ?? end ?? pos;
+    return {
+      id,
+      author: stringAttr(node.attrs.author),
+      initials: stringAttr(node.attrs.initials),
+      date: stringAttr(node.attrs.date),
+      text: stringAttr(node.attrs.text) ?? "",
+      from: hasRange ? start + 1 : point,
+      to: hasRange ? end : point,
+      referencePos: pos,
+      resolved: node.attrs.resolved === true,
+      replies: repliesAttr(node.attrs.replies).map((reply) => ({
+        id: reply.id,
+        author: reply.author,
+        initials: reply.initials,
+        date: reply.date,
+        text: reply.text
+      }))
+    };
+  });
+}
+export {
+  documentComments,
+  repliesAttr,
+  stringAttr
+};

package/dist/editor/commands/formatting/editing.d.ts

@@ -0,0 +1,32 @@
+/** Applies inline formatting while preserving each run's untouched XML. */
+import type { Command, EditorState } from "prosemirror-state";
+export type { RunToggle } from "../../../docx/runProps";
+/**
+ * Whether character formatting reaches anything where the selection stands, which is what a
+ * control offering it is drawn from.
+ *
+ * A selection running over a lock keeps its say, because the locked pieces are left out rather
+ * than the whole edit refused; only a selection the lock leaves nothing of has nothing to format.
+ * A caret formats no text of its own - it stages the formatting for the text typed next - so what
+ * settles it is whether that text could go in at all.
+ */
+export declare function canFormatText(state: EditorState): boolean;
+export declare const toggleBold: Command;
+export declare const toggleItalic: Command;
+export declare const toggleUnderline: Command;
+export declare const toggleStrike: Command;
+/** Sets the font size in points. Null withdraws the setting and falls back to the document default */
+export declare function setFontSize(pt: number | null): Command;
+/** Sets the font by name. Null withdraws the setting and falls back to the document default font */
+export declare function setFontFamily(name: string | null): Command;
+/** Sets the text color as `#RRGGBB`. Null withdraws the color setting */
+export declare function setTextColor(hex: string | null): Command;
+/**
+ * Sets the text background color as `#RRGGBB`. Null withdraws the background.
+ * A highlight (`w:highlight`) written by an older document is removed along with it at that spot.
+ */
+export declare function setTextBackground(hex: string | null): Command;
+export declare function isBoldActive(state: EditorState): boolean;
+export declare function isItalicActive(state: EditorState): boolean;
+export declare function isUnderlineActive(state: EditorState): boolean;
+export declare function isStrikeActive(state: EditorState): boolean;

package/dist/editor/commands/formatting/editing.js

@@ -0,0 +1,138 @@
+// src/editor/commands/formatting/editing.ts
+import {
+  editRunProps,
+  isRunToggleOn,
+  matchesRunEdit
+} from "../../../docx/runProps.js";
+import { docxSchema } from "../../../schema/index.js";
+import {
+  insertionInsideLocked,
+  rangeTouchesLocked
+} from "../../../schema/locks.js";
+import {
+  activePieces,
+  caretPiece,
+  text,
+  textPieces
+} from "./shared.js";
+function editedMark(target, edit) {
+  const next = editRunProps(
+    { rPr: text(target.mark?.attrs.rPr), format: target.format },
+    target.pPr,
+    edit
+  );
+  if (!next) return null;
+  return docxSchema.marks.run.create({
+    ...target.mark?.attrs,
+    rPr: next.rPr,
+    format: next.format
+  });
+}
+function planChanges(pieces, edit) {
+  const changes = [];
+  for (const target of pieces) {
+    const mark = editedMark(target, edit);
+    if (!mark) return null;
+    changes.push({ from: target.from, to: target.to, mark });
+  }
+  return changes;
+}
+function applyToSelection(state, dispatch, edit) {
+  const pieces = textPieces(state).filter(
+    (target) => (
+      // Text already in the desired state is left untouched, so its original XML survives
+      !matchesRunEdit(target.format, edit) && // A locked stretch is left out rather than refused: the guard turns down the whole
+      // transaction, so asking for it would leave the rest of the selection unformatted too
+      !rangeTouchesLocked(state.doc, target.from, target.to)
+    )
+  );
+  const changes = pieces.length > 0 ? planChanges(pieces, edit) : null;
+  if (!changes) return false;
+  if (dispatch) {
+    const tr = state.tr;
+    for (const change of changes) {
+      tr.addMark(change.from, change.to, change.mark);
+    }
+    dispatch(tr);
+  }
+  return true;
+}
+function applyToCaret(state, dispatch, edit) {
+  const target = caretPiece(state);
+  if (matchesRunEdit(target.format, edit)) return false;
+  const mark = editedMark(target, edit);
+  if (!mark) return false;
+  if (dispatch) {
+    const marks = state.storedMarks ?? state.selection.$from.marks();
+    dispatch(state.tr.setStoredMarks(mark.addToSet(marks)));
+  }
+  return true;
+}
+function runEditCommand(edit) {
+  return (state, dispatch) => state.selection.empty ? applyToCaret(state, dispatch, edit) : applyToSelection(state, dispatch, edit);
+}
+function canFormatText(state) {
+  if (state.selection.empty) {
+    return !insertionInsideLocked(state.doc, state.selection.from);
+  }
+  return textPieces(state).some(
+    (target) => !rangeTouchesLocked(state.doc, target.from, target.to)
+  );
+}
+function isToggleActive(state, toggle) {
+  const pieces = activePieces(state);
+  return pieces.length > 0 && pieces.every((target) => isRunToggleOn(target.format, toggle));
+}
+function toggleCommand(toggle) {
+  return (state, dispatch) => {
+    const edit = {
+      kind: "toggle",
+      toggle,
+      on: !isToggleActive(state, toggle)
+    };
+    return runEditCommand(edit)(state, dispatch);
+  };
+}
+var toggleBold = toggleCommand("bold");
+var toggleItalic = toggleCommand("italic");
+var toggleUnderline = toggleCommand("underline");
+var toggleStrike = toggleCommand("strike");
+function setFontSize(pt) {
+  return runEditCommand({ kind: "fontSize", pt });
+}
+function setFontFamily(name) {
+  return runEditCommand({ kind: "fontFamily", name });
+}
+function setTextColor(hex) {
+  return runEditCommand({ kind: "color", hex });
+}
+function setTextBackground(hex) {
+  return runEditCommand({ kind: "background", hex });
+}
+function isBoldActive(state) {
+  return isToggleActive(state, "bold");
+}
+function isItalicActive(state) {
+  return isToggleActive(state, "italic");
+}
+function isUnderlineActive(state) {
+  return isToggleActive(state, "underline");
+}
+function isStrikeActive(state) {
+  return isToggleActive(state, "strike");
+}
+export {
+  canFormatText,
+  isBoldActive,
+  isItalicActive,
+  isStrikeActive,
+  isUnderlineActive,
+  setFontFamily,
+  setFontSize,
+  setTextBackground,
+  setTextColor,
+  toggleBold,
+  toggleItalic,
+  toggleStrike,
+  toggleUnderline
+};

package/dist/editor/commands/formatting/reading.d.ts

@@ -0,0 +1,57 @@
+/** Reads the active inline formatting shown by toolbar controls. */
+import type { Node as PMNode } from "prosemirror-model";
+import type { EditorState } from "prosemirror-state";
+import { type DocumentDefaults } from "../../../model/format";
+import { type FontFallbacks } from "../../../styles/fontStack";
+/**
+ * The font size at the selected position.
+ *
+ * "nobody wrote down a size" is kept apart from "several sizes are mixed".
+ * Lumping the two together would leave the toolbar unable to tell which is which, and both
+ * would show as the default value.
+ */
+export type ActiveFontSize = 
+/** Every selected character has the same size. A size given by a paragraph style lands here too */
+{
+    kind: "size";
+    pt: number;
+}
+/** Nobody wrote down a size, so `pt` is the size that actually gets rendered */
+ | {
+    kind: "default";
+    pt: number;
+}
+/** There are several sizes */
+ | {
+    kind: "mixed";
+};
+export declare function activeFontSize(state: EditorState): ActiveFontSize;
+/**
+ * The font at the selected position.
+ * The same three branches as size: explicit, unspecified (the name that actually gets rendered),
+ * and mixed.
+ */
+export type ActiveFontFamily = 
+/** Every selected character has the same font. A font given by a paragraph style lands here too */
+{
+    kind: "font";
+    name: string;
+}
+/** Nobody wrote down a font, so `name` is the font that actually gets rendered */
+ | {
+    kind: "default";
+    name: string;
+}
+/** There are several fonts */
+ | {
+    kind: "mixed";
+};
+export declare function activeFontFamily(state: EditorState, fontFallbacks?: FontFallbacks): ActiveFontFamily;
+/**
+ * Every font name this document uses. Collects the document default font and the fonts the
+ * runs wrote down. The toolbar select appends them after its presets.
+ * This walks the whole document, so the caller only calls it when the document changes.
+ */
+export declare function documentFontNames(doc: PMNode, defaults: DocumentDefaults): string[];
+export declare function activeTextColor(state: EditorState): string | null;
+export declare function activeTextBackground(state: EditorState): string | null;