@worktile/theia 19.4.2 → 19.5.0-next.0

package/components/index.d.ts

@@ -2,15 +2,12 @@ export * from './toolbar/toolbar.component';
 export * from './toolbar-dropdown/toolbar-dropdown.component';
 export * from './toolbar-group/toolbar-group.component';
 export * from './toolbar-item/toolbar-item.component';
-export * from './element/element.component';
 export * from './listbox/listbox';
 export * from './listbox/listbox.type';
 export * from './action/prevent-default';
 export * from './plugin-menu/plugin-menu.component';
 export * from './column-resize/column-resize-notifier';
 export * from './column-resize/event-dispatcher';
-export * from './template/template.component';
-export * from './text/text.component';
 export * from './action/prevent-default';
 export * from './inline-toolbar/inline-toolbar.component';
 export * from './conversion-hint/conversion-hint.component';

package/components/text/text.flavour.d.ts

@@ -0,0 +1,8 @@
+import { DefaultTextFlavour } from 'slate-angular';
+export declare class TextFlavour extends DefaultTextFlavour {
+    excludes: string[];
+    attributes: any[];
+    render(): void;
+    applyRichtext(): void;
+    onContextChange(): void;
+}

package/editor.component.d.ts

@@ -3,9 +3,10 @@ import { ThyIconRegistry } from 'ngx-tethys/icon';
 import { Descendant, Editor, Element, NodeEntry, Range, Text } from 'slate';
 import { SlateError } from 'slate-angular';
 import { DOMRange } from 'slate-dom';
-import { TheTemplate, TheText, TheToolbarComponent } from './components';
+import { TheToolbarComponent } from './components';
 import { TheEditor, TheOptions, ThePresetConfig, ThePlugin, ToolbarEntity, DomEventDataInfo } from './interfaces';
 import { TheContextService } from './services/context.service';
+import { TextFlavour } from './components/text/text.flavour';
 import * as i0 from "@angular/core";
 export declare class TheEditorComponent implements OnInit, OnChanges, OnDestroy {
     private cdr;
@@ -29,7 +30,6 @@ export declare class TheEditorComponent implements OnInit, OnChanges, OnDestroy
     }>;
     theEditorCreated: EventEmitter<Editor>;
     theUploadingStatus: EventEmitter<boolean>;
-    templateInstance: TheTemplate;
     theEditableContainer: ElementRef<HTMLElement>;
     globalToolbarInstance: TheToolbarComponent;
     toolbarEntity: ToolbarEntity;
@@ -71,7 +71,7 @@ export declare class TheEditorComponent implements OnInit, OnChanges, OnDestroy
     private onErrorHandler;
     renderElement: (element: Element) => import("slate-angular").ViewType;
     renderLeaf: (text: Text) => import("slate-angular").ViewType;
-    renderText: (text: Text) => typeof TheText;
+    renderText: (text: Text) => typeof TextFlavour;
     private generateDecorate;
     onKeyDown: (event: KeyboardEvent) => void;
     mousedown(event: MouseEvent): void;

package/fesm2022/worktile-theia.mjs

@@ -1,6 +1,6 @@
 import { NgStyle, NgTemplateOutlet, NgClass, DOCUMENT } from '@angular/common';
 import * as i0 from '@angular/core';
-import { InjectionToken, Component, inject, signal, Injectable, computed, HostBinding, Input, Directive, ViewChild, HostListener, ViewContainerRef, Inject, TemplateRef, ChangeDetectionStrategy, forwardRef, ContentChildren, Optional, SkipSelf, EventEmitter, NgZone, ElementRef, DestroyRef, Output, Pipe, ChangeDetectorRef, Renderer2, viewChild, ViewChildren, Injector, NgModule } from '@angular/core';
+import { InjectionToken, Component, inject, signal, Injectable, computed, HostBinding, Input, Directive, ViewChild, HostListener, ViewContainerRef, Inject, TemplateRef, forwardRef, ContentChildren, Optional, SkipSelf, EventEmitter, NgZone, ElementRef, DestroyRef, Output, Pipe, ChangeDetectorRef, Renderer2, ChangeDetectionStrategy, viewChild, ViewChildren, Injector, NgModule } from '@angular/core';
 import { ThyDivider } from 'ngx-tethys/divider';
 import { ThyAction, ThyActions } from 'ngx-tethys/action';
 import { ThyDropdownMenuItemDirective, ThyDropdownMenuDivider, ThyDropdownMenuItemNameDirective, ThyDropdownMenuItemIconDirective, ThyDropdownMenuItemActiveDirective, ThyDropdownMenuComponent, ThyDropdownMenuGroup, ThyDropdownDirective, ThyDropdownMenuItemExtendIconDirective } from 'ngx-tethys/dropdown';
@@ -10,7 +10,7 @@ import { cloneDeep, map, assign, defaults, groupBy, uniq, isEqual } from 'lodash
 export { assign, cloneDeep, debounce, defaults, groupBy, isEqual, map, uniq } from 'lodash';
 import { Editor, Element, Span, Range, Path, Node, Point, Text, Transforms, Operation, createEditor } from 'slate';
 import * as i4 from 'slate-angular';
-import { FAKE_LEFT_BLOCK_CARD_OFFSET, FAKE_RIGHT_BLOCK_CARD_OFFSET, getClipboardData, AngularEditor, hotkeys, getPlainText as getPlainText$1, createClipboardData, setClipboardData, BaseElementComponent, IS_SAFARI, ELEMENT_TO_COMPONENT, BaseTextComponent, SlateModule, hasBlockCard, isCardLeft, SlateChildrenOutlet, defaultScrollSelectionIntoView, getDataTransferClipboard, withAngular } from 'slate-angular';
+import { FAKE_LEFT_BLOCK_CARD_OFFSET, FAKE_RIGHT_BLOCK_CARD_OFFSET, getClipboardData, AngularEditor, hotkeys, getPlainText as getPlainText$1, createClipboardData, setClipboardData, BaseElementComponent, IS_SAFARI, ELEMENT_TO_COMPONENT, SlateModule, hasBlockCard, isCardLeft, SlateChildrenOutlet, BaseElementFlavour, DefaultTextFlavour, defaultScrollSelectionIntoView, getDataTransferClipboard, withAngular } from 'slate-angular';
 import { HistoryEditor, withHistory } from 'slate-history';
 import { NODE_TO_PARENT, NODE_TO_INDEX, NODE_TO_ELEMENT, EDITOR_TO_ELEMENT } from 'slate-dom';
 import { TheiaConverter } from '@atinc/selene';
@@ -4453,26 +4453,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                 args: ['click', ['$event']]
             }] } });
 
