History Transactions

Overview

Use history transactions to merge multiple edits into a single undo/redo entry. This keeps the undo stack clean when you perform a batch of updates that should revert together.

API

editor.beginTransaction('Batch update')
// ...multiple edits...
editor.commitTransaction()

• beginTransaction(description?) starts a grouped history entry.
• commitTransaction() finalizes the group and records a single snapshot.

If no description is provided, the history entry label defaults to Grouped change.

Behavior

• Changes made between beginTransaction() and commitTransaction() are consolidated into one history entry.
• Calling commitTransaction() without an active transaction is a no-op.
• Pending debounced history saves are cleared when committing to avoid extra entries.
• During history restore, the editor also runs visual orphan cleanup to drop stale frame labels or component badges whose owners were removed by the restored snapshot.

Example

const rect = editor.addShape('rect', {
  x: 40,
  y: 40,
  width: 150,
  height: 110,
  fill: '#112233',
})

editor.beginTransaction('Batch update')
editor.updateObjectProperty(rect.id, 'style.fill', '#445566')
editor.setObjectPosition(rect.id, 120, 140)
editor.commitTransaction()