Keyboard handling

Adding commands

The PrismEditor.keyCommandMap record maps KeyboardEvent.key to a function called when that key is pressed. This can be useful to add a simple keyboard shortcut without adding an entire keydown handler.

Overriding commands

The defaultCommands() extension registers multiple commands to keyCommandMap. These can be overridden after the defaultCommands() is added.

// Adding a Alt+Enter shortcut without removing the default enter functionality

// Adding a Alt+Enter shortcut without removing the default enter functionality

const oldEnterCallback = editor.keyCommandMap.Enter

editor.keyCommandMap.Enter = (e, selection, value) => {

if (e.altKey) {

// Shortcut code goes here

return true

}

return oldEnterCallback?.(e, selection, value)

}

// Removing the default backspace command

editor.keyCommandMap.Backspace = null

If the handler returns true, e.preventDefault() and e.stopImmediatePropagation() get called automatically.

Adding keydown handlers

Multiple extensions add keydown event handlers to the textarea instead of using the keyCommandMap. Some of them also use capture mode. This is because if a handler in the keyCommandMap returns true, e.stopImmediatePropagation() gets called. Using capture mode ensures the handler runs before any keyCommandMap handlers.

Adding input commands

There’s also an inputCommandMap mapping user input (InputEvent.data) to functions called when that input is typed. This is used by defaultCommands() to automatically close brackets, quotes, and XML tags. If the handler returns true, e.preventDefault() and e.stopImmediatePropagation() get called in the beforeinput handler.