X-Git-Url: http://source.bookstackapp.com/bookstack/blobdiff_plain/ced66f167132ff8b556ad0df6204a6a8b09e2d77..refs/pull/5312/head:/resources/js/wysiwyg/services/keyboard-handling.ts

diff --git a/resources/js/wysiwyg/services/keyboard-handling.ts b/resources/js/wysiwyg/services/keyboard-handling.ts
index 7e3323f86..2c7bfdbba 100644
--- a/resources/js/wysiwyg/services/keyboard-handling.ts
+++ b/resources/js/wysiwyg/services/keyboard-handling.ts
@@ -1,25 +1,76 @@
 import {EditorUiContext} from "../ui/framework/core";
 import {
+    $getSelection,
     $isDecoratorNode,
     COMMAND_PRIORITY_LOW,
     KEY_BACKSPACE_COMMAND,
     KEY_DELETE_COMMAND,
-    LexicalEditor
+    KEY_ENTER_COMMAND, KEY_TAB_COMMAND,
+    LexicalEditor,
+    LexicalNode
 } from "lexical";
 import {$isImageNode} from "../nodes/image";
 import {$isMediaNode} from "../nodes/media";
 import {getLastSelection} from "../utils/selection";
+import {$getNearestNodeBlockParent} from "../utils/nodes";
+import {$createCustomParagraphNode} from "../nodes/custom-paragraph";
+import {$isCustomListItemNode} from "../nodes/custom-list-item";
+import {$setInsetForSelection} from "../utils/lists";
+
+function isSingleSelectedNode(nodes: LexicalNode[]): boolean {
+    if (nodes.length === 1) {
+        const node = nodes[0];
+        if ($isDecoratorNode(node) || $isImageNode(node) || $isMediaNode(node)) {
+            return true;
+        }
+    }
+
+    return false;
+}
 
 function deleteSingleSelectedNode(editor: LexicalEditor) {
     const selectionNodes = getLastSelection(editor)?.getNodes() || [];
-    if (selectionNodes.length === 1) {
+    if (isSingleSelectedNode(selectionNodes)) {
+        editor.update(() => {
+            selectionNodes[0].remove();
+        });
+    }
+}
+
+function insertAfterSingleSelectedNode(editor: LexicalEditor, event: KeyboardEvent|null): boolean {
+    const selectionNodes = getLastSelection(editor)?.getNodes() || [];
+    if (isSingleSelectedNode(selectionNodes)) {
         const node = selectionNodes[0];
-        if ($isDecoratorNode(node) || $isImageNode(node) || $isMediaNode(node)) {
-            editor.update(() => {
-                node.remove();
+        const nearestBlock = $getNearestNodeBlockParent(node) || node;
+        if (nearestBlock) {
+            requestAnimationFrame(() => {
+                editor.update(() => {
+                    const newParagraph = $createCustomParagraphNode();
+                    nearestBlock.insertAfter(newParagraph);
+                    newParagraph.select();
+                });
             });
+            event?.preventDefault();
+            return true;
         }
     }
+
+    return false;
+}
+
+function handleInsetOnTab(editor: LexicalEditor, event: KeyboardEvent|null): boolean {
+    const change = event?.shiftKey ? -40 : 40;
+    const selection = $getSelection();
+    const nodes = selection?.getNodes() || [];
+    if (nodes.length > 1 || (nodes.length === 1 && $isCustomListItemNode(nodes[0].getParent()))) {
+        editor.update(() => {
+            $setInsetForSelection(editor, change);
+        });
+        event?.preventDefault();
+        return true;
+    }
+
+    return false;
 }
 
 export function registerKeyboardHandling(context: EditorUiContext): () => void {
@@ -33,8 +84,18 @@ export function registerKeyboardHandling(context: EditorUiContext): () => void {
         return false;
     }, COMMAND_PRIORITY_LOW);
 
+    const unregisterEnter = context.editor.registerCommand(KEY_ENTER_COMMAND, (event): boolean => {
+        return insertAfterSingleSelectedNode(context.editor, event);
+    }, COMMAND_PRIORITY_LOW);
+
+    const unregisterTab = context.editor.registerCommand(KEY_TAB_COMMAND, (event): boolean => {
+        return handleInsetOnTab(context.editor, event);
+    }, COMMAND_PRIORITY_LOW);
+
     return () => {
-          unregisterBackspace();
-          unregisterDelete();
+        unregisterBackspace();
+        unregisterDelete();
+        unregisterEnter();
+        unregisterTab();
     };
 }
\ No newline at end of file