diff --git a/src/dom_components/view/ComponentTextView.ts b/src/dom_components/view/ComponentTextView.ts index 78b003f86..632c10a6d 100644 --- a/src/dom_components/view/ComponentTextView.ts +++ b/src/dom_components/view/ComponentTextView.ts @@ -151,7 +151,7 @@ export default class ComponentTextView extends ComponentView { // If there is a custom RTE the content is just baked staticly // inside 'content' - if (rte?.customRte) { + if (rte?.customRte && !rte.customRte.parseContent) { comps.length && comps.reset(undefined, opts); model.set('content', content, contentOpt); } else { diff --git a/src/editor/index.ts b/src/editor/index.ts index bc37d4eee..70d53367d 100644 --- a/src/editor/index.ts +++ b/src/editor/index.ts @@ -78,7 +78,7 @@ import PageManager from '../pages'; import PanelManager from '../panels'; import ParserModule from '../parser'; import { CustomParserCss } from '../parser/config/config'; -import RichTextEditorModule, { RichTextEditorEvent } from '../rich_text_editor'; +import RichTextEditorModule, { CustomRTE, RichTextEditorEvent } from '../rich_text_editor'; import SelectorManager, { SelectorEvent } from '../selector_manager'; import StorageManager, { StorageEvent } from '../storage_manager'; import { ProjectData } from '../storage_manager/model/IStorage'; @@ -649,7 +649,7 @@ export default class Editor implements IBaseModule { * } * }); */ - setCustomRte(obj: any) { + setCustomRte(obj: CustomRTE & ThisType) { this.RichTextEditor.customRte = obj; } diff --git a/src/rich_text_editor/index.ts b/src/rich_text_editor/index.ts index 488471803..fa0d883fe 100644 --- a/src/rich_text_editor/index.ts +++ b/src/rich_text_editor/index.ts @@ -49,9 +49,32 @@ export type RichTextEditorEvent = 'rte:enable' | 'rte:disable'; const eventsUp = 'change:canvasOffset frame:scroll component:update'; export interface CustomRTE { - enable: (el: HTMLElement, rte: T) => T; - disable: (el: HTMLElement, rte: T) => T; + /** + * If true, the returned HTML content will be parsed into Components, allowing + * the custom RTE to behave in the same way as the native one. + * If false, the HTML content will be used as it is in the canvas and the export code. + */ + parseContent?: boolean; + /** + * Create or enable the custom RTE. + */ + enable: (el: HTMLElement, rte: T) => T | Promise; + /** + * Disable the custom RTE. + */ + disable: (el: HTMLElement, rte: T) => any | Promise; + /** + * Get HTML content from the custom RTE. + * If not specified, it will use the innerHTML of the element. + */ + getContent?: () => string; + /** + * Destroy the custom RTE. + * Will be triggered on editor destroy. + */ destroy?: () => void; + + [key: string]: unknown; } export default class RichTextEditorModule extends Module {