@worktile/theia 1.2.19 → 2.1.0

package/bundles/worktile-theia.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('slate-angular'), require('ngx-tethys/core'), require('is-hotkey'), require('slate'), require('slate-history'), require('lodash'), require('marked'), require('@atinc/selene'), require('ngx-tethys/popover'), require('@angular/cdk/overlay'), require('ngx-tethys/alert'), require('rxjs/operators'), require('ngx-tethys/uploader'), require('@angular/platform-browser'), require('rxjs'), require('ngx-tethys/progress'), require('ngx-tethys/icon'), require('ngx-tethys/input'), require('ngx-tethys/nav'), require('ngx-tethys/tooltip'), require('ng-codemirror'), require('ngx-tethys/notify'), require('ngx-tethys/action-menu'), require('ngx-tethys/switch'), require('ngx-tethys/resizable'), require('is-url'), require('ngx-tethys/button'), require('ngx-tethys/form'), require('ngx-tethys/shared'), require('ngx-tethys'), require('@angular/cdk/coercion'), require('@angular/cdk/portal'), require('ngx-tethys/list'), require('ngx-tethys/autocomplete'), require('ngx-tethys/avatar'), require('ngx-tethys/select')) :
     typeof define === 'function' && define.amd ? define('@worktile/theia', ['exports', '@angular/core', '@angular/common', '@angular/forms', 'slate-angular', 'ngx-tethys/core', 'is-hotkey', 'slate', 'slate-history', 'lodash', 'marked', '@atinc/selene', 'ngx-tethys/popover', '@angular/cdk/overlay', 'ngx-tethys/alert', 'rxjs/operators', 'ngx-tethys/uploader', '@angular/platform-browser', 'rxjs', 'ngx-tethys/progress', 'ngx-tethys/icon', 'ngx-tethys/input', 'ngx-tethys/nav', 'ngx-tethys/tooltip', 'ng-codemirror', 'ngx-tethys/notify', 'ngx-tethys/action-menu', 'ngx-tethys/switch', 'ngx-tethys/resizable', 'is-url', 'ngx-tethys/button', 'ngx-tethys/form', 'ngx-tethys/shared', 'ngx-tethys', '@angular/cdk/coercion', '@angular/cdk/portal', 'ngx-tethys/list', 'ngx-tethys/autocomplete', 'ngx-tethys/avatar', 'ngx-tethys/select'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.worktile = global.worktile || {}, global.worktile.theia = {}), global.ng.core, global.ng.common, global.ng.forms, global.i1, global.core, global.isHotkey, global.slate, global.slateHistory, global._lodash, global.marked, global.selene, global.i1$2, global.ng.cdk.overlay, global.i1$1, global.rxjs.operators, global.uploader, global.ng.platformBrowser, global.rxjs, global.i4, global.i4$1, global.i5, global.i3, global.i5$1, global.i7, global.i1$4, global.i5$2, global.i5$3, global.i8, global.isUrl, global.i1$5, global.i2$1, global.i5$4, global.i1$6, global.ng.cdk.coercion, global.ng.cdk.portal, global.i2$2, global.autocomplete, global.avatar, global.select));
