@worktile/theia 15.0.11 → 15.0.13

package/fesm2020/worktile-theia.mjs

@@ -25,12 +25,10 @@ import * as i8 from 'ngx-tethys/tooltip';
 import { ThyTooltipModule } from 'ngx-tethys/tooltip';
 import * as i8$1 from 'ngx-tethys/divider';
 import { ThyDividerComponent, ThyDividerModule } from 'ngx-tethys/divider';
-import * as i2$2 from '@angular/cdk/scrolling';
-import { CdkScrollable, ScrollingModule } from '@angular/cdk/scrolling';
 import { mixinUnsubscribe, MixinBase, ScrollToService } from 'ngx-tethys/core';
 import { isKeyHotkey, isHotkey } from 'is-hotkey';
 import { Subject, fromEvent, timer, combineLatest, Observable, BehaviorSubject, merge, ReplaySubject } from 'rxjs';
-import { takeUntil, debounceTime, take, delay, map as map$1, skip, filter, startWith, distinctUntilChanged, share, mapTo, pairwise } from 'rxjs/operators';
+import { takeUntil, debounceTime, take, delay, map as map$1, filter, startWith, distinctUntilChanged, skip, share, mapTo, pairwise } from 'rxjs/operators';
 import * as i5 from 'ngx-tethys/input';
 import { ThyInputModule } from 'ngx-tethys/input';
 import * as i10 from 'ngx-tethys/empty';
@@ -63,6 +61,8 @@ import * as i7$1 from 'ngx-tethys/input-number';
 import { ThyInputNumberModule } from 'ngx-tethys/input-number';
 import { coerceCssPixelValue } from '@angular/cdk/coercion';
 import { PortalInjector, ComponentPortal } from '@angular/cdk/portal';
+import * as i2$2 from '@angular/cdk/scrolling';
+import { ScrollingModule } from '@angular/cdk/scrolling';
 import { ThyAutocompleteModule } from 'ngx-tethys/autocomplete';
 import { ThyAvatarModule } from 'ngx-tethys/avatar';
 import { ThyDialogModule } from 'ngx-tethys/dialog';
@@ -215,6 +215,11 @@ var Indents;
     Indents["indentRight"] = "indent-right";
     Indents["indentLeft"] = "indent-left";
 })(Indents || (Indents = {}));
