From 261cac950b018917b98994ae3bcfe7a67f778500 Mon Sep 17 00:00:00 2001 From: Tom Moor Date: Thu, 17 Feb 2022 20:41:13 -0800 Subject: [PATCH] fix: Capture Tab within editor, remove custom key handling in favor of keymaps closes #3118 --- shared/editor/lib/ExtensionManager.ts | 25 +++++------- shared/editor/plugins/Keys.ts | 58 +++++++++++++++------------ 2 files changed, 42 insertions(+), 41 deletions(-) diff --git a/shared/editor/lib/ExtensionManager.ts b/shared/editor/lib/ExtensionManager.ts index af14e4f96..9f6947e3c 100644 --- a/shared/editor/lib/ExtensionManager.ts +++ b/shared/editor/lib/ExtensionManager.ts @@ -117,25 +117,18 @@ export default class ExtensionManager { } keymaps({ schema }: { schema: Schema }) { - const extensionKeymaps = this.extensions - .filter((extension) => ["extension"].includes(extension.type)) + const keymaps = this.extensions .filter((extension) => extension.keys) - .map((extension: Extension) => extension.keys({ schema })); - - const nodeKeymaps = this.extensions - .filter((extension) => ["node", "mark"].includes(extension.type)) - .filter((extension) => extension.keys) - .map((extension: Node | Mark) => - extension.keys({ - type: schema[`${extension.type}s`][extension.name], - schema, - }) + .map((extension) => + ["node", "mark"].includes(extension.type) + ? extension.keys({ + type: schema[`${extension.type}s`][extension.name], + schema, + }) + : (extension as Extension).keys({ schema }) ); - return [ - ...extensionKeymaps, - ...nodeKeymaps, - ].map((keys: Record) => keymap(keys)); + return keymaps.map(keymap); } inputRules({ schema }: { schema: Schema }) { diff --git a/shared/editor/plugins/Keys.ts b/shared/editor/plugins/Keys.ts index bf1903335..1dffa0be3 100644 --- a/shared/editor/plugins/Keys.ts +++ b/shared/editor/plugins/Keys.ts @@ -4,9 +4,9 @@ import { Selection, AllSelection, TextSelection, + EditorState, } from "prosemirror-state"; -import Extension from "../lib/Extension"; -import isModKey from "../lib/isModKey"; +import Extension, { Command } from "../lib/Extension"; import isInCode from "../queries/isInCode"; export default class Keys extends Extension { @@ -14,6 +14,37 @@ export default class Keys extends Extension { return "keys"; } + keys(): Record { + return { + // No-ops prevent Tab escaping the editor bounds + Tab: () => true, + "Shift-Tab": () => true, + + // Shortcuts for when editor has separate edit mode + Escape: () => { + if (this.options.onCancel) { + this.options.onCancel(); + return true; + } + return false; + }, + "Mod-s": () => { + if (this.options.onSave) { + this.options.onSave(); + return true; + } + return false; + }, + "Mod-Enter": (state: EditorState) => { + if (!isInCode(state) && this.options.onSaveAndExit) { + this.options.onSaveAndExit(); + return true; + } + return false; + }, + }; + } + get plugins() { return [ new Plugin({ @@ -60,29 +91,6 @@ export default class Keys extends Extension { } } - // All the following keys require mod to be down - if (!isModKey(event)) { - return false; - } - - if (event.key === "s") { - event.preventDefault(); - this.options.onSave(); - return true; - } - - if (event.key === "Enter" && !isInCode(view.state)) { - event.preventDefault(); - this.options.onSaveAndExit(); - return true; - } - - if (event.key === "Escape") { - event.preventDefault(); - this.options.onCancel(); - return true; - } - return false; }, },