Extensions
history
Undo and redo as commands, for toolbars.
The engine keeps the stack and binds the keys; these just reach it. The commands return false when there is nothing to rewind, so a button can disable itself.
1 · Install
One package for every extension · there is no @matrajs/history to install.
npm i @matrajs/core2 · Add it to the editor
Import it and put it in the extensions array. That array is the whole feature list:
what is not in it is not in your bundle and not in the document's schema.
import { createEditor, document, paragraph, text, history } from '@matrajs/core'
const editor = createEditor({
extensions: [document, paragraph, text, history],
element: document.querySelector('#editor'),
})
Already in starterKit · if you spread that kit you have this extension
and adding it again is a duplicate the schema will reject.
3 · Use it
Run a command, and give focus back · a click on a button takes it away.
editor.commands.undo()
editor.focus()Wired to a button:
const button = document.querySelector('#undo')
button.addEventListener('click', () => {
editor.commands.undo()
editor.focus()
})Commands
Every one returns true if it changed the document and false
if it could not · a command that does not apply where the caret is says so rather than
throwing.
| Command | Call |
|---|---|
undo |
editor.commands.undo()
|
redo |
editor.commands.redo()
|