1
0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-07-28 17:02:04 +03:00

Editors: Added lexical editor for testing

Started basic playground for testing lexical as a new WYSIWYG editor.
Moved out tinymce to be under wysiwyg-tinymce instead so lexical is the
default, but TinyMce code remains.
This commit is contained in:
Dan Brown
2024-05-27 15:39:41 +01:00
parent 6019d2ee14
commit 5a4f595341
32 changed files with 303 additions and 30 deletions

View File

@ -0,0 +1,48 @@
import {buildForEditor as buildEditorConfig} from '../wysiwyg-tinymce/config';
import {Component} from './component';
export class WysiwygEditorTinymce extends Component {
setup() {
this.elem = this.$el;
this.tinyMceConfig = buildEditorConfig({
language: this.$opts.language,
containerElement: this.elem,
darkMode: document.documentElement.classList.contains('dark-mode'),
textDirection: this.$opts.textDirection,
drawioUrl: this.getDrawIoUrl(),
pageId: Number(this.$opts.pageId),
translations: {
imageUploadErrorText: this.$opts.imageUploadErrorText,
serverUploadLimitText: this.$opts.serverUploadLimitText,
},
translationMap: window.editor_translations,
});
window.$events.emitPublic(this.elem, 'editor-tinymce::pre-init', {config: this.tinyMceConfig});
window.tinymce.init(this.tinyMceConfig).then(editors => {
this.editor = editors[0];
});
}
getDrawIoUrl() {
const drawioUrlElem = document.querySelector('[drawio-url]');
if (drawioUrlElem) {
return drawioUrlElem.getAttribute('drawio-url');
}
return '';
}
/**
* Get the content of this editor.
* Used by the parent page editor component.
* @return {{html: String}}
*/
getContent() {
return {
html: this.editor.getContent(),
};
}
}