@worktile/theia 2.4.2 → 2.4.5

package/fesm2015/worktile-theia.js

@@ -54,7 +54,7 @@ import { ThySharedModule } from 'ngx-tethys/shared';
 import * as i1$6 from 'ngx-tethys';
 import { coerceCssPixelValue } from '@angular/cdk/coercion';
 import { PortalInjector, ComponentPortal } from '@angular/cdk/portal';
-import * as i2$3 from 'ngx-tethys/list';
+import * as i1$7 from 'ngx-tethys/list';
 import { ThyListModule } from 'ngx-tethys/list';
 import { ThyAutocompleteModule } from 'ngx-tethys/autocomplete';
 import { ThyAvatarModule } from 'ngx-tethys/avatar';
@@ -1317,6 +1317,30 @@ const getContainerBlocks = (editor) => {
     return !containerNode ? CONTAINER_BLOCKS : [...CONTAINER_BLOCKS, containerNode[0].type];
 };
 
+const getDirectlyParent = (editor) => {
+    const [, anchorPath] = getBlockAbove(editor);
+    if (!anchorPath)
+        return;
+    const parentEntry = getParent(editor, anchorPath);
+    if (!parentEntry)
+        return;
+    return parentEntry;
+};
+
+const isTypesInParent = (editor, types) => {
+    if (!Array.isArray(types)) {
+        types = [types];
+    }
+    const [, anchorPath] = getBlockAbove(editor);
+    if (!anchorPath)
+        return false;
+    const parentEntry = Editor.above(editor, { match: n => types.includes(n.type) });
+    if (!parentEntry)
+        return false;
+    const [parentNode] = parentEntry;
+    return types.includes(parentNode.type);
+};
+
 var index$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
     getLastNode: getLastNode,
