mirror of
https://github.com/BookStackApp/BookStack.git
synced 2025-08-07 23:03:00 +03:00
Lexical: Updated URL handling, added mouse handling
- Removed URL protocol allow-list to allow any as per old editor. - Added mouse handling, so that clicks below many last hard-to-escape block types will add an empty new paragraph for easy escaping & editing.
This commit is contained in:
63
resources/js/wysiwyg/services/mouse-handling.ts
Normal file
63
resources/js/wysiwyg/services/mouse-handling.ts
Normal file
@@ -0,0 +1,63 @@
|
||||
import {EditorUiContext} from "../ui/framework/core";
|
||||
import {
|
||||
$createParagraphNode, $getRoot,
|
||||
$getSelection,
|
||||
$isDecoratorNode, CLICK_COMMAND,
|
||||
COMMAND_PRIORITY_LOW, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND,
|
||||
KEY_BACKSPACE_COMMAND,
|
||||
KEY_DELETE_COMMAND,
|
||||
KEY_ENTER_COMMAND, KEY_TAB_COMMAND,
|
||||
LexicalEditor,
|
||||
LexicalNode
|
||||
} from "lexical";
|
||||
import {$isImageNode} from "@lexical/rich-text/LexicalImageNode";
|
||||
import {$isMediaNode} from "@lexical/rich-text/LexicalMediaNode";
|
||||
import {getLastSelection} from "../utils/selection";
|
||||
import {$getNearestNodeBlockParent, $getParentOfType, $selectOrCreateAdjacent} from "../utils/nodes";
|
||||
import {$setInsetForSelection} from "../utils/lists";
|
||||
import {$isListItemNode} from "@lexical/list";
|
||||
import {$isDetailsNode, DetailsNode} from "@lexical/rich-text/LexicalDetailsNode";
|
||||
import {$isDiagramNode} from "../utils/diagrams";
|
||||
import {$isTableNode} from "@lexical/table";
|
||||
|
||||
function isHardToEscapeNode(node: LexicalNode): boolean {
|
||||
return $isDecoratorNode(node) || $isImageNode(node) || $isMediaNode(node) || $isDiagramNode(node) || $isTableNode(node);
|
||||
}
|
||||
|
||||
function insertBelowLastNode(context: EditorUiContext, event: MouseEvent): boolean {
|
||||
const lastNode = $getRoot().getLastChild();
|
||||
if (!lastNode || !isHardToEscapeNode(lastNode)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const lastNodeDom = context.editor.getElementByKey(lastNode.getKey());
|
||||
if (!lastNodeDom) {
|
||||
return false;
|
||||
}
|
||||
|
||||
const nodeBounds = lastNodeDom.getBoundingClientRect();
|
||||
const isClickBelow = event.clientY > nodeBounds.bottom;
|
||||
if (isClickBelow) {
|
||||
context.editor.update(() => {
|
||||
const newNode = $createParagraphNode();
|
||||
$getRoot().append(newNode);
|
||||
newNode.select();
|
||||
});
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
export function registerMouseHandling(context: EditorUiContext): () => void {
|
||||
const unregisterClick = context.editor.registerCommand(CLICK_COMMAND, (event): boolean => {
|
||||
insertBelowLastNode(context, event);
|
||||
return false;
|
||||
}, COMMAND_PRIORITY_LOW);
|
||||
|
||||
|
||||
return () => {
|
||||
unregisterClick();
|
||||
};
|
||||
}
|
Reference in New Issue
Block a user