Lexical: Added initial form/modal styles

This commit is contained in:
Dan Brown
2024-07-09 20:49:47 +01:00
parent 2c96af9aea
commit 51d8044a54
5 changed files with 122 additions and 18 deletions

View File

@ -49,6 +49,9 @@ export function createPageEditorInstance(container: HTMLElement, htmlContent: st
setEditorContentFromHtml(editor, htmlContent);
const debugView = document.getElementById('lexical-debug');
if (debugView) {
debugView.hidden = true;
}
editor.registerUpdateListener(({editorState}) => {
console.log('editorState', editorState.toJSON());
if (debugView) {

View File

@ -1,7 +1,7 @@
import {EditorForm, EditorFormDefinition} from "./forms";
import {el} from "../../helpers";
import {EditorContainerUiElement} from "./core";
import closeIcon from "@icons/close.svg";
export interface EditorModalDefinition {
title: string;
@ -37,7 +37,12 @@ export class EditorFormModal extends EditorContainerUiElement {
}
protected buildDOM(): HTMLElement {
const closeButton = el('button', {class: 'editor-modal-close', type: 'button', title: this.trans('Close')}, ['x']);
const closeButton = el('button', {
class: 'editor-modal-close',
type: 'button',
title: this.trans('Close'),
});
closeButton.innerHTML = closeIcon;
closeButton.addEventListener('click', this.hide.bind(this));
const modal = el('div', {class: 'editor-modal editor-form-modal'}, [

View File

@ -87,17 +87,17 @@ export function getMainEditorFullToolbar(): EditorContainerUiElement {
new EditorButton(fullscreen),
// Test
new EditorButton({
label: 'Test button',
action(context: EditorUiContext) {
context.editor.update(() => {
// Do stuff
});
},
isActive() {
return false;
}
})
// new EditorButton({
// label: 'Test button',
// action(context: EditorUiContext) {
// context.editor.update(() => {
// // Do stuff
// });
// },
// isActive() {
// return false;
// }
// })
]),
]);
}