Undo/Redo

The undo features lets the user withdraw recent changes done to the editor content, as well as bring them back again. All operations are remembered and organized into batches, that can later be easily undone or redone. By utilizing the batches approach, the feature is capable of selectively reverting past changes, not just the latest ones. This allows handling asynchronous actions such as image uploads without blocking the user from editing the document in the meantime.

The selective undo is heavily used in real-time collaboration environments. In such scenario, a specific user should only be able to revert their changes, while keeping the changes made by other users intact (unless there is an editing conflict). By omitting some changes and going down the stack, it is possible to only revert selected changes.

The feature supports both toolbar buttons and keyboard shortcuts for convenient and easy operation.

This feature is enabled by default in all predefined builds.

# Demo

Use the demo below to try out the undo and redo mechanism. Play around the content, try to introduce some changes and then use the toolbar buttons to undo or redo these.

Alternatively, utilize the well-known keyboard shortcut Ctrl + Z (it would be Cmd + Z on Mac) for undo. For a redo you can use either Ctrl + Y or Ctrl + Shift + Z (respectively with Cmd on Mac).

The purpose of writing

In the days of images and icons, the written word has significantly lost its impact. The potential readers rush and suffer attention deficiency, hence all writing longer than a glance is often omitted. This is a hard situation for anyone, as this invalidates the primary purpose of writing anything.

And the primary purpose of writing is to sell. Whatever you do, this is always about selling. Not only writing, but anything is about selling. Adverts sell. TV commercials sell. Facebook posts sell. Tweets sell. This may be a product, a service, a car, or a software bundle, but also your point of view, your opinion, or your image. Even your cosplay photos on Instagram sell some idea about yourself.

This is even more so in the professional writing environment, as none of us doubts this — we are here to sell. Whether we want to encourage people to try the new fancy frapuccinate grande turtleneck soda, convince them to exchange their old 2015 combi van model for the newest hybrid 2020 model, or if we want them to buy a book about the Silesian private eye — we all aim at selling.

This demo only presents a limited set of features. Visit the full-featured editor example to see more in action.

# Installation

This feature is enabled by default in all builds (loaded by the Essentials plugin). The installation instructions are for developers interested in building their own, custom rich text editor or willing to configure the toolbar button.

To add this feature to your editor, install the @ckeditor/ckeditor5-undo package:

npm install --save @ckeditor/ckeditor5-undo

Then add the Undo plugin to your plugin list and to the toolbar:

import Undo from '@ckeditor/ckeditor5-undo/src/undo';

ClassicEditor
    .create( document.querySelector( '#editor' ), {
        // Load the plugin.
        plugins: [ Undo, /* ... */ ],

        // Display the "Undo" and "Redo" buttons in the toolbar.
        toolbar: [ 'undo', 'redo', /* ... */ ],
    } )
    .then( /* ... */ )
    .catch( /* ... */ );

Read more about installing plugins and toolbar configuration.

# Common API

The Undo plugin is a “glue” plugin that loads the UndoEditing engine and the UndoUI features.

The UndoEditing feature registers the following commands:

The UndoCommand which can be programmatically called as undo and is used to retrieve editor history from a batch.
```
editor.execute( 'undo');
```
It can be used to retrieve changes from the latest batch, or from some previous batch (e.g. changes made by a selected user in a collaborative environment):
```
editor.execute( 'undo', batchToUndo );
```
The RedoCommand is used to restore undo state from batch and is called as redo.
```
editor.execute( 'redo');
```

The UndoUI feature introduces the undo and redo buttons to the editor toolbar.

We recommend using the official CKEditor 5 inspector for development and debugging. It will give you tons of useful information about the state of the editor such as internal data structures, selection, commands, and many more.

Every day, we work hard to keep our documentation complete. Have you spotted outdated information? Is something missing? Please report it via our issue tracker.