-class TheDefaultElement extends TheBaseElement {
-    get indent() {
-        return this.element?.indent;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TheDefaultElement, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TheDefaultElement, isStandalone: true, selector: "[theDefaultElement]", host: { properties: { "attr.the-indent": "this.indent" } }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TheDefaultElement, decorators: [{
-            type: Component,
-            args: [{
-                    selector: '[theDefaultElement]',
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    standalone: true
-                }]
-        }], propDecorators: { indent: [{
-                type: HostBinding,
-                args: ['attr.the-indent']
-            }] } });
-
 const THE_LISTBOX_PARENT_OPTION_TOKEN = new InjectionToken('THE_LISTBOX_PARENT_OPTION_TOKEN');
 const THE_LISTBOX_PARENT_GROUP_TOKEN = new InjectionToken('THE_LISTBOX_PARENT_GROUP_TOKEN');
 const THE_LISTBOX_TOKEN = new InjectionToken('THE_LISTBOX_TOKEN');
@@ -8661,157 +8641,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
             type: Injectable
         }], ctorParameters: () => [{ type: i0.NgZone }] });
 
-class TheHeadingElement extends TheBaseElement {
-    constructor() {
-        super(...arguments);
-        this.beforeContextChange = (value) => {
-            const isHeading = isStandardHeadingElement(value.element);
-            if (isHeading && this.element && value.element !== this.element) {
-                if (value.element.isCollapsed !== this.element.isCollapsed) {
-                    const followElements = getFollowElements(this.editor, value.element);
-                    // 一旦内容发生变化会出现 targetDom get undefined 的情况，所以等一个 setTimeout 周期
-                    setTimeout(() => {
-                        followElements.forEach(el => {
-                            const isVisible = this.editor.isVisible(el);
-                            toggleHeadingRelatedElement(this.editor, el, isVisible);
-                        });
-                    }, 0);
-                }
-            }
-        };
-    }
-    ngOnInit() {
-        super.ngOnInit();
-        if (this.element && isStandardHeadingElement(this.element) && this.element.isCollapsed) {
-            const followElements = getFollowElements(this.editor, this.element);
-            // 处理删除后撤销场景
-            followElements.forEach(el => {
-                toggleHeadingRelatedElement(this.editor, el, false);
-            });
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TheHeadingElement, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TheHeadingElement, isStandalone: true, selector: "[theHeadingElement]", usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TheHeadingElement, decorators: [{
-            type: Component,
-            args: [{
-                    selector: '[theHeadingElement]',
-                    template: '',
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    standalone: true
-                }]
-        }] });
-
-class TheTemplate {
-    constructor() {
-        this.renderElement = (element) => {
-            if (element.type === ElementKinds.default) {
-                return this.paragraphTemplate;
-            }
-            if (element.type === ElementKinds.heading_1) {
-                return this.headingOneTemplate;
-            }
-            if (element.type === ElementKinds.heading_2) {
-                return this.headingTwoTemplate;
-            }
-            if (element.type === ElementKinds.heading_3) {
-                return this.headingThreeTemplate;
-            }
-            if (element.type === ElementKinds.heading_4) {
-                return this.headingFourTemplate;
-            }
-            if (element.type === ElementKinds.heading_5) {
-                return this.headingFiveTemplate;
-            }
-            if (element.type === ElementKinds.heading_6) {
-                return this.headingSixTemplate;
-            }
-            return null;
-        };
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TheTemplate, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TheTemplate, isStandalone: true, selector: "the-template,[theTemplate]", viewQueries: [{ propertyName: "paragraphTemplate", first: true, predicate: ["paragraph"], descendants: true, read: TemplateRef, static: true }, { propertyName: "headingOneTemplate", first: true, predicate: ["headingOne"], descendants: true, read: TemplateRef, static: true }, { propertyName: "headingTwoTemplate", first: true, predicate: ["headingTwo"], descendants: true, read: TemplateRef, static: true }, { propertyName: "headingThreeTemplate", first: true, predicate: ["headingThree"], descendants: true, read: TemplateRef, static: true }, { propertyName: "headingFourTemplate", first: true, predicate: ["headingFour"], descendants: true, read: TemplateRef, static: true }, { propertyName: "headingFiveTemplate", first: true, predicate: ["headingFive"], descendants: true, read: TemplateRef, static: true }, { propertyName: "headingSixTemplate", first: true, predicate: ["headingSix"], descendants: true, read: TemplateRef, static: true }], ngImport: i0, template: "<ng-template #paragraph let-context=\"context\" let-viewContext=\"viewContext\">\n  <div theDefaultElement [context]=\"context\" [viewContext]=\"viewContext\" [ngStyle]=\"context.element | elementStyle\"></div>\n</ng-template>\n<ng-template #headingOne let-context=\"context\" let-viewContext=\"viewContext\">\n  <h1\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h1>\n</ng-template>\n<ng-template #headingTwo let-context=\"context\" let-viewContext=\"viewContext\">\n  <h2\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h2>\n</ng-template>\n<ng-template #headingThree let-context=\"context\" let-viewContext=\"viewContext\">\n  <h3\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h3>\n</ng-template>\n<ng-template #headingFour let-context=\"context\" let-viewContext=\"viewContext\">\n  <h4\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h4>\n</ng-template>\n<ng-template #headingFive let-context=\"context\" let-viewContext=\"viewContext\">\n  <h5\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h5>\n</ng-template>\n<ng-template #headingSix let-context=\"context\" let-viewContext=\"viewContext\">\n  <h6\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h6>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: ElementStylePipe, name: "elementStyle" }, { kind: "component", type: TheDefaultElement, selector: "[theDefaultElement]" }, { kind: "component", type: TheHeadingElement, selector: "[theHeadingElement]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TheTemplate, decorators: [{
-            type: Component,
-            args: [{ selector: 'the-template,[theTemplate]', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgStyle, ElementStylePipe, TheDefaultElement, TheHeadingElement], template: "<ng-template #paragraph let-context=\"context\" let-viewContext=\"viewContext\">\n  <div theDefaultElement [context]=\"context\" [viewContext]=\"viewContext\" [ngStyle]=\"context.element | elementStyle\"></div>\n</ng-template>\n<ng-template #headingOne let-context=\"context\" let-viewContext=\"viewContext\">\n  <h1\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h1>\n</ng-template>\n<ng-template #headingTwo let-context=\"context\" let-viewContext=\"viewContext\">\n  <h2\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h2>\n</ng-template>\n<ng-template #headingThree let-context=\"context\" let-viewContext=\"viewContext\">\n  <h3\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h3>\n</ng-template>\n<ng-template #headingFour let-context=\"context\" let-viewContext=\"viewContext\">\n  <h4\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h4>\n</ng-template>\n<ng-template #headingFive let-context=\"context\" let-viewContext=\"viewContext\">\n  <h5\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h5>\n</ng-template>\n<ng-template #headingSix let-context=\"context\" let-viewContext=\"viewContext\">\n  <h6\n    theHeadingElement\n    [context]=\"context\"\n    [viewContext]=\"viewContext\"\n    [attr.id]=\"context.element.key\"\n    [ngStyle]=\"context.element | elementStyle\"\n  ></h6>\n</ng-template>\n" }]
-        }], propDecorators: { paragraphTemplate: [{
-                type: ViewChild,
-                args: ['paragraph', { read: TemplateRef, static: true }]
-            }], headingOneTemplate: [{
-                type: ViewChild,
-                args: ['headingOne', { read: TemplateRef, static: true }]
-            }], headingTwoTemplate: [{
-                type: ViewChild,
-                args: ['headingTwo', { read: TemplateRef, static: true }]
-            }], headingThreeTemplate: [{
-                type: ViewChild,
-                args: ['headingThree', { read: TemplateRef, static: true }]
-            }], headingFourTemplate: [{
-                type: ViewChild,
-                args: ['headingFour', { read: TemplateRef, static: true }]
-            }], headingFiveTemplate: [{
-                type: ViewChild,
-                args: ['headingFive', { read: TemplateRef, static: true }]
-            }], headingSixTemplate: [{
-                type: ViewChild,
-                args: ['headingSix', { read: TemplateRef, static: true }]
-            }] } });
-
-class TheText extends BaseTextComponent {
-    constructor() {
-        super(...arguments);
-        this.excludes = ['color', 'font-size', 'background-color', 'text'];
-        this.attributes = [];
-        this.renderer2 = inject(Renderer2);
-    }
-    onContextChange() {
-        super.onContextChange();
-        this.applyTextMark();
-    }
-    applyTextMark() {
-        this.attributes.forEach(attr => {
-            this.renderer2.removeAttribute(this.elementRef.nativeElement, attr);
-        });
-        this.attributes = [];
-        for (const key in this.text) {
-            if (Object.prototype.hasOwnProperty.call(this.text, key) && !this.excludes.includes(key) && !!this.text[key]) {
-                const attr = `the-${key}`;
-                this.renderer2.setAttribute(this.elementRef.nativeElement, attr, 'true');
-                this.attributes.push(attr);
-            }
-        }
-        const fontSize = this.text[MarkTypes.fontSize];
-        this.renderer2.setAttribute(this.elementRef.nativeElement, `the-${MarkTypes.fontSize}`, fontSize ? fontSize : null);
-        if (this.text[MarkTypes.color]) {
-            this.renderer2.setStyle(this.elementRef.nativeElement, 'color', this.text[MarkTypes.color]);
-        }
-        else {
-            this.renderer2.removeStyle(this.elementRef.nativeElement, 'color');
-        }
-        if (this.text[MarkTypes.backgroundColor]) {
-            this.renderer2.setStyle(this.elementRef.nativeElement, 'background-color', this.text[MarkTypes.backgroundColor]);
-        }
-        else {
-            this.renderer2.removeStyle(this.elementRef.nativeElement, 'background-color');
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TheText, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TheText, isStandalone: true, selector: "span[theText]", host: { attributes: { "data-slate-node": "text" } }, usesInheritance: true, ngImport: i0, template: ``, isInline: true }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TheText, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'span[theText]',
-                    template: ``,
-                    host: {
-                        'data-slate-node': 'text'
-                    },
-                    standalone: true
-                }]
-        }] });
-
 class TheInlineToolbar {
     constructor(elementRef, scrollDispatcher, cdr, ngZone, contextService) {
         this.elementRef = elementRef;
@@ -18256,6 +18085,191 @@ const shortcuts = (editor, event) => {
     markShortcuts(editor, event);
 };
 
+class TheBaseFlavourElement extends BaseElementFlavour {
+    toggleClassNames() {
+        if (this.selection && this.editor && this.editor.isVoid(this.element)) {
+            this.nativeElement.classList.add(`slate-selected-element`);
+            if (this.isCollapsed && isGlobalCollapsed(this.editor)) {
+                this.nativeElement.classList.add(`slate-focus-element`);
+            }
+            else {
+                this.nativeElement.classList.remove(`slate-focus-element`);
+            }
+        }
+        else {
+            this.nativeElement.classList.remove(`slate-selected-element`);
+            this.nativeElement.classList.remove(`slate-focus-element`);
+        }
+    }
+    toggleIndent() {
+        if (this.element?.indent) {
+            this.nativeElement.setAttribute('the-indent', this.element.indent.toString());
+        }
+        else {
+            this.nativeElement.removeAttribute('the-indent');
+        }
+    }
+    toggleStyles() {
+        if (this.element?.align) {
+            this.nativeElement.style.textAlign = this.element.align;
+        }
+        else {
+            this.nativeElement.style.textAlign = '';
+        }
+        if (this.element?.textIndent) {
+            this.nativeElement.style.textIndent = this.element.textIndent + 'em';
+        }
+        else {
+            this.nativeElement.style.textIndent = '';
+        }
+    }
+    render() {
+        this.context.attributes['data-slate-key'] = this.context.element.key;
+        const nativeElement = this.createNativeElement();
+        this.nativeElement = nativeElement;
+        const blockClass = this.editor.isInline(this.element) ? 'slate-inline-block' : 'slate-block';
+        this.nativeElement.classList.add(`slate-element-${this.element.type}`, blockClass);
+        this.toggleClassNames();
+        this.toggleStyles();
+    }
+    onInit() {
+        super.onInit();
+        if (this.editor) {
+            const isVisible = this.editor.isVisible(this.element);
+            const isBlockCard = this.editor.isBlockCard(this.element);
+            if (!isVisible) {
+                if (isBlockCard) {
+                    setTimeout(() => {
+                        toggleHeadingRelatedElement(this.editor, this.element, isVisible);
+                    }, 0);
+                }
+                else {
+                    toggleHeadingRelatedElement(this.editor, this.element, isVisible);
+                }
+            }
+        }
+    }
+    rerender() {
+        this.toggleClassNames();
+        this.toggleStyles();
+    }
+}
+
+class ParagraphFlavour extends TheBaseFlavourElement {
+    render() {
+        super.render();
+        this.toggleIndent();
+    }
+    rerender() {
+        super.rerender();
+        this.toggleIndent();
+    }
+    createNativeElement() {
+        return document.createElement('div');
+    }
+}
+
+class HeadingFlavour extends TheBaseFlavourElement {
+    constructor() {
+        super(...arguments);
+        this.beforeContextChange = (value) => {
+            const isHeading = isStandardHeadingElement(value.element);
+            if (isHeading && this.element && value.element !== this.element) {
+                if (value.element.isCollapsed !== this.element.isCollapsed) {
+                    const followElements = getFollowElements(this.editor, value.element);
+                    // 一旦内容发生变化会出现 targetDom get undefined 的情况，所以等一个 setTimeout 周期
+                    setTimeout(() => {
+                        followElements.forEach(el => {
+                            const isVisible = this.editor.isVisible(el);
+                            toggleHeadingRelatedElement(this.editor, el, isVisible);
+                        });
+                    }, 0);
+                }
+            }
+        };
+    }
+    render() {
+        super.render();
+        this.nativeElement.setAttribute('id', this.element.key || '');
+    }
+    onInit() {
+        super.onInit();
+        if (this.element && isStandardHeadingElement(this.element) && this.element.isCollapsed) {
+            const followElements = getFollowElements(this.editor, this.element);
+            // 处理删除后撤销场景
+            followElements.forEach(el => {
+                toggleHeadingRelatedElement(this.editor, el, false);
+            });
+        }
+    }
+    createNativeElement() {
+        const type = this.element.type;
+        switch (type) {
+            case 'heading-one':
+                return this.createHeadingElement(1);
+            case 'heading-two':
+                return this.createHeadingElement(2);
+            case 'heading-three':
+                return this.createHeadingElement(3);
+            case 'heading-four':
+                return this.createHeadingElement(4);
+            case 'heading-five':
+                return this.createHeadingElement(5);
+            case 'heading-six':
+                return this.createHeadingElement(6);
+        }
+        return document.createElement('div');
+    }
+    createHeadingElement(level) {
+        return document.createElement(`h${level}`);
+    }
+}
+
+class TextFlavour extends DefaultTextFlavour {
+    constructor() {
+        super(...arguments);
+        this.excludes = ['color', 'font-size', 'background-color', 'text'];
+        this.attributes = [];
+    }
+    render() {
+        super.render();
+        this.applyRichtext();
+    }
+    applyRichtext() {
+        this.attributes.forEach(attr => {
+            this.nativeElement.removeAttribute(attr);
+        });
+        this.attributes = [];
+        for (const key in this.text) {
+            if (Object.prototype.hasOwnProperty.call(this.text, key) && !this.excludes.includes(key) && !!this.text[key]) {
+                const attr = `the-${key}`;
+                this.nativeElement.setAttribute(attr, 'true');
+                this.attributes.push(attr);
+            }
+        }
+        const fontSize = this.text[MarkTypes.fontSize];
+        this.nativeElement.setAttribute(`the-${MarkTypes.fontSize}`, fontSize ? fontSize : null);
+        if (this.text[MarkTypes.color]) {
+            this.nativeElement.style.color = this.text[MarkTypes.color];
+        }
+        else {
+            this.nativeElement.style.color = '';
+        }
+        if (this.text[MarkTypes.backgroundColor]) {
+            this.nativeElement.style.backgroundColor = this.text[MarkTypes.backgroundColor];
+        }
+        else {
+            this.nativeElement.style.backgroundColor = '';
+        }
+    }
+    onContextChange() {
+        super.onContextChange();
+        if (this.initialized) {
+            this.applyRichtext();
+        }
+    }
+}
+
 class TheEditorComponent {
     get options() {
         return this.editor?.options;
@@ -18295,18 +18309,26 @@ class TheEditorComponent {
             defaultScrollSelectionIntoView(e, domRange);
         };
         this.renderElement = (element) => {
-            const template = this.templateInstance.renderElement(element);
             const component = this.editor.renderElement(element);
-            return component ? component : template;
+            if (component) {
+                return component;
+            }
+            if (element.type === 'paragraph') {
+                return ParagraphFlavour;
+            }
+            if (isHeadingElement(element)) {
+                return HeadingFlavour;
+            }
+            return null;
         };
         this.renderLeaf = (text) => {
             const leaf = this.editor.renderLeaf(text);
-            return leaf ? leaf : null;
+            return leaf;
         };
         this.renderText = (text) => {
             for (const key in MarkTypes) {
                 if (text[MarkTypes[key]]) {
-                    return TheText;
+                    return TextFlavour;
                 }
             }
             if (text.text.length === 0) {
@@ -18652,7 +18674,7 @@ class TheEditorComponent {
                 useExisting: forwardRef(() => TheEditorComponent),
                 multi: true
             }
-        ], viewQueries: [{ propertyName: "templateInstance", first: true, predicate: ["templateInstance"], descendants: true, static: true }, { propertyName: "theEditableContainer", first: true, predicate: ["theEditableContainer"], descendants: true, read: ElementRef, static: true }, { propertyName: "globalToolbarInstance", first: true, predicate: ["globalToolbar"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (!options?.readonly && !theGlobalToolbar && !isMobileMode) {\n  <the-toolbar\n    [ngClass]=\"{\n      'the-toolbar-disabled': options?.disabled\n    }\"\n    #globalToolbar\n    [editor]=\"editor\"\n    [toolbarItems]=\"toolbarEntity.global\"\n    [containerClass]=\"globalToolbarClass\"\n    [align]=\"options?.toolbar?.align\"\n  ></the-toolbar>\n}\n\n<div\n  #theEditableContainer\n  class=\"the-editable-container\"\n  thyImageGroup\n  [ngClass]=\"{\n    'the-editor-disabled': options?.disabled,\n    'max-height': maxHeight\n  }\"\n  [ngStyle]=\"{ 'max-height': maxHeight }\"\n>\n  <slate-editable\n    class=\"the-editor-typo\"\n    [editor]=\"editor\"\n    [ngModel]=\"editorValue\"\n    [renderElement]=\"renderElement\"\n    [renderText]=\"renderText\"\n    [renderLeaf]=\"renderLeaf\"\n    [isStrictDecorate]=\"false\"\n    [decorate]=\"decorate\"\n    [placeholder]=\"options?.placeholder\"\n    [placeholderDecorate]=\"options?.placeholderDecorate ? options?.placeholderDecorate : null\"\n    [readonly]=\"options?.readonly || options?.disabled\"\n    [keydown]=\"onKeyDown\"\n    [click]=\"onClick\"\n    [paste]=\"onSlaPaste\"\n    [blur]=\"onSlaBlur\"\n    [focus]=\"onSlaFocus\"\n    [copy]=\"onSlaCopy\"\n    [cut]=\"onSlaCut\"\n    [beforeInput]=\"onSlaBeforeInput\"\n    [compositionStart]=\"onSlaCompositionStart\"\n    [compositionEnd]=\"onSlaCompositionEnd\"\n    [dragStart]=\"onSlaDragStart\"\n    [dragOver]=\"onSlaDragOver\"\n    [drop]=\"onDrop\"\n    [scrollSelectionIntoView]=\"scrollSelectionIntoView\"\n    (ngModelChange)=\"valueChange($event)\"\n    (mousedown)=\"mousedown($event)\"\n  ></slate-editable>\n\n  @if (!isMobileMode) {\n    @if (!options?.readonly && options?.inlineToolbarVisible) {\n      <the-inline-toolbar [editor]=\"editor\" [toolbarItems]=\"toolbarEntity.inline\"></the-inline-toolbar>\n    }\n    @if (!options?.readonly) {\n      <div theQuickInsert [editor]=\"editor\" [isVisible]=\"visibleQuickInsertPlus\"></div>\n    }\n  }\n\n  <the-template #templateInstance></the-template>\n</div>\n", dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SlateModule }, { kind: "component", type: i4.SlateEditable, selector: "slate-editable", inputs: ["editor", "renderElement", "renderLeaf", "renderText", "decorate", "placeholderDecorate", "scrollSelectionIntoView", "isStrictDecorate", "trackBy", "readonly", "placeholder", "beforeInput", "blur", "click", "compositionEnd", "compositionUpdate", "compositionStart", "copy", "cut", "dragOver", "dragStart", "dragEnd", "drop", "focus", "keydown", "paste", "spellCheck", "autoCorrect", "autoCapitalize"] }, { kind: "component", type: TheTemplate, selector: "the-template,[theTemplate]" }, { kind: "component", type: TheQuickInsert, selector: "[theQuickInsert]", inputs: ["editor", "isVisible"] }, { kind: "component", type: TheInlineToolbar, selector: "the-inline-toolbar", inputs: ["editor", "toolbarItems"] }, { kind: "component", type: TheToolbarComponent, selector: "the-toolbar", inputs: ["editor", "toolbarItems", "align", "containerClass", "isMore", "afterTemplate"] }, { kind: "component", type: ThyImageGroup, selector: "thy-image-group, [thyImageGroup]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "theEditableContainer", first: true, predicate: ["theEditableContainer"], descendants: true, read: ElementRef, static: true }, { propertyName: "globalToolbarInstance", first: true, predicate: ["globalToolbar"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (!options?.readonly && !theGlobalToolbar && !isMobileMode) {\n  <the-toolbar\n    [ngClass]=\"{\n      'the-toolbar-disabled': options?.disabled\n    }\"\n    #globalToolbar\n    [editor]=\"editor\"\n    [toolbarItems]=\"toolbarEntity.global\"\n    [containerClass]=\"globalToolbarClass\"\n    [align]=\"options?.toolbar?.align\"\n  ></the-toolbar>\n}\n\n<div\n  #theEditableContainer\n  class=\"the-editable-container\"\n  thyImageGroup\n  [ngClass]=\"{\n    'the-editor-disabled': options?.disabled,\n    'max-height': maxHeight\n  }\"\n  [ngStyle]=\"{ 'max-height': maxHeight }\"\n>\n  <slate-editable\n    class=\"the-editor-typo\"\n    [editor]=\"editor\"\n    [ngModel]=\"editorValue\"\n    [renderElement]=\"renderElement\"\n    [renderText]=\"renderText\"\n    [renderLeaf]=\"renderLeaf\"\n    [isStrictDecorate]=\"false\"\n    [decorate]=\"decorate\"\n    [placeholder]=\"options?.placeholder\"\n    [placeholderDecorate]=\"options?.placeholderDecorate ? options?.placeholderDecorate : null\"\n    [readonly]=\"options?.readonly || options?.disabled\"\n    [keydown]=\"onKeyDown\"\n    [click]=\"onClick\"\n    [paste]=\"onSlaPaste\"\n    [blur]=\"onSlaBlur\"\n    [focus]=\"onSlaFocus\"\n    [copy]=\"onSlaCopy\"\n    [cut]=\"onSlaCut\"\n    [beforeInput]=\"onSlaBeforeInput\"\n    [compositionStart]=\"onSlaCompositionStart\"\n    [compositionEnd]=\"onSlaCompositionEnd\"\n    [dragStart]=\"onSlaDragStart\"\n    [dragOver]=\"onSlaDragOver\"\n    [drop]=\"onDrop\"\n    [scrollSelectionIntoView]=\"scrollSelectionIntoView\"\n    (ngModelChange)=\"valueChange($event)\"\n    (mousedown)=\"mousedown($event)\"\n  ></slate-editable>\n\n  @if (!isMobileMode) {\n    @if (!options?.readonly && options?.inlineToolbarVisible) {\n      <the-inline-toolbar [editor]=\"editor\" [toolbarItems]=\"toolbarEntity.inline\"></the-inline-toolbar>\n    }\n    @if (!options?.readonly) {\n      <div theQuickInsert [editor]=\"editor\" [isVisible]=\"visibleQuickInsertPlus\"></div>\n    }\n  }\n</div>\n", dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: SlateModule }, { kind: "component", type: i4.SlateEditable, selector: "slate-editable", inputs: ["editor", "renderElement", "renderLeaf", "renderText", "decorate", "placeholderDecorate", "scrollSelectionIntoView", "isStrictDecorate", "trackBy", "readonly", "placeholder", "beforeInput", "blur", "click", "compositionEnd", "compositionUpdate", "compositionStart", "copy", "cut", "dragOver", "dragStart", "dragEnd", "drop", "focus", "keydown", "paste", "spellCheck", "autoCorrect", "autoCapitalize"] }, { kind: "component", type: TheQuickInsert, selector: "[theQuickInsert]", inputs: ["editor", "isVisible"] }, { kind: "component", type: TheInlineToolbar, selector: "the-inline-toolbar", inputs: ["editor", "toolbarItems"] }, { kind: "component", type: TheToolbarComponent, selector: "the-toolbar", inputs: ["editor", "toolbarItems", "align", "containerClass", "isMore", "afterTemplate"] }, { kind: "component", type: ThyImageGroup, selector: "thy-image-group, [thyImageGroup]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TheEditorComponent, decorators: [{
             type: Component,
@@ -18660,17 +18682,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                         class: 'the-editor',
                         '[class.the-editor-readonly]': 'editor.options?.readonly',
                         '[class.the-mobile-editor]': 'isMobileMode'
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
-                        NgStyle,
-                        NgClass,
-                        FormsModule,
-                        SlateModule,
-                        TheTemplate,
-                        TheQuickInsert,
-                        TheInlineToolbar,
-                        TheToolbarComponent,
-                        ThyImageGroup
-                    ], providers: [
+                    }, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgStyle, NgClass, FormsModule, SlateModule, TheQuickInsert, TheInlineToolbar, TheToolbarComponent, ThyImageGroup], providers: [
                         TheContextService,
                         {
                             provide: TheToolbarGroupToken,
@@ -18681,7 +18693,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                             useExisting: forwardRef(() => TheEditorComponent),
                             multi: true
                         }
-                    ], template: "@if (!options?.readonly && !theGlobalToolbar && !isMobileMode) {\n  <the-toolbar\n    [ngClass]=\"{\n      'the-toolbar-disabled': options?.disabled\n    }\"\n    #globalToolbar\n    [editor]=\"editor\"\n    [toolbarItems]=\"toolbarEntity.global\"\n    [containerClass]=\"globalToolbarClass\"\n    [align]=\"options?.toolbar?.align\"\n  ></the-toolbar>\n}\n\n<div\n  #theEditableContainer\n  class=\"the-editable-container\"\n  thyImageGroup\n  [ngClass]=\"{\n    'the-editor-disabled': options?.disabled,\n    'max-height': maxHeight\n  }\"\n  [ngStyle]=\"{ 'max-height': maxHeight }\"\n>\n  <slate-editable\n    class=\"the-editor-typo\"\n    [editor]=\"editor\"\n    [ngModel]=\"editorValue\"\n    [renderElement]=\"renderElement\"\n    [renderText]=\"renderText\"\n    [renderLeaf]=\"renderLeaf\"\n    [isStrictDecorate]=\"false\"\n    [decorate]=\"decorate\"\n    [placeholder]=\"options?.placeholder\"\n    [placeholderDecorate]=\"options?.placeholderDecorate ? options?.placeholderDecorate : null\"\n    [readonly]=\"options?.readonly || options?.disabled\"\n    [keydown]=\"onKeyDown\"\n    [click]=\"onClick\"\n    [paste]=\"onSlaPaste\"\n    [blur]=\"onSlaBlur\"\n    [focus]=\"onSlaFocus\"\n    [copy]=\"onSlaCopy\"\n    [cut]=\"onSlaCut\"\n    [beforeInput]=\"onSlaBeforeInput\"\n    [compositionStart]=\"onSlaCompositionStart\"\n    [compositionEnd]=\"onSlaCompositionEnd\"\n    [dragStart]=\"onSlaDragStart\"\n    [dragOver]=\"onSlaDragOver\"\n    [drop]=\"onDrop\"\n    [scrollSelectionIntoView]=\"scrollSelectionIntoView\"\n    (ngModelChange)=\"valueChange($event)\"\n    (mousedown)=\"mousedown($event)\"\n  ></slate-editable>\n\n  @if (!isMobileMode) {\n    @if (!options?.readonly && options?.inlineToolbarVisible) {\n      <the-inline-toolbar [editor]=\"editor\" [toolbarItems]=\"toolbarEntity.inline\"></the-inline-toolbar>\n    }\n    @if (!options?.readonly) {\n      <div theQuickInsert [editor]=\"editor\" [isVisible]=\"visibleQuickInsertPlus\"></div>\n    }\n  }\n\n  <the-template #templateInstance></the-template>\n</div>\n" }]
+                    ], template: "@if (!options?.readonly && !theGlobalToolbar && !isMobileMode) {\n  <the-toolbar\n    [ngClass]=\"{\n      'the-toolbar-disabled': options?.disabled\n    }\"\n    #globalToolbar\n    [editor]=\"editor\"\n    [toolbarItems]=\"toolbarEntity.global\"\n    [containerClass]=\"globalToolbarClass\"\n    [align]=\"options?.toolbar?.align\"\n  ></the-toolbar>\n}\n\n<div\n  #theEditableContainer\n  class=\"the-editable-container\"\n  thyImageGroup\n  [ngClass]=\"{\n    'the-editor-disabled': options?.disabled,\n    'max-height': maxHeight\n  }\"\n  [ngStyle]=\"{ 'max-height': maxHeight }\"\n>\n  <slate-editable\n    class=\"the-editor-typo\"\n    [editor]=\"editor\"\n    [ngModel]=\"editorValue\"\n    [renderElement]=\"renderElement\"\n    [renderText]=\"renderText\"\n    [renderLeaf]=\"renderLeaf\"\n    [isStrictDecorate]=\"false\"\n    [decorate]=\"decorate\"\n    [placeholder]=\"options?.placeholder\"\n    [placeholderDecorate]=\"options?.placeholderDecorate ? options?.placeholderDecorate : null\"\n    [readonly]=\"options?.readonly || options?.disabled\"\n    [keydown]=\"onKeyDown\"\n    [click]=\"onClick\"\n    [paste]=\"onSlaPaste\"\n    [blur]=\"onSlaBlur\"\n    [focus]=\"onSlaFocus\"\n    [copy]=\"onSlaCopy\"\n    [cut]=\"onSlaCut\"\n    [beforeInput]=\"onSlaBeforeInput\"\n    [compositionStart]=\"onSlaCompositionStart\"\n    [compositionEnd]=\"onSlaCompositionEnd\"\n    [dragStart]=\"onSlaDragStart\"\n    [dragOver]=\"onSlaDragOver\"\n    [drop]=\"onDrop\"\n    [scrollSelectionIntoView]=\"scrollSelectionIntoView\"\n    (ngModelChange)=\"valueChange($event)\"\n    (mousedown)=\"mousedown($event)\"\n  ></slate-editable>\n\n  @if (!isMobileMode) {\n    @if (!options?.readonly && options?.inlineToolbarVisible) {\n      <the-inline-toolbar [editor]=\"editor\" [toolbarItems]=\"toolbarEntity.inline\"></the-inline-toolbar>\n    }\n    @if (!options?.readonly) {\n      <div theQuickInsert [editor]=\"editor\" [isVisible]=\"visibleQuickInsertPlus\"></div>\n    }\n  }\n</div>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.DestroyRef }, { type: i0.ElementRef }, { type: i0.Injector }, { type: i0.NgZone }, { type: i0.ViewContainerRef }, { type: TheContextService }, { type: i2$5.ThyIconRegistry }, { type: undefined, decorators: [{
                     type: Optional
                 }, {
@@ -18705,9 +18717,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                 type: Output
             }], theUploadingStatus: [{
                 type: Output
-            }], templateInstance: [{
-                type: ViewChild,
-                args: ['templateInstance', { static: true }]
             }], theEditableContainer: [{
                 type: ViewChild,
                 args: ['theEditableContainer', { static: true, read: ElementRef }]
@@ -18982,5 +18991,5 @@ const withTestPlugin = (plugins, initValue) => {
  * Generated bundle index. Do not edit.
  */
 
-export { ALIGN_BLOCK_TYPES, A_TAG_REL_ATTR, AlignEditor, Alignment, BLOCK_DELETE_BACKWARD_TYPES, BLOCK_HIDDEN_CLASS, BasicTest, BlockquoteEditor, CLIPBOARD_FORMAT_KEY, CODEMIRROR_PADDING_TOP, CODE_MODES, CONTAINER_BLOCKS, CONTROL_KEY, CodeEditor, ColorEditor, ColumnResizeNotifierSource, ColumnResizingStore, DEFAULT_LANGUAGE, DEFAULT_SCROLL_CONTAINER, DISABLED_OPERATE_TYPES, DataTransferFaker, DefaultElementOptions, DefaultGlobalToolbarDefinition, DefaultInlineToolbarDefinition, DropdownMode, ELEMENT_UNIQUE_ID, EditorPresetConfigFactoryMock, ElementKinds, ErrorCodes, FontSizeTypes, FontSizes, HEADING_TYPES, HeaderLevelMap, HeadingEditor, HoveredCellInfo, HrEditor, IS_MAC, ImageEditor, IndentEditor, Indents, InlineCodeEditor, LINK_DEFAULT_TEXT, LIST_BLOCK_TYPES, LOWEST_TEXT_CONTAINER_TYPES, LayoutTypes, LinkEditor, ListEditor, MarkEditor, MarkProps, MarkTypes, MentionEditor, PICTURE_ACCEPTED_UPLOAD_MIME, PICTURE_ACCEPTED_UPLOAD_SIZE, PluginKeys, PluginMenuIcons, PluginMenuSvgs, Position, QUICK_INSERT_HOTKEY, QuickInsertEditor, ResizeRef, SLA_TABLE_CELL_SELECTOR, SLA_TABLE_SELECTOR, STANDARD_HEADING_TYPES, ScrollDirection, SpecialBackgroundColor, TAB_SPACE, THE_EDITOR_BG_COLOR, THE_EDITOR_COLOR, THE_EDITOR_CONVERSION_HINT_REF, THE_EDITOR_ORIGIN_ANCHOR, THE_EDITOR_POPOVER_REF, THE_EDITOR_PREVIOUS_SELECTION, THE_EDITOR_UUID, THE_I18N_DE_DE, THE_I18N_EN_US, THE_I18N_JA_JP, THE_I18N_LOCALE_ID, THE_I18N_RU_RU, THE_I18N_ZH_HANS, THE_I18N_ZH_HANT, THE_IMAGE_SERVICE_TOKEN, THE_LISTBOX_PARENT_GROUP_TOKEN, THE_LISTBOX_PARENT_OPTION_TOKEN, THE_LISTBOX_TOKEN, THE_MODE_PROVIDER, THE_MODE_TOKEN, THE_PLUGIN_MENU_REF, THE_PRESET_CONFIG_TOKEN, TableCellEventDispatcher, TableEditor, TableHeaderBackgroundColor, TablePosition, TheBaseElement, TheBaseSuggestion, TheBaseToolbarDropdown, TheBaseToolbarItem, TheColumnResizeDirective, TheColumnResizeOverlayHandle, TheContextMenu, TheContextService, TheConversionHint, TheDataMode, TheDefaultElement, TheEditor, TheEditorComponent, TheEditorModule, TheI18nService, TheImage, TheInlineToolbar, TheListboxDirective, TheListboxGroupDirective, TheListboxOptionDirective, TheLocaleType, TheMode, TheModeConfig, ThePluginMenu, ThePluginMenuComponent, ThePluginMenuItemType, ThePreventDefaultDirective, index$1 as TheQueries, TheQuickInsert, TheTableSelect, TheTemplate, TheText, TheToolbarComponent, TheToolbarDropdown, TheToolbarGroup, TheToolbarGroupToken, TheToolbarItem, TheToolbarService, index as TheTransforms, TodoItemEditor, ToolbarActionTypes, ToolbarAlignment, ToolbarItemType, ToolbarMoreGroup, VOID_BLOCK_TYPES, VerticalAlignEditor, VerticalAlignment, ZERO_WIDTH_CHAR, autoFocus, base64toBlob, bottomLeftPosition, bottomRightPosition, buildPluginMenu, buildPluginMenuItemMap, buildQuickInsertMenus, calcPrintColumnWidth, calcSpanForColumn, calcSpanForRow, calculateHeaderRowHeight, calculateRowControls, coercePixelsFromCssValue, combinePlugins, copyNode, createCell, createEmptyContent, createEmptyParagraph, createMentionPlugin, createPluginFactory, createRow, createTable, createTablePosition, createTest1Plugin, createTestPlugin, createToolbar, createVerticalAlignPlugin, customPluginMock, customPluginMockKey, dataDeserialize, dataSerializing, deDeLocale, deleteElementKey, enUsLocale, errorImageUrlMock, expandPreviousHeadings, extractFragment, extractFragmentByHTML, filterTextFormat, fixBlockWithoutParagraph, fixBlockWithoutText, flattenDeepPlugins, getCellPositionsFromRange, getCollapsedStandardHeadingAbove, getColsTotalWidth, getColumnsWidth, getDirtyElements, getEditorScrollContainer, getEditorUUID, getElementClassByPrefix, getElementHeight, getElementWidth, getEndBlock, getFollowElements, getGridColumns, getMode, getNextCell, getOriginCell, getPlugin, getPluginOptions, getPlugins, getPreviousRelatedHeadingElements, getRowsTotalHeight, getSelectCellNode, getSelectedCellPositions, getStartBlock, getTableByCell, getTableByRow, getTheDefaultPluginMenu, getToolbarClass, hasHeaderRow, headingOptions, htmlToTheia, idCreator, inValidTypes, initializeDefaultMenuIcons, injectTranslations, insertDataByInvalidType, internalPlugins, isCleanEmptyParagraph, isColorIndicator, isColorInput, isColorPanel, isDirectionKeydown, isHeadingElement, isInside, isMobileMode, isPrintMode, isPureEmptyParagraph, isRangeInTable, isRectangularInTableCells, isSelectedAllCell, isSelectionInTable, isStandardHeadingElement, isStandardHeadingElementByType, isUrl, isVirtualKey, jaJpLocale, matchOptions, mergeArray, mergeDeepPlugins, mergeElementOptions, mergeOptions, nestedStructureByKey, normalizeValue, originOptions, plainToTheia, pluginKey, pluginKey1, pluginsByKey, reSelection, recursionNodes, refocus, ruRuLocale, setClipboardDataByDom, setEditorUUID, theTethysIconRegistryFaker, toggleHeadingRelatedElement, topLeftPosition, topRightPosition, uniqueCellPosition, updatePopoverPosition, useElementStyle, withMention, withTestPlugin, withTheia, zhHansLocale, zhHantLocale };
+export { ALIGN_BLOCK_TYPES, A_TAG_REL_ATTR, AlignEditor, Alignment, BLOCK_DELETE_BACKWARD_TYPES, BLOCK_HIDDEN_CLASS, BasicTest, BlockquoteEditor, CLIPBOARD_FORMAT_KEY, CODEMIRROR_PADDING_TOP, CODE_MODES, CONTAINER_BLOCKS, CONTROL_KEY, CodeEditor, ColorEditor, ColumnResizeNotifierSource, ColumnResizingStore, DEFAULT_LANGUAGE, DEFAULT_SCROLL_CONTAINER, DISABLED_OPERATE_TYPES, DataTransferFaker, DefaultElementOptions, DefaultGlobalToolbarDefinition, DefaultInlineToolbarDefinition, DropdownMode, ELEMENT_UNIQUE_ID, EditorPresetConfigFactoryMock, ElementKinds, ErrorCodes, FontSizeTypes, FontSizes, HEADING_TYPES, HeaderLevelMap, HeadingEditor, HoveredCellInfo, HrEditor, IS_MAC, ImageEditor, IndentEditor, Indents, InlineCodeEditor, LINK_DEFAULT_TEXT, LIST_BLOCK_TYPES, LOWEST_TEXT_CONTAINER_TYPES, LayoutTypes, LinkEditor, ListEditor, MarkEditor, MarkProps, MarkTypes, MentionEditor, PICTURE_ACCEPTED_UPLOAD_MIME, PICTURE_ACCEPTED_UPLOAD_SIZE, PluginKeys, PluginMenuIcons, PluginMenuSvgs, Position, QUICK_INSERT_HOTKEY, QuickInsertEditor, ResizeRef, SLA_TABLE_CELL_SELECTOR, SLA_TABLE_SELECTOR, STANDARD_HEADING_TYPES, ScrollDirection, SpecialBackgroundColor, TAB_SPACE, THE_EDITOR_BG_COLOR, THE_EDITOR_COLOR, THE_EDITOR_CONVERSION_HINT_REF, THE_EDITOR_ORIGIN_ANCHOR, THE_EDITOR_POPOVER_REF, THE_EDITOR_PREVIOUS_SELECTION, THE_EDITOR_UUID, THE_I18N_DE_DE, THE_I18N_EN_US, THE_I18N_JA_JP, THE_I18N_LOCALE_ID, THE_I18N_RU_RU, THE_I18N_ZH_HANS, THE_I18N_ZH_HANT, THE_IMAGE_SERVICE_TOKEN, THE_LISTBOX_PARENT_GROUP_TOKEN, THE_LISTBOX_PARENT_OPTION_TOKEN, THE_LISTBOX_TOKEN, THE_MODE_PROVIDER, THE_MODE_TOKEN, THE_PLUGIN_MENU_REF, THE_PRESET_CONFIG_TOKEN, TableCellEventDispatcher, TableEditor, TableHeaderBackgroundColor, TablePosition, TheBaseElement, TheBaseSuggestion, TheBaseToolbarDropdown, TheBaseToolbarItem, TheColumnResizeDirective, TheColumnResizeOverlayHandle, TheContextMenu, TheContextService, TheConversionHint, TheDataMode, TheEditor, TheEditorComponent, TheEditorModule, TheI18nService, TheImage, TheInlineToolbar, TheListboxDirective, TheListboxGroupDirective, TheListboxOptionDirective, TheLocaleType, TheMode, TheModeConfig, ThePluginMenu, ThePluginMenuComponent, ThePluginMenuItemType, ThePreventDefaultDirective, index$1 as TheQueries, TheQuickInsert, TheTableSelect, TheToolbarComponent, TheToolbarDropdown, TheToolbarGroup, TheToolbarGroupToken, TheToolbarItem, TheToolbarService, index as TheTransforms, TodoItemEditor, ToolbarActionTypes, ToolbarAlignment, ToolbarItemType, ToolbarMoreGroup, VOID_BLOCK_TYPES, VerticalAlignEditor, VerticalAlignment, ZERO_WIDTH_CHAR, autoFocus, base64toBlob, bottomLeftPosition, bottomRightPosition, buildPluginMenu, buildPluginMenuItemMap, buildQuickInsertMenus, calcPrintColumnWidth, calcSpanForColumn, calcSpanForRow, calculateHeaderRowHeight, calculateRowControls, coercePixelsFromCssValue, combinePlugins, copyNode, createCell, createEmptyContent, createEmptyParagraph, createMentionPlugin, createPluginFactory, createRow, createTable, createTablePosition, createTest1Plugin, createTestPlugin, createToolbar, createVerticalAlignPlugin, customPluginMock, customPluginMockKey, dataDeserialize, dataSerializing, deDeLocale, deleteElementKey, enUsLocale, errorImageUrlMock, expandPreviousHeadings, extractFragment, extractFragmentByHTML, filterTextFormat, fixBlockWithoutParagraph, fixBlockWithoutText, flattenDeepPlugins, getCellPositionsFromRange, getCollapsedStandardHeadingAbove, getColsTotalWidth, getColumnsWidth, getDirtyElements, getEditorScrollContainer, getEditorUUID, getElementClassByPrefix, getElementHeight, getElementWidth, getEndBlock, getFollowElements, getGridColumns, getMode, getNextCell, getOriginCell, getPlugin, getPluginOptions, getPlugins, getPreviousRelatedHeadingElements, getRowsTotalHeight, getSelectCellNode, getSelectedCellPositions, getStartBlock, getTableByCell, getTableByRow, getTheDefaultPluginMenu, getToolbarClass, hasHeaderRow, headingOptions, htmlToTheia, idCreator, inValidTypes, initializeDefaultMenuIcons, injectTranslations, insertDataByInvalidType, internalPlugins, isCleanEmptyParagraph, isColorIndicator, isColorInput, isColorPanel, isDirectionKeydown, isHeadingElement, isInside, isMobileMode, isPrintMode, isPureEmptyParagraph, isRangeInTable, isRectangularInTableCells, isSelectedAllCell, isSelectionInTable, isStandardHeadingElement, isStandardHeadingElementByType, isUrl, isVirtualKey, jaJpLocale, matchOptions, mergeArray, mergeDeepPlugins, mergeElementOptions, mergeOptions, nestedStructureByKey, normalizeValue, originOptions, plainToTheia, pluginKey, pluginKey1, pluginsByKey, reSelection, recursionNodes, refocus, ruRuLocale, setClipboardDataByDom, setEditorUUID, theTethysIconRegistryFaker, toggleHeadingRelatedElement, topLeftPosition, topRightPosition, uniqueCellPosition, updatePopoverPosition, useElementStyle, withMention, withTestPlugin, withTheia, zhHansLocale, zhHantLocale };
 //# sourceMappingURL=worktile-theia.mjs.map