@@ -1344,6 +1368,7 @@ var index$1 = /*#__PURE__*/Object.freeze({
     getPlainText: getPlainText,
     getSelectionMarks: getSelectionMarks,
     getContainerBlocks: getContainerBlocks,
+    getDirectlyParent: getDirectlyParent,
     isAncestor: isAncestor,
     isCollapsed: isCollapsed,
     isEmptyParagraph: isEmptyParagraph,
@@ -1366,6 +1391,7 @@ var index$1 = /*#__PURE__*/Object.freeze({
     isEmptyContent: isEmptyContent,
     isEmptyParagraphByPath: isEmptyParagraphByPath,
     isContainer: isContainer,
+    isTypesInParent: isTypesInParent,
     anchorBlock: anchorBlock,
     anchorBlockEntry: anchorBlockEntry,
     anchorInlineEntry: anchorInlineEntry,
@@ -1377,11 +1403,32 @@ var index$1 = /*#__PURE__*/Object.freeze({
 });
 
 const insertElementNext = (editor, node) => {
+    var _a;
     if (Range.isExpanded(editor.selection)) {
         Editor.deleteFragment(editor);
     }
-    const anchorBlockPath = anchorBlockEntry(editor)[1];
-    const isEmpty = isEmptyParagraph(editor);
+    const allowContainerOperateTypes = ((_a = editor.options) === null || _a === void 0 ? void 0 : _a.allowContainerOperateTypes) || [];
+    const isAllowContainerInsert = isTypesInParent(editor, allowContainerOperateTypes);
+    const isBlockCardCursor$1 = isBlockCardCursor(editor);
+    const containerBlocks = getContainerBlocks(editor);
+    const isContainer = isNodeTypeIn(editor, containerBlocks, { at: editor.selection });
+    const [anchorBlock, anchorBlockPath] = anchorBlockEntry(editor);
+    const isEmpty = Editor.isEmpty(editor, anchorBlock);
+    if (isAllowContainerInsert && isContainer && !isBlockCardCursor$1) {
+        const [, containerPath] = Editor.above(editor, {
+            match: n => Editor.isBlock(editor, n) && allowContainerOperateTypes.includes(n.type),
+            at: editor.selection
+        });
+        Editor.withoutNormalizing(editor, () => {
+            const containerPathFirstPath = anchorBlockPath.slice(0, containerPath.length + 1);
+            Transforms.insertNodes(editor, node, { at: Path.next(containerPathFirstPath) });
+            Transforms.select(editor, Editor.start(editor, Path.next(containerPathFirstPath)));
+            if (isEmpty) {
+                Transforms.removeNodes(editor, { at: anchorBlockPath });
+            }
+        });
+        return;
+    }
     const nextPath = Path.next([anchorBlockPath[0]]);
     Transforms.insertNodes(editor, node, { at: nextPath });
     if (isEmpty && anchorBlockPath.length === 1) {
@@ -1737,6 +1784,9 @@ const isCleanEmptyParagraph = (editor) => {
         return false;
     }
     const block = Node.ancestor(editor, [editor.selection.anchor.path[0]]);
+    return isPureEmptyParagraph(editor, block);
+};
+const isPureEmptyParagraph = (editor, block) => {
     const textIndent = 'textIndent';
     const align = 'align';
     const hasTextIndent = block[textIndent];
@@ -3532,10 +3582,11 @@ const withList = ({ validLiChildrenTypes } = {}) => (editor) => {
 };
 
 class TheTodoItemComponent extends TheBaseElementComponent {
-    constructor(elementRef, cdr) {
+    constructor(elementRef, cdr, ctxService) {
         super(elementRef, cdr);
         this.elementRef = elementRef;
         this.cdr = cdr;
+        this.ctxService = ctxService;
         this.checkItemClass = true;
     }
     get level() {
@@ -3546,13 +3597,18 @@ class TheTodoItemComponent extends TheBaseElementComponent {
         super.ngOnInit();
     }
     onCheck(checked) {
-        if (this.readonly) {
+        const options = this.ctxService.getTheOptions();
+        const noBindReadonly = options.noBindReadonlyPlugins && options.noBindReadonlyPlugins.includes(ElementKinds.checkItem);
+        if (!noBindReadonly && this.readonly) {
             return false;
         }
+        else {
+            setNode(this.editor, { checked }, this.element);
+        }
         setNode(this.editor, { checked }, this.element);
     }
 }
-TheTodoItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: TheTodoItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+TheTodoItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: TheTodoItemComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: TheContextService }], target: i0.ɵɵFactoryTarget.Component });
 TheTodoItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", type: TheTodoItemComponent, selector: "div[theTodoItem]", host: { properties: { "class.the-check-item": "this.checkItemClass", "attr.the-level": "this.level" } }, usesInheritance: true, ngImport: i0, template: `
         <span contenteditable="false" class="todo-item-status">
             <input #checkbox type="checkbox" [checked]="element.checked" (click)="onCheck(checkbox.checked)" />
@@ -3570,7 +3626,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImpo
         <span><slate-children [children]="children" [context]="childrenContext" [viewContext]="viewContext"></slate-children></span>
     `
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { checkItemClass: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: TheContextService }]; }, propDecorators: { checkItemClass: [{
                 type: HostBinding,
                 args: ['class.the-check-item']
             }], level: [{
@@ -8700,7 +8756,7 @@ class TableService {
             offset: this.offset,
             hasBackdrop: this.hasBackdrop,
             insideClosable: this.insideClosable,
-            panelClass: 'the-table-toolbar-wrap',
+            panelClass: 'the-temp-table-toolbar-wrap',
             scrollStrategy: this.overlay.scrollStrategies.reposition(),
             manualClosure: true
         });
@@ -8710,15 +8766,15 @@ class TableService {
         if (origin instanceof HTMLTableCellElement && origin.tagName !== 'TH') {
             const { selectedRowsIndex, selectedColumnsIndex, focusCellPath, isSelectedTable, focusCellElement } = this.tableStore;
             const [row, col] = focusCellPath.slice(-2);
-            const tableElement = focusCellElement.closest('.the-table-container');
+            const tableElement = focusCellElement.closest('.the-temp-table-container');
             if (isSelectedTable && col === 0 && row === 0) {
-                return tableElement.querySelector('.the-table-corner-controls');
+                return tableElement.querySelector('.the-temp-table-corner-controls');
             }
             if (selectedColumnsIndex.length > 0 && row === 0) {
-                return tableElement.querySelectorAll('.the-table-col-controls')[col];
+                return tableElement.querySelectorAll('.the-temp-table-col-controls')[col];
             }
             if (selectedRowsIndex.length > 0 && col === 0) {
-                return tableElement.querySelectorAll('.the-table-row-controls-button-wrap')[row];
+                return tableElement.querySelectorAll('.the-temp-table-row-controls-button-wrap')[row];
             }
         }
         return origin;
@@ -8819,13 +8875,13 @@ class TheInsertMarkComponent {
             const tableWrapper = tableComponent.tableWrapper.nativeElement;
             const tableElement = tableComponent.theTableElement.nativeElement;
             let result = 0;
-            const rowControl = tableComponent.nativeElement.querySelector('.the-table-row-controls');
+            const rowControl = tableComponent.nativeElement.querySelector('.the-temp-table-row-controls');
             let rowControlWidth = 11;
             if (rowControl) {
                 rowControlWidth = rowControl.getBoundingClientRect().width;
             }
             if (this.type === 'row') {
-                result = tableWrapper.offsetWidth + rowControlWidth;
+                result = tableWrapper.offsetWidth + rowControlWidth - 2;
             }
             else {
                 result = tableElement.offsetHeight - 1;
@@ -8836,7 +8892,7 @@ class TheInsertMarkComponent {
     ngOnDestroy() { }
 }
 TheInsertMarkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: TheInsertMarkComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-TheInsertMarkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", type: TheInsertMarkComponent, selector: "the-table-insert-mark", inputs: { type: "type", at: "at", tableStore: "tableStore" }, ngImport: i0, template: "<div\n    [thyTooltip]=\"!disabled && tooltipContent\"\n    class=\"the-table-controls-insert-wrapper\"\n    [ngClass]=\"{ disabled: disabled }\"\n    contenteditable=\"false\"\n    (mousedown)=\"onMouseDown($event)\"\n    (mouseenter)=\"onMouseEnter($event)\"\n    (mouseleave)=\"onMouseLeave($event)\"\n>\n    <div\n        class=\"the-table-controls-insert-line\"\n        *ngIf=\"dotWrapperHovered\"\n        [attr.data-dot-type]=\"type\"\n        [ngStyle]=\"{ height: type === 'column' && insertLength, width: type === 'row' && insertLength }\"\n    ></div>\n</div>\n", directives: [{ type: i5.ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+TheInsertMarkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", type: TheInsertMarkComponent, selector: "the-table-insert-mark", inputs: { type: "type", at: "at", tableStore: "tableStore" }, ngImport: i0, template: "<div\n    [thyTooltip]=\"!disabled && tooltipContent\"\n    class=\"the-temp-table-controls-insert-wrapper\"\n    [ngClass]=\"{ disabled: disabled }\"\n    contenteditable=\"false\"\n    (mousedown)=\"onMouseDown($event)\"\n    (mouseenter)=\"onMouseEnter($event)\"\n    (mouseleave)=\"onMouseLeave($event)\"\n>\n    <div\n        class=\"the-temp-table-controls-insert-line\"\n        *ngIf=\"dotWrapperHovered\"\n        [attr.data-dot-type]=\"type\"\n        [ngStyle]=\"{ height: type === 'column' && insertLength, width: type === 'row' && insertLength }\"\n    ></div>\n</div>\n", directives: [{ type: i5.ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: TheInsertMarkComponent, decorators: [{
             type: Component,
             args: [{
@@ -9315,7 +9371,7 @@ TheTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", vers
             provide: TheTableToken,
             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 }], usesInheritance: true, ngImport: i0, template: "<div\n    class=\"the-table-container\"\n    theColumnResize\n    [ngClass]=\"{\n        'the-table-with-controls': isInTable,\n        'the-numbered-column-container': element?.options?.numberedColumn,\n        'the-table-selection-hide': tableStore.isCellSelecting || tableStore.isRightClicking\n    }\"\n>\n    <div\n        class=\"the-table-row-controls-wrapper\"\n        [ngClass]=\"{\n            'the-table-focus': isInTable\n        }\"\n    >\n        <div\n            class=\"the-table-corner-controls\"\n            [ngClass]=\"{\n                visible: !readonly && isInTable,\n                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\">\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\">\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\">\n                <div\n                    class=\"the-table-row-controls-button-wrap\"\n                    *ngFor=\"let control of rowControls; let i = index; trackBy: trackByFnRowCotrols\"\n                    [ngClass]=\"{\n                        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 && !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\">{{ 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 [ngClass]=\"{ 'the-table-with-controls': isInTable }\">\n            <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\">\n                    <th\n                        class=\"the-table-col-controls\"\n                        [ngClass]=\"{\n                            active: tableStore.selectedColumnsIndex.includes(i),\n                            dangerous: tableStore.dangerousColumnsIndex.includes(i) && tableStore.dangerousCells.length > 0\n                        }\"\n                        (mousedown)=\"onColMouseDown($event, i)\"\n                        *ngFor=\"let control of colControls; let i = index; trackBy: trackByFnColCotrols\"\n                    >\n                        <the-table-insert-mark *ngIf=\"isInTable\" type=\"column\" [at]=\"i + 1\" [tableStore]=\"tableStore\">\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        </table>\n    </div>\n</div>\n", components: [{ type: TheInsertMarkComponent, selector: "the-table-insert-mark", inputs: ["type", "at", "tableStore"] }, { type: i1.SlateChildrenComponent, selector: "slate-children", inputs: ["children", "context", "viewContext"] }], directives: [{ type: TheColumnResizeDirective, selector: "div[theColumnResize]" }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    ], 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 }], usesInheritance: true, ngImport: i0, template: "<!-- \u7C7B\u540D the-temp-*: \u4E34\u65F6\u89E3\u51B3\u56E0\u53D7portal\u5F71\u54CD\u8868\u683C\u6837\u5F0F\u95EE\u9898\uFF0C\u540E\u671F\u6539\u56DEthe-* -->\n<div\n    class=\"the-temp-table-container\"\n    theColumnResize\n    [ngClass]=\"{\n        'the-temp-table-with-controls': isInTable,\n        'the-temp-numbered-column-container': element?.options?.numberedColumn,\n        'the-temp-table-selection-hide': tableStore.isCellSelecting || tableStore.isRightClicking\n    }\"\n>\n    <div\n        class=\"the-temp-table-row-controls-wrapper\"\n        [ngClass]=\"{\n            'the-temp-table-focus': isInTable\n        }\"\n    >\n        <div\n            class=\"the-temp-table-corner-controls\"\n            [ngClass]=\"{\n                visible: !readonly && isInTable,\n                active: isSelectedAllCell,\n                dangerous: tableStore.isSelectedTable && tableStore.dangerousCells.length > 0\n            }\"\n        >\n            <div class=\"the-temp-table-corner-button\" (mousedown)=\"onSelectTable($event)\"></div>\n            <div class=\"the-temp-table-corner-controls-insert-row-marker\">\n                <the-table-insert-mark type=\"row\" [at]=\"0\" [tableStore]=\"tableStore\"></the-table-insert-mark>\n            </div>\n            <div class=\"the-temp-table-corner-controls-insert-column-marker\">\n                <the-table-insert-mark type=\"column\" [at]=\"0\" [tableStore]=\"tableStore\"></the-table-insert-mark>\n            </div>\n        </div>\n        <div class=\"the-temp-table-row-controls\">\n            <div class=\"the-temp-table-row-controls-inner\">\n                <div\n                    class=\"the-temp-table-row-controls-button-wrap\"\n                    *ngFor=\"let control of rowControls; let i = index; trackBy: trackByFnRowCotrols\"\n                    [ngClass]=\"{\n                        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 && !element?.options?.numberedColumn\">\n                        <button\n                            (mousedown)=\"onRowMouseDown($event, control.rowIndex)\"\n                            type=\"button\"\n                            [ngStyle]=\"{ height: control.height + 1 + 'px' }\"\n                            class=\"the-temp-table-row-controls-button the-temp-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-temp-table-numbered-controls-button\"\n                            [ngStyle]=\"{ height: control.height + 1 + 'px' }\"\n                        >\n                            <p class=\"row-number d-flex align-items-center\">{{ 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-temp-table-wrapper\" #tableWrapper [ngClass]=\"{ 'the-temp-table-numbered': element?.options?.numberedColumn }\">\n        <table class=\"the-temp-table\" #theTable [ngClass]=\"{ 'the-temp-table-with-controls': isInTable }\">\n            <colgroup *ngIf=\"columns\">\n                <col *ngFor=\"let col of columns\" [ngStyle]=\"{ width: col.width + 'px' }\" />\n            </colgroup>\n            <thead>\n                <tr class=\"the-temp-table-col-controls-wrapper\">\n                    <th\n                        class=\"the-temp-table-col-controls\"\n                        [ngClass]=\"{\n                            active: tableStore.selectedColumnsIndex.includes(i),\n                            dangerous: tableStore.dangerousColumnsIndex.includes(i) && tableStore.dangerousCells.length > 0\n                        }\"\n                        (mousedown)=\"onColMouseDown($event, i)\"\n                        *ngFor=\"let control of colControls; let i = index; trackBy: trackByFnColCotrols\"\n                    >\n                        <the-table-insert-mark *ngIf=\"isInTable\" type=\"column\" [at]=\"i + 1\" [tableStore]=\"tableStore\">\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        </table>\n    </div>\n</div>\n", components: [{ type: TheInsertMarkComponent, selector: "the-table-insert-mark", inputs: ["type", "at", "tableStore"] }, { type: i1.SlateChildrenComponent, selector: "slate-children", inputs: ["children", "context", "viewContext"] }], directives: [{ type: TheColumnResizeDirective, selector: "div[theColumnResize]" }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: TheTableComponent, decorators: [{
             type: Component,
             args: [{
@@ -10172,12 +10228,12 @@ class TheTdComponent extends TheBaseElementComponent {
     }
     updateOverlayHandleRowSize() {
         const tableElement = this.tableComponent.nativeElement;
-        const rowControl = tableElement.querySelector('.the-table-row-controls');
+        const rowControl = tableElement.querySelector('.the-temp-table-row-controls');
         let rowControlWidth = 11;
         if (rowControl) {
             rowControlWidth = rowControl.getBoundingClientRect().width;
         }
-        const width = this.tableComponent.tableWrapper.nativeElement.offsetWidth + rowControlWidth;
+        const width = this.tableComponent.tableWrapper.nativeElement.offsetWidth + rowControlWidth - 2;
         this.overlayRef.addPanelClass(this.rowResizeClass);
         this.overlayRef.updateSize({ width, height: OVERLAY_INIT_SIZE });
     }
@@ -10369,8 +10425,7 @@ class TheTdComponent extends TheBaseElementComponent {
     applyTopRows(rows, deltaY, rowIndex) {
         while (deltaY < 0 && rows[rowIndex]) {
             const rowOffsetHeight = getElementHeight(rows[rowIndex]);
-            const rowStyleHeight = coercePixelsFromCssValue(rows[rowIndex].style.height);
-            if (rowOffsetHeight > this.tableOptions.minHeightPx && rowOffsetHeight === rowStyleHeight) {
+            if (rowOffsetHeight > this.tableOptions.minHeightPx) {
                 if (this.resizingStore.isResizing(deltaY, this.isXAxisHover)) {
                     this.resizingStore.storeResizingRow(rows[rowIndex]);
                 }
@@ -10390,8 +10445,7 @@ class TheTdComponent extends TheBaseElementComponent {
     applyBottomRows(rows, deltaY, rowIndex) {
         while (rows[rowIndex] && deltaY > 0) {
             const rowOffsetHeight = getElementHeight(rows[rowIndex]);
-            const rowStyleHeight = coercePixelsFromCssValue(rows[rowIndex].style.height);
-            if (rowOffsetHeight > this.tableOptions.minHeightPx && rowOffsetHeight === rowStyleHeight) {
+            if (rowOffsetHeight > this.tableOptions.minHeightPx) {
                 if (this.resizingStore.isResizing(deltaY, this.isXAxisHover)) {
                     this.resizingStore.storeResizingRow(rows[rowIndex]);
                 }
@@ -11268,26 +11322,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImpo
             }] } });
 
 class TheQuickToolbarComponent extends mixinUnsubscribe(MixinBase) {
-    constructor(popoverRef, elementRef) {
+    constructor(elementRef, cdr) {
         super();
-        this.popoverRef = popoverRef;
         this.elementRef = elementRef;
+        this.cdr = cdr;
         this.ToolbarItemMode = ToolbarItemMode;
         this.ToolbarActionTypes = ToolbarActionTypes;
     }
     handleMouseDown(event) {
         if (!this.elementRef.nativeElement.contains(event.target)) {
-            QuickInsertEditor.closeQuickToolbar(this.editor);
+            QuickInsertEditor.closeQuickInsertToolbar(this.editor);
         }
         else {
             event.preventDefault();
         }
     }
     handleEnter() {
-        QuickInsertEditor.closeQuickToolbar(this.editor);
+        QuickInsertEditor.closeQuickInsertToolbar(this.editor);
     }
     handleEsc() {
-        QuickInsertEditor.closeQuickToolbar(this.editor);
+        QuickInsertEditor.closeQuickInsertToolbar(this.editor);
     }
     ngOnInit() {
         this.editorElement = AngularEditor.toDOMNode(this.editor, this.editor);
@@ -11312,15 +11366,15 @@ class TheQuickToolbarComponent extends mixinUnsubscribe(MixinBase) {
         super.ngOnDestroy();
     }
 }
-TheQuickToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: TheQuickToolbarComponent, deps: [{ token: i1$3.ThyPopoverRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-TheQuickToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", type: TheQuickToolbarComponent, selector: "the-quick-toolbar", inputs: { editor: "editor", quickToolbarItems: "quickToolbarItems" }, host: { listeners: { "document: mousedown": "handleMouseDown($event)", "document: keydown.enter": "handleEnter()", "document: keydown.escape": "handleEsc()" } }, usesInheritance: true, ngImport: i0, template: "<thy-selection-list\n    class=\"the-quick-toolbar\"\n    [thyBindKeyEventContainer]=\"editorElement\"\n    (thySelectionChange)=\"selectionChange($event)\"\n    [thyMultiple]=\"false\"\n>\n    <ng-container *ngFor=\"let item of quickToolbarItems\">\n        <ng-container *ngIf=\"item.key !== ToolbarActionTypes.split; else splitLine\">\n            <thy-list-option [thyValue]=\"item?.key\" (mousedown)=\"stopPropagation($event)\">\n                <the-toolbar-item [editor]=\"editor\" [item]=\"item\" [itemMode]=\"ToolbarItemMode.vertical\"></the-toolbar-item>\n            </thy-list-option>\n        </ng-container>\n    </ng-container>\n</thy-selection-list>\n\n<ng-template #splitLine>\n    <nav-split-line [mode]=\"ToolbarItemMode.horizontal\"></nav-split-line>\n</ng-template>\n", components: [{ type: i2$3.ThySelectionListComponent, selector: "thy-selection-list,[thy-selection-list]", inputs: ["thyMultiple", "thyBindKeyEventContainer", "thyScrollContainer", "thyBeforeKeydown", "thyUniqueKey", "thyCompareWith", "thyLayout", "thyAutoActiveFirstItem", "thySize", "thySpaceKeyEnabled"], outputs: ["thySelectionChange"] }, { type: i5$2.ThyListOptionComponent, selector: "thy-list-option,[thy-list-option]", inputs: ["id", "thyValue", "thyDisabled"] }, { type: TheToolbarItemComponent, selector: "the-toolbar-item", inputs: ["editor", "item", "itemMode"] }, { type: NavSplitLineComponent, selector: "nav-split-line", inputs: ["mode"] }], directives: [{ type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TheQuickToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: TheQuickToolbarComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+TheQuickToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.15", type: TheQuickToolbarComponent, selector: "the-quick-toolbar", inputs: { editor: "editor", quickToolbarItems: "quickToolbarItems" }, host: { listeners: { "document: mousedown": "handleMouseDown($event)", "document: keydown.enter": "handleEnter()", "document: keydown.escape": "handleEsc()" } }, usesInheritance: true, ngImport: i0, template: "<thy-selection-list\n    class=\"the-quick-toolbar\"\n    [thyBindKeyEventContainer]=\"editorElement\"\n    (thySelectionChange)=\"selectionChange($event)\"\n    [thyMultiple]=\"false\"\n>\n    <ng-container *ngFor=\"let item of quickToolbarItems\">\n        <ng-container *ngIf=\"item.key !== ToolbarActionTypes.split; else splitLine\">\n            <thy-list-option [thyValue]=\"item?.key\" (mousedown)=\"stopPropagation($event)\">\n                <the-toolbar-item [editor]=\"editor\" [item]=\"item\" [itemMode]=\"ToolbarItemMode.vertical\"></the-toolbar-item>\n            </thy-list-option>\n        </ng-container>\n    </ng-container>\n</thy-selection-list>\n\n<ng-template #splitLine>\n    <nav-split-line [mode]=\"ToolbarItemMode.horizontal\"></nav-split-line>\n</ng-template>\n", components: [{ type: i1$7.ThySelectionListComponent, selector: "thy-selection-list,[thy-selection-list]", inputs: ["thyMultiple", "thyBindKeyEventContainer", "thyScrollContainer", "thyBeforeKeydown", "thyUniqueKey", "thyCompareWith", "thyLayout", "thyAutoActiveFirstItem", "thySize", "thySpaceKeyEnabled"], outputs: ["thySelectionChange"] }, { type: i5$2.ThyListOptionComponent, selector: "thy-list-option,[thy-list-option]", inputs: ["id", "thyValue", "thyDisabled"] }, { type: TheToolbarItemComponent, selector: "the-toolbar-item", inputs: ["editor", "item", "itemMode"] }, { type: NavSplitLineComponent, selector: "nav-split-line", inputs: ["mode"] }], directives: [{ type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: TheQuickToolbarComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'the-quick-toolbar',
                     templateUrl: 'quick-toolbar.component.html'
                 }]
-        }], ctorParameters: function () { return [{ type: i1$3.ThyPopoverRef }, { type: i0.ElementRef }]; }, propDecorators: { editor: [{
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { editor: [{
                 type: Input
             }], quickToolbarItems: [{
                 type: Input
@@ -11335,16 +11389,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImpo
                 args: ['document: keydown.escape']
             }] } });
 
-const OperationTypes = ['insert_text', 'remove_node', 'merge_node'];
 const QuickInsertEditor = {
-    openQuickToolbar(editor, toolbarItems, origin) {
+    openQuickInsertToolbar(editor, quickToolbarItems, origin) {
+        if (QuickInsertEditor.isOpenedToolbar(editor)) {
+            return;
+        }
+        if (!origin) {
+            const [block,] = getBlockAbove(editor);
+            const rootNode = AngularEditor.toDOMNode(editor, block);
+            origin = rootNode.querySelector('[data-slate-leaf="true"]');
+        }
         const overlay = editor.injector.get(Overlay);
         const viewContainerRef = editor.injector.get(ViewContainerRef);
         const thyPopover = editor.injector.get(ThyPopover);
         const quickToolbarRef = thyPopover.open(TheQuickToolbarComponent, {
             initialState: {
                 editor,
-                quickToolbarItems: toolbarItems
+                quickToolbarItems
             },
             origin,
             viewContainerRef: viewContainerRef,
@@ -11357,52 +11418,45 @@ const QuickInsertEditor = {
             scrollStrategy: overlay.scrollStrategies.reposition(),
             manualClosure: true
         });
+        quickToolbarRef.componentInstance.cdr.markForCheck();
         THE_EDITOR_QUICK_TOOLBAR_REF.set(editor, quickToolbarRef);
     },
-    closeQuickToolbar(editor) {
+    closeQuickInsertToolbar(editor) {
         const quickToolbarRef = THE_EDITOR_QUICK_TOOLBAR_REF.get(editor);
         if (quickToolbarRef) {
             quickToolbarRef.close();
             THE_EDITOR_QUICK_TOOLBAR_REF.set(editor, null);
         }
     },
-    isOpenToolbar(editor, opTypes = OperationTypes) {
-        const isCollapsedCursor = TheEditor.isFocused(editor) && editor.selection && Range.isCollapsed(editor.selection);
-        if (!isCollapsedCursor) {
-            return false;
-        }
-        const block = Node.ancestor(editor, [editor.selection.anchor.path[0]]);
-        const { undos } = editor.history;
-        const lastBatch = undos[undos.length - 1];
-        const lastOp = lastBatch && lastBatch[lastBatch.length - 1];
-        if (lastOp &&
-            block.children.length === 1 &&
-            block.type === ElementKinds.paragraph &&
-            Node.string(block) === QUICK_TOOLBAR_HOTKEY &&
-            opTypes.includes(lastOp.type) &&
-            (lastOp.text === QUICK_TOOLBAR_HOTKEY || lastOp.text === undefined)) {
-            return true;
-        }
-        return false;
+    isOpenedToolbar(editor) {
+        const quickToolbarRef = THE_EDITOR_QUICK_TOOLBAR_REF.get(editor);
+        return !!quickToolbarRef;
     }
 };
 
 const withQuickInsert = (editor) => {
     const { onKeydown, deleteBackward, onChange } = editor;
+    let presseingQuickInsertHotkey = false;
     editor.onKeydown = (event) => {
-        if (event.key === QUICK_TOOLBAR_HOTKEY && isCleanEmptyParagraph(editor)) {
-            const rootNode = AngularEditor.toDOMNode(editor, Node.ancestor(editor, [editor.selection.anchor.path[0]]));
-            const theEditorComponent = editor.injector.get(TheEditorComponent);
-            const quickToolbars = theEditorComponent.quickToolbarItems;
-            const leafElement = rootNode.querySelector('[data-slate-leaf="true"]');
-            const origin = leafElement || rootNode;
-            QuickInsertEditor.openQuickToolbar(editor, quickToolbars, origin);
+        var _a;
+        if (event.key === QUICK_TOOLBAR_HOTKEY) {
+            const types = [...(((_a = editor.options) === null || _a === void 0 ? void 0 : _a.allowContainerOperateTypes) || [])];
+            const [block] = getBlockAbove(editor);
+            if (isPureEmptyParagraph(editor, block) && allowOpenQuickToolbar(editor, types)) {
+                presseingQuickInsertHotkey = true;
+            }
+        }
+        const quickToolbarRef = THE_EDITOR_QUICK_TOOLBAR_REF.get(editor);
+        const isMoveUp = hotkeys.isMoveUp(event);
+        const isMoveDown = hotkeys.isMoveDown(event);
+        if (quickToolbarRef && (isMoveUp || isMoveDown)) {
+            return;
         }
         onKeydown(event);
     };
     editor.deleteBackward = unit => {
-        if (!QuickInsertEditor.isOpenToolbar(editor, ['remove_text'])) {
-            QuickInsertEditor.closeQuickToolbar(editor);
+        if (QuickInsertEditor.isOpenedToolbar(editor)) {
+            QuickInsertEditor.closeQuickInsertToolbar(editor);
         }
         deleteBackward(unit);
     };
@@ -11410,16 +11464,35 @@ const withQuickInsert = (editor) => {
         var _a;
         onChange();
         if (editor.selection) {
+            const [block, path] = getBlockAbove(editor);
+            // quick insert plus
             const editorComponent = editor.injector.get(TheEditorComponent);
             (_a = editorComponent.quickInsertInstance) === null || _a === void 0 ? void 0 : _a.checkStatus();
-            const block = Node.ancestor(editor, [editor.selection.anchor.path[0]]);
-            if (!isCleanEmptyParagraph(editor) && Node.string(block) !== QUICK_TOOLBAR_HOTKEY) {
-                QuickInsertEditor.closeQuickToolbar(editor);
+            if (presseingQuickInsertHotkey && Node.string(block) === QUICK_TOOLBAR_HOTKEY) {
+                QuickInsertEditor.openQuickInsertToolbar(editor, editorComponent.quickToolbarItems);
+                presseingQuickInsertHotkey = false;
+                return;
+            }
+            else {
+                presseingQuickInsertHotkey = false;
+            }
+            if (QuickInsertEditor.isOpenedToolbar(editor) &&
+                !isPureEmptyParagraph(editor, block) &&
+                Node.string(block) !== QUICK_TOOLBAR_HOTKEY) {
+                QuickInsertEditor.closeQuickInsertToolbar(editor);
             }
         }
     };
     return editor;
 };
+const allowOpenQuickToolbar = (editor, allowTypes) => {
+    const [block, path] = getBlockAbove(editor);
+    const parentNode = Node.parent(editor, path);
+    if (path.length === 1 || (parentNode && allowTypes.includes(parentNode.type))) {
+        return true;
+    }
+    return false;
+};
 
 const withSoftBreak = (options = { rules: [{ hotkey: 'shift+enter' }] }) => (editor) => {
     const { onKeydown } = editor;
@@ -11709,6 +11782,78 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImpo
                 args: ['class.disabled']
             }] } });
 
+const onKeydownTextIndent = (editor, event, kinds, textIndentDisabled) => {
+    const { selection } = editor;
+    const isExpanded = Range.isExpanded(selection);
+    const nodes = Array.from(Editor.nodes(editor, {
+        mode: 'highest',
+        match: node => Element$1.isElement(node) && kinds.includes(node.type)
+    }));
+    const [startBlock] = nodes;
+    if (!startBlock) {
+        return false;
+    }
+    const [block, path] = startBlock;
+    const isStart = Editor.isStart(editor, selection.anchor, path);
+    if (isKeyHotkey('Tab', event)) {
+        event.preventDefault();
+        if (startBlock && (isExpanded || isStart)) {
+            if (!editor.isVoid(block)) {
+                let { textIndent, type } = block;
+                // do not apply first-line indentation for lists
+                if (!textIndent && !textIndentDisabled.includes(type)) {
+                    IndentEditor.setTextIndent(editor, kinds, 2);
+                    return true;
+                }
+                else {
+                    IndentEditor.setIndent(editor);
+                    return true;
+                }
+            }
+        }
+        else {
+            editor.insertText(TAB_SPACE);
+            return true;
+        }
+    }
+    if (isKeyHotkey('shift+Tab', event)) {
+        if (startBlock && (isExpanded || isStart)) {
+            if (!editor.isVoid(block)) {
+                return IndentEditor.cancelTextIntent(editor, event, block, kinds);
+            }
+        }
+    }
+    if (selection && Range.isCollapsed(selection) && hotkeys.isDeleteBackward(event)) {
+        if (startBlock && isStart) {
+            return IndentEditor.cancelTextIntent(editor, event, block, kinds);
+        }
+    }
+    return false;
+};
+
+const withIndent = (kinds) => (editor) => {
+    const { onKeydown } = editor;
+    editor.onKeydown = (event) => {
+        var _a, _b, _c, _d;
+        let indentTypes = kinds;
+        let disableIndentTypes = [ElementKinds.bulletedList, ElementKinds.numberedList, ElementKinds.checkItem];
+        if ((_b = (_a = editor.extraIndentOptions) === null || _a === void 0 ? void 0 : _a.indentTypes) === null || _b === void 0 ? void 0 : _b.length) {
+            indentTypes = mergIndentTypes(kinds, editor.extraIndentOptions.indentTypes);
+        }
+        if ((_d = (_c = editor.extraIndentOptions) === null || _c === void 0 ? void 0 : _c.disabledIndentTypes) === null || _d === void 0 ? void 0 : _d.length) {
+            disableIndentTypes = mergIndentTypes(disableIndentTypes, editor.extraIndentOptions.disabledIndentTypes);
+        }
+        const isContinue = !onKeydownTextIndent(editor, event, indentTypes, disableIndentTypes);
+        if (isContinue) {
+            onKeydown(event);
+        }
+    };
+    return editor;
+};
+const mergIndentTypes = (defaultTypes, indentTypes) => {
+    return Array.from(new Set([...defaultTypes, ...indentTypes]));
+};
+
 const MaxIndent = 11;
 const includesIndentTypes = [
     ElementKinds.checkItem,
@@ -11717,11 +11862,15 @@ const includesIndentTypes = [
     ElementKinds.paragraph,
     ...HEADING_TYPES
 ];
+const getIndentTypes = editor => {
+    let indentTypes = editor.extraIndentOptions ? editor.extraIndentOptions.indentTypes : [];
+    return mergIndentTypes(includesIndentTypes, indentTypes);
+};
 const IndentEditor = {
     setIndent(editor) {
         const nodes = Array.from(Editor.nodes(editor, {
             mode: 'highest',
-            match: n => Element$1.isElement(n) && includesIndentTypes.includes(n.type)
+            match: n => Element$1.isElement(n) && getIndentTypes(editor).includes(n.type)
         }));
         const [startBlock] = nodes;
         if (startBlock) {
@@ -11731,7 +11880,7 @@ const IndentEditor = {
             if (indent <= MaxIndent) {
                 Transforms.setNodes(editor, { indent }, {
                     mode: 'highest',
-                    match: n => Element$1.isElement(n) && includesIndentTypes.includes(n.type)
+                    match: n => Element$1.isElement(n) && getIndentTypes(editor).includes(n.type)
                 });
             }
         }
@@ -11739,7 +11888,7 @@ const IndentEditor = {
     cancelIndent(editor) {
         const nodes = Array.from(Editor.nodes(editor, {
             mode: 'highest',
-            match: n => Element$1.isElement(n) && includesIndentTypes.includes(n.type)
+            match: n => Element$1.isElement(n) && getIndentTypes(editor).includes(n.type)
         }));
         const [startBlock] = nodes;
         if (startBlock) {
@@ -11747,7 +11896,7 @@ const IndentEditor = {
             indent = indent === 1 ? null : (indent -= 1);
             Transforms.setNodes(editor, { indent }, {
                 mode: 'highest',
-                match: n => Element$1.isElement(n) && includesIndentTypes.includes(n.type)
+                match: n => Element$1.isElement(n) && getIndentTypes(editor).includes(n.type)
             });
         }
     },
@@ -11779,15 +11928,8 @@ const IndentEditor = {
     },
     isDisabled(editor) {
         if (editor.selection) {
-            const allowGroup = [
-                ElementKinds.paragraph,
-                ElementKinds.numberedList,
-                ElementKinds.bulletedList,
-                ElementKinds.checkItem,
-                ...HEADING_TYPES
-            ];
             const anchorBlock$1 = anchorBlock(editor);
-            return anchorBlock$1 && !allowGroup.includes(anchorBlock$1 === null || anchorBlock$1 === void 0 ? void 0 : anchorBlock$1.type);
+            return anchorBlock$1 && !getIndentTypes(editor).includes(anchorBlock$1 === null || anchorBlock$1 === void 0 ? void 0 : anchorBlock$1.type);
         }
         return false;
     }
@@ -11817,67 +11959,6 @@ const IndentOptions = [
     }
 ];
 
-const onKeydownTextIndent = (editor, event, kinds) => {
-    const { selection } = editor;
-    const isExpanded = Range.isExpanded(selection);
-    const nodes = Array.from(Editor.nodes(editor, {
-        mode: 'highest',
-        match: node => Element$1.isElement(node) && kinds.includes(node.type)
-    }));
-    const [startBlock] = nodes;
-    if (!startBlock) {
-        return false;
-    }
-    const [block, path] = startBlock;
-    const isStart = Editor.isStart(editor, selection.anchor, path);
-    const textIndentDisable = [ElementKinds.bulletedList, ElementKinds.numberedList, ElementKinds.checkItem];
-    if (isKeyHotkey('Tab', event)) {
-        event.preventDefault();
-        if (startBlock && (isExpanded || isStart)) {
-            if (!editor.isVoid(block)) {
-                let { textIndent, type } = block;
-                // do not apply first-line indentation for lists
-                if (!textIndent && !textIndentDisable.includes(type)) {
-                    IndentEditor.setTextIndent(editor, kinds, 2);
-                    return true;
-                }
-                else {
-                    IndentEditor.setIndent(editor);
-                    return true;
-                }
-            }
-        }
-        else {
-            editor.insertText(TAB_SPACE);
-            return true;
-        }
-    }
-    if (isKeyHotkey('shift+Tab', event)) {
-        if (startBlock && (isExpanded || isStart)) {
-            if (!editor.isVoid(block)) {
-                return IndentEditor.cancelTextIntent(editor, event, block, kinds);
-            }
-        }
-    }
-    if (selection && Range.isCollapsed(selection) && hotkeys.isDeleteBackward(event)) {
-        if (startBlock && isStart) {
-            return IndentEditor.cancelTextIntent(editor, event, block, kinds);
-        }
-    }
-    return false;
-};
-
-const withIndent = (kinds) => (editor) => {
-    const { onKeydown } = editor;
-    editor.onKeydown = (event) => {
-        const isContinue = !onKeydownTextIndent(editor, event, kinds);
-        if (isContinue) {
-            onKeydown(event);
-        }
-    };
-    return editor;
-};
-
 const internalPlugins = [
     withTheHistory,
     withAutoInsertData(),
@@ -12500,7 +12581,11 @@ class TheQuickInsertComponent {
     handleClick(event) {
         event.stopPropagation();
         event.preventDefault();
-        QuickInsertEditor.openQuickToolbar(this.editor, this.quickToolbarItems, this.iconElement.nativeElement);
+        if (QuickInsertEditor.isOpenedToolbar(this.editor)) {
+            QuickInsertEditor.closeQuickInsertToolbar(this.editor);
+            return;
+        }
+        QuickInsertEditor.openQuickInsertToolbar(this.editor, this.quickToolbarItems, this.iconElement.nativeElement);
     }
 }
 TheQuickInsertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.15", ngImport: i0, type: TheQuickInsertComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
@@ -12773,12 +12858,14 @@ class TheEditorComponent extends mixinUnsubscribe(MixinBase) {
         super.ngOnDestroy();
     }
     initialize() {
-        var _a, _b, _c;
+        var _a, _b, _c, _d;
         this.editor = withTheEditor(this.thePlugins, withHistory(withAngular(createEditor(), CLIPBOARD_FORMAT_KEY)));
         this.generateDecorate();
         this.editor.disabled = (_a = this.theOptions) === null || _a === void 0 ? void 0 : _a.disabled;
         this.editor.extraElementOptions = (_b = this.theOptions) === null || _b === void 0 ? void 0 : _b.extraElementOptions;
         this.editor.extraAutoFormatRules = (_c = this.theOptions) === null || _c === void 0 ? void 0 : _c.extraAutoFormatRules;
+        this.editor.extraIndentOptions = (_d = this.theOptions) === null || _d === void 0 ? void 0 : _d.extraIndentOptions;
+        this.editor.options = this.theOptions;
         setEditorUUID(this.editor, idCreator());
         this.theContextService.initialize({
             theOptions: this.theOptions,
@@ -13323,5 +13410,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.15", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ALIGN_BLOCK_TYPES, A_TAG_REL_ATTR, AlignEditor, Alignment, BLOCK_DELETEBACKWARD_TYPES, BlockquoteEditor, CLIPBOARD_FORMAT_KEY, CODEMIRROR_PADDING_TOP, CODE_MODES, COMPONENTS, CONTAINER_BLOCKS, CONTROL_KEY, CodeEditor, CodeMode, ColorEditor, DEFAULT_LANGUAGE, DEFAULT_SCROLL_CONTAINER, DefaultElementOptions, DefaultGlobalToolbarDefinition, DefaultInlineToolbarDefinition, DefaultQuickToolbarDefinition, DropdownMode, ELEMENT_UNIQUE_ID, ElementKinds, ErrorCodes, FontSizeTypes, FontSizes, HEADING_TYPES, HeadingEditor, HrEditor, IS_MAC, ImageEditor, Indents, LINK_DEFAULT_TEXT, LIST_BLOCK_TYPES, LayoutTypes, LinkEditor, ListEditor, MarkEditor, MarkProps, MarkTypes, PICTURE_ACCEPTED_UPLOAD_MIME, PICTURE_ACCEPTED_UPLOAD_SIZE, PLUGIN_COMPONENTS, QUICK_TOOLBAR_HOTKEY, QuickInsertEditor, STANDARD_HEADING_TYPES, TAB_SPACE, THE_CODE_MODE_PROVIDER, THE_CODE_MODE_TOKEN, THE_EDITOR_CONVERSION_HINT_REF, THE_EDITOR_QUICK_TOOLBAR_REF, THE_EDITOR_UUID, THE_INLINE_TOOLBAR_TYPES, THE_UPLOAD_SERVICE_TOKEN, TableEditor, TheBaseElementComponent, TheCodeConfig, TheContextService, TheDataMode, TheDefaultElementComponent, TheEditor, TheEditorComponent, TheEditorModule, TheImageComponent, TheMode, index$1 as TheQueries, TheToolbarBaseItemComponent, TheToolbarComponent, TheToolbarDropdownComponent, TheToolbarGroupComponent, TheToolbarGroupToken, TheToolbarItemComponent, TheToolbarService, index as TheTransforms, TodoItemEditor, ToolbarActionTypes, ToolbarAlignment, ToolbarItemMode, ToolbarItemType, ToolbarMoreGroup, VOID_BLOCK_TYPES, VerticalAlignEditor, VerticalAlignment, ZERO_WIDTH_CHAR, coercePixelsFromCssValue, createEmptyParagraph, dataDeserialize, dataSerializing, getColsTotalWidth, getElementClassByPrefix, getElementHeight, getElementWidth, getRowsTotalHeight, getToolbarClass, htmlToTheia, inValidTypes, isCleanEmptyParagraph, mergeElementOptions, plainToTheia, toolbarCompose, useElementStyle, withTheEditor };
+export { ALIGN_BLOCK_TYPES, A_TAG_REL_ATTR, AlignEditor, Alignment, BLOCK_DELETEBACKWARD_TYPES, BlockquoteEditor, CLIPBOARD_FORMAT_KEY, CODEMIRROR_PADDING_TOP, CODE_MODES, COMPONENTS, CONTAINER_BLOCKS, CONTROL_KEY, CodeEditor, CodeMode, ColorEditor, DEFAULT_LANGUAGE, DEFAULT_SCROLL_CONTAINER, DefaultElementOptions, DefaultGlobalToolbarDefinition, DefaultInlineToolbarDefinition, DefaultQuickToolbarDefinition, DropdownMode, ELEMENT_UNIQUE_ID, ElementKinds, ErrorCodes, FontSizeTypes, FontSizes, HEADING_TYPES, HeadingEditor, HrEditor, IS_MAC, ImageEditor, Indents, LINK_DEFAULT_TEXT, LIST_BLOCK_TYPES, LayoutTypes, LinkEditor, ListEditor, MarkEditor, MarkProps, MarkTypes, PICTURE_ACCEPTED_UPLOAD_MIME, PICTURE_ACCEPTED_UPLOAD_SIZE, PLUGIN_COMPONENTS, QUICK_TOOLBAR_HOTKEY, QuickInsertEditor, STANDARD_HEADING_TYPES, TAB_SPACE, THE_CODE_MODE_PROVIDER, THE_CODE_MODE_TOKEN, THE_EDITOR_CONVERSION_HINT_REF, THE_EDITOR_QUICK_TOOLBAR_REF, THE_EDITOR_UUID, THE_INLINE_TOOLBAR_TYPES, THE_UPLOAD_SERVICE_TOKEN, TableEditor, TheBaseElementComponent, TheCodeConfig, TheContextService, TheDataMode, TheDefaultElementComponent, TheEditor, TheEditorComponent, TheEditorModule, TheImageComponent, TheMode, index$1 as TheQueries, TheToolbarBaseItemComponent, TheToolbarComponent, TheToolbarDropdownComponent, TheToolbarGroupComponent, TheToolbarGroupToken, TheToolbarItemComponent, TheToolbarService, index as TheTransforms, TodoItemEditor, ToolbarActionTypes, ToolbarAlignment, ToolbarItemMode, ToolbarItemType, ToolbarMoreGroup, VOID_BLOCK_TYPES, VerticalAlignEditor, VerticalAlignment, ZERO_WIDTH_CHAR, coercePixelsFromCssValue, createEmptyParagraph, dataDeserialize, dataSerializing, getColsTotalWidth, getElementClassByPrefix, getElementHeight, getElementWidth, getRowsTotalHeight, getToolbarClass, htmlToTheia, inValidTypes, isCleanEmptyParagraph, isPureEmptyParagraph, mergeElementOptions, plainToTheia, toolbarCompose, useElementStyle, withTheEditor };
 //# sourceMappingURL=worktile-theia.js.map