BookStack Code Mirror - bookstack/blob - resources/js/wysiwyg/services/mouse-handling.ts

   1 import {EditorUiContext} from "../ui/framework/core";
   2 import {
   3     $createParagraphNode, $getRoot,
   4     $getSelection,
   5     $isDecoratorNode, CLICK_COMMAND,
   6     COMMAND_PRIORITY_LOW, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND,
   7     KEY_BACKSPACE_COMMAND,
   8     KEY_DELETE_COMMAND,
   9     KEY_ENTER_COMMAND, KEY_TAB_COMMAND,
  10     LexicalEditor,
  11     LexicalNode
  12 } from "lexical";
  13 import {$isImageNode} from "@lexical/rich-text/LexicalImageNode";
  14 import {$isMediaNode} from "@lexical/rich-text/LexicalMediaNode";
  15 import {getLastSelection} from "../utils/selection";
  16 import {$getNearestNodeBlockParent, $getParentOfType, $selectOrCreateAdjacent} from "../utils/nodes";
  17 import {$setInsetForSelection} from "../utils/lists";
  18 import {$isListItemNode} from "@lexical/list";
  19 import {$isDetailsNode, DetailsNode} from "@lexical/rich-text/LexicalDetailsNode";
  20 import {$isDiagramNode} from "../utils/diagrams";
  21 import {$isTableNode} from "@lexical/table";
  22
  23 function isHardToEscapeNode(node: LexicalNode): boolean {
  24     return $isDecoratorNode(node) || $isImageNode(node) || $isMediaNode(node) || $isDiagramNode(node) || $isTableNode(node);
  25 }
  26
  27 function insertBelowLastNode(context: EditorUiContext, event: MouseEvent): boolean {
  28     const lastNode = $getRoot().getLastChild();
  29     if (!lastNode || !isHardToEscapeNode(lastNode)) {
  30         return false;
  31     }
  32
  33     const lastNodeDom = context.editor.getElementByKey(lastNode.getKey());
  34     if (!lastNodeDom) {
  35         return false;
  36     }
  37
  38     const nodeBounds = lastNodeDom.getBoundingClientRect();
  39     const isClickBelow = event.clientY > nodeBounds.bottom;
  40     if (isClickBelow) {
  41         context.editor.update(() => {
  42             const newNode = $createParagraphNode();
  43             $getRoot().append(newNode);
  44             newNode.select();
  45         });
  46         return true;
  47     }
  48
  49     return false;
  50 }
  51
  52
  53 export function registerMouseHandling(context: EditorUiContext): () => void {
  54     const unregisterClick = context.editor.registerCommand(CLICK_COMMAND, (event): boolean => {
  55         insertBelowLastNode(context, event);
  56         return false;
  57     }, COMMAND_PRIORITY_LOW);
  58
  59
  60     return () => {
  61         unregisterClick();
  62     };
  63 }