@worktile/theia 13.0.8 → 13.0.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -40,10 +40,10 @@ import * as i4$2 from 'ngx-tethys/tooltip';
40
40
  import { ThyTooltipModule } from 'ngx-tethys/tooltip';
41
41
  import * as i8 from 'ng-codemirror';
42
42
  import { CodeMirrorComponent, CodemirrorModule } from 'ng-codemirror';
43
- import * as i1$4 from 'ngx-tethys/notify';
44
- import { ThyNotifyModule } from 'ngx-tethys/notify';
45
43
  import * as i5$2 from 'ngx-tethys/dropdown';
46
44
  import { ThyDropdownModule } from 'ngx-tethys/dropdown';
45
+ import * as i1$4 from 'ngx-tethys/notify';
46
+ import { ThyNotifyModule } from 'ngx-tethys/notify';
47
47
  import * as i5$3 from 'ngx-tethys/switch';
48
48
  import { ThySwitchModule } from 'ngx-tethys/switch';
49
49
  import * as i9 from 'ngx-tethys/resizable';
@@ -611,10 +611,6 @@ class TheContextService {
611
611
  const editableElement = this.getEditableElement();
612
612
  return editableElement?.firstElementChild;
613
613
  }
614
- layoutDefaultWidth() {
615
- const firstElementChild = this.getFirstElementChild();
616
- return 0.48 * firstElementChild.clientWidth;
617
- }
618
614
  addUploadingFiles(file) {
619
615
  this.uploadingFiles.push(file);
620
616
  }
@@ -2834,12 +2830,12 @@ class TheImageComponent extends TheBaseElementComponent {
2834
2830
  return this.layoutToolbarRef && this.layoutToolbarRef.getOverlayRef() && this.layoutToolbarRef.getOverlayRef().hasAttached();
2835
2831
  }
2836
2832
  get imageBindingWidth() {
2837
- return this.imageEntry?.layout && this.imageEntry?.width > this.layoutDefaultWidth && !this.imageEntry?.reSized
2833
+ const currentWidth = this.imageEntry?.width || this.naturalWidth;
2834
+ return this.imageEntry?.layout && currentWidth > this.layoutDefaultWidth && !this.imageEntry?.reSized
2838
2835
  ? this.layoutDefaultWidth
2839
2836
  : this.imageEntry.width;
2840
2837
  }
