@lexical/history

@lexical/history

This package contains history helpers for Lexical.

Methods

registerHistory

Registers necessary listeners to manage undo/redo history stack and related editor commands. It returns unregister callback that cleans up all listeners and should be called on editor unmount.

function registerHistory(
  editor: LexicalEditor,
  externalHistoryState: HistoryState,
  delay: number,
): () => void

Commands

History package handles UNDO_COMMAND, REDO_COMMAND and CLEAR_HISTORY_COMMAND commands. It also triggers CAN_UNDO_COMMAND and CAN_REDO_COMMAND commands when history state is changed. These commands could be used to work with history state:

import {UNDO_COMMAND, REDO_COMMAND} from 'lexical';

<Toolbar>
  <Button onClick={() => editor.dispatchCommand(UNDO_COMMAND, undefined)}>Undo</Button>
  <Button onClick={() => editor.dispatchCommand(REDO_COMMAND, undefined)}>Redo</Button>
</Toolbar>;

Similar packages

Other packages similar to @lexical/history

draft-js

Draft.js is a framework for building rich text editors in React. It includes built-in undo and redo functionality, similar to @lexical/history, but is part of a larger framework for managing editor state and content.

slate

Slate is another framework for building rich text editors in React. It provides undo and redo functionality through its history plugin, similar to @lexical/history. Slate offers more flexibility and control over the editor's behavior and state management.

prosemirror-history

ProseMirror is a toolkit for building rich text editors, and the prosemirror-history plugin provides undo and redo functionality. It is similar to @lexical/history in that it focuses on history management, but it is designed to work within the ProseMirror ecosystem.