## Keymaps You can customize the initial state of the module from the editor initialization ```js const editor = grapesjs.init({ keymaps: { // Object of keymaps defaults: { 'your-namespace:keymap-name' { keys: '⌘+z, ctrl+z', handler: 'some-command-id' }, ... } } }) ``` Once the editor is instantiated you can use its API and listen to its events. Before using these methods, you should get the module from the instance. ```js // Listen to events editor.on('keymap:add', () => { ... }); // Use the API const keymaps = editor.Keymaps; keymaps.add(...); ``` ## Available Events * `keymap:add` - New keymap added. The new keyamp object is passed as an argument * `keymap:remove` - Keymap removed. The removed keyamp object is passed as an argument * `keymap:emit` - Some keymap emitted, in arguments you get keymapId, shortcutUsed, Event * `keymap:emit:{keymapId}` - `keymapId` emitted, in arguments you get keymapId, shortcutUsed, Event ## Methods * [getConfig][1] * [add][2] * [get][3] * [getAll][4] * [remove][5] * [removeAll][6] ## getConfig Get configuration object Returns **[Object][7]** ## add Add new keymap ### Parameters * `id` **[string][8]** Keymap id * `keys` **[string][8]** Keymap keys, eg. `ctrl+a`, `⌘+z, ctrl+z` * `handler` **([Function][9] | [string][8])** Keymap handler, might be a function * `opts` **[Object][7]** Options (optional, default `{}`) * `opts.force` **[Boolean][10]** Force the handler to be executed. (optional, default `false`) * `opts.prevent` **[Boolean][10]** Prevent default of the original triggered event. (optional, default `false`) ### Examples ```javascript // 'ns' is just a custom namespace keymaps.add('ns:my-keymap', '⌘+j, ⌘+u, ctrl+j, alt+u', editor => { console.log('do stuff'); }); // or keymaps.add('ns:my-keymap', '⌘+s, ctrl+s', 'some-gjs-command', { // Prevent the default browser action prevent: true, }); // listen to events editor.on('keymap:emit', (id, shortcut, event) => { // ... }) ``` Returns **[Object][7]** Added keymap ## get Get the keymap by id ### Parameters * `id` **[string][8]** Keymap id ### Examples ```javascript keymaps.get('ns:my-keymap'); // -> {keys, handler}; ``` Returns **[Object][7]** Keymap object ## getAll Get all keymaps ### Examples ```javascript keymaps.getAll(); // -> {id1: {}, id2: {}}; ``` Returns **[Object][7]** ## remove Remove the keymap by id ### Parameters * `id` **[string][8]** Keymap id ### Examples ```javascript keymaps.remove('ns:my-keymap'); // -> {keys, handler}; ``` Returns **[Object][7]** Removed keymap ## removeAll Remove all binded keymaps Returns **this** [1]: #getconfig [2]: #add [3]: #get [4]: #getAll [5]: #remove [6]: #removeall [7]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object [8]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String [9]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function [10]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean