@smartbit4all/ng-client 6.0.26 → 6.0.28

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.
@@ -3392,13 +3392,11 @@ class UiActionButtonComponent {
3392
3392
  this.componentLibrary = ComponentLibrary;
3393
3393
  this.pressedButtonActive = true;
3394
3394
  this.menuOpened = false;
3395
- // Merges caller-supplied descriptor with defaults. Was done by mutating this.descriptor
3396
- // in ngOnInit; descriptor is now a read-only input, so it's derived instead.
3397
3395
  this.effectiveDescriptor = computed(() => {
3398
3396
  const descriptor = this.descriptor();
3399
3397
  const code = this.code();
3400
3398
  const defaults = {
3401
- title: code ?? 'UNDEFINED_BUTTON',
3399
+ title: '',
3402
3400
  color: 'primary',
3403
3401
  type: UiActionButtonType.NORMAL,
3404
3402
  };
@@ -3410,8 +3408,6 @@ class UiActionButtonComponent {
3410
3408
  type: descriptor?.type ?? defaults.type,
3411
3409
  };
3412
3410
  });
3413
- // Was built once in ngOnInit / rebuilt in ngOnChanges; now recomputed whenever any
3414
- // dependency signal changes.
3415
3411
  this.mainActionModel = computed(() => ({
3416
3412
  descriptor: this.effectiveDescriptor(),
3417
3413
  uiAction: {
@@ -7370,6 +7366,9 @@ class UiActionToolbarComponent {
7370
7366
  get isVertical() {
7371
7367
  return this.toolbarPropertes?.direction === ToolbarDirection.VERTICAL;
7372
7368
  }
7369
+ get isHorizontal() {
7370
+ return this.toolbarPropertes?.direction === ToolbarDirection.HORIZONTAL;
7371
+ }
7373
7372
  get isAlignedStart() {
7374
7373
  return this.toolbarPropertes?.alignment === ToolbarAlignment.START;
7375
7374
  }
@@ -7380,11 +7379,11 @@ class UiActionToolbarComponent {
7380
7379
  return MenuTriggerType;
7381
7380
  }
7382
7381
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: UiActionToolbarComponent, deps: [{ token: UiActionService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: COMPONENT_LIBRARY }], target: i0.ɵɵFactoryTarget.Component }); }
7383
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: { uiActionModels: "uiActionModels", uiActionDescriptorService: "uiActionDescriptorService", id: "id", scrollOnWrap: "scrollOnWrap", toolbarPropertes: "toolbarPropertes" }, host: { listeners: { "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host{width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
7382
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: { uiActionModels: "uiActionModels", uiActionDescriptorService: "uiActionDescriptorService", id: "id", scrollOnWrap: "scrollOnWrap", toolbarPropertes: "toolbarPropertes" }, host: { listeners: { "window:resize": "onResize()" } }, viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
7384
7383
  }
7385
7384
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: UiActionToolbarComponent, decorators: [{
7386
7385
  type: Component,
7387
- args: [{ selector: 'smart-ui-action-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host{width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
7386
+ args: [{ selector: 'smart-ui-action-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
7388
7387
  }], ctorParameters: () => [{ type: UiActionService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: ComponentLibrary, decorators: [{
7389
7388
  type: Inject,
7390
7389
  args: [COMPONENT_LIBRARY]
@@ -8419,11 +8418,11 @@ class FileEditorToolbarComponent extends UiActionToolbarComponent {
8419
8418
  await super.fireAction(uiActionModel);
8420
8419
  }
8421
8420
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FileEditorToolbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
8422
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: FileEditorToolbarComponent, selector: "file-editor-toolbar", inputs: { dataUri: "dataUri" }, outputs: { actionEvent: "actionEvent" }, usesInheritance: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host{width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
8421
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: FileEditorToolbarComponent, selector: "file-editor-toolbar", inputs: { dataUri: "dataUri" }, outputs: { actionEvent: "actionEvent" }, usesInheritance: true, ngImport: i0, template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "viewActivated", "addedCssClass", "addBasicClasses", "iconPlaceholder"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
8423
8422
  }
8424
8423
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FileEditorToolbarComponent, decorators: [{
8425
8424
  type: Component,
8426
- args: [{ selector: 'file-editor-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host{width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
8425
+ args: [{ selector: 'file-editor-toolbar', template: "@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonLeft\"\r\n (actionClick)=\"scrollLeft()\"\r\n (mousedown)=\"scrollStart('left')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('left')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<div\r\n #container\r\n class=\"uiActionButtonsContainer\"\r\n [ngClass]=\"{\r\n scrollableContent: scrollOnWrap,\r\n verticalToolbar: isVertical,\r\n horizontalToolbar: isHorizontal,\r\n alignedStart: isAlignedStart,\r\n alignedEnd: isAlignedEnd,\r\n }\"\r\n>\r\n <ng-container *ngFor=\"let uiActionModel of uiActionModelsWithDescriptions; trackBy: trackByFn\">\r\n @if (uiActionModel.uiAction.code === 'themeSelector') {\r\n <theme-selector [model]=\"uiActionModel\"></theme-selector>\r\n } @else if (uiActionModel.uiAction.subActions && uiActionModel.uiAction.subActions.length > 0) {\r\n <ng-container\r\n *ngTemplateOutlet=\"menuTypes; context: { uiActionModel: uiActionModel }\"\r\n ></ng-container>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"uiActionModel.descriptor!\"\r\n [code]=\"uiActionModel.uiAction.code\"\r\n [disabled]=\"!!uiActionModel.uiAction.disabled\"\r\n [addedCssClass]=\"uiActionModel.cssClass\"\r\n [viewActivated]=\"uiActionModel.uiAction.viewActivated\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n (actionDoubleClick)=\"onActionDoubleClicked($event, uiActionModel)\"\r\n >\r\n </ui-action-button>\r\n }\r\n </ng-container>\r\n</div>\r\n\r\n@if (isScrollable && scrollOnWrap) {\r\n <ui-action-button\r\n [disabled]=\"!isScrollable\"\r\n [descriptor]=\"buttonRight\"\r\n (actionClick)=\"scrollRight()\"\r\n (mousedown)=\"scrollStart('right')\"\r\n (mouseup)=\"stopScroll()\"\r\n (mouseleave)=\"stopScroll()\"\r\n (touchstart)=\"scrollStart('right')\"\r\n (touchend)=\"stopScroll()\"\r\n />\r\n}\r\n\r\n<ng-template #menuTypes let-uiActionModel=\"uiActionModel\">\r\n @switch (uiActionModel?.uiAction?.descriptor?.menu?.triggerType) {\r\n @case (triggerType.HOVER) {\r\n <ui-hover-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-hover-menu>\r\n }\r\n @case (triggerType.CLICK) {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n @default {\r\n <ui-tiered-menu\r\n #menu\r\n [triggerAction]=\"uiActionModel.uiAction\"\r\n [subActions]=\"uiActionModel.uiAction.subActions!\"\r\n (actionClick)=\"onActionClicked($event, uiActionModel)\"\r\n ></ui-tiered-menu>\r\n }\r\n }\r\n</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;align-items:center}:host:has(.verticalToolbar){height:100%}:host:has(.horizontalToolbar.alignedEnd){width:100%}.uiActionButtonsContainer{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.uiActionButtonsContainer ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center}.uiActionButtonsContainer ::ng-deep .buttonWrapper{position:relative;width:fit-content;height:fit-content}.scrollableContent{flex:1;flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;display:flex;scrollbar-width:none;padding:.5rem 0;align-items:center}.scrollableContent::-webkit-scrollbar{display:none!important}.verticalToolbar{display:flex;flex-direction:column;height:100%}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%}.alignedStart{justify-content:flex-start}.alignedEnd{justify-content:flex-end}\n"] }]
8427
8426
  }], propDecorators: { dataUri: [{
8428
8427
  type: Input
8429
8428
  }], actionEvent: [{