@lexical/history
Advanced tools
@lexical/history is a plugin for the Lexical framework that provides undo and redo functionality for text editors. It allows developers to easily integrate history management into their Lexical-based editors, enabling users to revert or reapply changes made to the content.
Undo
This feature allows users to undo the last change made in the editor. The `undo` method reverts the editor state to the previous state.
import { createHistoryPlugin } from '@lexical/history';
const historyPlugin = createHistoryPlugin();
// To undo the last change
historyPlugin.undo();Redo
This feature allows users to redo the last undone change in the editor. The `redo` method reapplies the last change that was undone.
import { createHistoryPlugin } from '@lexical/history';
const historyPlugin = createHistoryPlugin();
// To redo the last undone change
historyPlugin.redo();Custom History Management
This feature allows developers to customize the history management, such as setting a maximum stack size for the undo/redo history. The `createHistoryPlugin` function accepts configuration options to tailor the history behavior.
import { createHistoryPlugin } from '@lexical/history';
const historyPlugin = createHistoryPlugin({ maxStackSize: 100 });
// Custom history management with a maximum stack size of 100
historyPlugin.undo();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 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 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.
@lexical/history
This package contains history helpers for Lexical.
registerHistoryRegisters 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
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)}>Undo</Button>
<Button onClick={() => editor.dispatchCommand(REDO_COMMAND)}>Redo</Button>
</Toolbar>;
v0.16.1 (2024-07-01)
FAQs
This package contains selection history helpers for Lexical.
We found that @lexical/history demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 5 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
A developer is accusing Tencent of violating the GPL by modifying a Python utility and changing its license to BSD, highlighting the importance of copyleft compliance.
Security News
In an open letter, JavaScript community leaders urge Oracle to give up the JavaScript trademark, arguing that it has been effectively abandoned through nonuse.
Security News
The initial version of the Socket Python SDK is now on PyPI, enabling developers to more easily interact with the Socket REST API in Python projects.