2841
2838
  ngOnInit() {
2842
- this.layoutDefaultWidth = this.theContextService.layoutDefaultWidth();
2843
2839
  this.fileItem = this.theContextService.uploadingFiles.find(item => item.url === this.element.url);
2844
2840
  if (this.fileItem?.file && this.fileItem.file instanceof File) {
2845
2841
  this.uploadImage(this.fileItem.file);
@@ -2860,6 +2856,10 @@ class TheImageComponent extends TheBaseElementComponent {
2860
2856
  ngOnDestroy() {
2861
2857
  this.uploadingSubscription.unsubscribe();
2862
2858
  this.mouseUpSubscription.unsubscribe();
2859
+ this.theContextService.removeUploadImage(this.fileItem);
2860
+ if (this.uploading) {
2861
+ this.theContextService.uploadingStatus$.next(false);
2862
+ }
2863
2863
  super.ngOnDestroy();
2864
2864
  }
2865
2865
  ngAfterViewInit() {
@@ -2915,7 +2915,7 @@ class TheImageComponent extends TheBaseElementComponent {
2915
2915
  printerPositionY: event.pageY,
2916
2916
  internalWidth: imgElement.width || this.imageEntry.width,
2917
2917
  internalHeight: imgElement.height || this.imageEntry.height,
2918
- maxWidth: this.theContextService.getOptions().width
2918
+ maxWidth: this.theContextService.getFirstElementChild().clientWidth
2919
2919
  };
2920
2920
  this.mouseMoveSubscription = this.theContextService.onMouseMove$.subscribe(e => this.mouseMoveHandle(e, options));
2921
2921
  }
@@ -6925,17 +6925,12 @@ class TheToolbarDropdownComponent extends TheBaseToolbarDropdown {
6925
6925
  get isOpen() {
6926
6926
  return this.dropdownPopoverRef && this.dropdownPopoverRef.getOverlayRef() && this.dropdownPopoverRef.getOverlayRef().hasAttached();
6927
6927
  }
6928
- handleDocumentMouseDown(event) {
6929
- if (!this.elementRef.nativeElement.contains(event.target)) {
6930
- this.closeDropdownPopover();
6931
- }
6932
- }
6933
6928
  ngOnInit() {
6934
6929
  if (!this.activeMenuItem) {
6935
6930
  this.activeMenuItem = this.defaultDropdownItem;
6936
6931
  }
6937
- if (this.toolbarItem) {
6938
- this.elementRef.nativeElement.classList.add(`${this.toolbarItem?.key}`);
6932
+ if (this.toolbarItem && this.toolbarItem?.key) {
6933
+ this.elementRef.nativeElement?.classList?.add(`${this.toolbarItem?.key}`);
6939
6934
  }
6940
6935
  }
6941
6936
  toggleDropdown(event) {
@@ -6959,6 +6954,9 @@ class TheToolbarDropdownComponent extends TheBaseToolbarDropdown {
6959
6954
  item?.execute(this.editor);
6960
6955
  }
6961
6956
  }
6957
+ preventDefault(event) {
6958
+ event.preventDefault();
6959
+ }
6962
6960
  openDropdownPopover(event) {
6963
6961
  this.dropdownPopoverRef = this.thyPopover.open(this.dropdownTemplate, {
6964
6962
  origin: event.currentTarget,
@@ -6966,6 +6964,7 @@ class TheToolbarDropdownComponent extends TheBaseToolbarDropdown {
6966
6964
  originActiveClass: 'active',
6967
6965
  placement: 'bottomLeft',
6968
6966
  insideClosable: false,
6967
+ outsideClosable: true,
6969
6968
  backdropClosable: true,
6970
6969
  hasBackdrop: false,
6971
6970
  offset: 10,
@@ -7004,10 +7003,10 @@ class TheToolbarDropdownComponent extends TheBaseToolbarDropdown {
7004
7003
  }
7005
7004
  }
7006
7005
  TheToolbarDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TheToolbarDropdownComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.ThyPopover }, { token: i0.ViewContainerRef }, { token: i2$1.Overlay }], target: i0.ɵɵFactoryTarget.Component });
7007
- TheToolbarDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: TheToolbarDropdownComponent, selector: "the-toolbar-dropdown", inputs: { itemMousedownHandle: "itemMousedownHandle" }, host: { listeners: { "document: mousedown": "handleDocumentMouseDown($event)" }, properties: { "class": "this.className" } }, viewQueries: [{ propertyName: "iconModeTemplate", first: true, predicate: ["iconModeTemplate"], descendants: true, static: true }, { propertyName: "textModeTemplate", first: true, predicate: ["textModeTemplate"], descendants: true, static: true }, { propertyName: "dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<a\n *ngIf=\"mode === dropdownMode.icon\"\n href=\"javascript:;\"\n class=\"icon-mode link-with-down\"\n thyAction\n [thyActionIcon]=\"activeMenuItem?.icon\"\n [thyTooltip]=\"activeMenuItem?.name\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"toggleDropdown($event)\"\n>\n <thy-icon class=\"caret-down-icon font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n</a>\n<a\n *ngIf=\"mode !== dropdownMode.icon\"\n href=\"javascript:;\"\n class=\"text-mode\"\n thyAction\n [thyTooltip]=\"activeMenuItem?.name\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"toggleDropdown($event)\"\n>\n <span class=\"show-text\">{{ activeMenuItem?.name }}</span>\n <thy-icon class=\"font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n</a>\n\n<ng-template #dropdownTemplate>\n <div class=\"thy-dropdown-menu\">\n <ng-container *ngFor=\"let menu of menus\">\n <a\n *ngIf=\"menu.key !== 'split'\"\n href=\"javascript:;\"\n thyDropdownMenuItem\n [thyDropdownMenuItemActive]=\"menu.key === activeMenuItem?.key && !toolbarItem?.dropdownFixedIcon\"\n (mousedown)=\"itemMousedown($event, menu)\"\n [ngStyle]=\"menu?.styles\"\n >\n <thy-icon *ngIf=\"menu.icon && mode === dropdownMode.icon\" thyDropdownMenuItemIcon [thyIconName]=\"menu.icon\"></thy-icon>\n <span *ngIf=\"menu.name\" thyDropdownMenuItemName>{{ menu.name }}</span>\n </a>\n <thy-dropdown-menu-divider *ngIf=\"menu.key === 'split'\"></thy-dropdown-menu-divider>\n </ng-container>\n </div>\n</ng-template>\n", components: [{ type: i3$1.ThyActionComponent, selector: "thy-action, [thyAction]", inputs: ["thyType", "thyIcon", "thyActionIcon", "thyActive", "thyActionActive", "thyTheme", "thyHoverIcon", "thyDisabled"] }, { type: i2.ThyIconComponent, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { type: i5$2.ThyDropdownMenuDividerComponent, selector: "thy-dropdown-menu-divider" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$2.ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5$2.ThyDropdownMenuItemDirective, selector: "[thyDropdownMenuItem]", inputs: ["thyType", "thyDisabled"] }, { type: i5$2.ThyDropdownMenuItemActiveDirective, selector: "[thyDropdownMenuItemActive]", inputs: ["thyDropdownMenuItemActive"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i5$2.ThyDropdownMenuItemIconDirective, selector: "[thyDropdownMenuItemIcon]" }, { type: i5$2.ThyDropdownMenuItemNameDirective, selector: "[thyDropdownMenuItemName]" }] });
7006
+ TheToolbarDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: TheToolbarDropdownComponent, selector: "the-toolbar-dropdown", inputs: { itemMousedownHandle: "itemMousedownHandle" }, host: { properties: { "class": "this.className" } }, viewQueries: [{ propertyName: "iconModeTemplate", first: true, predicate: ["iconModeTemplate"], descendants: true, static: true }, { propertyName: "textModeTemplate", first: true, predicate: ["textModeTemplate"], descendants: true, static: true }, { propertyName: "dropdownTemplate", first: true, predicate: ["dropdownTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<a\n *ngIf=\"mode === dropdownMode.icon\"\n href=\"javascript:;\"\n class=\"icon-mode link-with-down\"\n thyAction\n [thyActionIcon]=\"activeMenuItem?.icon\"\n [thyTooltip]=\"activeMenuItem?.name\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"preventDefault($event)\"\n (click)=\"toggleDropdown($event)\"\n>\n <thy-icon class=\"caret-down-icon font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n</a>\n<a\n *ngIf=\"mode !== dropdownMode.icon\"\n href=\"javascript:;\"\n class=\"text-mode\"\n thyAction\n [thyTooltip]=\"activeMenuItem?.name\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"preventDefault($event)\"\n (click)=\"toggleDropdown($event)\"\n>\n <span class=\"show-text\">{{ activeMenuItem?.name }}</span>\n <thy-icon class=\"font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n</a>\n\n<ng-template #dropdownTemplate>\n <div class=\"thy-dropdown-menu\">\n <ng-container *ngFor=\"let menu of menus\">\n <a\n *ngIf=\"menu.key !== 'split'\"\n href=\"javascript:;\"\n thyDropdownMenuItem\n [ngStyle]=\"menu?.styles\"\n [thyDropdownMenuItemActive]=\"menu.key === activeMenuItem?.key && !toolbarItem?.dropdownFixedIcon\"\n (mousedown)=\"preventDefault($event)\"\n (click)=\"itemMousedown($event, menu)\"\n >\n <thy-icon *ngIf=\"menu.icon && mode === dropdownMode.icon\" thyDropdownMenuItemIcon [thyIconName]=\"menu.icon\"></thy-icon>\n <span *ngIf=\"menu.name\" thyDropdownMenuItemName>{{ menu.name }}</span>\n </a>\n <thy-dropdown-menu-divider *ngIf=\"menu.key === 'split'\"></thy-dropdown-menu-divider>\n </ng-container>\n </div>\n</ng-template>\n", components: [{ type: i3$1.ThyActionComponent, selector: "thy-action, [thyAction]", inputs: ["thyType", "thyIcon", "thyActionIcon", "thyActive", "thyActionActive", "thyTheme", "thyHoverIcon", "thyDisabled"] }, { type: i2.ThyIconComponent, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { type: i5$2.ThyDropdownMenuDividerComponent, selector: "thy-dropdown-menu-divider" }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$2.ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5$2.ThyDropdownMenuItemDirective, selector: "[thyDropdownMenuItem]", inputs: ["thyType", "thyDisabled"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i5$2.ThyDropdownMenuItemActiveDirective, selector: "[thyDropdownMenuItemActive]", inputs: ["thyDropdownMenuItemActive"] }, { type: i5$2.ThyDropdownMenuItemIconDirective, selector: "[thyDropdownMenuItemIcon]" }, { type: i5$2.ThyDropdownMenuItemNameDirective, selector: "[thyDropdownMenuItemName]" }] });
7008
7007
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TheToolbarDropdownComponent, decorators: [{
7009
7008
  type: Component,
7010
- args: [{ selector: 'the-toolbar-dropdown', template: "<a\n *ngIf=\"mode === dropdownMode.icon\"\n href=\"javascript:;\"\n class=\"icon-mode link-with-down\"\n thyAction\n [thyActionIcon]=\"activeMenuItem?.icon\"\n [thyTooltip]=\"activeMenuItem?.name\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"toggleDropdown($event)\"\n>\n <thy-icon class=\"caret-down-icon font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n</a>\n<a\n *ngIf=\"mode !== dropdownMode.icon\"\n href=\"javascript:;\"\n class=\"text-mode\"\n thyAction\n [thyTooltip]=\"activeMenuItem?.name\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"toggleDropdown($event)\"\n>\n <span class=\"show-text\">{{ activeMenuItem?.name }}</span>\n <thy-icon class=\"font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n</a>\n\n<ng-template #dropdownTemplate>\n <div class=\"thy-dropdown-menu\">\n <ng-container *ngFor=\"let menu of menus\">\n <a\n *ngIf=\"menu.key !== 'split'\"\n href=\"javascript:;\"\n thyDropdownMenuItem\n [thyDropdownMenuItemActive]=\"menu.key === activeMenuItem?.key && !toolbarItem?.dropdownFixedIcon\"\n (mousedown)=\"itemMousedown($event, menu)\"\n [ngStyle]=\"menu?.styles\"\n >\n <thy-icon *ngIf=\"menu.icon && mode === dropdownMode.icon\" thyDropdownMenuItemIcon [thyIconName]=\"menu.icon\"></thy-icon>\n <span *ngIf=\"menu.name\" thyDropdownMenuItemName>{{ menu.name }}</span>\n </a>\n <thy-dropdown-menu-divider *ngIf=\"menu.key === 'split'\"></thy-dropdown-menu-divider>\n </ng-container>\n </div>\n</ng-template>\n" }]
7009
+ args: [{ selector: 'the-toolbar-dropdown', template: "<a\n *ngIf=\"mode === dropdownMode.icon\"\n href=\"javascript:;\"\n class=\"icon-mode link-with-down\"\n thyAction\n [thyActionIcon]=\"activeMenuItem?.icon\"\n [thyTooltip]=\"activeMenuItem?.name\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"preventDefault($event)\"\n (click)=\"toggleDropdown($event)\"\n>\n <thy-icon class=\"caret-down-icon font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n</a>\n<a\n *ngIf=\"mode !== dropdownMode.icon\"\n href=\"javascript:;\"\n class=\"text-mode\"\n thyAction\n [thyTooltip]=\"activeMenuItem?.name\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"preventDefault($event)\"\n (click)=\"toggleDropdown($event)\"\n>\n <span class=\"show-text\">{{ activeMenuItem?.name }}</span>\n <thy-icon class=\"font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n</a>\n\n<ng-template #dropdownTemplate>\n <div class=\"thy-dropdown-menu\">\n <ng-container *ngFor=\"let menu of menus\">\n <a\n *ngIf=\"menu.key !== 'split'\"\n href=\"javascript:;\"\n thyDropdownMenuItem\n [ngStyle]=\"menu?.styles\"\n [thyDropdownMenuItemActive]=\"menu.key === activeMenuItem?.key && !toolbarItem?.dropdownFixedIcon\"\n (mousedown)=\"preventDefault($event)\"\n (click)=\"itemMousedown($event, menu)\"\n >\n <thy-icon *ngIf=\"menu.icon && mode === dropdownMode.icon\" thyDropdownMenuItemIcon [thyIconName]=\"menu.icon\"></thy-icon>\n <span *ngIf=\"menu.name\" thyDropdownMenuItemName>{{ menu.name }}</span>\n </a>\n <thy-dropdown-menu-divider *ngIf=\"menu.key === 'split'\"></thy-dropdown-menu-divider>\n </ng-container>\n </div>\n</ng-template>\n" }]
7011
7010
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$1.ThyPopover }, { type: i0.ViewContainerRef }, { type: i2$1.Overlay }]; }, propDecorators: { className: [{
7012
7011
  type: HostBinding,
7013
7012
  args: ['class']
@@ -7022,9 +7021,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
7022
7021
  }], dropdownTemplate: [{
7023
7022
  type: ViewChild,
7024
7023
  args: ['dropdownTemplate', { static: true }]
7025
- }], handleDocumentMouseDown: [{
7026
- type: HostListener,
7027
- args: ['document: mousedown', ['$event']]
7028
7024
  }] } });
7029
7025
 
7030
7026
  class TheCodeComponent extends TheBaseElementComponent {
@@ -7232,16 +7228,19 @@ class TheCodeComponent extends TheBaseElementComponent {
7232
7228
  }
7233
7229
  }
7234
7230
  TheCodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TheCodeComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1$4.ThyNotifyService }, { token: TheContextService }, { token: i0.NgZone }, { token: THE_MODE_TOKEN }], target: i0.ɵɵFactoryTarget.Component });
7235
- TheCodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: TheCodeComponent, selector: "div[theCode]", viewQueries: [{ propertyName: "codemirror", first: true, predicate: ["codemirror"], descendants: true, read: CodeMirrorComponent }], usesInheritance: true, ngImport: i0, template: "<thy-actions *ngIf=\"isCollapsed && codemirror && !options.readOnly\" contenteditable=\"false\" class=\"the-code-block-operation\" thySize=\"xxs\">\n <the-toolbar-dropdown\n [menus]=\"menus\"\n [toolbarItem]=\"activeLanguage\"\n [dropdownItemKey]=\"activeLanguage?.key\"\n [itemMousedownHandle]=\"onChangeLanguage\"\n >\n </the-toolbar-dropdown>\n <span class=\"auto-wrap d-flex align-items-center px-2 text-secondary\">\n <span>\u81EA\u52A8\u6362\u884C</span>\n <thy-switch\n class=\"auto-wrap-btn d-flex ml-1\"\n [(ngModel)]=\"options.lineWrapping\"\n (ngModelChange)=\"onChangeWrap($event)\"\n thySize=\"sm\"\n ></thy-switch>\n </span>\n <a href=\"javascript:;\" thyAction thyActionIcon=\"copy\" thyTooltip=\"\u590D\u5236\" thyTooltipPlacement=\"top\" (mousedown)=\"onCopy($event)\"></a>\n <thy-divider class=\"mx-2 align-self-center\" [thyVertical]=\"true\"></thy-divider>\n <a\n href=\"javascript:;\"\n thyAction\n thyType=\"danger\"\n thyActionIcon=\"trash\"\n thyTooltip=\"\u5220\u9664\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"onDelete($event)\"\n ></a>\n</thy-actions>\n\n<slate-children [children]=\"children\" [context]=\"childrenContext\" [viewContext]=\"viewContext\"></slate-children>\n\n<!-- \u53EA\u8BFB\u6A21\u5F0F\u4E0BCodeMirror-sizer\u9AD8\u5EA6\u6BD4\u7F16\u8F91\u6A21\u5F0F\u4E0B\u591A2px\uFF0C\u8BBE\u7F6EthyMinHeight\u4E3A46px\u9632\u6B62\u62D6\u62FD\u5230\u6700\u5C0F\u9AD8\u5EA6\u65F6\u53EA\u8BFB\u6A21\u5F0F\u4E0B\u51FA\u73B0\u6EDA\u52A8\u6761 -->\n<div\n thyResizable\n [thyMinHeight]=\"46\"\n [thyBounds]=\"resizeBounds\"\n [style.height.px]=\"resizeHeight\"\n (thyResize)=\"onResize($event)\"\n (thyResizeEnd)=\"onEndResize()\"\n class=\"resize-code-container\"\n [ngClass]=\"{ focus: isCollapsed, readonly: options.readOnly, active: isHightLight && isCollapsed }\"\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=\"isCollapsed && !options.readOnly\"></thy-resize-handle>\n</div>\n", components: [{ type: i3$1.ThyActionsComponent, selector: "thy-actions", inputs: ["thySize"] }, { type: TheToolbarDropdownComponent, selector: "the-toolbar-dropdown", inputs: ["itemMousedownHandle"] }, { type: i5$3.ThySwitchComponent, selector: "thy-switch", inputs: ["thyType", "thySize", "thyDisabled"], outputs: ["thyChange"] }, { type: i3$1.ThyActionComponent, selector: "thy-action, [thyAction]", inputs: ["thyType", "thyIcon", "thyActionIcon", "thyActive", "thyActionActive", "thyTheme", "thyHoverIcon", "thyDisabled"] }, { type: i4$1.ThyDividerComponent, selector: "thy-divider", inputs: ["thyVertical", "thyStyle", "thyColor", "thyText", "thyTextDirection", "thyDeeper"] }, { type: i1.SlateChildrenComponent, selector: "slate-children", inputs: ["children", "context", "viewContext"] }, { type: i8.CodeMirrorComponent, selector: "ng-codemirror, [ngCodeMirror]", inputs: ["autoMaxHeight", "options", "delayRefreshTime"], outputs: ["focusChange"] }, { type: i9.ThyResizeHandleComponent, selector: "thy-resize-handle, [thy-resize-handle]", inputs: ["thyDirection"], outputs: ["thyMouseDown"], exportAs: ["thyResizeHandle"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i4$2.ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { type: i9.ThyResizableDirective, selector: "[thyResizable]", inputs: ["thyBounds", "thyMaxHeight", "thyMaxWidth", "thyMinHeight", "thyMinWidth", "thyGridColumnCount", "thyMaxColumn", "thyMinColumn", "thyLockAspectRatio", "thyPreview", "thyDisabled"], outputs: ["thyResize", "thyResizeEnd", "thyResizeStart"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
7231
+ TheCodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: TheCodeComponent, selector: "div[theCode]", viewQueries: [{ propertyName: "codemirror", first: true, predicate: ["codemirror"], descendants: true, read: CodeMirrorComponent }, { propertyName: "toolbarDropdownComponent", first: true, predicate: TheToolbarDropdownComponent, descendants: true, read: TheToolbarDropdownComponent }], usesInheritance: true, ngImport: i0, template: "<thy-actions\n *ngIf=\"(isCollapsed && codemirror && !options.readOnly) || toolbarDropdownComponent?.isOpen\"\n contenteditable=\"false\"\n class=\"the-code-block-operation\"\n thySize=\"xxs\"\n>\n <the-toolbar-dropdown\n [menus]=\"menus\"\n [toolbarItem]=\"activeLanguage\"\n [dropdownItemKey]=\"activeLanguage?.key\"\n [itemMousedownHandle]=\"onChangeLanguage\"\n >\n </the-toolbar-dropdown>\n <span class=\"auto-wrap d-flex align-items-center px-2 text-secondary\">\n <span>\u81EA\u52A8\u6362\u884C</span>\n <thy-switch\n class=\"auto-wrap-btn d-flex ml-1\"\n [(ngModel)]=\"options.lineWrapping\"\n (ngModelChange)=\"onChangeWrap($event)\"\n thySize=\"sm\"\n ></thy-switch>\n </span>\n <a href=\"javascript:;\" thyAction thyActionIcon=\"copy\" thyTooltip=\"\u590D\u5236\" thyTooltipPlacement=\"top\" (mousedown)=\"onCopy($event)\"></a>\n <thy-divider class=\"mx-2 align-self-center\" [thyVertical]=\"true\"></thy-divider>\n <a\n href=\"javascript:;\"\n thyAction\n thyType=\"danger\"\n thyActionIcon=\"trash\"\n thyTooltip=\"\u5220\u9664\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"onDelete($event)\"\n ></a>\n</thy-actions>\n\n<slate-children [children]=\"children\" [context]=\"childrenContext\" [viewContext]=\"viewContext\"></slate-children>\n\n<!-- \u53EA\u8BFB\u6A21\u5F0F\u4E0BCodeMirror-sizer\u9AD8\u5EA6\u6BD4\u7F16\u8F91\u6A21\u5F0F\u4E0B\u591A2px\uFF0C\u8BBE\u7F6EthyMinHeight\u4E3A46px\u9632\u6B62\u62D6\u62FD\u5230\u6700\u5C0F\u9AD8\u5EA6\u65F6\u53EA\u8BFB\u6A21\u5F0F\u4E0B\u51FA\u73B0\u6EDA\u52A8\u6761 -->\n<div\n thyResizable\n [thyMinHeight]=\"46\"\n [thyBounds]=\"resizeBounds\"\n [style.height.px]=\"resizeHeight\"\n (thyResize)=\"onResize($event)\"\n (thyResizeEnd)=\"onEndResize()\"\n class=\"resize-code-container\"\n [ngClass]=\"{ focus: isCollapsed, readonly: options.readOnly, active: isHightLight && isCollapsed }\"\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=\"isCollapsed && !options.readOnly\"></thy-resize-handle>\n</div>\n", components: [{ type: i3$1.ThyActionsComponent, selector: "thy-actions", inputs: ["thySize"] }, { type: TheToolbarDropdownComponent, selector: "the-toolbar-dropdown", inputs: ["itemMousedownHandle"] }, { type: i5$3.ThySwitchComponent, selector: "thy-switch", inputs: ["thyType", "thySize", "thyDisabled"], outputs: ["thyChange"] }, { type: i3$1.ThyActionComponent, selector: "thy-action, [thyAction]", inputs: ["thyType", "thyIcon", "thyActionIcon", "thyActive", "thyActionActive", "thyTheme", "thyHoverIcon", "thyDisabled"] }, { type: i4$1.ThyDividerComponent, selector: "thy-divider", inputs: ["thyVertical", "thyStyle", "thyColor", "thyText", "thyTextDirection", "thyDeeper"] }, { type: i1.SlateChildrenComponent, selector: "slate-children", inputs: ["children", "context", "viewContext"] }, { type: i8.CodeMirrorComponent, selector: "ng-codemirror, [ngCodeMirror]", inputs: ["autoMaxHeight", "options", "delayRefreshTime"], outputs: ["focusChange"] }, { type: i9.ThyResizeHandleComponent, selector: "thy-resize-handle, [thy-resize-handle]", inputs: ["thyDirection"], outputs: ["thyMouseDown"], exportAs: ["thyResizeHandle"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i4$2.ThyTooltipDirective, selector: "[thyTooltip],[thy-tooltip]", inputs: ["thyTooltip", "thyTooltipPlacement", "thyTooltipClass", "thyTooltipShowDelay", "thyTooltipHideDelay", "thyTooltipTrigger", "thyTooltipDisabled", "thyTooltipTemplateContext", "thyTooltipOffset", "thyTooltipPin"], exportAs: ["thyTooltip"] }, { type: i9.ThyResizableDirective, selector: "[thyResizable]", inputs: ["thyBounds", "thyMaxHeight", "thyMaxWidth", "thyMinHeight", "thyMinWidth", "thyGridColumnCount", "thyMaxColumn", "thyMinColumn", "thyLockAspectRatio", "thyPreview", "thyDisabled"], outputs: ["thyResize", "thyResizeEnd", "thyResizeStart"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
7236
7232
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TheCodeComponent, decorators: [{
7237
7233
  type: Component,
7238
- args: [{ selector: 'div[theCode]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<thy-actions *ngIf=\"isCollapsed && codemirror && !options.readOnly\" contenteditable=\"false\" class=\"the-code-block-operation\" thySize=\"xxs\">\n <the-toolbar-dropdown\n [menus]=\"menus\"\n [toolbarItem]=\"activeLanguage\"\n [dropdownItemKey]=\"activeLanguage?.key\"\n [itemMousedownHandle]=\"onChangeLanguage\"\n >\n </the-toolbar-dropdown>\n <span class=\"auto-wrap d-flex align-items-center px-2 text-secondary\">\n <span>\u81EA\u52A8\u6362\u884C</span>\n <thy-switch\n class=\"auto-wrap-btn d-flex ml-1\"\n [(ngModel)]=\"options.lineWrapping\"\n (ngModelChange)=\"onChangeWrap($event)\"\n thySize=\"sm\"\n ></thy-switch>\n </span>\n <a href=\"javascript:;\" thyAction thyActionIcon=\"copy\" thyTooltip=\"\u590D\u5236\" thyTooltipPlacement=\"top\" (mousedown)=\"onCopy($event)\"></a>\n <thy-divider class=\"mx-2 align-self-center\" [thyVertical]=\"true\"></thy-divider>\n <a\n href=\"javascript:;\"\n thyAction\n thyType=\"danger\"\n thyActionIcon=\"trash\"\n thyTooltip=\"\u5220\u9664\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"onDelete($event)\"\n ></a>\n</thy-actions>\n\n<slate-children [children]=\"children\" [context]=\"childrenContext\" [viewContext]=\"viewContext\"></slate-children>\n\n<!-- \u53EA\u8BFB\u6A21\u5F0F\u4E0BCodeMirror-sizer\u9AD8\u5EA6\u6BD4\u7F16\u8F91\u6A21\u5F0F\u4E0B\u591A2px\uFF0C\u8BBE\u7F6EthyMinHeight\u4E3A46px\u9632\u6B62\u62D6\u62FD\u5230\u6700\u5C0F\u9AD8\u5EA6\u65F6\u53EA\u8BFB\u6A21\u5F0F\u4E0B\u51FA\u73B0\u6EDA\u52A8\u6761 -->\n<div\n thyResizable\n [thyMinHeight]=\"46\"\n [thyBounds]=\"resizeBounds\"\n [style.height.px]=\"resizeHeight\"\n (thyResize)=\"onResize($event)\"\n (thyResizeEnd)=\"onEndResize()\"\n class=\"resize-code-container\"\n [ngClass]=\"{ focus: isCollapsed, readonly: options.readOnly, active: isHightLight && isCollapsed }\"\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=\"isCollapsed && !options.readOnly\"></thy-resize-handle>\n</div>\n" }]
7234
+ args: [{ selector: 'div[theCode]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<thy-actions\n *ngIf=\"(isCollapsed && codemirror && !options.readOnly) || toolbarDropdownComponent?.isOpen\"\n contenteditable=\"false\"\n class=\"the-code-block-operation\"\n thySize=\"xxs\"\n>\n <the-toolbar-dropdown\n [menus]=\"menus\"\n [toolbarItem]=\"activeLanguage\"\n [dropdownItemKey]=\"activeLanguage?.key\"\n [itemMousedownHandle]=\"onChangeLanguage\"\n >\n </the-toolbar-dropdown>\n <span class=\"auto-wrap d-flex align-items-center px-2 text-secondary\">\n <span>\u81EA\u52A8\u6362\u884C</span>\n <thy-switch\n class=\"auto-wrap-btn d-flex ml-1\"\n [(ngModel)]=\"options.lineWrapping\"\n (ngModelChange)=\"onChangeWrap($event)\"\n thySize=\"sm\"\n ></thy-switch>\n </span>\n <a href=\"javascript:;\" thyAction thyActionIcon=\"copy\" thyTooltip=\"\u590D\u5236\" thyTooltipPlacement=\"top\" (mousedown)=\"onCopy($event)\"></a>\n <thy-divider class=\"mx-2 align-self-center\" [thyVertical]=\"true\"></thy-divider>\n <a\n href=\"javascript:;\"\n thyAction\n thyType=\"danger\"\n thyActionIcon=\"trash\"\n thyTooltip=\"\u5220\u9664\"\n thyTooltipPlacement=\"top\"\n (mousedown)=\"onDelete($event)\"\n ></a>\n</thy-actions>\n\n<slate-children [children]=\"children\" [context]=\"childrenContext\" [viewContext]=\"viewContext\"></slate-children>\n\n<!-- \u53EA\u8BFB\u6A21\u5F0F\u4E0BCodeMirror-sizer\u9AD8\u5EA6\u6BD4\u7F16\u8F91\u6A21\u5F0F\u4E0B\u591A2px\uFF0C\u8BBE\u7F6EthyMinHeight\u4E3A46px\u9632\u6B62\u62D6\u62FD\u5230\u6700\u5C0F\u9AD8\u5EA6\u65F6\u53EA\u8BFB\u6A21\u5F0F\u4E0B\u51FA\u73B0\u6EDA\u52A8\u6761 -->\n<div\n thyResizable\n [thyMinHeight]=\"46\"\n [thyBounds]=\"resizeBounds\"\n [style.height.px]=\"resizeHeight\"\n (thyResize)=\"onResize($event)\"\n (thyResizeEnd)=\"onEndResize()\"\n class=\"resize-code-container\"\n [ngClass]=\"{ focus: isCollapsed, readonly: options.readOnly, active: isHightLight && isCollapsed }\"\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=\"isCollapsed && !options.readOnly\"></thy-resize-handle>\n</div>\n" }]
7239
7235
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1$4.ThyNotifyService }, { type: TheContextService }, { type: i0.NgZone }, { type: TheModeConfig, decorators: [{
7240
7236
  type: Inject,
7241
7237
  args: [THE_MODE_TOKEN]
7242
7238
  }] }]; }, propDecorators: { codemirror: [{
7243
7239
  type: ViewChild,
7244
7240
  args: ['codemirror', { read: CodeMirrorComponent, static: false }]
7241
+ }], toolbarDropdownComponent: [{
7242
+ type: ViewChild,
7243
+ args: [TheToolbarDropdownComponent, { read: TheToolbarDropdownComponent, static: false }]
7245
7244
  }] } });
7246
7245
 
7247
7246
  const withCode = (editor) => {
@@ -11335,6 +11334,9 @@ class TheToolbarItemComponent extends TheBaseToolbarItem {
11335
11334
  this.renderToolbarItem();
11336
11335
  }
11337
11336
  }
11337
+ preventDefault(event) {
11338
+ event.preventDefault();
11339
+ }
11338
11340
  execute(event) {
11339
11341
  super.execute(event);
11340
11342
  if (this.editor?.disabled || this.disabled || !this.toolbarItem?.execute) {
@@ -11362,7 +11364,8 @@ TheToolbarItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0"
11362
11364
  [thyTooltip]="tooltip"
11363
11365
  [thyTooltipTemplateContext]="{ name: toolbarItem.name, shortcutKey: toolbarItem.shortcutKey }"
11364
11366
  thyTooltipPlacement="top"
11365
- (mousedown)="execute($event)"
11367
+ (mousedown)="preventDefault($event)"
11368
+ (click)="execute($event)"
11366
11369
  ></a>
11367
11370
  </ng-container>
11368
11371
  <ng-template #selectionItem>
@@ -11388,7 +11391,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
11388
11391
  [thyTooltip]="tooltip"
11389
11392
  [thyTooltipTemplateContext]="{ name: toolbarItem.name, shortcutKey: toolbarItem.shortcutKey }"
11390
11393
  thyTooltipPlacement="top"
11391
- (mousedown)="execute($event)"
11394
+ (mousedown)="preventDefault($event)"
11395
+ (click)="execute($event)"
11392
11396
  ></a>
11393
11397
  </ng-container>
11394
11398
  <ng-template #selectionItem>