Composite Operations

Combine multiple operations for complex transformations.

Overview

Composite operations combine multiple operations in a transaction for complex transformations like paste, split paragraph, or format multiple ranges.

Paste Operation

function pasteContent(editor: Editor, position: Path, content: string) {
  const tx = editor.beginTransaction();
  const selection = editor.getSelection();
  
  // Delete selection if exists
  if (!selection.isCollapsed) {
    tx.add({
      type: 'deleteContent',
      path: selection.start,
      length: selection.length
    });
  }
  
  // Insert pasted content
  tx.add({
    type: 'insertText',
    path: position,
    text: content
  });
  
  tx.commit(); // Single undo entry for entire paste
}

Format Multiple Ranges

function formatMultipleRanges(editor: Editor, ranges: Range[], format: string) {
  const tx = editor.beginTransaction();
  
  for (const range of ranges) {
    tx.add({
      type: 'applyFormat',
      path: range.start,
      length: range.length,
      format: format,
      value: true
    });
  }
  
  tx.commit(); // Single undo for all formatting
}

Split Paragraph

function splitParagraph(editor: Editor, position: Path) {
  const tx = editor.beginTransaction();
  const paragraph = editor.getNodeAtPath(position);
  
  const beforeText = paragraph.text.slice(0, position[1]);
  const afterText = paragraph.text.slice(position[1]);
  
  // Update current paragraph
  tx.add({
    type: 'replace',
    path: position,
    length: paragraph.text.length,
    content: beforeText
  });
  
  // Insert new paragraph
  tx.add({
    type: 'insertNode',
    path: [position[0] + 1],
    node: {
      type: 'paragraph',
      children: [{ type: 'text', text: afterText }]
    }
  });
  
  tx.commit();
}