Skip to content
Remirror
DocsAPIGitHub
  • Guides

The following is an example where the enter key can be customised to ignore all lower priority Enter key bindings.

The next method allows full control beyond the return value. It allows both calling all lower priority key bindings regardless of whether true or false has been called.

import { BaseExtensionOptions, Extension, KeyBindings } from '@remirror/core';
interface CustomKeymapExtensionOptions extends BaseExtensionOptions {
override: boolean;
}
export class CustomKeymapExtension extends Extension<CustomKeymapExtensionOptions> {
/**
* Shorthand method for creating the `BaseKeymapExtension`
*/
public static of(options: CustomKeymapExtensionOptions) {
return new CustomKeymapExtension(options);
}
get name() {
return 'customKeymap' as const;
}
get defaultOptions() {
return {
override: false,
};
}
/**
* Injects the baseKeymap into the editor.
*/
public keys(): KeyBindings {
const { override } = this.options;
return {
Enter({ next }) {
if (override) {
// No other commands will be run
return true;
}
next(); // Runs all lower priority commands
return true;
},
};
}
}

Usage

To use the above example you could do the following.

import { ExtensionManager } from '@remirror/core';
import { baseExtensions } from '@remirror/core-extensions';
import { CustomKeymapExtension } from './custom-keymap-extension';
const manager = ExtensionManager.of([
...baseExtensions,
{ priority: 1, extension: CustomKeymapExtension.of({ override: true }) },
]);

This manager can now be used to create an editor where the baseKeymap for the Enter key is overriden.

If override is set to false, the method will call all lower priority keybindings while still allowing the behaviour you want for the extension.

Edit the page on GitHub
Previous:
Advanced guide
Next:
Showcase