-})(this, (function (exports, i0, i6, i4$2, i1, core, isHotkey, slate, slateHistory, _lodash, marked, selene, i1$2, i2, i1$1, operators, uploader, i1$3, rxjs, i4, i4$1, i5, i3, i5$1, i7, i1$4, i5$2, i5$3, i8, isUrl, i1$5, i2$1, i5$4, i1$6, coercion, portal, i2$2, autocomplete, avatar, select) { 'use strict';
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.worktile = global.worktile || {}, global.worktile.theia = {}), global.ng.core, global.ng.common, global.ng.forms, global.i1, global.core, global.isHotkey, global.slate, global.slateHistory, global._lodash, global.marked, global.selene, global.i1$2, global.ng.cdk.overlay, global.i1$1, global.rxjs.operators, global.uploader, global.ng.platformBrowser, global.rxjs, global.i4, global.i4$1, global.i5, global.i3, global.i5$1, global.i8, global.i1$4, global.i5$2, global.i6$1, global.i9, global.isUrl, global.i1$5, global.i2$1, global.i5$3, global.i1$6, global.ng.cdk.coercion, global.ng.cdk.portal, global.i2$2, global.autocomplete, global.avatar, global.select));
+})(this, (function (exports, i0, i6, i4$2, i1, core, isHotkey, slate, slateHistory, _lodash, marked, selene, i1$2, i2, i1$1, operators, uploader, i1$3, rxjs, i4, i4$1, i5, i3, i5$1, i8, i1$4, i5$2, i6$1, i9, isUrl, i1$5, i2$1, i5$3, i1$6, coercion, portal, i2$2, autocomplete, avatar, select) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -40,15 +40,15 @@
     var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
     var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
     var i5__namespace$1 = /*#__PURE__*/_interopNamespace(i5$1);
-    var i7__namespace = /*#__PURE__*/_interopNamespace(i7);
+    var i8__namespace = /*#__PURE__*/_interopNamespace(i8);
     var i1__namespace$4 = /*#__PURE__*/_interopNamespace(i1$4);
     var i5__namespace$2 = /*#__PURE__*/_interopNamespace(i5$2);
-    var i5__namespace$3 = /*#__PURE__*/_interopNamespace(i5$3);
-    var i8__namespace = /*#__PURE__*/_interopNamespace(i8);
+    var i6__namespace$1 = /*#__PURE__*/_interopNamespace(i6$1);
+    var i9__namespace = /*#__PURE__*/_interopNamespace(i9);
     var isUrl__default = /*#__PURE__*/_interopDefaultLegacy(isUrl);
     var i1__namespace$5 = /*#__PURE__*/_interopNamespace(i1$5);
     var i2__namespace$1 = /*#__PURE__*/_interopNamespace(i2$1);
-    var i5__namespace$4 = /*#__PURE__*/_interopNamespace(i5$4);
+    var i5__namespace$3 = /*#__PURE__*/_interopNamespace(i5$3);
     var i1__namespace$6 = /*#__PURE__*/_interopNamespace(i1$6);
     var i2__namespace$2 = /*#__PURE__*/_interopNamespace(i2$2);
 
@@ -6922,23 +6922,22 @@
 
     var TheCodeComponent = /** @class */ (function (_super) {
         __extends(TheCodeComponent, _super);
-        function TheCodeComponent(elementRef, cdr, thyNotifyService, ngZone, config) {
+        function TheCodeComponent(elementRef, cdr, thyNotifyService, contextService, ngZone, config) {
             var _this = _super.call(this, elementRef, cdr) || this;
             _this.elementRef = elementRef;
             _this.cdr = cdr;
             _this.thyNotifyService = thyNotifyService;
+            _this.contextService = contextService;
             _this.ngZone = ngZone;
             _this.config = config;
             _this.startRenderCodemirror = false;
             _this.dropdownMode = exports.DropdownMode;
-            _this.codeMirrorFocused = false;
             _this.maxHeight = _this.config.mode === CodeMode.default ? 350 - CODEMIRROR_PADDING_TOP * 2 : 0;
             _this.menus = CODE_MODES.map(function (item) {
                 return { key: item.value, name: item.showName };
             });
             _this.ToolbarItemMode = exports.ToolbarItemMode;
-            _this.isAutoWrap = false;
-            _this.isResizing = false;
+            _this.isFocusCode = false;
             _this.resizeHeight = null;
             _this.options = {
                 mode: _this.menus[0].key,
@@ -6950,10 +6949,11 @@
                 cursorBlinkRate: 500
             };
             _this.actives = _this.menus[0];
+            _this.resizeBounds = null;
             _this.onChangeLangulage = function (item) {
                 _this.options = Object.assign(Object.assign({}, _this.options), { mode: item.key });
                 _this.actives = item;
-                CodeEditor.setCodeAttribute(_this.editor, _this.element, { langulage: item.key });
+                CodeEditor.setCodeAttribute(_this.editor, _this.element, { language: item.key });
             };
             return _this;
         }
@@ -6964,11 +6964,6 @@
             enumerable: false,
             configurable: true
         });
-        TheCodeComponent.prototype.handleCodeMousedown = function (event) {
-            if (!(event.target instanceof HTMLElement && this.elementRef.nativeElement.contains(event.target))) {
-                this.codeMirrorFocused = false;
-            }
-        };
         TheCodeComponent.prototype.onContextChange = function () {
             _super.prototype.onContextChange.call(this);
             if (this.initialized) {
@@ -6978,8 +6973,14 @@
                 if (this.options.mode !== this.element.language) {
                     this.useMode();
                 }
-                if (!this.readonly && this.isCollapsed) {
-                    this.initializeCodemirrorFocus();
+                if (this.options.lineWrapping !== this.element.autoWrap) {
+                    this.useAutoWrap();
+                }
+                if (this.resizeHeight !== this.element.height) {
+                    this.useHeight();
+                }
+                if (!this.isCollapsed) {
+                    this.isFocusCode = false;
                 }
             }
         };
@@ -7001,13 +7002,12 @@
                 this.ngZone.onStable.pipe(operators.take(1)).subscribe(function () {
                     _this.renderCodemirror();
                     _this.initializeCodemirrorFocus();
+                    _this.resizeBounds = {
+                        nativeElement: _this.contextService.getEditableElement()
+                    };
                 });
             }
         };
-        TheCodeComponent.prototype.focusChange = function (codeMirrorFocused) {
-            if (codeMirrorFocused)
-                this.codeMirrorFocused = codeMirrorFocused;
-        };
         TheCodeComponent.prototype.renderCodemirror = function () {
             this.startRenderCodemirror = true;
             this.useReadonly();
@@ -7018,7 +7018,7 @@
         };
         TheCodeComponent.prototype.initializeCodemirrorFocus = function () {
             var _this = this;
-            if (this.isCollapsed && !this.isResizing) {
+            if (this.isCollapsed) {
                 setTimeout(function () {
                     if (_this.isCollapsed && _this.codemirror && _this.codemirror.editor && !_this.codemirror.editor.hasFocus()) {
                         i1.AngularEditor.blur(_this.editor);
@@ -7033,7 +7033,7 @@
         };
         TheCodeComponent.prototype.onDelete = function (event) {
             event.preventDefault();
-            this.codeMirrorFocused = false;
+            this.isFocusCode = false;
             deleteElement(this.editor, this.element);
         };
         TheCodeComponent.prototype.onCopy = function (event) {
@@ -7049,7 +7049,10 @@
             document.execCommand('copy');
             this.thyNotifyService.success('复制成功');
             i1.AngularEditor.deselect(this.editor);
-            this.codeMirrorFocused = false;
+        };
+        TheCodeComponent.prototype.focusChange = function (codeMirrorFocused) {
+            if (codeMirrorFocused)
+                this.isFocusCode = codeMirrorFocused;
         };
         TheCodeComponent.prototype.useMode = function () {
             var _this = this;
@@ -7057,11 +7060,7 @@
             this.actives = this.menus.find(function (i) { return i.key === _this.element.language; });
         };
         TheCodeComponent.prototype.useAutoWrap = function () {
-            if (this.element.autoWrap) {
-                this.cdr.detectChanges();
-                this.isAutoWrap = this.element.autoWrap;
-                this.codemirror.setOptionIfChanged('lineWrapping', this.element.autoWrap);
-            }
+            this.options = Object.assign(Object.assign({}, this.options), { lineWrapping: this.element.autoWrap || false });
         };
         TheCodeComponent.prototype.useHeight = function () {
             if (this.element.height) {
@@ -7075,42 +7074,35 @@
         TheCodeComponent.prototype.onResize = function (_a) {
             var height = _a.height;
             this.resizeHeight = height;
-            slate.Transforms.select(this.editor, i1.AngularEditor.findPath(this.editor, this.element));
-            CodeEditor.setCodeAttribute(this.editor, this.element, { height: height });
             this.maxHeight = height;
         };
-        TheCodeComponent.prototype.onStartResize = function () {
-            this.isResizing = true;
-        };
         TheCodeComponent.prototype.onEndResize = function () {
-            this.isResizing = false;
+            slate.Transforms.select(this.editor, i1.AngularEditor.findPath(this.editor, this.element));
+            CodeEditor.setCodeAttribute(this.editor, this.element, { height: this.resizeHeight });
         };
         TheCodeComponent.prototype.onChangeWrap = function (value) {
-            i1.AngularEditor.deselect(this.editor);
-            this.codemirror.setOptionIfChanged('lineWrapping', value);
+            this.options = Object.assign(Object.assign({}, this.options), { lineWrapping: value || false });
             CodeEditor.setCodeAttribute(this.editor, this.element, { autoWrap: value ? value : null });
         };
         return TheCodeComponent;
     }(TheBaseElementComponent));
-    TheCodeComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheCodeComponent, deps: [{ token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }, { token: i1__namespace$4.ThyNotifyService }, { token: i0__namespace.NgZone }, { token: THE_CODE_MODE_TOKEN }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    TheCodeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: TheCodeComponent, selector: "div[theCode]", host: { listeners: { "document: mousedown": "handleCodeMousedown($event)" } }, viewQueries: [{ propertyName: "codemirror", first: true, predicate: ["codemirror"], descendants: true, read: i7.CodeMirrorComponent }], usesInheritance: true, ngImport: i0__namespace, template: "<div contenteditable=\"false\" class=\"the-block-operation\" *ngIf=\"codeMirrorFocused && !options.readOnly\">\n    <thy-icon-nav>\n        <the-toolbar-dropdown [menus]=\"menus\" [item]=\"actives\" [itemMousedownHandle]=\"onChangeLangulage\"> </the-toolbar-dropdown>\n        <a\n            href=\"javascript:;\"\n            thyIconNavLink\n            thyIconNavLinkIcon=\"copy\"\n            thyTooltip=\"\u590D\u5236\"\n            thyTooltipPlacement=\"top\"\n            (mousedown)=\"onCopy($event)\"\n        ></a>\n        <a\n            href=\"javascript:;\"\n            thyIconNavLink\n            thyIconNavLinkIcon=\"trash\"\n            thyTooltip=\"\u5220\u9664\"\n            class=\"remove-link\"\n            thyTooltipPlacement=\"top\"\n            (mousedown)=\"onDelete($event)\"\n        ></a>\n        <nav-split-line [mode]=\"ToolbarItemMode.vertical\"></nav-split-line>\n        <span class=\"auto-wrap d-flex align-items-center\">\n            <span>\u81EA\u52A8\u6362\u884C</span>\n            <thy-switch\n                class=\"auto-wrap-btn d-flex\"\n                [(ngModel)]=\"isAutoWrap\"\n                (ngModelChange)=\"onChangeWrap($event)\"\n                thySize=\"sm\"\n            ></thy-switch>\n        </span>\n    </thy-icon-nav>\n</div>\n\n<slate-children [children]=\"children\" [context]=\"childrenContext\" [viewContext]=\"viewContext\"></slate-children>\n<div\n    thyResizable\n    [thyMinHeight]=\"42\"\n    [style.height.px]=\"resizeHeight\"\n    (thyResize)=\"onResize($event)\"\n    (thyResizeStart)=\"onStartResize()\"\n    (thyResizeEnd)=\"onEndResize()\"\n    class=\"resize-code-container\"\n>\n    <ng-codemirror\n        *ngIf=\"startRenderCodemirror\"\n        #codemirror\n        contenteditable=\"false\"\n        class=\"ng-codemirror-wrapper\"\n        [ngStyle]=\"{ maxHeight: maxHeight > 0 ? maxHeight + 'px' : 'auto' }\"\n        [options]=\"options\"\n        [ngModel]=\"code\"\n        [delayRefreshTime]=\"300\"\n        (ngModelChange)=\"codeChange($event)\"\n        (focusChange)=\"focusChange($event)\"\n        [autoMaxHeight]=\"maxHeight\"\n    >\n    </ng-codemirror>\n    <thy-resize-handle thyDirection=\"bottom\" class=\"code-resize-icon\" *ngIf=\"codeMirrorFocused && !options.readOnly\"></thy-resize-handle>\n</div>\n", components: [{ type: i3__namespace.ThyIconNavComponent, selector: "thy-icon-nav", inputs: ["thyType"] }, { type: TheToolbarDropdownComponent, selector: "the-toolbar-dropdown", inputs: ["toolbarItem", "menus", "mode", "item", "itemMousedownHandle"] }, { type: i3__namespace.ThyIconNavLinkComponent, selector: "[thyIconNavLink]", inputs: ["thyIconNavLinkIcon", "thyIconNavLinkActive"] }, { type: NavSplitLineComponent, selector: "nav-split-line", inputs: ["mode"] }, { type: i5__namespace$3.ThySwitchComponent, selector: "thy-switch", inputs: ["thyType", "thySize", "thyDisabled"], outputs: ["thyChange"] }, { type: i1__namespace.SlateChildrenComponent, selector: "slate-children", inputs: ["children", "context", "viewContext"] }, { type: i7__namespace.CodeMirrorComponent, selector: "ng-codemirror, [ngCodeMirror]", inputs: ["autoMaxHeight", "delayRefreshTime", "options"], outputs: ["focusChange"] }, { type: i8__namespace.ThyResizeHandleComponent, selector: "thy-resize-handle, [thy-resize-handle]", inputs: ["thyDirection"], outputs: ["thyMouseDown"], exportAs: ["thyResizeHandle"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace$1.ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { type: i4__namespace$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4__namespace$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i8__namespace.ThyResizableDirective, selector: "[thyResizable]", inputs: ["thyBounds", "thyMaxHeight", "thyMaxWidth", "thyMinHeight", "thyMinWidth", "thyGridColumnCount", "thyMaxColumn", "thyMinColumn", "thyLockAspectRatio", "thyPreview", "thyDisabled"], outputs: ["thyResize", "thyResizeEnd", "thyResizeStart"] }, { type: i6__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    TheCodeComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheCodeComponent, deps: [{ token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }, { token: i1__namespace$4.ThyNotifyService }, { token: TheContextService }, { token: i0__namespace.NgZone }, { token: THE_CODE_MODE_TOKEN }], target: i0__namespace.ɵɵFactoryTarget.Component });
+    TheCodeComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: TheCodeComponent, selector: "div[theCode]", viewQueries: [{ propertyName: "codemirror", first: true, predicate: ["codemirror"], descendants: true, read: i8.CodeMirrorComponent }], usesInheritance: true, ngImport: i0__namespace, template: "<div contenteditable=\"false\" class=\"the-code-block-operation\" *ngIf=\"isFocusCode && !options.readOnly\">\n    <thy-icon-nav>\n        <the-toolbar-dropdown [menus]=\"menus\" [item]=\"actives\" [itemMousedownHandle]=\"onChangeLangulage\"> </the-toolbar-dropdown>\n        <a\n            href=\"javascript:;\"\n            thyIconNavLink\n            thyIconNavLinkIcon=\"copy\"\n            thyTooltip=\"\u590D\u5236\"\n            thyTooltipPlacement=\"top\"\n            (mousedown)=\"onCopy($event)\"\n        ></a>\n        <a\n            href=\"javascript:;\"\n            thyIconNavLink\n            thyIconNavLinkIcon=\"trash\"\n            thyTooltip=\"\u5220\u9664\"\n            class=\"remove-link\"\n            thyTooltipPlacement=\"top\"\n            (mousedown)=\"onDelete($event)\"\n        ></a>\n        <nav-split-line [mode]=\"ToolbarItemMode.vertical\"></nav-split-line>\n        <span class=\"auto-wrap d-flex align-items-center\">\n            <span>\u81EA\u52A8\u6362\u884C</span>\n            <thy-switch\n                class=\"auto-wrap-btn d-flex\"\n                [(ngModel)]=\"element.autoWrap\"\n                (ngModelChange)=\"onChangeWrap($event)\"\n                thySize=\"sm\"\n            ></thy-switch>\n        </span>\n    </thy-icon-nav>\n</div>\n\n<slate-children [children]=\"children\" [context]=\"childrenContext\" [viewContext]=\"viewContext\"></slate-children>\n<div\n    thyResizable\n    [thyMinHeight]=\"42\"\n    [thyBounds]=\"resizeBounds\"\n    [style.height.px]=\"resizeHeight\"\n    (thyResize)=\"onResize($event)\"\n    (thyResizeEnd)=\"onEndResize()\"\n    class=\"resize-code-container\"\n>\n    <ng-codemirror\n        *ngIf=\"startRenderCodemirror\"\n        #codemirror\n        contenteditable=\"false\"\n        class=\"ng-codemirror-wrapper\"\n        [ngStyle]=\"{ maxHeight: maxHeight > 0 ? maxHeight + 'px' : 'auto' }\"\n        [options]=\"options\"\n        [ngModel]=\"code\"\n        [delayRefreshTime]=\"300\"\n        (ngModelChange)=\"codeChange($event)\"\n        (focusChange)=\"focusChange($event)\"\n        [autoMaxHeight]=\"maxHeight\"\n    >\n    </ng-codemirror>\n    <thy-resize-handle thyDirection=\"bottom\" class=\"code-resize-icon\" *ngIf=\"isFocusCode && !options.readOnly\"></thy-resize-handle>\n</div>\n", components: [{ type: i3__namespace.ThyIconNavComponent, selector: "thy-icon-nav", inputs: ["thyType"] }, { type: TheToolbarDropdownComponent, selector: "the-toolbar-dropdown", inputs: ["toolbarItem", "menus", "mode", "item", "itemMousedownHandle"] }, { type: i3__namespace.ThyIconNavLinkComponent, selector: "[thyIconNavLink]", inputs: ["thyIconNavLinkIcon", "thyIconNavLinkActive"] }, { type: NavSplitLineComponent, selector: "nav-split-line", inputs: ["mode"] }, { type: i6__namespace$1.ThySwitchComponent, selector: "thy-switch", inputs: ["thyType", "thySize", "thyDisabled"], outputs: ["thyChange"] }, { type: i1__namespace.SlateChildrenComponent, selector: "slate-children", inputs: ["children", "context", "viewContext"] }, { type: i8__namespace.CodeMirrorComponent, selector: "ng-codemirror, [ngCodeMirror]", inputs: ["autoMaxHeight", "delayRefreshTime", "options"], outputs: ["focusChange"] }, { type: i9__namespace.ThyResizeHandleComponent, selector: "thy-resize-handle, [thy-resize-handle]", inputs: ["thyDirection"], outputs: ["thyMouseDown"], exportAs: ["thyResizeHandle"] }], directives: [{ type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace$1.ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { type: i4__namespace$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4__namespace$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i9__namespace.ThyResizableDirective, selector: "[thyResizable]", inputs: ["thyBounds", "thyMaxHeight", "thyMaxWidth", "thyMinHeight", "thyMinWidth", "thyGridColumnCount", "thyMaxColumn", "thyMinColumn", "thyLockAspectRatio", "thyPreview", "thyDisabled"], outputs: ["thyResize", "thyResizeEnd", "thyResizeStart"] }, { type: i6__namespace.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0__namespace.ChangeDetectionStrategy.OnPush });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheCodeComponent, decorators: [{
                 type: i0.Component,
                 args: [{
                         selector: 'div[theCode]',
-                        templateUrl: './code.component.html'
+                        templateUrl: './code.component.html',
+                        changeDetection: i0.ChangeDetectionStrategy.OnPush
                     }]
             }], ctorParameters: function () {
-            return [{ type: i0__namespace.ElementRef }, { type: i0__namespace.ChangeDetectorRef }, { type: i1__namespace$4.ThyNotifyService }, { type: i0__namespace.NgZone }, { type: TheCodeConfig, decorators: [{
+            return [{ type: i0__namespace.ElementRef }, { type: i0__namespace.ChangeDetectorRef }, { type: i1__namespace$4.ThyNotifyService }, { type: TheContextService }, { type: i0__namespace.NgZone }, { type: TheCodeConfig, decorators: [{
                             type: i0.Inject,
                             args: [THE_CODE_MODE_TOKEN]
                         }] }];
         }, propDecorators: { codemirror: [{
                     type: i0.ViewChild,
-                    args: ['codemirror', { read: i7.CodeMirrorComponent, static: false }]
-                }], handleCodeMousedown: [{
-                    type: i0.HostListener,
-                    args: ['document: mousedown', ['$event']]
+                    args: ['codemirror', { read: i8.CodeMirrorComponent, static: false }]
                 }] } });
 
     var withCode = function (editor) {
@@ -7324,7 +7316,7 @@
         return TheLinkEditComponent;
     }());
     TheLinkEditComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheLinkEditComponent, deps: [{ token: i1__namespace$3.ThyPopoverRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    TheLinkEditComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: TheLinkEditComponent, selector: "the-link-edit", inputs: { tag: "tag", node: "node", link: "link", text: "text", originSelection: "originSelection" }, host: { listeners: { "document: mousedown": "handleDocumentMouseDown($event)" }, properties: { "class": "this.className" } }, ngImport: i0__namespace, template: "<form\n    thyForm\n    #linkForm=\"thyForm\"\n    [thyFormValidatorConfig]=\"validatorConfig\"\n    name=\"linkForm\"\n>\n    <thy-form-group thyLabelText=\"\u6587\u672C\">\n        <input\n            thyInput\n            placeholder=\"\u8BF7\u8F93\u5165\u6587\u672C\"\n            required\n            name=\"text\"\n            [(ngModel)]=\"text\"\n            thyAutofocus\n            type=\"text\"\n        />\n    </thy-form-group>\n    <thy-form-group thyLabelText=\"\u94FE\u63A5\">\n        <input\n            name=\"link\"\n            thyInput\n            placeholder=\"\u8BF7\u8F93\u5165\u94FE\u63A5\"\n            required\n            type=\"text\"\n            #linkControl=\"ngModel\"\n            [(ngModel)]=\"link\"\n        />\n    </thy-form-group>\n    <thy-form-group-footer>\n        <div class=\"btn-pair\">\n            <button\n                thyButton=\"link-secondary\"\n                thySize=\"sm\"\n                (click)=\"closePopover()\"\n            >\u53D6\u6D88</button>\n            <button\n                thyButton=\"primary-square\"\n                thySize=\"sm\"\n                (thyFormSubmit)=\"applyLink(linkForm)\"\n            >\u5E94\u7528</button>\n        </div>\n    </thy-form-group-footer>\n</form>\n", components: [{ type: i2__namespace$1.ThyFormGroupComponent, selector: "thy-form-group", inputs: ["thyLabelText", "thyLabelTextTranslateKey", "thyLabelRequired", "thyLabelPaddingTopClear", "thyFeedbackIcon", "thyTips", "thyTipsTranslateKey", "thyRowFill"] }, { type: i2__namespace$1.ThyFormGroupFooterComponent, selector: "thy-form-group-footer", inputs: ["thyAlign"] }, { type: i1__namespace$5.ThyButtonComponent, selector: "thy-button,[thy-button],[thyButton]", inputs: ["thyButton", "thyType", "thyLoading", "thyLoadingText", "thySize", "thyIcon", "thySquare", "thyBlock"] }], directives: [{ type: i4__namespace$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i4__namespace$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4__namespace$2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$1.ThyFormDirective, selector: "[thyForm],[thy-form]", inputs: ["thyLayout", "thyEnterKeyMode", "thyFormValidatorConfig"], exportAs: ["thyForm"] }, { type: i5__namespace$4.ThyAutofocusDirective, selector: "input[thyAutofocus],textarea[thyAutofocus]", inputs: ["thyAutoSelect", "thyAutofocus"] }, { type: i4__namespace$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5__namespace.ThyInputDirective, selector: "[thyInput]", inputs: ["thySize", "thyAutocomplete"] }, { type: i4__namespace$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i4__namespace$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4__namespace$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i2__namespace$1.ThyFormSubmitDirective, selector: "[thyFormSubmit],[thy-form-submit]", outputs: ["thyFormSubmit"] }] });
+    TheLinkEditComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: TheLinkEditComponent, selector: "the-link-edit", inputs: { tag: "tag", node: "node", link: "link", text: "text", originSelection: "originSelection" }, host: { listeners: { "document: mousedown": "handleDocumentMouseDown($event)" }, properties: { "class": "this.className" } }, ngImport: i0__namespace, template: "<form\n    thyForm\n    #linkForm=\"thyForm\"\n    [thyFormValidatorConfig]=\"validatorConfig\"\n    name=\"linkForm\"\n>\n    <thy-form-group thyLabelText=\"\u6587\u672C\">\n        <input\n            thyInput\n            placeholder=\"\u8BF7\u8F93\u5165\u6587\u672C\"\n            required\n            name=\"text\"\n            [(ngModel)]=\"text\"\n            thyAutofocus\n            type=\"text\"\n        />\n    </thy-form-group>\n    <thy-form-group thyLabelText=\"\u94FE\u63A5\">\n        <input\n            name=\"link\"\n            thyInput\n            placeholder=\"\u8BF7\u8F93\u5165\u94FE\u63A5\"\n            required\n            type=\"text\"\n            #linkControl=\"ngModel\"\n            [(ngModel)]=\"link\"\n        />\n    </thy-form-group>\n    <thy-form-group-footer>\n        <div class=\"btn-pair\">\n            <button\n                thyButton=\"link-secondary\"\n                thySize=\"sm\"\n                (click)=\"closePopover()\"\n            >\u53D6\u6D88</button>\n            <button\n                thyButton=\"primary-square\"\n                thySize=\"sm\"\n                (thyFormSubmit)=\"applyLink(linkForm)\"\n            >\u5E94\u7528</button>\n        </div>\n    </thy-form-group-footer>\n</form>\n", components: [{ type: i2__namespace$1.ThyFormGroupComponent, selector: "thy-form-group", inputs: ["thyLabelText", "thyLabelTextTranslateKey", "thyLabelRequired", "thyLabelPaddingTopClear", "thyFeedbackIcon", "thyTips", "thyTipsTranslateKey", "thyRowFill"] }, { type: i2__namespace$1.ThyFormGroupFooterComponent, selector: "thy-form-group-footer", inputs: ["thyAlign"] }, { type: i1__namespace$5.ThyButtonComponent, selector: "thy-button,[thy-button],[thyButton]", inputs: ["thyButton", "thyType", "thyLoading", "thyLoadingText", "thySize", "thyIcon", "thySquare", "thyBlock"] }], directives: [{ type: i4__namespace$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i4__namespace$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4__namespace$2.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace$1.ThyFormDirective, selector: "[thyForm],[thy-form]", inputs: ["thyLayout", "thyEnterKeyMode", "thyFormValidatorConfig"], exportAs: ["thyForm"] }, { type: i5__namespace$3.ThyAutofocusDirective, selector: "input[thyAutofocus],textarea[thyAutofocus]", inputs: ["thyAutoSelect", "thyAutofocus"] }, { type: i4__namespace$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i5__namespace.ThyInputDirective, selector: "[thyInput]", inputs: ["thySize", "thyAutocomplete"] }, { type: i4__namespace$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { type: i4__namespace$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4__namespace$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i2__namespace$1.ThyFormSubmitDirective, selector: "[thyFormSubmit],[thy-form-submit]", outputs: ["thyFormSubmit"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheLinkEditComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -11622,7 +11614,7 @@
         return TheQuickToolbarComponent;
     }(core.mixinUnsubscribe(core.MixinBase)));
     TheQuickToolbarComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheQuickToolbarComponent, deps: [{ token: i1__namespace$3.ThyPopoverRef }, { token: i0__namespace.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    TheQuickToolbarComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: TheQuickToolbarComponent, selector: "the-quick-toolbar", inputs: { editor: "editor", quickToolbarItems: "quickToolbarItems" }, host: { listeners: { "document: mousedown": "handleMouseDown($event)", "document: keydown.enter": "handleEnter()" } }, usesInheritance: true, ngImport: i0__namespace, 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__namespace$2.ThySelectionListComponent, selector: "thy-selection-list,[thy-selection-list]", inputs: ["thyMultiple", "thyBindKeyEventContainer", "thyScrollContainer", "thyBeforeKeydown", "thyUniqueKey", "thyCompareWith", "thyLayout", "thyAutoActiveFirstItem", "thySize", "thySpaceKeyEnabled"], outputs: ["thySelectionChange"] }, { type: i5__namespace$4.ThyListOptionComponent, selector: "thy-list-option,[thy-list-option]", inputs: ["id", "thyValue", "thyDisabled"] }, { type: TheToolbarItemComponent, selector: "the-toolbar-item", inputs: ["item", "editor", "itemMode"] }, { type: NavSplitLineComponent, selector: "nav-split-line", inputs: ["mode"] }], directives: [{ type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+    TheQuickToolbarComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: TheQuickToolbarComponent, selector: "the-quick-toolbar", inputs: { editor: "editor", quickToolbarItems: "quickToolbarItems" }, host: { listeners: { "document: mousedown": "handleMouseDown($event)", "document: keydown.enter": "handleEnter()" } }, usesInheritance: true, ngImport: i0__namespace, 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__namespace$2.ThySelectionListComponent, selector: "thy-selection-list,[thy-selection-list]", inputs: ["thyMultiple", "thyBindKeyEventContainer", "thyScrollContainer", "thyBeforeKeydown", "thyUniqueKey", "thyCompareWith", "thyLayout", "thyAutoActiveFirstItem", "thySize", "thySpaceKeyEnabled"], outputs: ["thySelectionChange"] }, { type: i5__namespace$3.ThyListOptionComponent, selector: "thy-list-option,[thy-list-option]", inputs: ["id", "thyValue", "thyDisabled"] }, { type: TheToolbarItemComponent, selector: "the-toolbar-item", inputs: ["item", "editor", "itemMode"] }, { type: NavSplitLineComponent, selector: "nav-split-line", inputs: ["mode"] }], directives: [{ type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheQuickToolbarComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -11841,7 +11833,7 @@
         return TheFontSizeToolbarItemComponent;
     }(TheToolbarBaseItemComponent));
     TheFontSizeToolbarItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheFontSizeToolbarItemComponent, deps: [{ token: i0__namespace.ElementRef }, { token: i1__namespace$3.ThyPopover }, { token: i0__namespace.ViewContainerRef }, { token: i2__namespace.Overlay }], target: i0__namespace.ɵɵFactoryTarget.Component });
-    TheFontSizeToolbarItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: TheFontSizeToolbarItemComponent, selector: "the-font-size-toolbar-item", inputs: { editor: "editor", item: "item" }, host: { listeners: { "mousedown": "toggleDropdown($event)", "document: mousedown": "handleDocumentMouseDown($event)" }, properties: { "class.the-toolbar-dropdown-container": "this.toolbarItemContainer", "class.the-font-size-toolbar-item": "this.fontSizeToolbarItem", "class.disabled": "this.disableClass" } }, viewQueries: [{ propertyName: "dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0__namespace, template: "<a thyIconNavLink class=\"text-mode\" [thyTooltip]=\"item?.name\" thyTooltipPlacement=\"top\">\n    <span *ngIf=\"activeSize\" class=\"show-text\">{{ activeSize }}px</span>\n    <thy-icon class=\"text-caret-down-icon font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n</a>\n\n<ng-template #dropdownTemplate>\n    <thy-action-menu class=\"dropdown\">\n        <ng-container *ngFor=\"let size of fontSizes\">\n            <a\n                thyActionMenuItem\n                href=\"javascript:;\"\n                [thyActionMenuItemActive]=\"size === activeSize\"\n                (mousedown)=\"itemMousedown($event, size)\"\n            >\n                <span thyActionMenuItemName>{{ size }}px</span>\n            </a>\n        </ng-container>\n    </thy-action-menu>\n</ng-template>\n", components: [{ type: i3__namespace.ThyIconNavLinkComponent, selector: "[thyIconNavLink]", inputs: ["thyIconNavLinkIcon", "thyIconNavLinkActive"] }, { type: i4__namespace$1.ThyIconComponent, selector: "thy-icon", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { type: i5__namespace$2.ThyActionMenuComponent, selector: "thy-action-menu", inputs: ["thyTheme", "thyWidth"] }], directives: [{ type: i5__namespace$1.ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5__namespace$2.ThyActionMenuItemDirective, selector: "[thyActionMenuItem]", inputs: ["thyDisabled", "thyType"] }, { type: i5__namespace$2.ThyActionMenuItemActiveDirective, selector: "[thyActionMenuItemActive]", inputs: ["thyActionMenuItemActive"] }, { type: i5__namespace$2.ThyActionMenuItemNameDirective, selector: "[thyActionMenuItemName]" }] });
+    TheFontSizeToolbarItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.7", type: TheFontSizeToolbarItemComponent, selector: "the-font-size-toolbar-item", inputs: { editor: "editor", item: "item" }, host: { listeners: { "mousedown": "toggleDropdown($event)", "document: mousedown": "handleDocumentMouseDown($event)" }, properties: { "class.the-toolbar-dropdown-container": "this.toolbarItemContainer", "class.the-font-size-toolbar-item": "this.fontSizeToolbarItem", "class.disabled": "this.disableClass" } }, viewQueries: [{ propertyName: "dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0__namespace, template: "<a thyIconNavLink class=\"text-mode\" [thyTooltip]=\"item?.name\" thyTooltipPlacement=\"top\">\n    <span *ngIf=\"activeSize\" class=\"show-text\">{{ activeSize }}</span>\n    <thy-icon class=\"text-caret-down-icon font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n</a>\n\n<ng-template #dropdownTemplate>\n    <thy-action-menu class=\"dropdown\">\n        <ng-container *ngFor=\"let size of fontSizes\">\n            <a\n                thyActionMenuItem\n                href=\"javascript:;\"\n                [thyActionMenuItemActive]=\"size === activeSize\"\n                (mousedown)=\"itemMousedown($event, size)\"\n            >\n                <span thyActionMenuItemName>{{ size }}</span>\n            </a>\n        </ng-container>\n    </thy-action-menu>\n</ng-template>\n", components: [{ type: i3__namespace.ThyIconNavLinkComponent, selector: "[thyIconNavLink]", inputs: ["thyIconNavLinkIcon", "thyIconNavLinkActive"] }, { type: i4__namespace$1.ThyIconComponent, selector: "thy-icon", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { type: i5__namespace$2.ThyActionMenuComponent, selector: "thy-action-menu", inputs: ["thyTheme", "thyWidth"] }], directives: [{ type: i5__namespace$1.ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { type: i6__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5__namespace$2.ThyActionMenuItemDirective, selector: "[thyActionMenuItem]", inputs: ["thyDisabled", "thyType"] }, { type: i5__namespace$2.ThyActionMenuItemActiveDirective, selector: "[thyActionMenuItemActive]", inputs: ["thyActionMenuItemActive"] }, { type: i5__namespace$2.ThyActionMenuItemNameDirective, selector: "[thyActionMenuItemName]" }] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheFontSizeToolbarItemComponent, decorators: [{
                 type: i0.Component,
                 args: [{
@@ -13256,7 +13248,7 @@
         avatar.ThyAvatarModule,
         i3.ThyNavModule,
         i2$1.ThyFormModule,
-        i5$4.ThySharedModule,
+        i5$3.ThySharedModule,
         i2$2.ThyListModule,
         i5$1.ThyTooltipModule,
         i4.ThyProgressModule,
@@ -13267,8 +13259,8 @@
         i1$5.ThyButtonModule,
         i1$4.ThyNotifyModule,
         i1$1.ThyAlertModule,
-        i8.ThyResizableModule,
-        i5$3.ThySwitchModule
+        i9.ThyResizableModule,
+        i6$1.ThySwitchModule
     ];
     var COMPONENTS = [
         TheToolbarComponent,
@@ -13357,7 +13349,7 @@
             avatar.ThyAvatarModule,
             i3.ThyNavModule,
             i2$1.ThyFormModule,
-            i5$4.ThySharedModule,
+            i5$3.ThySharedModule,
             i2$2.ThyListModule,
             i5$1.ThyTooltipModule,
             i4.ThyProgressModule,
@@ -13368,20 +13360,20 @@
             i1$5.ThyButtonModule,
             i1$4.ThyNotifyModule,
             i1$1.ThyAlertModule,
-            i8.ThyResizableModule,
-            i5$3.ThySwitchModule, i7.CodemirrorModule, TheColumnSizeModule], exports: [TheEditorComponent, TheToolbarComponent, TheToolbarDropdownComponent, TheToolbarItemComponent, TheDefaultElementComponent] });
+            i9.ThyResizableModule,
+            i6$1.ThySwitchModule, i8.CodemirrorModule, TheColumnSizeModule], exports: [TheEditorComponent, TheToolbarComponent, TheToolbarDropdownComponent, TheToolbarItemComponent, TheDefaultElementComponent] });
     TheEditorModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheEditorModule, providers: [
             {
                 provide: TheToolbarGroupToken,
                 useValue: TheToolbarGroupComponent
             },
             THE_CODE_MODE_PROVIDER
-        ], imports: [__spreadArray(__spreadArray([i6.CommonModule, i1.SlateModule, i4$2.FormsModule], __read(TETHYS)), [i7.CodemirrorModule, TheColumnSizeModule])] });
+        ], imports: [__spreadArray(__spreadArray([i6.CommonModule, i1.SlateModule, i4$2.FormsModule], __read(TETHYS)), [i8.CodemirrorModule, TheColumnSizeModule])] });
     i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.7", ngImport: i0__namespace, type: TheEditorModule, decorators: [{
                 type: i0.NgModule,
                 args: [{
                         declarations: __spreadArray(__spreadArray(__spreadArray([TheEditorComponent], __read(PIPES)), __read(COMPONENTS)), __read(PLUGIN_COMPONENTS)),
-                        imports: __spreadArray(__spreadArray([i6.CommonModule, i1.SlateModule, i4$2.FormsModule], __read(TETHYS)), [i7.CodemirrorModule, TheColumnSizeModule]),
+                        imports: __spreadArray(__spreadArray([i6.CommonModule, i1.SlateModule, i4$2.FormsModule], __read(TETHYS)), [i8.CodemirrorModule, TheColumnSizeModule]),
                         exports: [TheEditorComponent, TheToolbarComponent, TheToolbarDropdownComponent, TheToolbarItemComponent, TheDefaultElementComponent],
                         entryComponents: __spreadArray(__spreadArray([], __read(COMPONENTS)), __read(PLUGIN_COMPONENTS)),
                         providers: [