FrameworkJavaScript

History API: undo, redo, and transactions

Control undo/redo functionality for editor operations.

Reaching the editor instance

The methods below run on the editor you created with new Blok(). They are available once editor.isReady resolves.

TypeScript

// You already hold the instance returned by the constructor.
const editor = new Blok({ holder: 'editor' });
await editor.isReady;

// Call any API method on it.
editor.caret.setToLastBlock('end');

Methods

history.undo()

void

Undo the last operation.

When to use

Programmatic Ctrl/Cmd+Z. No-op when there's nothing to undo — gate custom buttons on canUndo().

TypeScript

// Undo last change
editor.history.undo();

// Undo multiple times
for (let i = 0; i < 3; i++) {
  editor.history.undo();
}

history.redo()

void

Redo the last undone operation.

When to use

Programmatic Ctrl/Cmd+Shift+Z. Gate custom UI on canRedo() so the button disables correctly.

TypeScript

// Redo last undone change
editor.history.redo();

// Redo multiple times
for (let i = 0; i < 3; i++) {
  editor.history.redo();
}

history.canUndo()

boolean

Check if undo is available (there are operations to undo).

When to use

Use to enable/disable a custom undo button; pair with undo().

TypeScript

if (editor.history.canUndo()) {
  editor.history.undo();
} else {
  console.log('Nothing to undo');
}

history.canRedo()

boolean

Check if redo is available (there are undone operations to redo).

When to use

Use to enable/disable a custom redo button; pair with redo().

TypeScript

if (editor.history.canRedo()) {
  editor.history.redo();
} else {
  console.log('Nothing to redo');
}

history.clear()

void

Clear all history. Removes all undo/redo entries.

When to use

Drops the entire undo stack — call after loading fresh content so users can't undo back into the previous document.

TypeScript

// Clear history when loading new content
editor.blocks.render(newData);
editor.history.clear();