Expand all

CodeMirrorKeymap

Key bindings for CodeMirror.

This class provides key bindings for CodeMirror, including a help dialog that lists the available shortcuts, accessible via Ctrl-Shift-/.

Additional key bindings can be registered using registerKeyBinding(). This will take effect in the editor immediately.

To document key bindings in the help dialog, use registerKeyBindingHelp(), which can optionally also enable the key binding in the editor.

Both methods require an EditorView, which is only accessible after CodeMirror has been initialized. For dynamically added key bindings, use the ext.CodeMirror.ready hook to have access to the CodeMirror instance after initialization, which will have the CodeMirror.view property set.

Example

mw.hook( 'ext.CodeMirror.ready' ).add( ( $_dom, cm ) => {
  const myKeybinding = {
    key: 'F1',
    run: () => {
      // Do something when F1 is pressed.
    }
  };

  // Register the key binding in the editor.
  cm.registerKeyBinding( myKeybinding, cm.view );

  // Or, register only in the help dialog.
  cm.registerKeyBindingHelp( 'other', 'myKeybinding', myKeybinding );

  // Or, both.
  cm.registerKeyBindingHelp( 'other', 'myKeybinding', myKeybinding, cm.view );
} );

Constructor

new CodeMirrorKeymap() #

Source:

Properties

cursorModifiers :Map.<string, string> #

Map of descriptions of cursor modifiers (e.g. multi-cursor, crosshair). (Un)set elements directly on this map to document new cursor modifiers.

Keys are unique names, values are the descriptions.

Type:

  • Map.<string, string>
Source:
Map of descriptions of cursor modifiers (e.g.

dialog :HTMLDivElement #

Type:

Source:

extension #

Source:

keydownListener :function #

Type:

  • function
Source:

keymapHelpRegistry :Object.<Object.<CodeMirrorKeyBinding>> #

Registry of key bindings we want to advertise in the help dialog. The outer keys are the section within the dialog. The objects therein are for each mapping (command) we want to show, keyed by tool. The value for each is a CodeMirrorKeyBinding object.

Type:

Properties:

Name Type Description
textStyling Object.<CodeMirrorKeyBinding>
history Object.<CodeMirrorKeyBinding>
paragraph Object.<CodeMirrorKeyBinding>
search Object.<CodeMirrorKeyBinding>
insert Object.<CodeMirrorKeyBinding>
other Object.<CodeMirrorKeyBinding>
Source:
Registry of key bindings we want to advertise in the help dialog.

platform :string #

Platform name, used for platform-specific key bindings. This uses the same platform-detection logic as CodeMirror. One of mac, win, linux, or a blank string.

Type:

  • string
Source:
Platform name, used for platform-specific key bindings.

Methods

getShortcutHtml(keyBindingSequence) → {HTMLElement} #

Get the <kbd> HTML for a key binding sequence. This takes into account platform-specific key names.

Parameters:

Name Type Description
keyBindingSequence string
Source:

Returns:

Type
HTMLElement
Get the <kbd> HTML for a key binding sequence.

registerKeyBinding(keyBinding, view) #

Register a key binding with CodeMirror.

Parameters:

Name Type Description
keyBinding CodeMirrorKeyBinding

The key binding to register.
view EditorView

The EditorView to register the key binding(s) with.
Source:
Register a key binding with CodeMirror.

registerKeyBindingHelp(section, tool, [keyBinding], [view]) #

Register a key binding in the help dialog. If a view is passed in and the key binding has a run function, the key binding will also be enabled in the editor. If no run function exists, a key binding will only be documented in the help dialog and is presumed to be implemented elsewhere.

If the section or tool matches the name of an Extension registered with CodeMirrorPreferences, a help entry is only shown when the preference is enabled.

Parameters:

Name Type Attributes Default Description
section string

The section in the help dialog where the binding should be listed.
tool string

Transformed into a message key like 'codemirror-keymap-<tool>'.
keyBinding CodeMirrorKeyBinding | null optional
 null

null if this is a documentation-only.
view EditorView optional
 null

If provided, the key binding will be enabled as an Extension in the editor.
Source:
Register a key binding in the help dialog.

showHelpDialog() → {boolean} #

Show the keymap help dialog.

This implements the Codex Dialog component. See https://w.wiki/CcWY

Source:

Returns:

Type
boolean
Show the keymap help dialog.

Type Definitions

CodeMirrorKeyBinding #

Extends CodeMirror's KeyBinding interface with additional properties.

Type:

Properties:

Name Type Attributes Default Description
key string optional

The key binding sequence, i.e. Mod-Shift-/. Any applicable platform-specific key bindings will take precedence over this.
mac string optional

The key binding sequence to use specifically on macOS.
win string optional

The key binding sequence to use specifically on Windows
linux string optional

The key binding sequence to use specifically on Linux.
aliases Array.<string> optional

Additional key binding sequences that trigger the command.
run Command optional

The function to run when the key binding is triggered.
preventDefault boolean optional
 false

Prevent the default behavior of the key binding.
msg string | null optional

Override the auto-generated message in the help dialog. If not provided, a message key will be generated of the form codemirror-keymap-<command> and rendered with mw.msg. Use null to exclude the command from the help dialog.
prec function optional
 Prec.default

The precedence function to use for the key binding. See Prec for details.
Source:
See:
Extends CodeMirror's KeyBinding interface with additional properties.