+var ScrollDirection;
+(function (ScrollDirection) {
+    ScrollDirection[ScrollDirection["X"] = 0] = "X";
+    ScrollDirection[ScrollDirection["Y"] = 1] = "Y";
+})(ScrollDirection || (ScrollDirection = {}));
 var MarkTypes;
 (function (MarkTypes) {
     MarkTypes["bold"] = "bold";
@@ -3156,6 +3161,7 @@ class TheContextService {
         this.containerScrolled$ = new Subject();
         this.uploadingStatus$ = new Subject();
         this.containerResized$ = new Subject();
+        this.windowResized$ = new Subject();
         this.ngZone.runOutsideAngular(() => {
             this.onMouseUp$ = fromEvent(window, `mouseup`).pipe(takeUntil(this.destroy$));
             this.onMouseMove$ = fromEvent(window, `mousemove`).pipe(takeUntil(this.destroy$));
@@ -3166,6 +3172,7 @@ class TheContextService {
         this.options = options;
         this.rebindContainerScroll();
         this.bindContainerResize();
+        this.bindWindowResize();
     }
     rebindContainerScroll() {
         this.scrollSubscription?.unsubscribe();
@@ -3174,16 +3181,33 @@ class TheContextService {
                 this.options.nativeElement.querySelector(this.options.theOptions?.scrollContainer);
             if (containerElement) {
                 this.ngZone.runOutsideAngular(() => {
+                    let previousContainerScroll = { x: 0, y: 0 };
                     this.scrollSubscription = fromEvent(containerElement, 'scroll').subscribe(event => {
-                        this.containerScrolled$.next(event);
+                        const entires = { event, direction: ScrollDirection.Y };
+                        const target = event.target;
+                        const [x, y] = [target.scrollLeft, target.scrollTop];
+                        if (x !== previousContainerScroll.x) {
+                            entires.direction = ScrollDirection.X;
+                        }
+                        if (y !== previousContainerScroll.y) {
+                            entires.direction = ScrollDirection.Y;
+                        }
+                        previousContainerScroll = { x, y };
+                        this.containerScrolled$.next(entires);
                     });
                 });
             }
         }
     }
     bindContainerResize() {
-        let previousContainerRect = this.options.nativeElement.getBoundingClientRect();
-        this.resizeObserver = new ResizeObserver(entires => {
+        this.containerResizeObserver = this.elementResize(this.options.nativeElement, this.containerResized$);
+    }
+    bindWindowResize() {
+        this.windowResizeObserver = this.elementResize(document.documentElement, this.windowResized$);
+    }
+    elementResize(element, subject) {
+        let previousContainerRect = element.getBoundingClientRect();
+        const resizeObserver = new ResizeObserver(entires => {
             const currentRect = entires[0].contentRect;
             const result = { entry: entires[0], widthChanged: false, heightChanged: false };
             if (currentRect.width !== previousContainerRect.width) {
@@ -3193,9 +3217,10 @@ class TheContextService {
                 result.heightChanged = true;
             }
             previousContainerRect = currentRect;
-            this.containerResized$.next(result);
+            subject.next(result);
         });
-        return this.resizeObserver.observe(this.options.nativeElement);
+        resizeObserver.observe(element);
+        return resizeObserver;
     }
     getOptions() {
         if (!this.options.width) {
@@ -3227,7 +3252,9 @@ class TheContextService {
         this.uploadingStatus$.complete();
         this.containerScrolled$?.complete();
         this.containerResized$?.complete();
-        this.resizeObserver.disconnect();
+        this.containerResizeObserver?.disconnect();
+        this.windowResized$?.complete();
+        this.windowResizeObserver?.disconnect();
         this.scrollSubscription?.unsubscribe();
         this.destroy$.next();
         this.destroy$.complete();
@@ -3404,7 +3431,7 @@ const TABLE_INSERT_MASK$1 = 19;
 const TABLE_BORDER$1 = 1;
 const TABLE_PADDING$1 = 8;
 const TABLE_CONTROL = 11;
-const TABLE_NUMBER_COLUMN = 45;
+const TABLE_NUMBER_COLUMN = 44;
 const TableWithStickyRowClass = 'the-table-with-sticky-row';
 var FullscreenState;
 (function (FullscreenState) {
@@ -10710,7 +10737,7 @@ const PaintFormatEditor = {
         const element = EDITOR_TO_ELEMENT.get(editor);
         element.classList.add('pointer-paint');
         contextService.onMouseUp$
-            .pipe(skip(1), filter(event => element.contains(event.target)), take(1))
+            .pipe(filter(event => element.contains(event.target)), take(1))
             .subscribe((event) => {
             if (contextService.paintFormatStatus.isActive) {
                 PaintFormatEditor.formatBrush(editor);
@@ -12514,10 +12541,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
         }] });
 
 /**
- * 设置标题行网格列
+ * 获取标题行网格列宽值
  * @param editor
  * @param headerRow 标题行
- * @param cellRow
+ * @param cellsWidth
  * @returns string
  */
 const getGridColumns = (headerRow, cellsWidth) => {
@@ -12749,6 +12776,11 @@ class TheTableComponent extends TheBaseElementComponent {
         this.destroy$ = new Subject();
         this.rowControls = [];
         this.colControls = [];
+        this.getColControlButtonWidth = () => {
+            let result = 0;
+            result += this.element.options?.numberedColumn ? TABLE_NUMBER_COLUMN : 0;
+            return result;
+        };
     }
     get columns() {
         return this.element && this.element.columns;
@@ -12779,6 +12811,7 @@ class TheTableComponent extends TheBaseElementComponent {
                 this.useRowControls();
                 this.setHeaderCellStyle();
                 this.setHeaderRowShadow();
+                this.setHeaderRowLeftStyle();
                 this.cdr.markForCheck();
             });
             this.getIsInTable();
@@ -12866,32 +12899,42 @@ class TheTableComponent extends TheBaseElementComponent {
                 this.cdr.markForCheck();
             }
             this.setHeaderCellStyle();
+            const { left } = this.nativeElement.getBoundingClientRect();
+            this.tableRectLeft = left;
             this.subscribeScrollContainerScroll();
             this.contextService.containerResized$.pipe(takeUntil(this.destroy$)).subscribe(result => {
                 if (result.widthChanged) {
-                    this.setHeaderRowStyle();
+                    this.setGridColumnsStyle();
+                    this.setStickyRowStyle();
                     this.bindTableScrollingShadow();
                 }
             });
+            this.contextService.windowResized$.pipe(takeUntil(this.destroy$)).subscribe(result => {
+                if (result.widthChanged) {
+                    this.setHeaderRowShadow();
+                    this.setHeaderRowLeftStyle();
+                }
+            });
         });
     }
     /* 给标题行的左/右加阴影 */
     setHeaderRowShadow() {
         // 固定标题行遮盖
-        this.tableWrapper.nativeElement.style.zIndex = this.isStickyTop ? '3' : '0';
-        const headerRowRightShadow = this.headerRowRightShadow.nativeElement;
-        const headerRowLeftShadow = this.headerRowLeftShadow.nativeElement;
+        this.renderer.setStyle(this.tableWrapper.nativeElement, 'z-index', this.isStickyTop ? '3' : '0');
         if (this.isLeftShadow || this.isRightShadow) {
             let { height, top } = this.calcHeaderRowShadow();
-            let { left, width } = this.tableWrapper.nativeElement.getBoundingClientRect();
-            if (this.isRightShadow) {
-                headerRowRightShadow.style.height = height + 'px';
-                headerRowRightShadow.style.top = top + 'px';
-                headerRowRightShadow.style.left = left + width - 8 + 'px';
+            let { left, width } = this.nativeElement.getBoundingClientRect();
+            if (this.isRightShadow && this.headerRowRightShadow) {
+                const headerRowRightShadow = this.headerRowRightShadow.nativeElement;
+                this.renderer.setStyle(headerRowRightShadow, 'height', `${height}px`);
+                this.renderer.setStyle(headerRowRightShadow, 'top', `${top}px`);
+                this.renderer.setStyle(headerRowRightShadow, 'left', `${left + width - 8}px`);
             }
-            if (this.isLeftShadow) {
-                headerRowLeftShadow.style.height = height + 'px';
-                headerRowLeftShadow.style.top = top + 'px';
+            if (this.isLeftShadow && this.headerRowLeftShadow) {
+                const headerRowLeftShadow = this.headerRowLeftShadow.nativeElement;
+                this.renderer.setStyle(headerRowLeftShadow, 'height', `${height}px`);
+                this.renderer.setStyle(headerRowLeftShadow, 'top', `${top}px`);
+                this.renderer.setStyle(headerRowLeftShadow, 'left', `${left + this.getColControlButtonWidth()}px`);
             }
         }
     }
@@ -12910,20 +12953,28 @@ class TheTableComponent extends TheBaseElementComponent {
     subscribeScrollContainerScroll() {
         this.ngZone.runOutsideAngular(() => {
             this.contextService.containerScrolled$
-                .pipe(takeUntil(this.destroy$), map$1(event => {
-                this.scrollContainerTop = event.target.getBoundingClientRect().top;
-                const clientRect = this.theTableElement.nativeElement.getBoundingClientRect();
-                const headerTopHeight = this.isInTable ? -19 : 11;
-                const headerRowHeight = this.calculateRowControls()[0]?.height;
-                const top = clientRect.top + headerTopHeight;
-                this.isStickyTop =
-                    top <= this.scrollContainerTop + 8 &&
-                        clientRect.bottom - this.scrollContainerTop >= headerRowHeight &&
-                        this.freezeRowPipe.transform(this.element, this.headerRow, this.tablePluginOptions);
-                // 标题行内容超过固定高度时移除冻结
-                if (this.isStickyTop) {
-                    const maxHeaderRowHeight = (24 + 8) * 11; // 超出 11 行，取消冻结
-                    this.isStickyTop = headerRowHeight <= maxHeaderRowHeight;
+                .pipe(takeUntil(this.destroy$), map$1(entires => {
+                const { event, direction } = entires;
+                if (direction === ScrollDirection.X) {
+                    const { left } = this.nativeElement.getBoundingClientRect();
+                    this.isScrollX = this.tableRectLeft !== left;
+                    this.setHeaderRowLeftStyle();
+                }
+                if (direction === ScrollDirection.Y) {
+                    this.scrollContainerTop = event.target.getBoundingClientRect().top;
+                    const clientRect = this.theTableElement.nativeElement.getBoundingClientRect();
+                    const headerTopHeight = this.isInTable ? -19 : 11;
+                    const headerRowHeight = this.calculateRowControls()[0]?.height;
+                    const top = clientRect.top + headerTopHeight;
+                    this.isStickyTop =
+                        top <= this.scrollContainerTop + 8 &&
+                            clientRect.bottom - this.scrollContainerTop >= headerRowHeight &&
+                            this.freezeRowPipe.transform(this.element, this.headerRow, this.tablePluginOptions);
+                    // 标题行内容超过固定高度时移除冻结
+                    if (this.isStickyTop) {
+                        const maxHeaderRowHeight = (24 + 8) * 11; // 超出 11 行，取消冻结
+                        this.isStickyTop = headerRowHeight <= maxHeaderRowHeight;
+                    }
                 }
                 return this.isStickyTop;
             }), distinctUntilChanged())
@@ -12987,6 +13038,7 @@ class TheTableComponent extends TheBaseElementComponent {
         this.setGridColumnsStyle();
         this.setStickyRowStyle();
         this.setHeaderRowShadow();
+        this.setHeaderRowLeftStyle();
     }
     setGridColumnsStyle() {
         const colControl = this.columnControlsWrapper.nativeElement;
@@ -13026,6 +13078,7 @@ class TheTableComponent extends TheBaseElementComponent {
             const tablePaddingTop = headerRowHeight + 11; // 标题行高 + ctrl btn（11px）高度
             this.renderer.setStyle(this.theTableElement.nativeElement, 'padding-top', tablePaddingTop + 'px');
             this.renderer.setStyle(rowControlInner, 'padding-top', tablePaddingTop + 'px');
+            this.renderer.setStyle(this.tableRowControlsWrapper.nativeElement, 'z-index', '4');
         }
         else {
             this.renderer.removeClass(this.nativeElement, TableWithStickyRowClass);
@@ -13034,17 +13087,22 @@ class TheTableComponent extends TheBaseElementComponent {
             });
             this.renderer.setStyle(this.theTableElement.nativeElement, 'padding-top', null);
             this.renderer.setStyle(rowControlInner, 'padding-top', null);
+            this.renderer.setStyle(this.tableRowControlsWrapper.nativeElement, 'z-index', '1');
         }
-        // setTimeout： 需要等待 rowControls 在 dom 中渲染完毕后才能获取到 rowControlButton
-        if (this.initialized) {
-            this.setRowControlButtonStyle(numberedColumn);
+        const rowControlButton = this.rowControlsButtonWrapper.first?.nativeElement;
+        if (this.initialized && rowControlButton) {
+            this.setRowControlButtonStyle(rowControlButton);
         }
         else {
-            setTimeout(() => this.setRowControlButtonStyle(numberedColumn));
+            // setTimeout： 需要等待 rowControls 在 dom 中渲染完毕后才能获取到 rowControlButton
+            setTimeout(() => this.setRowControlButtonStyle(rowControlButton));
         }
     }
-    setRowControlButtonStyle(numberedColumn) {
-        const rowControlButton = this.rowControlsButtonWrapper.first?.nativeElement;
+    setRowControlButtonStyle(rowControlButton) {
+        const numberedColumn = this.element.options?.numberedColumn;
+        if (!rowControlButton) {
+            rowControlButton = this.rowControlsButtonWrapper.first?.nativeElement;
+        }
         if (this.isStickyTop) {
             if ((this.isInTable || numberedColumn) && rowControlButton) {
                 this.renderer.setStyle(rowControlButton, 'top', this.scrollContainerTop + 'px');
@@ -13239,9 +13297,16 @@ class TheTableComponent extends TheBaseElementComponent {
     }
     getDefaultCellWidth() {
         const tr = this.element.children[0];
-        const tableWidth = AngularEditor.toDOMNode(this.editor, tr).getBoundingClientRect().width;
+        let width = this.elementRef.nativeElement.getBoundingClientRect().width;
+        if (this.rowControlsInner) {
+            width -= this.rowControlsInner.nativeElement.getBoundingClientRect().width;
+            if (this.isCollapsedAndNonReadonly) {
+                // 聚焦之后会向左偏移一个 control（-11），见 .the-table-row-controls-wrapper
+                width += TABLE_CONTROL;
+            }
+        }
         return tr.children.map(cell => {
-            return Number((tableWidth / tr.children.length).toFixed(2));
+            return Number((width / tr.children.length).toFixed(2));
         });
     }
     initializeColumns() {
@@ -13408,7 +13473,7 @@ class TheTableComponent extends TheBaseElementComponent {
         const stickyRows = this.elementRef.nativeElement.querySelectorAll('.the-sticky-row');
         const setStickyRowPointerEvents = (pointerEventsStyle) => {
             for (const stiRow of stickyRows) {
-                stiRow.style.pointerEvents = pointerEventsStyle;
+                this.renderer.setStyle(stiRow, 'pointer-events', pointerEventsStyle);
             }
         };
         let timer;
@@ -13444,6 +13509,27 @@ class TheTableComponent extends TheBaseElementComponent {
             }
         }
     }
+    setHeaderRowLeftStyle() {
+        const stickyRows = this.elementRef.nativeElement.querySelectorAll('.the-sticky-row');
+        const cornerControl = this.cornerControl.nativeElement;
+        const rowControl = this.rowControlsButtonWrapper.first?.nativeElement;
+        const stickyElements = [...stickyRows, cornerControl, rowControl];
+        const { left } = this.nativeElement.getBoundingClientRect();
+        const buffer = this.isInTable ? -TABLE_CONTROL : 0;
+        if (this.isStickyTop && this.isScrollX) {
+            this.setHeaderRowShadow();
+            stickyRows.forEach((element) => {
+                this.renderer.setStyle(element, 'left', `${left + this.getColControlButtonWidth()}px`);
+            });
+            this.renderer.setStyle(cornerControl, 'left', `${left + buffer}px`);
+            rowControl && this.renderer.setStyle(rowControl, 'left', `${left + buffer}px`);
+        }
+        else {
+            stickyElements.forEach((element) => {
+                element && this.renderer.setStyle(element, 'left', null);
+            });
+        }
+    }
     trackByFnRowControls(index) {
         return index;
     }
@@ -13469,7 +13555,7 @@ TheTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", vers
             provide: THE_TABLE_COMPONENT_TOKEN,
             useExisting: TheTableComponent
         }
-    ], viewQueries: [{ propertyName: "tableWrapper", first: true, predicate: ["tableWrapper"], descendants: true, read: ElementRef, static: true }, { propertyName: "theTableElement", first: true, predicate: ["theTable"], descendants: true, read: ElementRef, static: true }, { propertyName: "tbodyElement", first: true, predicate: ["tbody"], descendants: true, read: ElementRef, static: true }, { propertyName: "columnControlsWrapper", first: true, predicate: ["columnControlsWrapper"], descendants: true, read: ElementRef }, { propertyName: "cornerControl", first: true, predicate: ["cornerControl"], descendants: true, read: ElementRef }, { propertyName: "rowControlsInner", first: true, predicate: ["rowControlsInner"], descendants: true, read: ElementRef }, { propertyName: "headerRowLeftShadow", first: true, predicate: ["headerRowLeftShadow"], descendants: true, read: ElementRef }, { propertyName: "headerRowRightShadow", first: true, predicate: ["headerRowRightShadow"], descendants: true, read: ElementRef }, { propertyName: "colgroup", first: true, predicate: ["colgroup"], descendants: true, read: ElementRef }, { propertyName: "rowControlsButtonWrapper", predicate: ["rowControlsButtonWrapper"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<div class=\"the-table-container\" theColumnResize>\n  <div class=\"the-table-row-controls-wrapper\">\n    <div\n      class=\"the-table-corner-controls the-sticky-corner-controls\"\n      #cornerControl\n      [ngClass]=\"{\n        visible: !readonly && (isInTable || tableStore.isRightClicking),\n        'control-active': isSelectedAllCell,\n        dangerous: tableStore.isSelectedTable && tableStore.dangerousCells.length > 0\n      }\"\n    >\n      <div class=\"the-table-corner-button\" (mousedown)=\"onSelectTable($event)\"></div>\n      <div class=\"the-table-corner-controls-insert-row-marker\" *ngIf=\"!headerRow\">\n        <the-table-insert-mark type=\"row\" [at]=\"0\" [tableStore]=\"tableStore\"></the-table-insert-mark>\n      </div>\n      <div class=\"the-table-corner-controls-insert-column-marker\" *ngIf=\"!element.options?.headerColumn\">\n        <the-table-insert-mark type=\"column\" [at]=\"0\" [tableStore]=\"tableStore\"></the-table-insert-mark>\n      </div>\n    </div>\n    <div class=\"the-table-row-controls\">\n      <div class=\"the-table-row-controls-inner\" #rowControlsInner>\n        <div\n          class=\"the-table-row-controls-button-wrap\"\n          #rowControlsButtonWrapper\n          *ngFor=\"let control of rowControls; let i = index; trackBy: trackByFnRowControls\"\n          [ngClass]=\"{\n            'control-active': tableStore.selectedRowsIndex.includes(control.rowIndex),\n            dangerous: tableStore.dangerousRowsIndex.includes(control.rowIndex) && tableStore.dangerousCells.length > 0\n          }\"\n        >\n          <ng-container *ngIf=\"!readonly && (isInTable || tableStore.isRightClicking) && !element?.options?.numberedColumn\">\n            <button\n              (mousedown)=\"onRowMousedown($event, control.rowIndex)\"\n              type=\"button\"\n              [ngStyle]=\"{ height: control.height + 1 + 'px' }\"\n              class=\"the-table-row-controls-button the-table-controls-button\"\n            ></button>\n          </ng-container>\n          <ng-container *ngIf=\"element?.options?.numberedColumn\">\n            <div\n              [contentEditable]=\"false\"\n              contenteditable=\"false\"\n              (mousedown)=\"onRowMousedown($event, control.rowIndex)\"\n              class=\"the-table-numbered-controls-button\"\n              [ngStyle]=\"{ height: control.height + 1 + 'px' }\"\n            >\n              <p class=\"row-number d-flex align-items-center\">{{ headerRow && i === 0 ? '' : headerRow ? i : i + 1 }}</p>\n            </div>\n          </ng-container>\n          <the-table-insert-mark type=\"row\" [at]=\"control.rowIndex + 1\" [tableStore]=\"tableStore\"> </the-table-insert-mark>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div class=\"the-table-wrapper\" #tableWrapper [ngClass]=\"{ 'the-table-numbered': element?.options?.numberedColumn }\">\n    <table class=\"the-table\" #theTable>\n      <colgroup #colgroup *ngIf=\"columns\">\n        <col *ngFor=\"let col of columns\" [ngStyle]=\"{ width: col.width + 'px' }\" />\n      </colgroup>\n      <thead>\n        <tr class=\"the-table-col-controls-wrapper the-sticky-row\" #columnControlsWrapper>\n          <th\n            #colControl\n            class=\"the-table-col-controls\"\n            *ngFor=\"let control of colControls; let i = index; trackBy: trackByFnColControls\"\n            [ngClass]=\"{\n              'control-active': tableStore.selectedColumnsIndex.includes(i),\n              dangerous: tableStore.dangerousColumnsIndex.includes(i) && tableStore.dangerousCells.length > 0\n            }\"\n            (mousedown)=\"onColMousedown($event, i)\"\n          >\n            <the-table-insert-mark\n              *ngIf=\"isInTable || tableStore.isRightClicking\"\n              type=\"column\"\n              [at]=\"i + 1\"\n              [tableStore]=\"tableStore\"\n              [parentElement]=\"colControl\"\n            >\n            </the-table-insert-mark>\n          </th>\n        </tr>\n      </thead>\n      <tbody #tbody>\n        <slate-children [children]=\"children\" [context]=\"childrenContext\" [viewContext]=\"viewContext\"> </slate-children>\n      </tbody>\n      <div class=\"header-row-shadow header-row-left-shadow\" #headerRowLeftShadow contenteditable=\"false\"></div>\n      <div class=\"header-row-shadow header-row-right-shadow\" #headerRowRightShadow contenteditable=\"false\"></div>\n    </table>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i1.SlateChildrenComponent, selector: "slate-children", inputs: ["children", "context", "viewContext"] }, { kind: "directive", type: TheColumnResizeDirective, selector: "div[theColumnResize]" }, { kind: "component", type: TheInsertMarkComponent, selector: "the-table-insert-mark", inputs: ["type", "at", "tableStore", "parentElement"] }] });
+    ], viewQueries: [{ propertyName: "tableWrapper", first: true, predicate: ["tableWrapper"], descendants: true, read: ElementRef, static: true }, { propertyName: "theTableElement", first: true, predicate: ["theTable"], descendants: true, read: ElementRef, static: true }, { propertyName: "tbodyElement", first: true, predicate: ["tbody"], descendants: true, read: ElementRef, static: true }, { propertyName: "tableRowControlsWrapper", first: true, predicate: ["tableRowControlsWrapper"], descendants: true, read: ElementRef }, { propertyName: "columnControlsWrapper", first: true, predicate: ["columnControlsWrapper"], descendants: true, read: ElementRef }, { propertyName: "cornerControl", first: true, predicate: ["cornerControl"], descendants: true, read: ElementRef }, { propertyName: "rowControlsInner", first: true, predicate: ["rowControlsInner"], descendants: true, read: ElementRef }, { propertyName: "headerRowLeftShadow", first: true, predicate: ["headerRowLeftShadow"], descendants: true, read: ElementRef }, { propertyName: "headerRowRightShadow", first: true, predicate: ["headerRowRightShadow"], descendants: true, read: ElementRef }, { propertyName: "colgroup", first: true, predicate: ["colgroup"], descendants: true, read: ElementRef }, { propertyName: "rowControlsButtonWrapper", predicate: ["rowControlsButtonWrapper"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<div class=\"the-table-container\" theColumnResize>\n  <div class=\"the-table-row-controls-wrapper\" #tableRowControlsWrapper>\n    <div\n      class=\"the-table-corner-controls the-sticky-corner-controls\"\n      #cornerControl\n      [ngClass]=\"{\n        visible: !readonly && (isInTable || tableStore.isRightClicking),\n        'control-active': isSelectedAllCell,\n        dangerous: tableStore.isSelectedTable && tableStore.dangerousCells.length > 0\n      }\"\n    >\n      <div class=\"the-table-corner-button\" (mousedown)=\"onSelectTable($event)\"></div>\n      <div class=\"the-table-corner-controls-insert-row-marker\" *ngIf=\"!headerRow\">\n        <the-table-insert-mark type=\"row\" [at]=\"0\" [tableStore]=\"tableStore\"></the-table-insert-mark>\n      </div>\n      <div class=\"the-table-corner-controls-insert-column-marker\" *ngIf=\"!element.options?.headerColumn\">\n        <the-table-insert-mark type=\"column\" [at]=\"0\" [tableStore]=\"tableStore\"></the-table-insert-mark>\n      </div>\n    </div>\n    <div class=\"the-table-row-controls\">\n      <div class=\"the-table-row-controls-inner\" #rowControlsInner>\n        <div\n          class=\"the-table-row-controls-button-wrap\"\n          #rowControlsButtonWrapper\n          *ngFor=\"let control of rowControls; let i = index; trackBy: trackByFnRowControls\"\n          [ngClass]=\"{\n            'control-active': tableStore.selectedRowsIndex.includes(control.rowIndex),\n            dangerous: tableStore.dangerousRowsIndex.includes(control.rowIndex) && tableStore.dangerousCells.length > 0\n          }\"\n        >\n          <ng-container *ngIf=\"!readonly && (isInTable || tableStore.isRightClicking) && !element?.options?.numberedColumn\">\n            <button\n              (mousedown)=\"onRowMousedown($event, control.rowIndex)\"\n              type=\"button\"\n              [ngStyle]=\"{ height: control.height + 1 + 'px' }\"\n              class=\"the-table-row-controls-button the-table-controls-button\"\n            ></button>\n          </ng-container>\n          <ng-container *ngIf=\"element?.options?.numberedColumn\">\n            <div\n              [contentEditable]=\"false\"\n              contenteditable=\"false\"\n              (mousedown)=\"onRowMousedown($event, control.rowIndex)\"\n              class=\"the-table-numbered-controls-button\"\n              [ngStyle]=\"{ height: control.height + 1 + 'px' }\"\n            >\n              <p class=\"row-number d-flex align-items-center\">{{ headerRow && i === 0 ? '' : headerRow ? i : i + 1 }}</p>\n            </div>\n          </ng-container>\n          <the-table-insert-mark type=\"row\" [at]=\"control.rowIndex + 1\" [tableStore]=\"tableStore\"> </the-table-insert-mark>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div class=\"the-table-wrapper\" #tableWrapper [ngClass]=\"{ 'the-table-numbered': element?.options?.numberedColumn }\">\n    <table class=\"the-table\" #theTable>\n      <colgroup #colgroup *ngIf=\"columns\">\n        <col *ngFor=\"let col of columns\" [ngStyle]=\"{ width: col.width + 'px' }\" />\n      </colgroup>\n      <thead>\n        <tr class=\"the-table-col-controls-wrapper the-sticky-row\" #columnControlsWrapper>\n          <th\n            #colControl\n            class=\"the-table-col-controls\"\n            *ngFor=\"let control of colControls; let i = index; trackBy: trackByFnColControls\"\n            [ngClass]=\"{\n              'control-active': tableStore.selectedColumnsIndex.includes(i),\n              dangerous: tableStore.dangerousColumnsIndex.includes(i) && tableStore.dangerousCells.length > 0\n            }\"\n            (mousedown)=\"onColMousedown($event, i)\"\n          >\n            <the-table-insert-mark\n              *ngIf=\"isInTable || tableStore.isRightClicking\"\n              type=\"column\"\n              [at]=\"i + 1\"\n              [tableStore]=\"tableStore\"\n              [parentElement]=\"colControl\"\n            >\n            </the-table-insert-mark>\n          </th>\n        </tr>\n      </thead>\n      <tbody #tbody>\n        <slate-children [children]=\"children\" [context]=\"childrenContext\" [viewContext]=\"viewContext\"> </slate-children>\n      </tbody>\n      <div\n        class=\"header-row-shadow header-row-left-shadow\"\n        #headerRowLeftShadow\n        contenteditable=\"false\"\n        *ngIf=\"!element.options?.headerColumn\"\n      ></div>\n      <div class=\"header-row-shadow header-row-right-shadow\" #headerRowRightShadow contenteditable=\"false\"></div>\n    </table>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i1.SlateChildrenComponent, selector: "slate-children", inputs: ["children", "context", "viewContext"] }, { kind: "directive", type: TheColumnResizeDirective, selector: "div[theColumnResize]" }, { kind: "component", type: TheInsertMarkComponent, selector: "the-table-insert-mark", inputs: ["type", "at", "tableStore", "parentElement"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImport: i0, type: TheTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'the-table, [theTable]', providers: [
@@ -13489,7 +13575,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
                         '[class.the-table-with-sticky-column]': 'freezeColumnPipe.transform(element, tablePluginOptions)',
                         '[class.the-numberd-table]': 'element?.options?.numberedColumn',
                         '[class.the-table-selection-hide]': 'tableStore.isCellSelecting || tableStore.isRightClicking'
-                    }, template: "<div class=\"the-table-container\" theColumnResize>\n  <div class=\"the-table-row-controls-wrapper\">\n    <div\n      class=\"the-table-corner-controls the-sticky-corner-controls\"\n      #cornerControl\n      [ngClass]=\"{\n        visible: !readonly && (isInTable || tableStore.isRightClicking),\n        'control-active': isSelectedAllCell,\n        dangerous: tableStore.isSelectedTable && tableStore.dangerousCells.length > 0\n      }\"\n    >\n      <div class=\"the-table-corner-button\" (mousedown)=\"onSelectTable($event)\"></div>\n      <div class=\"the-table-corner-controls-insert-row-marker\" *ngIf=\"!headerRow\">\n        <the-table-insert-mark type=\"row\" [at]=\"0\" [tableStore]=\"tableStore\"></the-table-insert-mark>\n      </div>\n      <div class=\"the-table-corner-controls-insert-column-marker\" *ngIf=\"!element.options?.headerColumn\">\n        <the-table-insert-mark type=\"column\" [at]=\"0\" [tableStore]=\"tableStore\"></the-table-insert-mark>\n      </div>\n    </div>\n    <div class=\"the-table-row-controls\">\n      <div class=\"the-table-row-controls-inner\" #rowControlsInner>\n        <div\n          class=\"the-table-row-controls-button-wrap\"\n          #rowControlsButtonWrapper\n          *ngFor=\"let control of rowControls; let i = index; trackBy: trackByFnRowControls\"\n          [ngClass]=\"{\n            'control-active': tableStore.selectedRowsIndex.includes(control.rowIndex),\n            dangerous: tableStore.dangerousRowsIndex.includes(control.rowIndex) && tableStore.dangerousCells.length > 0\n          }\"\n        >\n          <ng-container *ngIf=\"!readonly && (isInTable || tableStore.isRightClicking) && !element?.options?.numberedColumn\">\n            <button\n              (mousedown)=\"onRowMousedown($event, control.rowIndex)\"\n              type=\"button\"\n              [ngStyle]=\"{ height: control.height + 1 + 'px' }\"\n              class=\"the-table-row-controls-button the-table-controls-button\"\n            ></button>\n          </ng-container>\n          <ng-container *ngIf=\"element?.options?.numberedColumn\">\n            <div\n              [contentEditable]=\"false\"\n              contenteditable=\"false\"\n              (mousedown)=\"onRowMousedown($event, control.rowIndex)\"\n              class=\"the-table-numbered-controls-button\"\n              [ngStyle]=\"{ height: control.height + 1 + 'px' }\"\n            >\n              <p class=\"row-number d-flex align-items-center\">{{ headerRow && i === 0 ? '' : headerRow ? i : i + 1 }}</p>\n            </div>\n          </ng-container>\n          <the-table-insert-mark type=\"row\" [at]=\"control.rowIndex + 1\" [tableStore]=\"tableStore\"> </the-table-insert-mark>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div class=\"the-table-wrapper\" #tableWrapper [ngClass]=\"{ 'the-table-numbered': element?.options?.numberedColumn }\">\n    <table class=\"the-table\" #theTable>\n      <colgroup #colgroup *ngIf=\"columns\">\n        <col *ngFor=\"let col of columns\" [ngStyle]=\"{ width: col.width + 'px' }\" />\n      </colgroup>\n      <thead>\n        <tr class=\"the-table-col-controls-wrapper the-sticky-row\" #columnControlsWrapper>\n          <th\n            #colControl\n            class=\"the-table-col-controls\"\n            *ngFor=\"let control of colControls; let i = index; trackBy: trackByFnColControls\"\n            [ngClass]=\"{\n              'control-active': tableStore.selectedColumnsIndex.includes(i),\n              dangerous: tableStore.dangerousColumnsIndex.includes(i) && tableStore.dangerousCells.length > 0\n            }\"\n            (mousedown)=\"onColMousedown($event, i)\"\n          >\n            <the-table-insert-mark\n              *ngIf=\"isInTable || tableStore.isRightClicking\"\n              type=\"column\"\n              [at]=\"i + 1\"\n              [tableStore]=\"tableStore\"\n              [parentElement]=\"colControl\"\n            >\n            </the-table-insert-mark>\n          </th>\n        </tr>\n      </thead>\n      <tbody #tbody>\n        <slate-children [children]=\"children\" [context]=\"childrenContext\" [viewContext]=\"viewContext\"> </slate-children>\n      </tbody>\n      <div class=\"header-row-shadow header-row-left-shadow\" #headerRowLeftShadow contenteditable=\"false\"></div>\n      <div class=\"header-row-shadow header-row-right-shadow\" #headerRowRightShadow contenteditable=\"false\"></div>\n    </table>\n  </div>\n</div>\n" }]
+                    }, template: "<div class=\"the-table-container\" theColumnResize>\n  <div class=\"the-table-row-controls-wrapper\" #tableRowControlsWrapper>\n    <div\n      class=\"the-table-corner-controls the-sticky-corner-controls\"\n      #cornerControl\n      [ngClass]=\"{\n        visible: !readonly && (isInTable || tableStore.isRightClicking),\n        'control-active': isSelectedAllCell,\n        dangerous: tableStore.isSelectedTable && tableStore.dangerousCells.length > 0\n      }\"\n    >\n      <div class=\"the-table-corner-button\" (mousedown)=\"onSelectTable($event)\"></div>\n      <div class=\"the-table-corner-controls-insert-row-marker\" *ngIf=\"!headerRow\">\n        <the-table-insert-mark type=\"row\" [at]=\"0\" [tableStore]=\"tableStore\"></the-table-insert-mark>\n      </div>\n      <div class=\"the-table-corner-controls-insert-column-marker\" *ngIf=\"!element.options?.headerColumn\">\n        <the-table-insert-mark type=\"column\" [at]=\"0\" [tableStore]=\"tableStore\"></the-table-insert-mark>\n      </div>\n    </div>\n    <div class=\"the-table-row-controls\">\n      <div class=\"the-table-row-controls-inner\" #rowControlsInner>\n        <div\n          class=\"the-table-row-controls-button-wrap\"\n          #rowControlsButtonWrapper\n          *ngFor=\"let control of rowControls; let i = index; trackBy: trackByFnRowControls\"\n          [ngClass]=\"{\n            'control-active': tableStore.selectedRowsIndex.includes(control.rowIndex),\n            dangerous: tableStore.dangerousRowsIndex.includes(control.rowIndex) && tableStore.dangerousCells.length > 0\n          }\"\n        >\n          <ng-container *ngIf=\"!readonly && (isInTable || tableStore.isRightClicking) && !element?.options?.numberedColumn\">\n            <button\n              (mousedown)=\"onRowMousedown($event, control.rowIndex)\"\n              type=\"button\"\n              [ngStyle]=\"{ height: control.height + 1 + 'px' }\"\n              class=\"the-table-row-controls-button the-table-controls-button\"\n            ></button>\n          </ng-container>\n          <ng-container *ngIf=\"element?.options?.numberedColumn\">\n            <div\n              [contentEditable]=\"false\"\n              contenteditable=\"false\"\n              (mousedown)=\"onRowMousedown($event, control.rowIndex)\"\n              class=\"the-table-numbered-controls-button\"\n              [ngStyle]=\"{ height: control.height + 1 + 'px' }\"\n            >\n              <p class=\"row-number d-flex align-items-center\">{{ headerRow && i === 0 ? '' : headerRow ? i : i + 1 }}</p>\n            </div>\n          </ng-container>\n          <the-table-insert-mark type=\"row\" [at]=\"control.rowIndex + 1\" [tableStore]=\"tableStore\"> </the-table-insert-mark>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div class=\"the-table-wrapper\" #tableWrapper [ngClass]=\"{ 'the-table-numbered': element?.options?.numberedColumn }\">\n    <table class=\"the-table\" #theTable>\n      <colgroup #colgroup *ngIf=\"columns\">\n        <col *ngFor=\"let col of columns\" [ngStyle]=\"{ width: col.width + 'px' }\" />\n      </colgroup>\n      <thead>\n        <tr class=\"the-table-col-controls-wrapper the-sticky-row\" #columnControlsWrapper>\n          <th\n            #colControl\n            class=\"the-table-col-controls\"\n            *ngFor=\"let control of colControls; let i = index; trackBy: trackByFnColControls\"\n            [ngClass]=\"{\n              'control-active': tableStore.selectedColumnsIndex.includes(i),\n              dangerous: tableStore.dangerousColumnsIndex.includes(i) && tableStore.dangerousCells.length > 0\n            }\"\n            (mousedown)=\"onColMousedown($event, i)\"\n          >\n            <the-table-insert-mark\n              *ngIf=\"isInTable || tableStore.isRightClicking\"\n              type=\"column\"\n              [at]=\"i + 1\"\n              [tableStore]=\"tableStore\"\n              [parentElement]=\"colControl\"\n            >\n            </the-table-insert-mark>\n          </th>\n        </tr>\n      </thead>\n      <tbody #tbody>\n        <slate-children [children]=\"children\" [context]=\"childrenContext\" [viewContext]=\"viewContext\"> </slate-children>\n      </tbody>\n      <div\n        class=\"header-row-shadow header-row-left-shadow\"\n        #headerRowLeftShadow\n        contenteditable=\"false\"\n        *ngIf=\"!element.options?.headerColumn\"\n      ></div>\n      <div class=\"header-row-shadow header-row-right-shadow\" #headerRowRightShadow contenteditable=\"false\"></div>\n    </table>\n  </div>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: TableCellEventDispatcher }, { type: ColumnResizeNotifierSource }, { type: TableStore }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: TableService }, { type: TheTableContextMenuService }, { type: TableFreezeColumnPipe }, { type: TableFreezeRowPipe }, { type: i0.Renderer2 }, { type: TheContextService }]; }, propDecorators: { tableWrapper: [{
                 type: ViewChild,
                 args: ['tableWrapper', { read: ElementRef, static: true }]
@@ -13499,6 +13585,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.0", ngImpor
             }], tbodyElement: [{
                 type: ViewChild,
                 args: ['tbody', { read: ElementRef, static: true }]
+            }], tableRowControlsWrapper: [{
+                type: ViewChild,
+                args: ['tableRowControlsWrapper', { read: ElementRef, static: false }]
             }], columnControlsWrapper: [{
                 type: ViewChild,
                 args: ['columnControlsWrapper', { read: ElementRef, static: false }]
@@ -14018,16 +14107,16 @@ class TheTdComponent extends TheBaseElementComponent {
         return this.tableComponent.theTableElement.nativeElement;
     }
     get scrollableElementTop() {
-        const cdkscrollable = this.elementRef.nativeElement.closest('[cdkscrollable]');
-        if (cdkscrollable) {
-            return cdkscrollable.getBoundingClientRect().top;
+        const containerElement = this.elementRef.nativeElement.closest(this.editor.options?.scrollContainer || DEFAULT_SCROLL_CONTAINER);
+        if (containerElement) {
+            return containerElement.getBoundingClientRect().top;
         }
         return -window.scrollY;
     }
     get scrollableElementBottom() {
-        const cdkscrollable = this.elementRef.nativeElement.closest('[cdkscrollable]');
-        if (cdkscrollable) {
-            return cdkscrollable.getBoundingClientRect().bottom;
+        const containerElement = this.elementRef.nativeElement.closest(this.editor.options?.scrollContainer || DEFAULT_SCROLL_CONTAINER);
+        if (containerElement) {
+            return containerElement.getBoundingClientRect().bottom;
         }
         return -window.scrollY;
     }
@@ -15772,7 +15861,6 @@ class TheEditorComponent extends mixinUnsubscribe(MixinBase) {
     }
     ngOnInit() {
         this.initialize();
-        this.initCdkScroll();
         initializeDefaultMenuIcons(this.iconRegistry);
         this.theContextService.uploadingStatus$.subscribe(isUploading => {
             if (isUploading) {
@@ -15804,9 +15892,6 @@ class TheEditorComponent extends mixinUnsubscribe(MixinBase) {
     ngOnDestroy() {
         super.ngOnDestroy();
         THE_EDITOR_PREVIOUS_SELECTION.delete(this.editor);
-        if (this.cdkScrollable) {
-            this.cdkScrollable.ngOnDestroy();
-        }
     }
     initialize() {
         const defaultPlugins = internalPlugins();
@@ -15836,13 +15921,6 @@ class TheEditorComponent extends mixinUnsubscribe(MixinBase) {
             this.visibleQuickInsertPlus = false;
         }
     }
-    initCdkScroll() {
-        if (this.maxHeight) {
-            this.cdkScrollable = new CdkScrollable(this.theEditableContainer, this.scrollDispatcher, this.ngZone);
-            this.cdkScrollable.ngOnInit();
-            this.theEditableContainer.nativeElement.setAttribute('cdkScrollable', '');
-        }
-    }
     initializeOptions() {
         if (!this.theOptions) {
             this.theOptions = {
@@ -16324,5 +16402,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, BackgroundColors, BlockquoteEditor, CLIPBOARD_FORMAT_KEY, CODEMIRROR_PADDING_TOP, CODE_MODES, COMPONENTS, CONTAINER_BLOCKS, CONTROL_KEY, CodeEditor, ColorEditor, Colors, ColumnResizeNotifierSource, DEFAULT_LANGUAGE, DEFAULT_SCROLL_CONTAINER, DISABLED_OPERATE_TYPES, DefaultElementOptions, DefaultGlobalToolbarDefinition, DefaultInlineToolbarDefinition, DefaultPluginMenu, DropdownMode, ELEMENT_UNIQUE_ID, ElementKinds, ErrorCodes, FontSizeTypes, FontSizes, HEADING_TYPES, HeadingEditor, HoveredCellInfo, HrEditor, IS_MAC, ImageEditor, IndentEditor, Indents, InlineCodeEditor, LINK_DEFAULT_TEXT, LIST_BLOCK_TYPES, LayoutTypes, LinkEditor, ListEditor, MarkEditor, MarkProps, MarkTypes, MentionEditor, PICTURE_ACCEPTED_UPLOAD_MIME, PICTURE_ACCEPTED_UPLOAD_SIZE, PLUGIN_COMPONENTS, PluginKeys, PluginMenuIcons, PluginMenuSvgs, Position, QuickInsertEditor, STANDARD_HEADING_TYPES, SpecialBackgroundColor, SpecialTextColor, TAB_SPACE, THE_EDITOR_CONVERSION_HINT_REF, THE_EDITOR_ORIGIN_ANCHOR, THE_EDITOR_POPOVER_REF, THE_EDITOR_PREVIOUS_SELECTION, THE_EDITOR_UUID, THE_INLINE_TOOLBAR_TYPES, THE_LISTBOX_PARENT_GROUP_TOKEN, THE_LISTBOX_PARENT_OPTION_TOKEN, THE_LISTBOX_TOKEN, THE_MODE_PROVIDER, THE_MODE_TOKEN, THE_PLUGIN_MENU_REF, THE_UPLOAD_SERVICE_TOKEN, TableCellEventDispatcher, TableEditor, TableHeaderBackgroundColor, TheBaseElementComponent, TheBaseSuggestion, TheBaseToolbarDropdown, TheBaseToolbarItem, TheContextService, TheDataMode, TheDefaultElementComponent, TheEditor, TheEditorComponent, TheEditorModule, TheImageComponent, TheListboxDirective, TheListboxGroupDirective, TheListboxOptionDirective, TheMode, TheModeConfig, ThePluginMenu, ThePluginMenuComponent, ThePluginMenuItemType, ThePreventDefaultDirective, index$1 as TheQueries, TheToolbarComponent, TheToolbarDropdownComponent, TheToolbarGroupComponent, TheToolbarGroupToken, TheToolbarItemComponent, TheToolbarService, index as TheTransforms, TodoItemEditor, ToolbarActionTypes, ToolbarAlignment, ToolbarItemType, ToolbarMoreGroup, VOID_BLOCK_TYPES, VerticalAlignEditor, VerticalAlignment, ZERO_WIDTH_CHAR, autoFocus, base64toBlob, buildPluginMenu, buildPluginMenuItemMap, coercePixelsFromCssValue, combinePlugins, copyNode, copyNodeForSafari, createEmptyParagraph, createMentionPlugin, createPluginFactory, createToolbar, createVerticalAlignPlugin, dataDeserialize, dataSerializing, deleteElementKey, extractFragment, filterTextFormat, flattenDeepPlugins, getColsTotalWidth, getEditorUUID, getElementClassByPrefix, getElementHeight, getElementWidth, getEndBlock, getPlugin, getPluginOptions, getPlugins, getRowsTotalHeight, getStartBlock, getToolbarClass, headingOptions, htmlToTheia, idCreator, inValidTypes, initializeDefaultMenuIcons, internalPlugins, isCleanEmptyParagraph, isDirectionKeydown, isPureEmptyParagraph, mergeArray, mergeDeepPlugins, mergeElementOptions, mergeOptions, nestedStructureByKey, plainToTheia, pluginsByKey, reSelection, recursionNodes, refocus, scrollIntoView, setEditorUUID, useElementStyle, withMention, withTestPlugin, withTheia };
+export { ALIGN_BLOCK_TYPES, A_TAG_REL_ATTR, AlignEditor, Alignment, BLOCK_DELETE_BACKWARD_TYPES, BackgroundColors, BlockquoteEditor, CLIPBOARD_FORMAT_KEY, CODEMIRROR_PADDING_TOP, CODE_MODES, COMPONENTS, CONTAINER_BLOCKS, CONTROL_KEY, CodeEditor, ColorEditor, Colors, ColumnResizeNotifierSource, DEFAULT_LANGUAGE, DEFAULT_SCROLL_CONTAINER, DISABLED_OPERATE_TYPES, DefaultElementOptions, DefaultGlobalToolbarDefinition, DefaultInlineToolbarDefinition, DefaultPluginMenu, DropdownMode, ELEMENT_UNIQUE_ID, ElementKinds, ErrorCodes, FontSizeTypes, FontSizes, HEADING_TYPES, HeadingEditor, HoveredCellInfo, HrEditor, IS_MAC, ImageEditor, IndentEditor, Indents, InlineCodeEditor, LINK_DEFAULT_TEXT, LIST_BLOCK_TYPES, LayoutTypes, LinkEditor, ListEditor, MarkEditor, MarkProps, MarkTypes, MentionEditor, PICTURE_ACCEPTED_UPLOAD_MIME, PICTURE_ACCEPTED_UPLOAD_SIZE, PLUGIN_COMPONENTS, PluginKeys, PluginMenuIcons, PluginMenuSvgs, Position, QuickInsertEditor, STANDARD_HEADING_TYPES, ScrollDirection, SpecialBackgroundColor, SpecialTextColor, TAB_SPACE, THE_EDITOR_CONVERSION_HINT_REF, THE_EDITOR_ORIGIN_ANCHOR, THE_EDITOR_POPOVER_REF, THE_EDITOR_PREVIOUS_SELECTION, THE_EDITOR_UUID, THE_INLINE_TOOLBAR_TYPES, THE_LISTBOX_PARENT_GROUP_TOKEN, THE_LISTBOX_PARENT_OPTION_TOKEN, THE_LISTBOX_TOKEN, THE_MODE_PROVIDER, THE_MODE_TOKEN, THE_PLUGIN_MENU_REF, THE_UPLOAD_SERVICE_TOKEN, TableCellEventDispatcher, TableEditor, TableHeaderBackgroundColor, TheBaseElementComponent, TheBaseSuggestion, TheBaseToolbarDropdown, TheBaseToolbarItem, TheContextService, TheDataMode, TheDefaultElementComponent, TheEditor, TheEditorComponent, TheEditorModule, TheImageComponent, TheListboxDirective, TheListboxGroupDirective, TheListboxOptionDirective, TheMode, TheModeConfig, ThePluginMenu, ThePluginMenuComponent, ThePluginMenuItemType, ThePreventDefaultDirective, index$1 as TheQueries, TheToolbarComponent, TheToolbarDropdownComponent, TheToolbarGroupComponent, TheToolbarGroupToken, TheToolbarItemComponent, TheToolbarService, index as TheTransforms, TodoItemEditor, ToolbarActionTypes, ToolbarAlignment, ToolbarItemType, ToolbarMoreGroup, VOID_BLOCK_TYPES, VerticalAlignEditor, VerticalAlignment, ZERO_WIDTH_CHAR, autoFocus, base64toBlob, buildPluginMenu, buildPluginMenuItemMap, coercePixelsFromCssValue, combinePlugins, copyNode, copyNodeForSafari, createEmptyParagraph, createMentionPlugin, createPluginFactory, createToolbar, createVerticalAlignPlugin, dataDeserialize, dataSerializing, deleteElementKey, extractFragment, filterTextFormat, flattenDeepPlugins, getColsTotalWidth, getEditorUUID, getElementClassByPrefix, getElementHeight, getElementWidth, getEndBlock, getPlugin, getPluginOptions, getPlugins, getRowsTotalHeight, getStartBlock, getToolbarClass, headingOptions, htmlToTheia, idCreator, inValidTypes, initializeDefaultMenuIcons, internalPlugins, isCleanEmptyParagraph, isDirectionKeydown, isPureEmptyParagraph, mergeArray, mergeDeepPlugins, mergeElementOptions, mergeOptions, nestedStructureByKey, plainToTheia, pluginsByKey, reSelection, recursionNodes, refocus, scrollIntoView, setEditorUUID, useElementStyle, withMention, withTestPlugin, withTheia };
 //# sourceMappingURL=worktile-theia.mjs.map