webapp/bookstack
1
0
Fork 0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-07-30 04:23:11 +03:00
Code Activity

Lexical: Integrated diagram manager, added menu split button

Browse Source
This commit is contained in:
Dan Brown
2024-08-17 10:48:34 +01:00
parent ad6b26ba97
commit 0039f893cc
8 changed files with 103 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
resources/js/wysiwyg/utils/diagrams.ts
View File

@ -1,8 +1,11 @@
import {LexicalEditor, LexicalNode} from "lexical";
import {$getSelection, $insertNodes, LexicalEditor, LexicalNode} from "lexical";
import {HttpError} from "../../services/http";
import {EditorUiContext} from "../ui/framework/core";
import * as DrawIO from "../../services/drawio";
import {DiagramNode} from "../nodes/diagram";
import {$createDiagramNode, DiagramNode} from "../nodes/diagram";
import {ImageManager} from "../../components";
import {EditorImageData} from "./images";
import {$getNodeFromSelection} from "./selection";
export function $isDiagramNode(node: LexicalNode | null | undefined): node is DiagramNode {
return node instanceof DiagramNode;
@ -67,4 +70,26 @@ export function $openDrawingEditorForNode(context: EditorUiContext, node: Diagra
}, async (pngData: string) => {
return updateDrawingNodeFromData(context, node, pngData, isNew);
});
}
export function showDiagramManager(callback: (image: EditorImageData) => any) {
const imageManager: ImageManager = window.$components.first('image-manager') as ImageManager;
imageManager.show((image: EditorImageData) => {
callback(image);
}, 'drawio');
}
export function showDiagramManagerForInsert(context: EditorUiContext) {
const selection = context.lastSelection;
showDiagramManager((image: EditorImageData) => {
context.editor.update(() => {
const diagramNode = $createDiagramNode(image.id, image.url);
const selectedDiagram = $getNodeFromSelection(selection, $isDiagramNode);
if ($isDiagramNode(selectedDiagram)) {
selectedDiagram.replace(diagramNode);
} else {
$insertNodes([diagramNode]);
}
});
});
}

3
resources/js/wysiwyg/utils/images.ts
View File

@ -2,7 +2,8 @@ import {ImageManager} from "../../components";
import {$createImageNode} from "../nodes/image";
import {$createLinkNode, LinkNode} from "@lexical/link";
type EditorImageData = {
export type EditorImageData = {
id: string;
url: string;
thumbs?: {display: string};
name: string;