@worktile/theia 13.0.6 → 13.0.7

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.
@@ -760,7 +760,8 @@ class TheColorSelectService {
760
760
  offset: offset !== null ? offset : this.offset,
761
761
  hasBackdrop: this.hasBackdrop,
762
762
  insideClosable: this.insideClosable,
763
- panelClass: 'color-select-container'
763
+ panelClass: 'color-select-container',
764
+ originActiveClass: 'active'
764
765
  });
765
766
  return this.colorSelectRef;
766
767
  }
@@ -6918,27 +6919,18 @@ class TheToolbarDropdownComponent extends TheBaseToolbarDropdown {
6918
6919
  this.thyPopover = thyPopover;
6919
6920
  this.viewContainerRef = viewContainerRef;
6920
6921
  this.overlay = overlay;
6922
+ this.className = 'the-toolbar-dropdown-container';
6921
6923
  this.dropdownMode = DropdownMode;
6922
6924
  }
6923
6925
  get isOpen() {
6924
6926
  return this.dropdownPopoverRef && this.dropdownPopoverRef.getOverlayRef() && this.dropdownPopoverRef.getOverlayRef().hasAttached();
6925
6927
  }
6926
- toggleDropdown(event) {
6927
- super.execute(event);
6928
- if (this.editor?.disabled || this.disabled) {
6929
- return;
6930
- }
6931
- this.openDropdownPopover();
6932
- }
6933
6928
  handleDocumentMouseDown(event) {
6934
6929
  if (!this.elementRef.nativeElement.contains(event.target)) {
6935
6930
  this.closeDropdownPopover();
6936
6931
  }
6937
6932
  }
6938
6933
  ngOnInit() {
6939
- if (!this.template) {
6940
- this.template = this.mode === this.dropdownMode.icon ? this.iconModeTemplate : this.textModeTemplate;
6941
- }
6942
6934
  if (!this.activeMenuItem) {
6943
6935
  this.activeMenuItem = this.defaultDropdownItem;
6944
6936
  }
@@ -6946,6 +6938,13 @@ class TheToolbarDropdownComponent extends TheBaseToolbarDropdown {
6946
6938
  this.elementRef.nativeElement.classList.add(`${this.toolbarItem?.key}`);
6947
6939
  }
6948
6940
  }
6941
+ toggleDropdown(event) {
6942
+ super.execute(event);
6943
+ if (this.editor?.disabled || this.disabled) {
6944
+ return;
6945
+ }
6946
+ this.openDropdownPopover(event);
6947
+ }
6949
6948
  itemMousedown(event, item) {
6950
6949
  super.execute(event);
6951
6950
  this.closeDropdownPopover();
@@ -6960,10 +6959,11 @@ class TheToolbarDropdownComponent extends TheBaseToolbarDropdown {
6960
6959
  item?.execute(this.editor);
6961
6960
  }
6962
6961
  }
6963
- openDropdownPopover() {
6962
+ openDropdownPopover(event) {
6964
6963
  this.dropdownPopoverRef = this.thyPopover.open(this.dropdownTemplate, {
6965
- origin: this.elementRef,
6964
+ origin: event.currentTarget,
6966
6965
  panelClass: ['the-toolbar-dropdown-popover', this.toolbarItem?.key],
6966
+ originActiveClass: 'active',
6967
6967
  placement: 'bottomLeft',
6968
6968
  insideClosable: false,
6969
6969
  backdropClosable: true,
@@ -7004,13 +7004,14 @@ class TheToolbarDropdownComponent extends TheBaseToolbarDropdown {
7004
7004
  }
7005
7005
  }
7006
7006
  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: { "mousedown": "toggleDropdown($event)", "document: mousedown": "handleDocumentMouseDown($event)" }, classAttribute: "the-toolbar-dropdown-container" }, 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: "<ng-template [ngTemplateOutlet]=\"template\"></ng-template>\n\n<ng-template #iconModeTemplate>\n <a\n href=\"javascript:;\"\n class=\"icon-mode link-with-down\"\n thyAction\n [thyActionIcon]=\"activeMenuItem?.icon\"\n [thyTooltip]=\"activeMenuItem?.name\"\n thyTooltipPlacement=\"top\"\n >\n <thy-icon class=\"caret-down-icon font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n </a>\n</ng-template>\n\n<ng-template #textModeTemplate>\n <a href=\"javascript:;\" class=\"text-mode\" thyAction [thyTooltip]=\"activeMenuItem?.name\" thyTooltipPlacement=\"top\">\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</ng-template>\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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { 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: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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]" }] });
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]" }] });
7008
7008
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: TheToolbarDropdownComponent, decorators: [{
7009
7009
  type: Component,
7010
- args: [{ selector: 'the-toolbar-dropdown', host: {
7011
- class: 'the-toolbar-dropdown-container'
7012
- }, template: "<ng-template [ngTemplateOutlet]=\"template\"></ng-template>\n\n<ng-template #iconModeTemplate>\n <a\n href=\"javascript:;\"\n class=\"icon-mode link-with-down\"\n thyAction\n [thyActionIcon]=\"activeMenuItem?.icon\"\n [thyTooltip]=\"activeMenuItem?.name\"\n thyTooltipPlacement=\"top\"\n >\n <thy-icon class=\"caret-down-icon font-size-sm text-desc\" thyIconName=\"caret-down\"></thy-icon>\n </a>\n</ng-template>\n\n<ng-template #textModeTemplate>\n <a href=\"javascript:;\" class=\"text-mode\" thyAction [thyTooltip]=\"activeMenuItem?.name\" thyTooltipPlacement=\"top\">\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</ng-template>\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" }]
7013
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$1.ThyPopover }, { type: i0.ViewContainerRef }, { type: i2$1.Overlay }]; }, propDecorators: { itemMousedownHandle: [{
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" }]
7011
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$1.ThyPopover }, { type: i0.ViewContainerRef }, { type: i2$1.Overlay }]; }, propDecorators: { className: [{
7012
+ type: HostBinding,
7013
+ args: ['class']
7014
+ }], itemMousedownHandle: [{
7014
7015
  type: Input
7015
7016
  }], iconModeTemplate: [{
7016
7017
  type: ViewChild,
@@ -7021,9 +7022,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
7021
7022
  }], dropdownTemplate: [{
7022
7023
  type: ViewChild,
7023
7024
  args: ['dropdownTemplate', { static: true }]
7024
- }], toggleDropdown: [{
7025
- type: HostListener,
7026
- args: ['mousedown', ['$event']]
7027
7025
  }], handleDocumentMouseDown: [{
7028
7026
  type: HostListener,
7029
7027
  args: ['document: mousedown', ['$event']]
@@ -8668,7 +8666,7 @@ class TheTableToolbarComponent {
8668
8666
  insideClosable: false,
8669
8667
  hasBackdrop: false,
8670
8668
  placement: 'bottomLeft',
8671
- originActiveClass: 'table-options-active',
8669
+ originActiveClass: 'active',
8672
8670
  panelClass: 'table-options-pannel'
8673
8671
  });
8674
8672
  }