@beyondwork/docx-react-component 1.0.29 → 1.0.31

package/src/core/state/text-transaction.ts

@@ -0,0 +1,869 @@
+import { createSelectionSnapshot, type CanonicalDocumentEnvelope, type SelectionSnapshot } from "./editor-state.ts";
+import type { TransactionMapping } from "../selection/mapping.ts";
+import {
+  cloneParagraphProperties,
+  cloneStoryUnit,
+  createPlainText,
+  parseTextStory,
+  serializeTextStory,
+  type ParagraphProperties,
+  type StoryUnit,
+  type TextStory,
+} from "../schema/text-schema.ts";
+import { createEditorSurfaceSnapshot } from "../../runtime/surface-projection.ts";
+import type { DocumentRootNode, ParagraphNode, SdtNode, TableNode } from "../../model/canonical-document.ts";
+
+export type TextInsertion =
+  | {
+      type: "text";
+      text: string;
+    }
+  | {
+      type: "tab";
+    }
+  | {
+      type: "hard_break";
+    }
+  | {
+      type: "paragraph_break";
+    };
+
+export type TextTransactionIntent =
+  | {
+      type: "replace";
+      range?: {
+        from: number;
+        to: number;
+      };
+      insertion: TextInsertion[];
+    }
+  | {
+      type: "delete_backward";
+    }
+  | {
+      type: "delete_forward";
+    };
+
+export interface TextTransactionResult {
+  document: CanonicalDocumentEnvelope;
+  selection: SelectionSnapshot;
+  mapping: TransactionMapping;
+  storyText: string;
+}
+
+export class TextTransactionError extends Error {
+  readonly code: "invalid_selection" | "unsupported_content";
+
+  constructor(
+    code: TextTransactionError["code"],
+    message: string,
+  ) {
+    super(message);
+    this.name = "TextTransactionError";
+    this.code = code;
+  }
+}
+
+export function applyTextTransaction(
+  document: CanonicalDocumentEnvelope,
+  selection: SelectionSnapshot,
+  intent: TextTransactionIntent,
+  options: {
+    timestamp: string;
+  },
+): TextTransactionResult {
+  const topLevelParagraphResult = tryApplyTopLevelParagraphTransaction(
+    document,
+    selection,
+    intent,
+    options,
+  );
+  if (topLevelParagraphResult) {
+    return topLevelParagraphResult;
+  }
+
+  const sdtScopedResult = tryApplyTopLevelSdtParagraphTransaction(
+    document,
+    selection,
+    intent,
+    options,
+  );
+  if (sdtScopedResult) {
+    return sdtScopedResult;
+  }
+
+  const tableScopedResult = tryApplyTableParagraphTransaction(
+    document,
+    selection,
+    intent,
+    options,
+  );
+  if (tableScopedResult) {
+    return tableScopedResult;
+  }
+
+  return applyLinearTextTransaction(document, selection, intent, options);
+}
+
+function applyLinearTextTransaction(
+  document: CanonicalDocumentEnvelope,
+  selection: SelectionSnapshot,
+  intent: TextTransactionIntent,
+  options: {
+    timestamp: string;
+  },
+): TextTransactionResult {
+  const story = parseTextStory(document.content);
+  const normalizedRange = resolveRange(selection, story.size, intent);
+  const insertionUnits = createInsertionUnits(intent, story, normalizedRange.from);
+
+  ensureEditableRange(story.units.slice(normalizedRange.from, normalizedRange.to));
+
+  const nextUnits = [
+    ...story.units.slice(0, normalizedRange.from).map(cloneStoryUnit),
+    ...insertionUnits.map(cloneStoryUnit),
+    ...story.units.slice(normalizedRange.to).map(cloneStoryUnit),
+  ];
+
+  const nextStory: TextStory = {
+    firstParagraph: cloneParagraphProperties(story.firstParagraph),
+    units: normalizeStoryUnits(nextUnits),
+    size: 0,
+  };
+  nextStory.size = nextStory.units.length;
+
+  const caret = normalizedRange.from + insertionUnits.length;
+
+  return {
+    document: {
+      ...document,
+      updatedAt: options.timestamp,
+      content: serializeTextStory(nextStory),
+    },
+    selection: createSelectionSnapshot(caret, caret),
+    mapping: {
+      steps: [
+        {
+          from: normalizedRange.from,
+          to: normalizedRange.to,
+          insertSize: insertionUnits.length,
+        },
+      ],
+      metadata: {
+        affectsComments: true,
+        affectsRevisions: true,
+        ...(containsParagraphBoundaryChange(story, normalizedRange, insertionUnits)
+          ? { invalidatesStructures: true }
+          : {}),
+      },
+    },
+    storyText: createPlainText(nextStory),
+  };
+}
+
+function tryApplyTableParagraphTransaction(
+  document: CanonicalDocumentEnvelope,
+  selection: SelectionSnapshot,
+  intent: TextTransactionIntent,
+  options: {
+    timestamp: string;
+  },
+): TextTransactionResult | null {
+  const scope = resolveTableParagraphScope(document, selection);
+  if (!scope) {
+    return null;
+  }
+  if (scope === "unsupported") {
+    throw new TextTransactionError(
+      "unsupported_content",
+      "Text transactions inside table structures are only supported when the selection stays within one paragraph-backed table cell.",
+    );
+  }
+  const localDocument: CanonicalDocumentEnvelope = {
+    ...document,
+    content: {
+      type: "doc",
+      children: [scope.paragraph],
+    },
+  };
+  const localSelection = createSelectionSnapshot(
+    selection.anchor - scope.paragraphStart,
+    selection.head - scope.paragraphStart,
+  );
+  const localResult = applyLinearTextTransaction(
+    localDocument,
+    localSelection,
+    localizeTextTransactionIntent(intent, scope.paragraphStart),
+    options,
+  );
+  const nextParagraphBlocks = (localResult.document.content as DocumentRootNode).children;
+  const nextRoot: DocumentRootNode = {
+    ...scope.root,
+    children: scope.root.children.map((child, blockIndex) => {
+      if (blockIndex !== scope.tableBlockIndex) {
+        return child;
+      }
+
+      const table = child as TableNode;
+      return {
+        ...table,
+        rows: table.rows.map((row, rowIndex) => {
+          if (rowIndex !== scope.rowIndex) {
+            return row;
+          }
+
+          return {
+            ...row,
+            cells: row.cells.map((cell, cellIndex) => {
+              if (cellIndex !== scope.cellIndex) {
+                return cell;
+              }
+
+              return {
+                ...cell,
+                children: [
+                  ...cell.children.slice(0, scope.childIndex),
+                  ...nextParagraphBlocks,
+                  ...cell.children.slice(scope.childIndex + 1),
+                ],
+              };
+            }),
+          };
+        }),
+      };
+    }),
+  };
+
+  return {
+    document: {
+      ...document,
+      updatedAt: options.timestamp,
+      content: nextRoot,
+    },
+    selection: createSelectionSnapshot(
+      localResult.selection.anchor + scope.paragraphStart,
+      localResult.selection.head + scope.paragraphStart,
+    ),
+    mapping: {
+      ...localResult.mapping,
+      steps: localResult.mapping.steps.map((step) => ({
+        ...step,
+        from: step.from + scope.paragraphStart,
+        to: step.to + scope.paragraphStart,
+      })),
+    },
+    storyText: localResult.storyText,
+  };
+}
+
+function tryApplyTopLevelSdtParagraphTransaction(
+  document: CanonicalDocumentEnvelope,
+  selection: SelectionSnapshot,
+  intent: TextTransactionIntent,
+  options: {
+    timestamp: string;
+  },
+): TextTransactionResult | null {
+  const scope = resolveTopLevelSdtParagraphScope(document, selection);
+  if (!scope) {
+    return null;
+  }
+
+  const localDocument: CanonicalDocumentEnvelope = {
+    ...document,
+    content: {
+      type: "doc",
+      children: [scope.paragraph],
+    },
+  };
+  const localSelection = createSelectionSnapshot(
+    selection.anchor - scope.paragraphStart,
+    selection.head - scope.paragraphStart,
+  );
+  const localResult = applyLinearTextTransaction(
+    localDocument,
+    localSelection,
+    localizeTextTransactionIntent(intent, scope.paragraphStart),
+    options,
+  );
+  const nextParagraphBlocks = (localResult.document.content as DocumentRootNode).children;
+  const nextRoot: DocumentRootNode = {
+    ...scope.root,
+    children: scope.root.children.map((child, blockIndex) => {
+      if (blockIndex !== scope.blockIndex) {
+        return child;
+      }
+      return replaceParagraphInSdt(child as SdtNode, scope.childPath, nextParagraphBlocks);
+    }),
+  };
+
+  return {
+    document: {
+      ...document,
+      updatedAt: options.timestamp,
+      content: nextRoot,
+    },
+    selection: createSelectionSnapshot(
+      localResult.selection.anchor + scope.paragraphStart,
+      localResult.selection.head + scope.paragraphStart,
+    ),
+    mapping: {
+      ...localResult.mapping,
+      steps: localResult.mapping.steps.map((step) => ({
+        ...step,
+        from: step.from + scope.paragraphStart,
+        to: step.to + scope.paragraphStart,
+      })),
+    },
+    storyText: localResult.storyText,
+  };
+}
+
+function tryApplyTopLevelParagraphTransaction(
+  document: CanonicalDocumentEnvelope,
+  selection: SelectionSnapshot,
+  intent: TextTransactionIntent,
+  options: {
+    timestamp: string;
+  },
+): TextTransactionResult | null {
+  const scope = resolveTopLevelParagraphScope(document, selection);
+  if (!scope) {
+    return null;
+  }
+  if (
+    selection.isCollapsed &&
+    ((intent.type === "delete_backward" && selection.anchor === scope.paragraphStart) ||
+      (intent.type === "delete_forward" && selection.anchor === scope.paragraphEnd))
+  ) {
+    return null;
+  }
+
+  const localDocument: CanonicalDocumentEnvelope = {
+    ...document,
+    content: {
+      type: "doc",
+      children: [scope.paragraph],
+    },
+  };
+  const localSelection = createSelectionSnapshot(
+    selection.anchor - scope.paragraphStart,
+    selection.head - scope.paragraphStart,
+  );
+  const localResult = applyLinearTextTransaction(
+    localDocument,
+    localSelection,
+    localizeTextTransactionIntent(intent, scope.paragraphStart),
+    options,
+  );
+  const nextParagraphBlocks = (localResult.document.content as DocumentRootNode).children;
+  const nextRoot: DocumentRootNode = {
+    ...scope.root,
+    children: [
+      ...scope.root.children.slice(0, scope.blockIndex),
+      ...nextParagraphBlocks,
+      ...scope.root.children.slice(scope.blockIndex + 1),
+    ],
+  };
+
+  return {
+    document: {
+      ...document,
+      updatedAt: options.timestamp,
+      content: nextRoot,
+    },
+    selection: createSelectionSnapshot(
+      localResult.selection.anchor + scope.paragraphStart,
+      localResult.selection.head + scope.paragraphStart,
+    ),
+    mapping: {
+      ...localResult.mapping,
+      steps: localResult.mapping.steps.map((step) => ({
+        ...step,
+        from: step.from + scope.paragraphStart,
+        to: step.to + scope.paragraphStart,
+      })),
+    },
+    storyText: localResult.storyText,
+  };
+}
+
+function resolveTableParagraphScope(
+  document: CanonicalDocumentEnvelope,
+  selection: SelectionSnapshot,
+):
+  | {
+      root: DocumentRootNode;
+      tableBlockIndex: number;
+      rowIndex: number;
+      cellIndex: number;
+      childIndex: number;
+      paragraph: ParagraphNode;
+      paragraphStart: number;
+    }
+  | "unsupported"
+  | null {
+  const root = document.content as DocumentRootNode;
+  if (!root || root.type !== "doc" || !Array.isArray(root.children)) {
+    return null;
+  }
+
+  const surface = createEditorSurfaceSnapshot(document, selection);
+  const selectionFrom = Math.min(selection.anchor, selection.head);
+  const selectionTo = Math.max(selection.anchor, selection.head);
+
+  for (let blockIndex = 0; blockIndex < root.children.length; blockIndex += 1) {
+    const block = root.children[blockIndex];
+    const surfaceBlock = surface.blocks[blockIndex];
+    if (block?.type !== "table" || surfaceBlock?.kind !== "table") {
+      continue;
+    }
+
+    const insideTable = selectionFallsWithinSurfaceRange(
+      selectionFrom,
+      selectionTo,
+      surfaceBlock.from,
+      surfaceBlock.to,
+    );
+    if (!insideTable) {
+      continue;
+    }
+
+    for (let rowIndex = 0; rowIndex < block.rows.length; rowIndex += 1) {
+      const row = block.rows[rowIndex];
+      const surfaceRow = surfaceBlock.rows[rowIndex];
+      if (!row || !surfaceRow) {
+        continue;
+      }
+
+      for (let cellIndex = 0; cellIndex < row.cells.length; cellIndex += 1) {
+        const cell = row.cells[cellIndex];
+        const surfaceCell = surfaceRow.cells[cellIndex];
+        if (!cell || !surfaceCell) {
+          continue;
+        }
+
+        for (
+          let childIndex = 0;
+          childIndex < Math.min(cell.children.length, surfaceCell.content.length);
+          childIndex += 1
+        ) {
+          const child = cell.children[childIndex];
+          const surfaceChild = surfaceCell.content[childIndex];
+          if (child?.type !== "paragraph" || surfaceChild?.kind !== "paragraph") {
+            continue;
+          }
+
+          const insideParagraph = selectionFallsWithinSurfaceRange(
+            selectionFrom,
+            selectionTo,
+            surfaceChild.from,
+            surfaceChild.to,
+          );
+          if (!insideParagraph) {
+            continue;
+          }
+
+          return {
+            root,
+            tableBlockIndex: blockIndex,
+            rowIndex,
+            cellIndex,
+            childIndex,
+            paragraph: child,
+            paragraphStart: surfaceChild.from,
+          };
+        }
+      }
+    }
+
+    return "unsupported";
+  }
+
+  return null;
+}
+
+function resolveTopLevelParagraphScope(
+  document: CanonicalDocumentEnvelope,
+  selection: SelectionSnapshot,
+):
+  | {
+      root: DocumentRootNode;
+      blockIndex: number;
+      paragraph: ParagraphNode;
+      paragraphStart: number;
+      paragraphEnd: number;
+    }
+  | null {
+  const root = document.content as DocumentRootNode;
+  if (!root || root.type !== "doc" || !Array.isArray(root.children)) {
+    return null;
+  }
+
+  const surface = createEditorSurfaceSnapshot(document, selection);
+  const selectionFrom = Math.min(selection.anchor, selection.head);
+  const selectionTo = Math.max(selection.anchor, selection.head);
+
+  for (let blockIndex = 0; blockIndex < root.children.length; blockIndex += 1) {
+    const block = root.children[blockIndex];
+    const surfaceBlock = surface.blocks[blockIndex];
+    if (block?.type !== "paragraph" || surfaceBlock?.kind !== "paragraph") {
+      continue;
+    }
+
+    const insideParagraph = selectionFallsWithinSurfaceRange(
+      selectionFrom,
+      selectionTo,
+      surfaceBlock.from,
+      surfaceBlock.to,
+    );
+    const isCollapsedParagraphTailBeforeTable =
+      selectionFrom === selectionTo &&
+      selectionFrom === surfaceBlock.to &&
+      root.children[blockIndex + 1]?.type === "table";
+    if (!insideParagraph && !isCollapsedParagraphTailBeforeTable) {
+      continue;
+    }
+
+    return {
+      root,
+      blockIndex,
+      paragraph: block,
+      paragraphStart: surfaceBlock.from,
+      paragraphEnd: surfaceBlock.to,
+    };
+  }
+
+  return null;
+}
+
+function resolveTopLevelSdtParagraphScope(
+  document: CanonicalDocumentEnvelope,
+  selection: SelectionSnapshot,
+):
+  | {
+      root: DocumentRootNode;
+      blockIndex: number;
+      childPath: number[];
+      paragraph: ParagraphNode;
+      paragraphStart: number;
+    }
+  | null {
+  const root = document.content as DocumentRootNode;
+  if (!root || root.type !== "doc" || !Array.isArray(root.children)) {
+    return null;
+  }
+
+  const surface = createEditorSurfaceSnapshot(document, selection);
+  const selectionFrom = Math.min(selection.anchor, selection.head);
+  const selectionTo = Math.max(selection.anchor, selection.head);
+
+  for (let blockIndex = 0; blockIndex < root.children.length; blockIndex += 1) {
+    const block = root.children[blockIndex];
+    const surfaceBlock = surface.blocks[blockIndex];
+    if (block?.type !== "sdt" || surfaceBlock?.kind !== "sdt_block") {
+      continue;
+    }
+
+    const nested = resolveParagraphInSdtChildren(
+      block.children,
+      surfaceBlock.children,
+      selectionFrom,
+      selectionTo,
+      [],
+    );
+    if (nested) {
+      return {
+        root,
+        blockIndex,
+        childPath: nested.childPath,
+        paragraph: nested.paragraph,
+        paragraphStart: nested.paragraphStart,
+      };
+    }
+  }
+
+  return null;
+}
+
+function resolveParagraphInSdtChildren(
+  blocks: readonly DocumentRootNode["children"][number][],
+  surfaceBlocks: readonly {
+    kind: string;
+    from: number;
+    to: number;
+    children?: readonly { kind: string; from: number; to: number; children?: readonly unknown[] }[];
+  }[],
+  selectionFrom: number,
+  selectionTo: number,
+  path: number[],
+):
+  | {
+      childPath: number[];
+      paragraph: ParagraphNode;
+      paragraphStart: number;
+    }
+  | null {
+  for (let index = 0; index < Math.min(blocks.length, surfaceBlocks.length); index += 1) {
+    const block = blocks[index];
+    const surfaceBlock = surfaceBlocks[index];
+    if (!block || !surfaceBlock) {
+      continue;
+    }
+
+    if (block.type === "paragraph" && surfaceBlock.kind === "paragraph") {
+      const insideParagraph = selectionFallsWithinSurfaceRange(
+        selectionFrom,
+        selectionTo,
+        surfaceBlock.from,
+        surfaceBlock.to,
+      );
+      if (insideParagraph) {
+        return {
+          childPath: [...path, index],
+          paragraph: block,
+          paragraphStart: surfaceBlock.from,
+        };
+      }
+      continue;
+    }
+
+    if (block.type === "sdt" && surfaceBlock.kind === "sdt_block") {
+      const nested = resolveParagraphInSdtChildren(
+        block.children,
+        (surfaceBlock.children ?? []) as {
+          kind: string;
+          from: number;
+          to: number;
+          children?: readonly { kind: string; from: number; to: number; children?: readonly unknown[] }[];
+        }[],
+        selectionFrom,
+        selectionTo,
+        [...path, index],
+      );
+      if (nested) {
+        return nested;
+      }
+    }
+  }
+
+  return null;
+}
+
+function replaceParagraphInSdt(
+  sdt: SdtNode,
+  childPath: number[],
+  nextParagraphBlocks: DocumentRootNode["children"],
+): SdtNode {
+  if (childPath.length === 0) {
+    return sdt;
+  }
+
+  const [childIndex, ...restPath] = childPath;
+  return {
+    ...sdt,
+    children: sdt.children.map((child, index) => {
+      if (index !== childIndex) {
+        return child;
+      }
+      if (restPath.length === 0) {
+        return nextParagraphBlocks[0] ?? child;
+      }
+      if (child.type === "sdt") {
+        return replaceParagraphInSdt(child, restPath, nextParagraphBlocks);
+      }
+      return child;
+    }),
+  };
+}
+
+function selectionFallsWithinSurfaceRange(
+  selectionFrom: number,
+  selectionTo: number,
+  rangeFrom: number,
+  rangeTo: number,
+): boolean {
+  if (rangeFrom === rangeTo) {
+    return selectionFrom === rangeFrom && selectionTo === rangeTo;
+  }
+
+  return (
+    selectionFrom >= rangeFrom &&
+    selectionTo <= rangeTo &&
+    selectionFrom < rangeTo
+  );
+}
+
+function resolveRange(
+  selection: SelectionSnapshot,
+  storySize: number,
+  intent: TextTransactionIntent,
+): { from: number; to: number } {
+  const from = Math.max(0, Math.min(selection.anchor, selection.head));
+  const to = Math.max(0, Math.max(selection.anchor, selection.head));
+
+  if (from > storySize || to > storySize) {
+    throw new TextTransactionError(
+      "invalid_selection",
+      `Selection ${from}-${to} exceeds story size ${storySize}.`,
+    );
+  }
+
+  if (intent.type === "replace") {
+    if (intent.range) {
+      const explicitFrom = Math.max(0, Math.min(intent.range.from, intent.range.to));
+      const explicitTo = Math.max(0, Math.max(intent.range.from, intent.range.to));
+      if (explicitFrom > storySize || explicitTo > storySize) {
+        throw new TextTransactionError(
+          "invalid_selection",
+          `Explicit range ${explicitFrom}-${explicitTo} exceeds story size ${storySize}.`,
+        );
+      }
+
+      return {
+        from: explicitFrom,
+        to: explicitTo,
+      };
+    }
+
+    return { from, to };
+  }
+
+  if (from !== to) {
+    return { from, to };
+  }
+
+  if (intent.type === "delete_backward") {
+    return {
+      from: Math.max(0, from - 1),
+      to: from,
+    };
+  }
+
+  return {
+    from,
+    to: Math.min(storySize, from + 1),
+  };
+}
+
+function localizeTextTransactionIntent(
+  intent: TextTransactionIntent,
+  offset: number,
+): TextTransactionIntent {
+  if (intent.type !== "replace" || !intent.range) {
+    return intent;
+  }
+
+  return {
+    ...intent,
+    range: {
+      from: intent.range.from - offset,
+      to: intent.range.to - offset,
+    },
+  };
+}
+
+function createInsertionUnits(
+  intent: TextTransactionIntent,
+  story: TextStory,
+  position: number,
+): StoryUnit[] {
+  if (intent.type !== "replace") {
+    return [];
+  }
+
+  const inheritedProps = resolveParagraphPropertiesAtPosition(story, position);
+
+  return intent.insertion.flatMap((entry) => {
+    switch (entry.type) {
+      case "text":
+        return Array.from(entry.text).map<StoryUnit>((character) => ({
+          kind: "text",
+          value: character,
+        }));
+      case "tab":
+        return [{ kind: "tab" }];
+      case "hard_break":
+        return [{ kind: "hard_break" }];
+      case "paragraph_break":
+        return [
+          {
+            kind: "paragraph_break",
+            nextParagraph: cloneParagraphProperties(inheritedProps),
+          },
+        ];
+    }
+  });
+}
+
+function resolveParagraphPropertiesAtPosition(
+  story: TextStory,
+  position: number,
+): ParagraphProperties {
+  let current = cloneParagraphProperties(story.firstParagraph);
+
+  for (let index = 0; index < Math.min(position, story.units.length); index += 1) {
+    const unit = story.units[index];
+    if (unit.kind === "paragraph_break") {
+      current = cloneParagraphProperties(unit.nextParagraph);
+    } else if (unit.kind === "opaque_block" && unit.nextParagraph) {
+      current = cloneParagraphProperties(unit.nextParagraph);
+    }
+  }
+
+  return current;
+}
+
+function normalizeStoryUnits(units: StoryUnit[]): StoryUnit[] {
+  if (units.length === 0) {
+    return [];
+  }
+
+  const normalized: StoryUnit[] = [];
+
+  for (const unit of units) {
+    if (
+      unit.kind === "paragraph_break" &&
+      normalized[normalized.length - 1]?.kind === "paragraph_break"
+    ) {
+      normalized.push({
+        kind: "paragraph_break",
+        nextParagraph: cloneParagraphProperties(unit.nextParagraph),
+      });
+      continue;
+    }
+
+    normalized.push(cloneStoryUnit(unit));
+  }
+
+  return normalized;
+}
+
+function ensureEditableRange(units: StoryUnit[]): void {
+  const protectedUnit = units.find(
+    (unit) => unit.kind === "opaque_inline" || unit.kind === "opaque_block" || unit.kind === "image",
+  );
+
+  if (!protectedUnit) {
+    return;
+  }
+
+  throw new TextTransactionError(
+    "unsupported_content",
+    `Text transaction crosses protected ${protectedUnit.kind} content.`,
+  );
+}
+
+function containsParagraphBoundaryChange(
+  story: TextStory,
+  range: { from: number; to: number },
+  insertionUnits: StoryUnit[],
+): boolean {
+  if (insertionUnits.some((unit) => unit.kind === "paragraph_break")) {
+    return true;
+  }
+
+  return story.units
+    .slice(range.from, range.to)
+    .some((unit) => unit.kind === "paragraph_break");
+}