@smartbit4all/ng-client 4.5.45 → 4.5.46

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.
@@ -3355,11 +3355,11 @@ class SmartIconComponent {
3355
3355
  return Object.assign({}, ...styles.filter(Boolean));
3356
3356
  }
3357
3357
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartIconComponent, deps: [{ token: SmartIconService }, { token: i0.ChangeDetectorRef }, { token: i2.DomSanitizer }, { token: COMPONENT_LIBRARY }], target: i0.ɵɵFactoryTarget.Component }); }
3358
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: SmartIconComponent, selector: "smart-icon", inputs: { iconWithoutNamespace: ["icon", "iconWithoutNamespace"], color: "color", imageResource: "imageResource" }, usesOnChanges: true, ngImport: i0, template: "@if(imageResource){\r\n<ng-container *ngTemplateOutlet=\"imageResourceIcon\" />\r\n} @else if(iconWithoutNamespace){\r\n<ng-container *ngTemplateOutlet=\"normalIcon\" />\r\n}\r\n\r\n<ng-template #imageResourceIcon>\r\n @if(imageResource){\r\n <div\r\n class=\"imageResourceIcon\"\r\n [smartTooltip]=\"imageResource.tooltip\"\r\n [uiBadge]=\"imageResource.badge\"\r\n >\r\n @if(imageResource.kind === imageResourceKind.URL){\r\n <img\r\n [ngStyle]=\"getImageResourceStyle(imageResource)\"\r\n class=\"imageIcon\"\r\n [src]=\"imageResource.source\"\r\n [alt]=\"imageResource.identifier\"\r\n />\r\n } @else if(imageResource.identifier){\r\n <ng-container *ngTemplateOutlet=\"normalIcon\"></ng-container>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #normalIcon>\r\n @if(compLib === componentLibrary.PRIMENG){\r\n <ng-container *ngTemplateOutlet=\"primeIcon\" />\r\n }@else {\r\n <ng-container *ngTemplateOutlet=\"materialIcon\" />\r\n }\r\n</ng-template>\r\n\r\n<ng-template #primeIcon>\r\n @if (isCustom) {\r\n <i\r\n class=\"pi custom-prime-icon\"\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n >\r\n @if(iconHtml){\r\n <span\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n [innerHTML]=\"iconHtml\"\r\n ></span>\r\n }\r\n </i>\r\n }@else if(icon) {\r\n <i\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n [ngClass]=\"getIcon(icon)\"\r\n ></i>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #materialIcon>\r\n @if (isCustom) {\r\n <mat-icon\r\n [ngStyle]=\"getImageResourceStyle(imageResource)\"\r\n [color]=\"color ?? 'primary'\"\r\n svgIcon=\"{{ icon }}\"\r\n ></mat-icon>\r\n }@else if(icon) {\r\n <mat-icon [ngStyle]=\"getImageResourceStyle(imageResource)\" [color]=\"color ?? 'primary'\">\r\n {{ icon }}\r\n </mat-icon>\r\n }\r\n</ng-template>\r\n", styles: [".custom-prime-icon{height:1rem;width:auto}:host ::ng-deep .p-badge{background-color:var(--accent-color);color:#fff;font-size:.5rem;min-width:1rem;height:1rem;line-height:1rem}:host ::ng-deep .p-overlay-badge .p-badge{transform:translate(80%,-70%)}.imageIcon{height:1rem;max-width:1rem;border-radius:.3rem}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: SmartTooltipDirective, selector: "[smartTooltip]", inputs: ["smartTooltip"] }, { kind: "directive", type: UiBadgeDirective, selector: "[uiBadge], [uiBadgeValue]", inputs: ["uiBadge", "uiBadgeValue"] }] }); }
3358
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: SmartIconComponent, selector: "smart-icon", inputs: { iconWithoutNamespace: ["icon", "iconWithoutNamespace"], color: "color", imageResource: "imageResource" }, usesOnChanges: true, ngImport: i0, template: "@if(imageResource){\r\n<ng-container *ngTemplateOutlet=\"imageResourceIcon\" />\r\n} @else if(iconWithoutNamespace){\r\n<ng-container *ngTemplateOutlet=\"normalIcon\" />\r\n}\r\n\r\n<ng-template #imageResourceIcon>\r\n @if(imageResource){\r\n <div\r\n class=\"imageResourceIcon\"\r\n [smartTooltip]=\"imageResource.tooltip\"\r\n [uiBadge]=\"imageResource.badge\"\r\n >\r\n @if(imageResource.kind === imageResourceKind.URL){\r\n <img\r\n [ngStyle]=\"getImageResourceStyle(imageResource)\"\r\n class=\"imageIcon\"\r\n [src]=\"imageResource.source\"\r\n [alt]=\"imageResource.identifier\"\r\n />\r\n } @else if(imageResource.identifier){\r\n <ng-container *ngTemplateOutlet=\"normalIcon\"></ng-container>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #normalIcon>\r\n @if(compLib === componentLibrary.PRIMENG){\r\n <ng-container *ngTemplateOutlet=\"primeIcon\" />\r\n }@else {\r\n <ng-container *ngTemplateOutlet=\"materialIcon\" />\r\n }\r\n</ng-template>\r\n\r\n<ng-template #primeIcon>\r\n @if (isCustom) {\r\n <i\r\n class=\"pi custom-prime-icon\"\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n >\r\n @if(iconHtml){\r\n <span\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n [innerHTML]=\"iconHtml\"\r\n ></span>\r\n }\r\n </i>\r\n }@else if(icon) {\r\n <i\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n [ngClass]=\"getIcon(icon)\"\r\n ></i>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #materialIcon>\r\n @if (isCustom) {\r\n <mat-icon\r\n [ngStyle]=\"getImageResourceStyle(imageResource)\"\r\n [color]=\"color ?? 'primary'\"\r\n svgIcon=\"{{ icon }}\"\r\n ></mat-icon>\r\n }@else if(icon) {\r\n <mat-icon [ngStyle]=\"getImageResourceStyle(imageResource)\" [color]=\"color ?? 'primary'\">\r\n {{ icon }}\r\n </mat-icon>\r\n }\r\n</ng-template>\r\n", styles: [":host{display:inline-flex;min-width:1rem;width:1rem}.custom-prime-icon{height:1rem;width:auto}:host ::ng-deep .p-badge{background-color:var(--accent-color);color:#fff;font-size:.5rem;min-width:1rem;height:1rem;line-height:1rem}:host ::ng-deep .p-overlay-badge .p-badge{transform:translate(80%,-70%)}.imageIcon{height:1rem;max-width:1rem;border-radius:.3rem}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: SmartTooltipDirective, selector: "[smartTooltip]", inputs: ["smartTooltip"] }, { kind: "directive", type: UiBadgeDirective, selector: "[uiBadge], [uiBadgeValue]", inputs: ["uiBadge", "uiBadgeValue"] }] }); }
3359
3359
  }
3360
3360
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartIconComponent, decorators: [{
3361
3361
  type: Component,
3362
- args: [{ selector: 'smart-icon', template: "@if(imageResource){\r\n<ng-container *ngTemplateOutlet=\"imageResourceIcon\" />\r\n} @else if(iconWithoutNamespace){\r\n<ng-container *ngTemplateOutlet=\"normalIcon\" />\r\n}\r\n\r\n<ng-template #imageResourceIcon>\r\n @if(imageResource){\r\n <div\r\n class=\"imageResourceIcon\"\r\n [smartTooltip]=\"imageResource.tooltip\"\r\n [uiBadge]=\"imageResource.badge\"\r\n >\r\n @if(imageResource.kind === imageResourceKind.URL){\r\n <img\r\n [ngStyle]=\"getImageResourceStyle(imageResource)\"\r\n class=\"imageIcon\"\r\n [src]=\"imageResource.source\"\r\n [alt]=\"imageResource.identifier\"\r\n />\r\n } @else if(imageResource.identifier){\r\n <ng-container *ngTemplateOutlet=\"normalIcon\"></ng-container>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #normalIcon>\r\n @if(compLib === componentLibrary.PRIMENG){\r\n <ng-container *ngTemplateOutlet=\"primeIcon\" />\r\n }@else {\r\n <ng-container *ngTemplateOutlet=\"materialIcon\" />\r\n }\r\n</ng-template>\r\n\r\n<ng-template #primeIcon>\r\n @if (isCustom) {\r\n <i\r\n class=\"pi custom-prime-icon\"\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n >\r\n @if(iconHtml){\r\n <span\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n [innerHTML]=\"iconHtml\"\r\n ></span>\r\n }\r\n </i>\r\n }@else if(icon) {\r\n <i\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n [ngClass]=\"getIcon(icon)\"\r\n ></i>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #materialIcon>\r\n @if (isCustom) {\r\n <mat-icon\r\n [ngStyle]=\"getImageResourceStyle(imageResource)\"\r\n [color]=\"color ?? 'primary'\"\r\n svgIcon=\"{{ icon }}\"\r\n ></mat-icon>\r\n }@else if(icon) {\r\n <mat-icon [ngStyle]=\"getImageResourceStyle(imageResource)\" [color]=\"color ?? 'primary'\">\r\n {{ icon }}\r\n </mat-icon>\r\n }\r\n</ng-template>\r\n", styles: [".custom-prime-icon{height:1rem;width:auto}:host ::ng-deep .p-badge{background-color:var(--accent-color);color:#fff;font-size:.5rem;min-width:1rem;height:1rem;line-height:1rem}:host ::ng-deep .p-overlay-badge .p-badge{transform:translate(80%,-70%)}.imageIcon{height:1rem;max-width:1rem;border-radius:.3rem}\n"] }]
3362
+ args: [{ selector: 'smart-icon', template: "@if(imageResource){\r\n<ng-container *ngTemplateOutlet=\"imageResourceIcon\" />\r\n} @else if(iconWithoutNamespace){\r\n<ng-container *ngTemplateOutlet=\"normalIcon\" />\r\n}\r\n\r\n<ng-template #imageResourceIcon>\r\n @if(imageResource){\r\n <div\r\n class=\"imageResourceIcon\"\r\n [smartTooltip]=\"imageResource.tooltip\"\r\n [uiBadge]=\"imageResource.badge\"\r\n >\r\n @if(imageResource.kind === imageResourceKind.URL){\r\n <img\r\n [ngStyle]=\"getImageResourceStyle(imageResource)\"\r\n class=\"imageIcon\"\r\n [src]=\"imageResource.source\"\r\n [alt]=\"imageResource.identifier\"\r\n />\r\n } @else if(imageResource.identifier){\r\n <ng-container *ngTemplateOutlet=\"normalIcon\"></ng-container>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #normalIcon>\r\n @if(compLib === componentLibrary.PRIMENG){\r\n <ng-container *ngTemplateOutlet=\"primeIcon\" />\r\n }@else {\r\n <ng-container *ngTemplateOutlet=\"materialIcon\" />\r\n }\r\n</ng-template>\r\n\r\n<ng-template #primeIcon>\r\n @if (isCustom) {\r\n <i\r\n class=\"pi custom-prime-icon\"\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n >\r\n @if(iconHtml){\r\n <span\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n [innerHTML]=\"iconHtml\"\r\n ></span>\r\n }\r\n </i>\r\n }@else if(icon) {\r\n <i\r\n [ngStyle]=\"mergeStyles(getImageResourceStyle(imageResource), getStyle(color))\"\r\n [ngClass]=\"getIcon(icon)\"\r\n ></i>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #materialIcon>\r\n @if (isCustom) {\r\n <mat-icon\r\n [ngStyle]=\"getImageResourceStyle(imageResource)\"\r\n [color]=\"color ?? 'primary'\"\r\n svgIcon=\"{{ icon }}\"\r\n ></mat-icon>\r\n }@else if(icon) {\r\n <mat-icon [ngStyle]=\"getImageResourceStyle(imageResource)\" [color]=\"color ?? 'primary'\">\r\n {{ icon }}\r\n </mat-icon>\r\n }\r\n</ng-template>\r\n", styles: [":host{display:inline-flex;min-width:1rem;width:1rem}.custom-prime-icon{height:1rem;width:auto}:host ::ng-deep .p-badge{background-color:var(--accent-color);color:#fff;font-size:.5rem;min-width:1rem;height:1rem;line-height:1rem}:host ::ng-deep .p-overlay-badge .p-badge{transform:translate(80%,-70%)}.imageIcon{height:1rem;max-width:1rem;border-radius:.3rem}\n"] }]
3363
3363
  }], ctorParameters: () => [{ type: SmartIconService }, { type: i0.ChangeDetectorRef }, { type: i2.DomSanitizer }, { type: ComponentLibrary, decorators: [{
3364
3364
  type: Inject,
3365
3365
  args: [COMPONENT_LIBRARY]
@@ -3385,13 +3385,18 @@ class UiActionButtonComponent {
3385
3385
  this.compLib = compLib ?? ComponentLibrary.PRIMENG;
3386
3386
  }
3387
3387
  ngOnInit() {
3388
- if (!this.descriptor) {
3389
- this.descriptor = {
3390
- title: this.code ?? 'UNDEFINED_BUTTON',
3391
- color: 'primary',
3392
- type: UiActionButtonType.FLAT,
3393
- };
3394
- }
3388
+ const defaults = {
3389
+ title: this.code ?? 'UNDEFINED_BUTTON',
3390
+ color: 'primary',
3391
+ type: UiActionButtonType.NORMAL,
3392
+ };
3393
+ this.descriptor = {
3394
+ ...defaults,
3395
+ ...this.descriptor,
3396
+ title: this.descriptor?.title ?? defaults.title,
3397
+ color: this.descriptor?.color ?? defaults.color,
3398
+ type: this.descriptor?.type ?? defaults.type,
3399
+ };
3395
3400
  this.buildMainActionModel();
3396
3401
  }
3397
3402
  ngOnChanges(changes) {
@@ -3554,12 +3559,15 @@ class UiActionButtonComponent {
3554
3559
  return (this.descriptor.iconPosition === IconPosition.POST &&
3555
3560
  (this.descriptor.icon != null || this.descriptor.iconResource != null));
3556
3561
  }
3562
+ getColor() {
3563
+ return this.descriptor?.color || 'text';
3564
+ }
3557
3565
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: UiActionButtonComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: COMPONENT_LIBRARY, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
3558
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: UiActionButtonComponent, selector: "ui-action-button", inputs: { disabled: "disabled", descriptor: "descriptor", code: "code", addedCssClass: "addedCssClass", addBasicClasses: "addBasicClasses" }, outputs: { actionClick: "actionClick", actionDoubleClick: "actionDoubleClick" }, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"buttonWithBadge\"></ng-container>\r\n\r\n<ng-template #buttonWithBadge>\r\n @if (descriptor && descriptor.badge) {\r\n <ui-badge [descriptor]=\"descriptor.badge\">\r\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n </ui-badge>\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #buttonTemplate>\r\n @if (compLib === componentLibrary.PRIMENG) {\r\n <button\r\n pButton\r\n pRipple\r\n [smartTooltip]=\"descriptor.tooltip\"\r\n [disabled]=\"!!disabled\"\r\n (click)=\"onActionClicked($event, mainActionModel)\"\r\n (dblclick)=\"onActionDoubleClicked($event)\"\r\n [autofocus]=\"false\"\r\n [ngStyle]=\"calcStyle(descriptor.style)\"\r\n [ngClass]=\"getCombinedClasses()\"\r\n class=\"{{ getbtnClass() }} {{ addedCssClass }}\"\r\n type=\"button\"\r\n [attr.data-testid]=\"code ?? null\"\r\n >\r\n <div *ngIf=\"isOnlyIcon(); then buttonIcon; else text\"></div>\r\n </button>\r\n } @else {\r\n <button\r\n mat-button\r\n [smartTooltip]=\"descriptor.tooltip\"\r\n [color]=\"descriptor.color\"\r\n [disabled]=\"!!disabled\"\r\n (click)=\"onActionClicked($event, mainActionModel)\"\r\n (dblclick)=\"onActionDoubleClicked($event)\"\r\n [ngStyle]=\"calcStyle(descriptor.style)\"\r\n [ngClass]=\"getCombinedClasses()\"\r\n class=\"{{ getbtnClass() }} {{ addedCssClass }}\"\r\n type=\"button\"\r\n [attr.data-testid]=\"code ?? null\"\r\n >\r\n <div *ngIf=\"isOnlyIcon(); then buttonIcon; else text\"></div>\r\n </button>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #text>\r\n @if (renderPre() || renderEmpty()) {\r\n <ng-container *ngTemplateOutlet=\"buttonIcon\" />\r\n }\r\n {{ descriptor.title }}\r\n @if (renderPost()) {\r\n <ng-container *ngTemplateOutlet=\"buttonIcon\" />\r\n }\r\n</ng-template>\r\n\r\n<ng-template #buttonIcon>\r\n @if (renderEmpty()) {\r\n <smart-icon></smart-icon>\r\n } @else if (descriptor.iconResource) {\r\n <smart-icon [imageResource]=\"descriptor.iconResource\"></smart-icon>\r\n } @else {\r\n <smart-icon\r\n [icon]=\"descriptor.icon\"\r\n [color]=\"descriptor.iconColor ?? descriptor.color\"\r\n ></smart-icon>\r\n }\r\n</ng-template>\r\n", styles: [":host ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center;line-height:1;padding:.75rem 1rem}:host{height:fit-content;width:fit-content;padding:unset;margin:unset}:host ::ng-deep .mdc-button__label{display:flex;flex-direction:row;gap:1rem;align-items:center;justify-content:center}:host ::ng-deep .mdc-button{height:fit-content;min-height:var(--mdc-text-button-container-height)}:host ::ng-deep .mat-mdc-icon-button ::ng-deep img{width:unset;height:unset}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: i3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: UiBadgeComponent, selector: "ui-badge", inputs: ["descriptor", "inputValue"] }, { kind: "directive", type: SmartTooltipDirective, selector: "[smartTooltip]", inputs: ["smartTooltip"] }] }); }
3566
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: UiActionButtonComponent, selector: "ui-action-button", inputs: { disabled: "disabled", descriptor: "descriptor", code: "code", addedCssClass: "addedCssClass", addBasicClasses: "addBasicClasses" }, outputs: { actionClick: "actionClick", actionDoubleClick: "actionDoubleClick" }, usesOnChanges: true, ngImport: i0, template: "@if (descriptor.type === 'SEPARATOR') {\r\n <div class=\"separator\">\r\n @if (descriptor.title) {\r\n <span class=\"separator-label\" [style.color]=\"'var(--' + getColor() + '-color)'\">\r\n {{ descriptor.title }}\r\n </span>\r\n }\r\n <hr class=\"separator-line\" [style.border-top-color]=\"'var(--' + getColor() + '-color)'\" />\r\n </div>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"buttonWithBadge\"></ng-container>\r\n}\r\n\r\n<ng-template #buttonWithBadge>\r\n @if (descriptor && descriptor.badge) {\r\n <ui-badge [descriptor]=\"descriptor.badge\">\r\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n </ui-badge>\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #buttonTemplate>\r\n @if (compLib === componentLibrary.PRIMENG) {\r\n <button\r\n pButton\r\n pRipple\r\n [smartTooltip]=\"descriptor.tooltip\"\r\n [disabled]=\"!!disabled\"\r\n (click)=\"onActionClicked($event, mainActionModel)\"\r\n (dblclick)=\"onActionDoubleClicked($event)\"\r\n [autofocus]=\"false\"\r\n [ngStyle]=\"calcStyle(descriptor.style)\"\r\n [ngClass]=\"getCombinedClasses()\"\r\n class=\"{{ getbtnClass() }} {{ addedCssClass }}\"\r\n type=\"button\"\r\n [attr.data-testid]=\"code ?? null\"\r\n >\r\n <div *ngIf=\"isOnlyIcon(); then buttonIcon; else text\"></div>\r\n </button>\r\n } @else {\r\n <button\r\n mat-button\r\n [smartTooltip]=\"descriptor.tooltip\"\r\n [color]=\"descriptor.color\"\r\n [disabled]=\"!!disabled\"\r\n (click)=\"onActionClicked($event, mainActionModel)\"\r\n (dblclick)=\"onActionDoubleClicked($event)\"\r\n [ngStyle]=\"calcStyle(descriptor.style)\"\r\n [ngClass]=\"getCombinedClasses()\"\r\n class=\"{{ getbtnClass() }} {{ addedCssClass }}\"\r\n type=\"button\"\r\n [attr.data-testid]=\"code ?? null\"\r\n >\r\n <div *ngIf=\"isOnlyIcon(); then buttonIcon; else text\"></div>\r\n </button>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #text>\r\n @if (renderPre() || renderEmpty()) {\r\n <ng-container *ngTemplateOutlet=\"buttonIcon\" />\r\n }\r\n {{ descriptor.title }}\r\n @if (renderPost()) {\r\n <ng-container *ngTemplateOutlet=\"buttonIcon\" />\r\n }\r\n</ng-template>\r\n\r\n<ng-template #buttonIcon>\r\n @if (renderEmpty()) {\r\n <smart-icon></smart-icon>\r\n } @else if (descriptor.iconResource) {\r\n <smart-icon [imageResource]=\"descriptor.iconResource\"></smart-icon>\r\n } @else {\r\n <smart-icon\r\n [icon]=\"descriptor.icon\"\r\n [color]=\"descriptor.iconColor ?? descriptor.color\"\r\n ></smart-icon>\r\n }\r\n</ng-template>\r\n", styles: [":host{--text-color: black}:host ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center;line-height:1;padding:.75rem 1rem}:host{height:fit-content;width:fit-content;padding:unset;margin:unset}:host ::ng-deep .mdc-button__label{display:flex;flex-direction:row;gap:1rem;align-items:center;justify-content:center}:host ::ng-deep .mdc-button{height:fit-content;min-height:var(--mdc-text-button-container-height)}:host ::ng-deep .mat-mdc-icon-button ::ng-deep img{width:unset;height:unset}.separator{display:flex;flex-direction:column;padding:0 .5rem;width:100%}.separator-label{font-size:.7rem;color:#888;padding-bottom:.15rem}.separator-line{border:none;border-top:1px solid #e2e5e9;margin:0}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i5.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: i3.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading", "severity", "raised", "rounded", "text", "outlined", "size", "plain"] }, { kind: "component", type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: UiBadgeComponent, selector: "ui-badge", inputs: ["descriptor", "inputValue"] }, { kind: "directive", type: SmartTooltipDirective, selector: "[smartTooltip]", inputs: ["smartTooltip"] }] }); }
3559
3567
  }
3560
3568
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: UiActionButtonComponent, decorators: [{
3561
3569
  type: Component,
3562
- args: [{ selector: 'ui-action-button', template: "<ng-container *ngTemplateOutlet=\"buttonWithBadge\"></ng-container>\r\n\r\n<ng-template #buttonWithBadge>\r\n @if (descriptor && descriptor.badge) {\r\n <ui-badge [descriptor]=\"descriptor.badge\">\r\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n </ui-badge>\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #buttonTemplate>\r\n @if (compLib === componentLibrary.PRIMENG) {\r\n <button\r\n pButton\r\n pRipple\r\n [smartTooltip]=\"descriptor.tooltip\"\r\n [disabled]=\"!!disabled\"\r\n (click)=\"onActionClicked($event, mainActionModel)\"\r\n (dblclick)=\"onActionDoubleClicked($event)\"\r\n [autofocus]=\"false\"\r\n [ngStyle]=\"calcStyle(descriptor.style)\"\r\n [ngClass]=\"getCombinedClasses()\"\r\n class=\"{{ getbtnClass() }} {{ addedCssClass }}\"\r\n type=\"button\"\r\n [attr.data-testid]=\"code ?? null\"\r\n >\r\n <div *ngIf=\"isOnlyIcon(); then buttonIcon; else text\"></div>\r\n </button>\r\n } @else {\r\n <button\r\n mat-button\r\n [smartTooltip]=\"descriptor.tooltip\"\r\n [color]=\"descriptor.color\"\r\n [disabled]=\"!!disabled\"\r\n (click)=\"onActionClicked($event, mainActionModel)\"\r\n (dblclick)=\"onActionDoubleClicked($event)\"\r\n [ngStyle]=\"calcStyle(descriptor.style)\"\r\n [ngClass]=\"getCombinedClasses()\"\r\n class=\"{{ getbtnClass() }} {{ addedCssClass }}\"\r\n type=\"button\"\r\n [attr.data-testid]=\"code ?? null\"\r\n >\r\n <div *ngIf=\"isOnlyIcon(); then buttonIcon; else text\"></div>\r\n </button>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #text>\r\n @if (renderPre() || renderEmpty()) {\r\n <ng-container *ngTemplateOutlet=\"buttonIcon\" />\r\n }\r\n {{ descriptor.title }}\r\n @if (renderPost()) {\r\n <ng-container *ngTemplateOutlet=\"buttonIcon\" />\r\n }\r\n</ng-template>\r\n\r\n<ng-template #buttonIcon>\r\n @if (renderEmpty()) {\r\n <smart-icon></smart-icon>\r\n } @else if (descriptor.iconResource) {\r\n <smart-icon [imageResource]=\"descriptor.iconResource\"></smart-icon>\r\n } @else {\r\n <smart-icon\r\n [icon]=\"descriptor.icon\"\r\n [color]=\"descriptor.iconColor ?? descriptor.color\"\r\n ></smart-icon>\r\n }\r\n</ng-template>\r\n", styles: [":host ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center;line-height:1;padding:.75rem 1rem}:host{height:fit-content;width:fit-content;padding:unset;margin:unset}:host ::ng-deep .mdc-button__label{display:flex;flex-direction:row;gap:1rem;align-items:center;justify-content:center}:host ::ng-deep .mdc-button{height:fit-content;min-height:var(--mdc-text-button-container-height)}:host ::ng-deep .mat-mdc-icon-button ::ng-deep img{width:unset;height:unset}\n"] }]
3570
+ args: [{ selector: 'ui-action-button', template: "@if (descriptor.type === 'SEPARATOR') {\r\n <div class=\"separator\">\r\n @if (descriptor.title) {\r\n <span class=\"separator-label\" [style.color]=\"'var(--' + getColor() + '-color)'\">\r\n {{ descriptor.title }}\r\n </span>\r\n }\r\n <hr class=\"separator-line\" [style.border-top-color]=\"'var(--' + getColor() + '-color)'\" />\r\n </div>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"buttonWithBadge\"></ng-container>\r\n}\r\n\r\n<ng-template #buttonWithBadge>\r\n @if (descriptor && descriptor.badge) {\r\n <ui-badge [descriptor]=\"descriptor.badge\">\r\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n </ui-badge>\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"buttonTemplate\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #buttonTemplate>\r\n @if (compLib === componentLibrary.PRIMENG) {\r\n <button\r\n pButton\r\n pRipple\r\n [smartTooltip]=\"descriptor.tooltip\"\r\n [disabled]=\"!!disabled\"\r\n (click)=\"onActionClicked($event, mainActionModel)\"\r\n (dblclick)=\"onActionDoubleClicked($event)\"\r\n [autofocus]=\"false\"\r\n [ngStyle]=\"calcStyle(descriptor.style)\"\r\n [ngClass]=\"getCombinedClasses()\"\r\n class=\"{{ getbtnClass() }} {{ addedCssClass }}\"\r\n type=\"button\"\r\n [attr.data-testid]=\"code ?? null\"\r\n >\r\n <div *ngIf=\"isOnlyIcon(); then buttonIcon; else text\"></div>\r\n </button>\r\n } @else {\r\n <button\r\n mat-button\r\n [smartTooltip]=\"descriptor.tooltip\"\r\n [color]=\"descriptor.color\"\r\n [disabled]=\"!!disabled\"\r\n (click)=\"onActionClicked($event, mainActionModel)\"\r\n (dblclick)=\"onActionDoubleClicked($event)\"\r\n [ngStyle]=\"calcStyle(descriptor.style)\"\r\n [ngClass]=\"getCombinedClasses()\"\r\n class=\"{{ getbtnClass() }} {{ addedCssClass }}\"\r\n type=\"button\"\r\n [attr.data-testid]=\"code ?? null\"\r\n >\r\n <div *ngIf=\"isOnlyIcon(); then buttonIcon; else text\"></div>\r\n </button>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #text>\r\n @if (renderPre() || renderEmpty()) {\r\n <ng-container *ngTemplateOutlet=\"buttonIcon\" />\r\n }\r\n {{ descriptor.title }}\r\n @if (renderPost()) {\r\n <ng-container *ngTemplateOutlet=\"buttonIcon\" />\r\n }\r\n</ng-template>\r\n\r\n<ng-template #buttonIcon>\r\n @if (renderEmpty()) {\r\n <smart-icon></smart-icon>\r\n } @else if (descriptor.iconResource) {\r\n <smart-icon [imageResource]=\"descriptor.iconResource\"></smart-icon>\r\n } @else {\r\n <smart-icon\r\n [icon]=\"descriptor.icon\"\r\n [color]=\"descriptor.iconColor ?? descriptor.color\"\r\n ></smart-icon>\r\n }\r\n</ng-template>\r\n", styles: [":host{--text-color: black}:host ::ng-deep button{display:flex;gap:1rem;align-items:center;justify-content:center;line-height:1;padding:.75rem 1rem}:host{height:fit-content;width:fit-content;padding:unset;margin:unset}:host ::ng-deep .mdc-button__label{display:flex;flex-direction:row;gap:1rem;align-items:center;justify-content:center}:host ::ng-deep .mdc-button{height:fit-content;min-height:var(--mdc-text-button-container-height)}:host ::ng-deep .mat-mdc-icon-button ::ng-deep img{width:unset;height:unset}.separator{display:flex;flex-direction:column;padding:0 .5rem;width:100%}.separator-label{font-size:.7rem;color:#888;padding-bottom:.15rem}.separator-line{border:none;border-top:1px solid #e2e5e9;margin:0}\n"] }]
3563
3571
  }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: ComponentLibrary, decorators: [{
3564
3572
  type: Inject,
3565
3573
  args: [COMPONENT_LIBRARY]
@@ -6385,6 +6393,7 @@ class ClickMenuComponent {
6385
6393
  this.submenuOpenMap = new Map();
6386
6394
  this.subActions = [];
6387
6395
  this.hasCheckedChildren = false;
6396
+ this.hasSubActionSiblings = false;
6388
6397
  this.compLib = compLib ?? ComponentLibrary.PRIMENG;
6389
6398
  if (this.compLib === ComponentLibrary.PRIMENG) {
6390
6399
  this.icon = 'chevron-right';
@@ -6408,11 +6417,11 @@ class ClickMenuComponent {
6408
6417
  }
6409
6418
  ngOnChanges(changes) {
6410
6419
  if (changes['triggerAction']) {
6411
- var trigger = changes['triggerAction'].currentValue;
6412
- var previousTrigger = changes['triggerAction'].previousValue;
6413
- this.subActions = trigger?.subActions ?? [];
6420
+ const trigger = changes['triggerAction'].currentValue;
6421
+ const previousTrigger = changes['triggerAction'].previousValue;
6422
+ this.subActions = this.normalizeSubActions(trigger?.subActions ?? []);
6414
6423
  if (this.isOpen && previousTrigger) {
6415
- var hasSubActionsChanged = this.hasSubActionsChanged(previousTrigger?.subActions, trigger?.subActions);
6424
+ const hasSubActionsChanged = this.hasSubActionsChanged(previousTrigger?.subActions, trigger?.subActions);
6416
6425
  if (hasSubActionsChanged) {
6417
6426
  this.refreshOverlay();
6418
6427
  }
@@ -6532,12 +6541,38 @@ class ClickMenuComponent {
6532
6541
  }
6533
6542
  });
6534
6543
  }
6544
+ normalizeSubActions(actions) {
6545
+ this.hasSubActionSiblings = actions.some((a) => a.subActions && a.subActions.length > 0);
6546
+ const anyHasIcon = actions.some((a) => a.descriptor?.icon || a.descriptor?.iconResource);
6547
+ const lastSetPosition = [...actions].reverse().find((a) => a.descriptor?.iconPosition != null)?.descriptor
6548
+ ?.iconPosition ?? IconPosition.PRE;
6549
+ return actions.map((action) => {
6550
+ const hasIcon = !!(action.descriptor?.icon || action.descriptor?.iconResource);
6551
+ return {
6552
+ ...action,
6553
+ descriptor: action.descriptor
6554
+ ? {
6555
+ ...action.descriptor,
6556
+ type: UiActionButtonType.NORMAL,
6557
+ iconPosition: anyHasIcon
6558
+ ? hasIcon
6559
+ ? (action.descriptor.iconPosition ?? lastSetPosition)
6560
+ : IconPosition.EMPTY
6561
+ : action.descriptor.iconPosition,
6562
+ }
6563
+ : {
6564
+ type: UiActionButtonType.NORMAL,
6565
+ iconPosition: anyHasIcon ? IconPosition.EMPTY : undefined,
6566
+ },
6567
+ };
6568
+ });
6569
+ }
6535
6570
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ClickMenuComponent, deps: [{ token: UiMenuService }, { token: i2$2.Overlay }, { token: i0.ViewContainerRef }, { token: i2$2.OverlayPositionBuilder }, { token: COMPONENT_LIBRARY, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
6536
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: { triggerAction: "triggerAction", isSubmenu: "isSubmenu", menuOpenDirection: "menuOpenDirection" }, outputs: { actionClick: "actionClick", submenuOpened: "submenuOpened" }, host: { listeners: { "click": "onMenuClick($event)", "document:click": "onDocumentClick($event)" } }, viewQueries: [{ propertyName: "menuTemplate", first: true, predicate: ["menuTemplate"], descendants: true }, { propertyName: "submenuComponents", predicate: ["submenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isSubmenu) {\r\n <div class=\"submenu hoverEffect\" [class.activeSubmenu]=\"isOpen\" (mouseenter)=\"openMenu($event)\">\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n <smart-icon [icon]=\"icon\" color=\"black\"></smart-icon>\r\n </div>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n}\r\n\r\n<ng-template #menuTemplate>\r\n <ul class=\"ui-tiered-menu sb4-menu-panel\">\r\n <li\r\n *ngFor=\"let action of subActions\"\r\n class=\"hoverEffect\"\r\n [class.disabled]=\"action.disabled\"\r\n (mouseenter)=\"closeSiblingSubmenus(action)\"\r\n >\r\n @if (action.subActions && action.subActions.length > 0) {\r\n <ui-tiered-menu\r\n #submenu\r\n [triggerAction]=\"action\"\r\n [isSubmenu]=\"true\"\r\n [subActions]=\"action.subActions!\"\r\n [menuOpenDirection]=\"triggerAction.descriptor?.menu?.openDirection\"\r\n (actionClick)=\"actionClick.emit($event)\"\r\n (submenuOpened)=\"onSubmenuOpened(submenu)\"\r\n ></ui-tiered-menu>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"action.descriptor!\"\r\n [code]=\"action.code\"\r\n [disabled]=\"!!action.disabled\"\r\n (actionClick)=\"!action.subActions?.length && onActionClick(action)\"\r\n ></ui-action-button>\r\n }\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #triggerTempalte>\r\n <ui-action-button\r\n [descriptor]=\"triggerAction.descriptor!\"\r\n [code]=\"triggerAction.code\"\r\n [disabled]=\"!!triggerAction.disabled\"\r\n (actionClick)=\"toggleMenu($event.event)\"\r\n [class.submenuTrigger]=\"isSubmenu\"\r\n >\r\n </ui-action-button>\r\n</ng-template>\r\n", styles: [":host{display:inline-block;position:relative}ul,.ui-tiered-menu{top:100%;left:0;list-style:none;padding-left:0;margin:0;background:#fff;width:fit-content;box-shadow:2px 2px 8px #0003;z-index:1000;border-radius:5px;padding:.1rem}.submenuTrigger,.ui-tiered-menu ::ng-deep button{background-color:#fff;box-shadow:unset;border:unset;border-radius:unset;color:#000;width:100%;justify-content:flex-start}.hoverEffect:hover,.hoverEffect ::ng-deep button:hover{background-color:#f1f5f9}.hoverEffect.activeSubmenu,.hoverEffect.activeSubmenu ::ng-deep button{background-color:#f1f5f9}.ui-tiered-menu ::ng-deep ui-action-button,.ui-tiered-menu ::ng-deep ui-badge{width:100%}.ui-tiered-menu>li{position:relative}.submenu{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.submenu ::ng-deep ui-action-button{flex:1}.disabled{color:#aaa;cursor:not-allowed}.ui-tiered-menu ui-tiered-menu{width:100%}smart-icon{align-content:center}\n"], dependencies: [{ 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: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "addedCssClass", "addBasicClasses"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }] }); }
6571
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: { triggerAction: "triggerAction", isSubmenu: "isSubmenu", menuOpenDirection: "menuOpenDirection" }, outputs: { actionClick: "actionClick", submenuOpened: "submenuOpened" }, host: { listeners: { "click": "onMenuClick($event)", "document:click": "onDocumentClick($event)" } }, viewQueries: [{ propertyName: "menuTemplate", first: true, predicate: ["menuTemplate"], descendants: true }, { propertyName: "submenuComponents", predicate: ["submenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isSubmenu) {\r\n <div class=\"submenu hoverEffect\" [class.activeSubmenu]=\"isOpen\" (mouseenter)=\"openMenu($event)\">\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n <smart-icon [icon]=\"icon\" color=\"black\"></smart-icon>\r\n </div>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n}\r\n\r\n<ng-template #menuTemplate>\r\n <ul class=\"ui-tiered-menu sb4-menu-panel\">\r\n <li\r\n *ngFor=\"let action of subActions\"\r\n class=\"hoverEffect\"\r\n [class.disabled]=\"action.disabled\"\r\n (mouseenter)=\"closeSiblingSubmenus(action)\"\r\n >\r\n @if (action.subActions && action.subActions.length > 0) {\r\n <ui-tiered-menu\r\n #submenu\r\n [triggerAction]=\"action\"\r\n [isSubmenu]=\"true\"\r\n [subActions]=\"action.subActions!\"\r\n [menuOpenDirection]=\"triggerAction.descriptor?.menu?.openDirection\"\r\n (actionClick)=\"actionClick.emit($event)\"\r\n (submenuOpened)=\"onSubmenuOpened(submenu)\"\r\n ></ui-tiered-menu>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"action.descriptor!\"\r\n [code]=\"action.code\"\r\n [disabled]=\"!!action.disabled\"\r\n (actionClick)=\"!action.subActions?.length && onActionClick(action)\"\r\n ></ui-action-button>\r\n <smart-icon></smart-icon>\r\n }\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #triggerTempalte>\r\n <ui-action-button\r\n [descriptor]=\"triggerAction.descriptor!\"\r\n [code]=\"triggerAction.code\"\r\n [disabled]=\"!!triggerAction.disabled\"\r\n (actionClick)=\"toggleMenu($event.event)\"\r\n [class.submenuTrigger]=\"isSubmenu\"\r\n >\r\n </ui-action-button>\r\n</ng-template>\r\n", styles: [":host{display:inline-block;position:relative}li{display:flex}ul,.ui-tiered-menu{top:100%;left:0;list-style:none;padding-left:0;margin:0;background:#fff;width:fit-content;box-shadow:2px 2px 8px #0003;z-index:1000;border-radius:5px;padding:.1rem}.submenuTrigger,.ui-tiered-menu ::ng-deep button{background-color:#fff;box-shadow:unset;border:unset;border-radius:unset;color:#000;width:100%;justify-content:flex-start}.hoverEffect:hover,.hoverEffect ::ng-deep button:hover{background-color:#f1f5f9}.hoverEffect.activeSubmenu,.hoverEffect.activeSubmenu ::ng-deep button{background-color:#f1f5f9}.ui-tiered-menu ::ng-deep ui-action-button,.ui-tiered-menu ::ng-deep ui-badge{width:100%}.ui-tiered-menu>li{position:relative}.submenu{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.submenu ::ng-deep ui-action-button{flex:1}.disabled{color:#aaa;cursor:not-allowed}.ui-tiered-menu ui-tiered-menu{width:100%}smart-icon{align-content:center}:host ::ng-deep .menu-row{display:flex;flex-direction:row;align-items:center}:host ::ng-deep .menu-row-reverse{display:flex;flex-direction:row-reverse;align-items:center}\n"], dependencies: [{ 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: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "addedCssClass", "addBasicClasses"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }] }); }
6537
6572
  }
6538
6573
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ClickMenuComponent, decorators: [{
6539
6574
  type: Component,
6540
- args: [{ selector: 'ui-tiered-menu', template: "@if (isSubmenu) {\r\n <div class=\"submenu hoverEffect\" [class.activeSubmenu]=\"isOpen\" (mouseenter)=\"openMenu($event)\">\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n <smart-icon [icon]=\"icon\" color=\"black\"></smart-icon>\r\n </div>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n}\r\n\r\n<ng-template #menuTemplate>\r\n <ul class=\"ui-tiered-menu sb4-menu-panel\">\r\n <li\r\n *ngFor=\"let action of subActions\"\r\n class=\"hoverEffect\"\r\n [class.disabled]=\"action.disabled\"\r\n (mouseenter)=\"closeSiblingSubmenus(action)\"\r\n >\r\n @if (action.subActions && action.subActions.length > 0) {\r\n <ui-tiered-menu\r\n #submenu\r\n [triggerAction]=\"action\"\r\n [isSubmenu]=\"true\"\r\n [subActions]=\"action.subActions!\"\r\n [menuOpenDirection]=\"triggerAction.descriptor?.menu?.openDirection\"\r\n (actionClick)=\"actionClick.emit($event)\"\r\n (submenuOpened)=\"onSubmenuOpened(submenu)\"\r\n ></ui-tiered-menu>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"action.descriptor!\"\r\n [code]=\"action.code\"\r\n [disabled]=\"!!action.disabled\"\r\n (actionClick)=\"!action.subActions?.length && onActionClick(action)\"\r\n ></ui-action-button>\r\n }\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #triggerTempalte>\r\n <ui-action-button\r\n [descriptor]=\"triggerAction.descriptor!\"\r\n [code]=\"triggerAction.code\"\r\n [disabled]=\"!!triggerAction.disabled\"\r\n (actionClick)=\"toggleMenu($event.event)\"\r\n [class.submenuTrigger]=\"isSubmenu\"\r\n >\r\n </ui-action-button>\r\n</ng-template>\r\n", styles: [":host{display:inline-block;position:relative}ul,.ui-tiered-menu{top:100%;left:0;list-style:none;padding-left:0;margin:0;background:#fff;width:fit-content;box-shadow:2px 2px 8px #0003;z-index:1000;border-radius:5px;padding:.1rem}.submenuTrigger,.ui-tiered-menu ::ng-deep button{background-color:#fff;box-shadow:unset;border:unset;border-radius:unset;color:#000;width:100%;justify-content:flex-start}.hoverEffect:hover,.hoverEffect ::ng-deep button:hover{background-color:#f1f5f9}.hoverEffect.activeSubmenu,.hoverEffect.activeSubmenu ::ng-deep button{background-color:#f1f5f9}.ui-tiered-menu ::ng-deep ui-action-button,.ui-tiered-menu ::ng-deep ui-badge{width:100%}.ui-tiered-menu>li{position:relative}.submenu{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.submenu ::ng-deep ui-action-button{flex:1}.disabled{color:#aaa;cursor:not-allowed}.ui-tiered-menu ui-tiered-menu{width:100%}smart-icon{align-content:center}\n"] }]
6575
+ args: [{ selector: 'ui-tiered-menu', template: "@if (isSubmenu) {\r\n <div class=\"submenu hoverEffect\" [class.activeSubmenu]=\"isOpen\" (mouseenter)=\"openMenu($event)\">\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n <smart-icon [icon]=\"icon\" color=\"black\"></smart-icon>\r\n </div>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n}\r\n\r\n<ng-template #menuTemplate>\r\n <ul class=\"ui-tiered-menu sb4-menu-panel\">\r\n <li\r\n *ngFor=\"let action of subActions\"\r\n class=\"hoverEffect\"\r\n [class.disabled]=\"action.disabled\"\r\n (mouseenter)=\"closeSiblingSubmenus(action)\"\r\n >\r\n @if (action.subActions && action.subActions.length > 0) {\r\n <ui-tiered-menu\r\n #submenu\r\n [triggerAction]=\"action\"\r\n [isSubmenu]=\"true\"\r\n [subActions]=\"action.subActions!\"\r\n [menuOpenDirection]=\"triggerAction.descriptor?.menu?.openDirection\"\r\n (actionClick)=\"actionClick.emit($event)\"\r\n (submenuOpened)=\"onSubmenuOpened(submenu)\"\r\n ></ui-tiered-menu>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"action.descriptor!\"\r\n [code]=\"action.code\"\r\n [disabled]=\"!!action.disabled\"\r\n (actionClick)=\"!action.subActions?.length && onActionClick(action)\"\r\n ></ui-action-button>\r\n <smart-icon></smart-icon>\r\n }\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #triggerTempalte>\r\n <ui-action-button\r\n [descriptor]=\"triggerAction.descriptor!\"\r\n [code]=\"triggerAction.code\"\r\n [disabled]=\"!!triggerAction.disabled\"\r\n (actionClick)=\"toggleMenu($event.event)\"\r\n [class.submenuTrigger]=\"isSubmenu\"\r\n >\r\n </ui-action-button>\r\n</ng-template>\r\n", styles: [":host{display:inline-block;position:relative}li{display:flex}ul,.ui-tiered-menu{top:100%;left:0;list-style:none;padding-left:0;margin:0;background:#fff;width:fit-content;box-shadow:2px 2px 8px #0003;z-index:1000;border-radius:5px;padding:.1rem}.submenuTrigger,.ui-tiered-menu ::ng-deep button{background-color:#fff;box-shadow:unset;border:unset;border-radius:unset;color:#000;width:100%;justify-content:flex-start}.hoverEffect:hover,.hoverEffect ::ng-deep button:hover{background-color:#f1f5f9}.hoverEffect.activeSubmenu,.hoverEffect.activeSubmenu ::ng-deep button{background-color:#f1f5f9}.ui-tiered-menu ::ng-deep ui-action-button,.ui-tiered-menu ::ng-deep ui-badge{width:100%}.ui-tiered-menu>li{position:relative}.submenu{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.submenu ::ng-deep ui-action-button{flex:1}.disabled{color:#aaa;cursor:not-allowed}.ui-tiered-menu ui-tiered-menu{width:100%}smart-icon{align-content:center}:host ::ng-deep .menu-row{display:flex;flex-direction:row;align-items:center}:host ::ng-deep .menu-row-reverse{display:flex;flex-direction:row-reverse;align-items:center}\n"] }]
6541
6576
  }], ctorParameters: () => [{ type: UiMenuService }, { type: i2$2.Overlay }, { type: i0.ViewContainerRef }, { type: i2$2.OverlayPositionBuilder }, { type: ComponentLibrary, decorators: [{
6542
6577
  type: Inject,
6543
6578
  args: [COMPONENT_LIBRARY]
@@ -6607,7 +6642,7 @@ class HoverMenuComponent {
6607
6642
  if (changes['triggerAction']) {
6608
6643
  const trigger = changes['triggerAction'].currentValue;
6609
6644
  const previousTrigger = changes['triggerAction'].previousValue;
6610
- this.subActions = trigger?.subActions ?? [];
6645
+ this.subActions = this.normalizeSubActions(trigger?.subActions ?? []);
6611
6646
  if (this.isOpen && previousTrigger) {
6612
6647
  const hasSubActionsChanged = this.hasSubActionsChanged(previousTrigger?.subActions, trigger?.subActions);
6613
6648
  if (hasSubActionsChanged) {
@@ -6729,12 +6764,32 @@ class HoverMenuComponent {
6729
6764
  }
6730
6765
  });
6731
6766
  }
6767
+ normalizeSubActions(actions) {
6768
+ const anyHasIcon = actions.some((a) => a.descriptor?.icon || a.descriptor?.iconResource);
6769
+ return actions.map((action) => ({
6770
+ ...action,
6771
+ descriptor: action.descriptor
6772
+ ? {
6773
+ ...action.descriptor,
6774
+ type: UiActionButtonType.NORMAL,
6775
+ iconPosition: anyHasIcon
6776
+ ? action.descriptor.icon || action.descriptor.iconResource
6777
+ ? action.descriptor.iconPosition
6778
+ : IconPosition.EMPTY
6779
+ : action.descriptor.iconPosition,
6780
+ }
6781
+ : {
6782
+ type: UiActionButtonType.NORMAL,
6783
+ iconPosition: anyHasIcon ? IconPosition.EMPTY : undefined,
6784
+ },
6785
+ }));
6786
+ }
6732
6787
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: HoverMenuComponent, deps: [{ token: UiMenuService }, { token: i2$2.Overlay }, { token: i0.ViewContainerRef }, { token: i2$2.OverlayPositionBuilder }, { token: COMPONENT_LIBRARY, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
6733
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: { triggerAction: "triggerAction", isSubmenu: "isSubmenu", menuOpenDirection: "menuOpenDirection" }, outputs: { actionClick: "actionClick", submenuOpened: "submenuOpened" }, host: { listeners: { "click": "onMenuClick($event)", "document:click": "onDocumentClick($event)" } }, viewQueries: [{ propertyName: "menuTemplate", first: true, predicate: ["menuTemplate"], descendants: true }, { propertyName: "submenuComponents", predicate: ["submenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (isSubmenu) {\r\n <div class=\"submenu hoverEffect\" [class.activeSubmenu]=\"isOpen\" (mouseenter)=\"openMenu($event)\">\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n <smart-icon [icon]=\"icon\" color=\"black\"></smart-icon>\r\n </div>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n}\r\n\r\n<ng-template #menuTemplate>\r\n <ul class=\"ui-hover-menu sb4-menu-panel\">\r\n <li\r\n *ngFor=\"let action of subActions\"\r\n class=\"hoverEffect\"\r\n [class.disabled]=\"action.disabled\"\r\n (mouseenter)=\"closeSiblingSubmenus(action)\"\r\n >\r\n @if (action.subActions && action.subActions.length > 0) {\r\n <ui-hover-menu\r\n #submenu\r\n [triggerAction]=\"action\"\r\n [isSubmenu]=\"true\"\r\n [subActions]=\"action.subActions!\"\r\n [menuOpenDirection]=\"triggerAction.descriptor?.menu?.openDirection\"\r\n (actionClick)=\"actionClick.emit($event)\"\r\n (submenuOpened)=\"onSubmenuOpened(submenu)\"\r\n ></ui-hover-menu>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"action.descriptor!\"\r\n [code]=\"action.code\"\r\n [disabled]=\"!!action.disabled\"\r\n (actionClick)=\"onActionClick(action)\"\r\n ></ui-action-button>\r\n }\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #triggerTempalte>\r\n <ui-action-button\r\n [descriptor]=\"triggerAction.descriptor!\"\r\n [code]=\"triggerAction.code\"\r\n [disabled]=\"!!triggerAction.disabled\"\r\n (mouseenter)=\"openMenu($event)\"\r\n (actionClick)=\"onActionClick(triggerAction)\"\r\n [class.submenuTrigger]=\"isSubmenu\"\r\n >\r\n </ui-action-button>\r\n</ng-template>\r\n", styles: [":host{display:inline-block;position:relative}ul,.ui-hover-menu{top:100%;left:0;list-style:none;padding-left:0;margin:0;background:#fff;width:fit-content;box-shadow:2px 2px 8px #0003;z-index:1000;border-radius:5px;padding:.1rem}.submenuTrigger,.ui-hover-menu ::ng-deep button{background-color:#fff;box-shadow:unset;border:unset;border-radius:unset;color:#000;width:100%;justify-content:flex-start}.hoverEffect:hover,.hoverEffect ::ng-deep button:hover{background-color:#f1f5f9}.hoverEffect.activeSubmenu,.hoverEffect.activeSubmenu ::ng-deep button{background-color:#f1f5f9}.ui-hover-menu ::ng-deep ui-action-button,.ui-hover-menu ::ng-deep ui-badge{width:100%}.ui-hover-menu>li{position:relative}.submenu{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.submenu ::ng-deep ui-action-button{flex:1}.disabled{color:#aaa;cursor:not-allowed}.ui-hover-menu ui-hover-menu{width:100%}smart-icon{align-content:center}\n"], dependencies: [{ 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: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "addedCssClass", "addBasicClasses"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }] }); }
6788
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: { triggerAction: "triggerAction", isSubmenu: "isSubmenu", menuOpenDirection: "menuOpenDirection" }, outputs: { actionClick: "actionClick", submenuOpened: "submenuOpened" }, host: { listeners: { "click": "onMenuClick($event)", "document:click": "onDocumentClick($event)" } }, viewQueries: [{ propertyName: "menuTemplate", first: true, predicate: ["menuTemplate"], descendants: true }, { propertyName: "submenuComponents", predicate: ["submenu"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"submenu hoverEffect\" [class.activeSubmenu]=\"isOpen\" (mouseenter)=\"openMenu($event)\">\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n @if (isSubmenu) {\r\n <smart-icon [icon]=\"icon\" color=\"black\"></smart-icon>\r\n } @else {\r\n <smart-icon></smart-icon>\r\n }\r\n</div>\r\n\r\n<ng-template #menuTemplate>\r\n <ul class=\"ui-hover-menu sb4-menu-panel\">\r\n <li\r\n *ngFor=\"let action of subActions\"\r\n class=\"hoverEffect\"\r\n [class.disabled]=\"action.disabled\"\r\n (mouseenter)=\"closeSiblingSubmenus(action)\"\r\n >\r\n @if (action.subActions && action.subActions.length > 0) {\r\n <ui-hover-menu\r\n #submenu\r\n [triggerAction]=\"action\"\r\n [isSubmenu]=\"true\"\r\n [subActions]=\"action.subActions!\"\r\n [menuOpenDirection]=\"triggerAction.descriptor?.menu?.openDirection\"\r\n (actionClick)=\"actionClick.emit($event)\"\r\n (submenuOpened)=\"onSubmenuOpened(submenu)\"\r\n ></ui-hover-menu>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"action.descriptor!\"\r\n [code]=\"action.code\"\r\n [disabled]=\"!!action.disabled\"\r\n (actionClick)=\"onActionClick(action)\"\r\n ></ui-action-button>\r\n }\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #triggerTempalte>\r\n <ui-action-button\r\n [descriptor]=\"triggerAction.descriptor!\"\r\n [code]=\"triggerAction.code\"\r\n [disabled]=\"!!triggerAction.disabled\"\r\n (mouseenter)=\"openMenu($event)\"\r\n (actionClick)=\"onActionClick(triggerAction)\"\r\n [class.submenuTrigger]=\"isSubmenu\"\r\n >\r\n </ui-action-button>\r\n</ng-template>\r\n", styles: [":host{display:inline-block;position:relative}ul,.ui-hover-menu{top:100%;left:0;list-style:none;padding-left:0;margin:0;background:#fff;width:fit-content;box-shadow:2px 2px 8px #0003;z-index:1000;border-radius:5px;padding:.1rem}.submenuTrigger,.ui-hover-menu ::ng-deep button{background-color:#fff;box-shadow:unset;border:unset;border-radius:unset;color:#000;width:100%;justify-content:flex-start}.hoverEffect:hover,.hoverEffect ::ng-deep button:hover{background-color:#f1f5f9}.hoverEffect.activeSubmenu,.hoverEffect.activeSubmenu ::ng-deep button{background-color:#f1f5f9}.ui-hover-menu ::ng-deep ui-action-button,.ui-hover-menu ::ng-deep ui-badge{width:100%}.ui-hover-menu>li{position:relative}.submenu{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.submenu ::ng-deep ui-action-button{flex:1}.disabled{color:#aaa;cursor:not-allowed}.ui-hover-menu ui-hover-menu{width:100%}smart-icon{align-content:center}\n"], dependencies: [{ 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: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "addedCssClass", "addBasicClasses"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu", "menuOpenDirection"], outputs: ["actionClick", "submenuOpened"] }] }); }
6734
6789
  }
6735
6790
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: HoverMenuComponent, decorators: [{
6736
6791
  type: Component,
6737
- args: [{ selector: 'ui-hover-menu', template: "@if (isSubmenu) {\r\n <div class=\"submenu hoverEffect\" [class.activeSubmenu]=\"isOpen\" (mouseenter)=\"openMenu($event)\">\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n <smart-icon [icon]=\"icon\" color=\"black\"></smart-icon>\r\n </div>\r\n} @else {\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n}\r\n\r\n<ng-template #menuTemplate>\r\n <ul class=\"ui-hover-menu sb4-menu-panel\">\r\n <li\r\n *ngFor=\"let action of subActions\"\r\n class=\"hoverEffect\"\r\n [class.disabled]=\"action.disabled\"\r\n (mouseenter)=\"closeSiblingSubmenus(action)\"\r\n >\r\n @if (action.subActions && action.subActions.length > 0) {\r\n <ui-hover-menu\r\n #submenu\r\n [triggerAction]=\"action\"\r\n [isSubmenu]=\"true\"\r\n [subActions]=\"action.subActions!\"\r\n [menuOpenDirection]=\"triggerAction.descriptor?.menu?.openDirection\"\r\n (actionClick)=\"actionClick.emit($event)\"\r\n (submenuOpened)=\"onSubmenuOpened(submenu)\"\r\n ></ui-hover-menu>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"action.descriptor!\"\r\n [code]=\"action.code\"\r\n [disabled]=\"!!action.disabled\"\r\n (actionClick)=\"onActionClick(action)\"\r\n ></ui-action-button>\r\n }\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #triggerTempalte>\r\n <ui-action-button\r\n [descriptor]=\"triggerAction.descriptor!\"\r\n [code]=\"triggerAction.code\"\r\n [disabled]=\"!!triggerAction.disabled\"\r\n (mouseenter)=\"openMenu($event)\"\r\n (actionClick)=\"onActionClick(triggerAction)\"\r\n [class.submenuTrigger]=\"isSubmenu\"\r\n >\r\n </ui-action-button>\r\n</ng-template>\r\n", styles: [":host{display:inline-block;position:relative}ul,.ui-hover-menu{top:100%;left:0;list-style:none;padding-left:0;margin:0;background:#fff;width:fit-content;box-shadow:2px 2px 8px #0003;z-index:1000;border-radius:5px;padding:.1rem}.submenuTrigger,.ui-hover-menu ::ng-deep button{background-color:#fff;box-shadow:unset;border:unset;border-radius:unset;color:#000;width:100%;justify-content:flex-start}.hoverEffect:hover,.hoverEffect ::ng-deep button:hover{background-color:#f1f5f9}.hoverEffect.activeSubmenu,.hoverEffect.activeSubmenu ::ng-deep button{background-color:#f1f5f9}.ui-hover-menu ::ng-deep ui-action-button,.ui-hover-menu ::ng-deep ui-badge{width:100%}.ui-hover-menu>li{position:relative}.submenu{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.submenu ::ng-deep ui-action-button{flex:1}.disabled{color:#aaa;cursor:not-allowed}.ui-hover-menu ui-hover-menu{width:100%}smart-icon{align-content:center}\n"] }]
6792
+ args: [{ selector: 'ui-hover-menu', template: "<div class=\"submenu hoverEffect\" [class.activeSubmenu]=\"isOpen\" (mouseenter)=\"openMenu($event)\">\r\n <ng-container *ngTemplateOutlet=\"triggerTempalte\"></ng-container>\r\n @if (isSubmenu) {\r\n <smart-icon [icon]=\"icon\" color=\"black\"></smart-icon>\r\n } @else {\r\n <smart-icon></smart-icon>\r\n }\r\n</div>\r\n\r\n<ng-template #menuTemplate>\r\n <ul class=\"ui-hover-menu sb4-menu-panel\">\r\n <li\r\n *ngFor=\"let action of subActions\"\r\n class=\"hoverEffect\"\r\n [class.disabled]=\"action.disabled\"\r\n (mouseenter)=\"closeSiblingSubmenus(action)\"\r\n >\r\n @if (action.subActions && action.subActions.length > 0) {\r\n <ui-hover-menu\r\n #submenu\r\n [triggerAction]=\"action\"\r\n [isSubmenu]=\"true\"\r\n [subActions]=\"action.subActions!\"\r\n [menuOpenDirection]=\"triggerAction.descriptor?.menu?.openDirection\"\r\n (actionClick)=\"actionClick.emit($event)\"\r\n (submenuOpened)=\"onSubmenuOpened(submenu)\"\r\n ></ui-hover-menu>\r\n } @else {\r\n <ui-action-button\r\n [descriptor]=\"action.descriptor!\"\r\n [code]=\"action.code\"\r\n [disabled]=\"!!action.disabled\"\r\n (actionClick)=\"onActionClick(action)\"\r\n ></ui-action-button>\r\n }\r\n </li>\r\n </ul>\r\n</ng-template>\r\n\r\n<ng-template #triggerTempalte>\r\n <ui-action-button\r\n [descriptor]=\"triggerAction.descriptor!\"\r\n [code]=\"triggerAction.code\"\r\n [disabled]=\"!!triggerAction.disabled\"\r\n (mouseenter)=\"openMenu($event)\"\r\n (actionClick)=\"onActionClick(triggerAction)\"\r\n [class.submenuTrigger]=\"isSubmenu\"\r\n >\r\n </ui-action-button>\r\n</ng-template>\r\n", styles: [":host{display:inline-block;position:relative}ul,.ui-hover-menu{top:100%;left:0;list-style:none;padding-left:0;margin:0;background:#fff;width:fit-content;box-shadow:2px 2px 8px #0003;z-index:1000;border-radius:5px;padding:.1rem}.submenuTrigger,.ui-hover-menu ::ng-deep button{background-color:#fff;box-shadow:unset;border:unset;border-radius:unset;color:#000;width:100%;justify-content:flex-start}.hoverEffect:hover,.hoverEffect ::ng-deep button:hover{background-color:#f1f5f9}.hoverEffect.activeSubmenu,.hoverEffect.activeSubmenu ::ng-deep button{background-color:#f1f5f9}.ui-hover-menu ::ng-deep ui-action-button,.ui-hover-menu ::ng-deep ui-badge{width:100%}.ui-hover-menu>li{position:relative}.submenu{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.submenu ::ng-deep ui-action-button{flex:1}.disabled{color:#aaa;cursor:not-allowed}.ui-hover-menu ui-hover-menu{width:100%}smart-icon{align-content:center}\n"] }]
6738
6793
  }], ctorParameters: () => [{ type: UiMenuService }, { type: i2$2.Overlay }, { type: i0.ViewContainerRef }, { type: i2$2.OverlayPositionBuilder }, { type: ComponentLibrary, decorators: [{
6739
6794
  type: Inject,
6740
6795
  args: [COMPONENT_LIBRARY]
@@ -6898,7 +6953,7 @@ class UiActionToolbarComponent {
6898
6953
  scheduleActions(uiActionModels) {
6899
6954
  this.clearSchedule();
6900
6955
  uiActionModels.forEach((uiActionModel) => {
6901
- let uiAction = uiActionModel.uiAction;
6956
+ var uiAction = uiActionModel.uiAction;
6902
6957
  if (!uiAction.code ||
6903
6958
  uiAction.disabled ||
6904
6959
  !uiAction.schedule?.intervalSeconds ||
@@ -6906,15 +6961,21 @@ class UiActionToolbarComponent {
6906
6961
  uiAction.subActions?.length) {
6907
6962
  return;
6908
6963
  }
6909
- let intervalInMs = uiAction.schedule.intervalSeconds * 1000;
6910
- let sub = interval(intervalInMs)
6964
+ var intervalInMs = uiAction.schedule.intervalSeconds * 1000;
6965
+ var sub = interval(intervalInMs)
6911
6966
  .pipe(takeUntil(this._destroy$))
6912
6967
  .subscribe(() => {
6913
- uiActionModel.uiAction.params = {
6914
- ...uiActionModel.uiAction.params,
6915
- scheduled: true,
6968
+ var scheduledUiActionModel = {
6969
+ ...uiActionModel,
6970
+ uiAction: {
6971
+ ...uiActionModel.uiAction,
6972
+ params: {
6973
+ ...uiActionModel.uiAction.params,
6974
+ scheduled: true,
6975
+ },
6976
+ },
6916
6977
  };
6917
- this.fireAction(uiActionModel);
6978
+ this.fireAction(scheduledUiActionModel);
6918
6979
  });
6919
6980
  this.schedules.set(uiAction.code, sub);
6920
6981
  });