1
0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-07-31 15:24:31 +03:00

Lexical: Started build of image node and decoration UI

This commit is contained in:
Dan Brown
2024-06-03 16:56:31 +01:00
parent 7c504a10a8
commit a74e04141c
5 changed files with 195 additions and 2 deletions

View File

@ -67,7 +67,6 @@ export class FormatPreviewButton extends EditorButton {
}, [this.getLabel()]);
const stylesToApply = this.getStylesFromPreview();
console.log(stylesToApply);
for (const style of Object.keys(stylesToApply)) {
preview.style.setProperty(style, stylesToApply[style]);
}

View File

@ -7,6 +7,9 @@ import {
import {getMainEditorFullToolbar} from "./toolbars";
import {EditorUIManager} from "./framework/manager";
import {link as linkFormDefinition} from "./defaults/form-definitions";
import {DecoratorListener} from "lexical/LexicalEditor";
import type {NodeKey} from "lexical/LexicalNode";
import {el} from "../helpers";
export function buildEditorUI(element: HTMLElement, editor: LexicalEditor) {
const manager = new EditorUIManager();
@ -28,6 +31,20 @@ export function buildEditorUI(element: HTMLElement, editor: LexicalEditor) {
form: linkFormDefinition,
});
// Register decorator listener
// Maybe move to manager?
const domDecorateListener: DecoratorListener<HTMLElement> = (decorator: Record<NodeKey, HTMLElement>) => {
const keys = Object.keys(decorator);
for (const key of keys) {
const decoratedEl = editor.getElementByKey(key);
const decoratorEl = decorator[key];
if (decoratedEl) {
decoratedEl.append(decoratorEl);
}
}
}
editor.registerDecoratorListener(domDecorateListener);
// Update button states on editor selection change
editor.registerCommand(SELECTION_CHANGE_COMMAND, () => {
const selection = $getSelection();