@smartbit4all/ng-client 4.5.43 → 4.5.44

package/fesm2022/smartbit4all-ng-client.mjs

@@ -1531,6 +1531,48 @@ class ViewService {
             reportProgress: reportProgress
         });
     }
+    getAndroidTheme(name, observe = 'body', reportProgress = false, options) {
+        if (name === null || name === undefined) {
+            throw new Error('Required parameter name was null or undefined when calling getAndroidTheme.');
+        }
+        let localVarHeaders = this.defaultHeaders;
+        let localVarHttpHeaderAcceptSelected = options && options.httpHeaderAccept;
+        if (localVarHttpHeaderAcceptSelected === undefined) {
+            // to determine the Accept header
+            const httpHeaderAccepts = [
+                'application/json'
+            ];
+            localVarHttpHeaderAcceptSelected = this.configuration.selectHeaderAccept(httpHeaderAccepts);
+        }
+        if (localVarHttpHeaderAcceptSelected !== undefined) {
+            localVarHeaders = localVarHeaders.set('Accept', localVarHttpHeaderAcceptSelected);
+        }
+        let localVarHttpContext = options && options.context;
+        if (localVarHttpContext === undefined) {
+            localVarHttpContext = new HttpContext();
+        }
+        let responseType_ = 'json';
+        if (localVarHttpHeaderAcceptSelected) {
+            if (localVarHttpHeaderAcceptSelected.startsWith('text')) {
+                responseType_ = 'text';
+            }
+            else if (this.configuration.isJsonMime(localVarHttpHeaderAcceptSelected)) {
+                responseType_ = 'json';
+            }
+            else {
+                responseType_ = 'blob';
+            }
+        }
+        let localVarPath = `/context/themes/android/${this.configuration.encodeParam({ name: "name", value: name, in: "path", style: "simple", explode: false, dataType: "string", dataFormat: undefined })}`;
+        return this.httpClient.request('get', `${this.configuration.basePath}${localVarPath}`, {
+            context: localVarHttpContext,
+            responseType: responseType_,
+            withCredentials: this.configuration.withCredentials,
+            headers: localVarHeaders,
+            observe: observe,
+            reportProgress: reportProgress
+        });
+    }
     getComponentModel(uuid, observe = 'body', reportProgress = false, options) {
         if (uuid === null || uuid === undefined) {
             throw new Error('Required parameter uuid was null or undefined when calling getComponentModel.');
@@ -1615,6 +1657,48 @@ class ViewService {
             reportProgress: reportProgress
         });
     }
+    getIosTheme(name, observe = 'body', reportProgress = false, options) {
+        if (name === null || name === undefined) {
+            throw new Error('Required parameter name was null or undefined when calling getIosTheme.');
+        }
+        let localVarHeaders = this.defaultHeaders;
+        let localVarHttpHeaderAcceptSelected = options && options.httpHeaderAccept;
+        if (localVarHttpHeaderAcceptSelected === undefined) {
+            // to determine the Accept header
+            const httpHeaderAccepts = [
+                'application/json'
+            ];
+            localVarHttpHeaderAcceptSelected = this.configuration.selectHeaderAccept(httpHeaderAccepts);
+        }
+        if (localVarHttpHeaderAcceptSelected !== undefined) {
+            localVarHeaders = localVarHeaders.set('Accept', localVarHttpHeaderAcceptSelected);
+        }
+        let localVarHttpContext = options && options.context;
+        if (localVarHttpContext === undefined) {
+            localVarHttpContext = new HttpContext();
+        }
+        let responseType_ = 'json';
+        if (localVarHttpHeaderAcceptSelected) {
+            if (localVarHttpHeaderAcceptSelected.startsWith('text')) {
+                responseType_ = 'text';
+            }
+            else if (this.configuration.isJsonMime(localVarHttpHeaderAcceptSelected)) {
+                responseType_ = 'json';
+            }
+            else {
+                responseType_ = 'blob';
+            }
+        }
+        let localVarPath = `/context/themes/ios/${this.configuration.encodeParam({ name: "name", value: name, in: "path", style: "simple", explode: false, dataType: "string", dataFormat: undefined })}`;
+        return this.httpClient.request('get', `${this.configuration.basePath}${localVarPath}`, {
+            context: localVarHttpContext,
+            responseType: responseType_,
+            withCredentials: this.configuration.withCredentials,
+            headers: localVarHeaders,
+            observe: observe,
+            reportProgress: reportProgress
+        });
+    }
     getPublishedViewData(channel, uuid, observe = 'body', reportProgress = false, options) {
         if (channel === null || channel === undefined) {
             throw new Error('Required parameter channel was null or undefined when calling getPublishedViewData.');
@@ -2459,6 +2543,23 @@ var LinkTargetEnum;
 })(LinkTargetEnum || (LinkTargetEnum = {}));
 ;
 
+/**
+ * View API
+ * View API
+ *
+ * The version of the OpenAPI document: 1.0.0
+ * Contact: info@it4all.hu
+ *
+ * NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
+ * https://openapi-generator.tech
+ * Do not edit the class manually.
+ */
+var MenuTriggerType;
+(function (MenuTriggerType) {
+    MenuTriggerType["CLICK"] = "CLICK";
+    MenuTriggerType["HOVER"] = "HOVER";
+})(MenuTriggerType || (MenuTriggerType = {}));
+
 /**
  * View API
  * View API
@@ -3262,21 +3363,29 @@ class UiActionButtonComponent {
     }
     ngOnInit() {
         if (!this.descriptor) {
-            throw new Error('UiActionButtonComponent: "descriptor" input is required but was not provided.');
+            this.descriptor = {
+                title: this.code ?? 'UNDEFINED_BUTTON',
+                color: 'primary',
+                type: UiActionButtonType.FLAT,
+            };
         }
+        this.buildMainActionModel();
     }
     ngOnChanges(changes) {
         if (changes['descriptor'] && this.descriptor) {
-            this.mainActionModel = {
-                descriptor: this.descriptor,
-                uiAction: {
-                    descriptor: this.descriptor,
-                    code: this.code,
-                    disabled: this.disabled ?? false,
-                },
-            };
+            this.buildMainActionModel();
         }
     }
+    buildMainActionModel() {
+        this.mainActionModel = {
+            descriptor: this.descriptor,
+            uiAction: {
+                descriptor: this.descriptor,
+                code: this.code,
+                disabled: this.disabled ?? false,
+            },
+        };
+    }
     ngOnDestroy() {
         this._destroy$.next();
         this._destroy$.complete();
@@ -6249,7 +6358,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
             args: [{ providedIn: 'root' }]
         }] });
 
-class MenuComponent {
+class ClickMenuComponent {
     constructor(menuService, overlay, viewContainerRef, overlayPositionBuilder, compLib) {
         this.menuService = menuService;
         this.overlay = overlay;
@@ -6367,7 +6476,7 @@ class MenuComponent {
             this.menuService.closeAllMenus();
         }
         let triggerElement = event.currentTarget;
-        const positions = this.isSubmenu ? SUBMENU_POSITIONS : ROOT_MENU_POSITIONS;
+        var positions = this.isSubmenu ? SUBMENU_POSITIONS : ROOT_MENU_POSITIONS;
         let positionStrategy = this.overlayPositionBuilder
             .flexibleConnectedTo(triggerElement)
             .withFlexibleDimensions(false)
@@ -6390,7 +6499,6 @@ class MenuComponent {
         }
     }
     onSubmenuOpened(openedAction) {
-        // Check if submenuComponents is available
         if (!this.submenuComponents || this.submenuComponents.length === 0) {
             setTimeout(() => {
                 this.onSubmenuOpened(openedAction);
@@ -6403,12 +6511,212 @@ class MenuComponent {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: MenuComponent, deps: [{ token: UiMenuService }, { token: i2$2.Overlay }, { token: i0.ViewContainerRef }, { token: i2$2.OverlayPositionBuilder }, { token: COMPONENT_LIBRARY, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: MenuComponent, selector: "ui-tiered-menu", inputs: { triggerAction: "triggerAction", isSubmenu: "isSubmenu" }, 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\">\r\n    <li *ngFor=\"let action of subActions\" class=\"hoverEffect\" [class.disabled]=\"action.disabled\">\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          (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: MenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu"], outputs: ["actionClick", "submenuOpened"] }] }); }
+    closeSiblingSubmenus(exceptAction) {
+        this.submenuComponents?.forEach((submenu) => {
+            if (submenu.triggerAction.code !== exceptAction.code && submenu.isOpen) {
+                submenu.closeMenu();
+            }
+        });
+    }
+    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 }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: { triggerAction: "triggerAction", isSubmenu: "isSubmenu" }, 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          (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"], outputs: ["actionClick", "submenuOpened"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ClickMenuComponent, decorators: [{
+            type: Component,
+            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          (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"] }]
+        }], ctorParameters: () => [{ type: UiMenuService }, { type: i2$2.Overlay }, { type: i0.ViewContainerRef }, { type: i2$2.OverlayPositionBuilder }, { type: ComponentLibrary, decorators: [{
+                    type: Inject,
+                    args: [COMPONENT_LIBRARY]
+                }, {
+                    type: Optional
+                }] }], propDecorators: { submenuComponents: [{
+                type: ViewChildren,
+                args: ['submenu']
+            }], menuTemplate: [{
+                type: ViewChild,
+                args: ['menuTemplate']
+            }], triggerAction: [{
+                type: Input
+            }], isSubmenu: [{
+                type: Input
+            }], actionClick: [{
+                type: Output
+            }], submenuOpened: [{
+                type: Output
+            }], onMenuClick: [{
+                type: HostListener,
+                args: ['click', ['$event']]
+            }], onDocumentClick: [{
+                type: HostListener,
+                args: ['document:click', ['$event']]
+            }] } });
+
+class HoverMenuComponent {
+    constructor(menuService, overlay, viewContainerRef, overlayPositionBuilder, compLib) {
+        this.menuService = menuService;
+        this.overlay = overlay;
+        this.viewContainerRef = viewContainerRef;
+        this.overlayPositionBuilder = overlayPositionBuilder;
+        this.compLib = compLib;
+        this.overlayRef = null;
+        this.isSubmenu = false;
+        this.actionClick = new EventEmitter();
+        this.submenuOpened = new EventEmitter();
+        this.destroy$ = new Subject();
+        this.submenuOpenMap = new Map();
+        this.subActions = [];
+        this.hasCheckedChildren = false;
+        this.compLib = compLib ?? ComponentLibrary.PRIMENG;
+        if (this.compLib === ComponentLibrary.PRIMENG) {
+            this.icon = 'chevron-right';
+        }
+        else if (this.compLib === ComponentLibrary.MATERIAL) {
+            this.icon = 'chevron_right';
+        }
+    }
+    ngOnInit() {
+        this.menuService
+            .getCloseSignal()
+            .pipe(takeUntil(this.destroy$))
+            .subscribe(() => {
+            this.closeMenu();
+        });
+    }
+    ngAfterViewChecked() {
+        if (this.isOpen && !this.hasCheckedChildren && this.submenuComponents.length > 0) {
+            this.hasCheckedChildren = true;
+        }
+    }
+    ngOnChanges(changes) {
+        if (changes['triggerAction']) {
+            const trigger = changes['triggerAction'].currentValue;
+            const previousTrigger = changes['triggerAction'].previousValue;
+            this.subActions = trigger?.subActions ?? [];
+            if (this.isOpen && previousTrigger) {
+                const hasSubActionsChanged = this.hasSubActionsChanged(previousTrigger?.subActions, trigger?.subActions);
+                if (hasSubActionsChanged) {
+                    this.refreshOverlay();
+                }
+            }
+        }
+    }
+    hasSubActionsChanged(oldSubActions, newSubActions) {
+        const oldLength = oldSubActions?.length ?? 0;
+        const newLength = newSubActions?.length ?? 0;
+        if (oldLength !== newLength) {
+            return true;
+        }
+        if (oldLength > 0 && newLength > 0) {
+            for (let i = 0; i < newLength; i++) {
+                if (oldSubActions[i].code !== newSubActions[i].code) {
+                    return true;
+                }
+            }
+        }
+        return false;
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    onActionClick(action) {
+        if (!action.disabled) {
+            this.actionClick.emit(action);
+            this.menuService.closeAllMenus();
+        }
+    }
+    onMenuClick(event) {
+        event.stopPropagation();
+    }
+    onDocumentClick(event) {
+        this.menuService.closeAllMenus();
+        if (this.overlayRef) {
+            this.closeMenu();
+        }
+    }
+    get isOpen() {
+        return !!this.overlayRef;
+    }
+    closeMenu() {
+        if (this.overlayRef) {
+            this.overlayRef.dispose();
+            this.overlayRef = null;
+            this.hasCheckedChildren = false;
+        }
+        if (this.submenuComponents && this.submenuComponents.length > 0) {
+            this.submenuComponents.forEach((submenu) => {
+                submenu.closeMenu();
+            });
+        }
+    }
+    refreshOverlay() {
+        if (!this.overlayRef) {
+            return;
+        }
+        this.overlayRef.detach();
+        let portal = new TemplatePortal(this.menuTemplate, this.viewContainerRef);
+        this.overlayRef.attach(portal);
+        this.hasCheckedChildren = false;
+    }
+    openMenu(event) {
+        if (this.isOpen) {
+            return;
+        }
+        if (this.isSubmenu) {
+            this.submenuOpened.emit(this.triggerAction);
+        }
+        else {
+            this.menuService.closeAllMenus();
+        }
+        let triggerElement = event.currentTarget;
+        var positions = this.isSubmenu ? SUBMENU_POSITIONS : ROOT_MENU_POSITIONS;
+        let positionStrategy = this.overlayPositionBuilder
+            .flexibleConnectedTo(triggerElement)
+            .withFlexibleDimensions(false)
+            .withPush(true)
+            .withPositions(positions);
+        this.overlayRef = this.overlay.create({
+            positionStrategy,
+            scrollStrategy: this.overlay.scrollStrategies.reposition(),
+            hasBackdrop: false,
+        });
+        let portal = new TemplatePortal(this.menuTemplate, this.viewContainerRef);
+        this.overlayRef.attach(portal);
+    }
+    toggleMenu(event) {
+        if (!this.isOpen) {
+            this.openMenu(event);
+        }
+        else {
+            this.closeMenu();
+        }
+    }
+    onSubmenuOpened(openedAction) {
+        if (!this.submenuComponents || this.submenuComponents.length === 0) {
+            setTimeout(() => {
+                this.onSubmenuOpened(openedAction);
+            }, 0);
+            return;
+        }
+        this.submenuComponents.forEach((submenu) => {
+            if (submenu.triggerAction.code !== openedAction.code && submenu.overlayRef) {
+                submenu.closeMenu();
+            }
+        });
+    }
+    closeSiblingSubmenus(exceptAction) {
+        this.submenuComponents?.forEach((submenu) => {
+            if (submenu.triggerAction.code !== exceptAction.code && submenu.isOpen) {
+                submenu.closeMenu();
+            }
+        });
+    }
+    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 }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: { triggerAction: "triggerAction", isSubmenu: "isSubmenu" }, 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          (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"], outputs: ["actionClick", "submenuOpened"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: MenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: HoverMenuComponent, decorators: [{
             type: Component,
-            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\">\r\n    <li *ngFor=\"let action of subActions\" class=\"hoverEffect\" [class.disabled]=\"action.disabled\">\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          (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"] }]
+            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          (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"] }]
         }], ctorParameters: () => [{ type: UiMenuService }, { type: i2$2.Overlay }, { type: i0.ViewContainerRef }, { type: i2$2.OverlayPositionBuilder }, { type: ComponentLibrary, decorators: [{
                     type: Inject,
                     args: [COMPONENT_LIBRARY]
@@ -6475,6 +6783,7 @@ class UiActionToolbarComponent {
         this.compLib = compLib;
         this._destroy$ = new Subject();
         this.componentLibrary = ComponentLibrary; // Expose the enum to the template
+        this.triggerType = MenuTriggerType;
         this.pressedButtonActive = true;
         this.scrollOnWrap = false;
         this.isScrollable = false;
@@ -6747,11 +7056,11 @@ class UiActionToolbarComponent {
         return this.toolbarPropertes?.direction === ToolbarDirection.VERTICAL;
     }
     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 }); }
-    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  }\"\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      <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    } @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        (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", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}.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}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%;justify-content:flex-start}\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: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "addedCssClass", "addBasicClasses"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: MenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
+    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  }\"\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        (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  @if (uiActionModel?.uiAction?.descriptor?.menuTriggerType == 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  } @else {\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</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}.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}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%;justify-content:flex-start}\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", "addedCssClass", "addBasicClasses"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: UiActionToolbarComponent, decorators: [{
             type: Component,
-            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  }\"\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      <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    } @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        (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", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}.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}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%;justify-content:flex-start}\n"] }]
+            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  }\"\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        (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  @if (uiActionModel?.uiAction?.descriptor?.menuTriggerType == 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  } @else {\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</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}.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}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%;justify-content:flex-start}\n"] }]
         }], ctorParameters: () => [{ type: UiActionService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: ComponentLibrary, decorators: [{
                     type: Inject,
                     args: [COMPONENT_LIBRARY]
@@ -7786,11 +8095,11 @@ class FileEditorToolbarComponent extends UiActionToolbarComponent {
         await super.fireAction(uiActionModel);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FileEditorToolbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    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  }\"\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      <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    } @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        (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", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}.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}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%;justify-content:flex-start}\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: "component", type: UiActionButtonComponent, selector: "ui-action-button", inputs: ["disabled", "descriptor", "code", "addedCssClass", "addBasicClasses"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: MenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
+    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  }\"\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        (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  @if (uiActionModel?.uiAction?.descriptor?.menuTriggerType == 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  } @else {\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</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}.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}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%;justify-content:flex-start}\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", "addedCssClass", "addBasicClasses"], outputs: ["actionClick", "actionDoubleClick"] }, { kind: "component", type: ClickMenuComponent, selector: "ui-tiered-menu", inputs: ["triggerAction", "isSubmenu"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: HoverMenuComponent, selector: "ui-hover-menu", inputs: ["triggerAction", "isSubmenu"], outputs: ["actionClick", "submenuOpened"] }, { kind: "component", type: ThemeSelectorComponent, selector: "theme-selector", inputs: ["model"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: FileEditorToolbarComponent, decorators: [{
             type: Component,
-            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  }\"\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      <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    } @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        (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", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}.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}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%;justify-content:flex-start}\n"] }]
+            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  }\"\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        (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  @if (uiActionModel?.uiAction?.descriptor?.menuTriggerType == 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  } @else {\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</ng-template>\r\n", styles: [":host:has(.uiActionButtonsContainer.scrollableContent){display:flex;flex-direction:row;justify-content:space-between;gap:.5rem;width:100%;align-items:center}.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}.verticalToolbar ::ng-deep ui-action-button,.verticalToolbar ::ng-deep button{width:100%;justify-content:flex-start}\n"] }]
         }], propDecorators: { dataUri: [{
                 type: Input
             }], actionEvent: [{
@@ -13046,7 +13355,8 @@ class SmartViewContextModule {
             SmartVoiceRecorderComponent,
             HighlightPipe,
             UiActionButtonComponent,
-            MenuComponent,
+            ClickMenuComponent,
+            HoverMenuComponent,
             UploadWidgetComponent,
             VoiceRecordWidgetComponent,
             PhotoCaptureWidgetComponent,
@@ -13110,7 +13420,7 @@ class SmartViewContextModule {
             ComparableDropdownDirective,
             ComparableMultiselectDirective,
             UiActionButtonComponent,
-            MenuComponent,
+            ClickMenuComponent,
             UploadWidgetComponent,
             VoiceRecordWidgetComponent,
             PhotoCaptureWidgetComponent,
@@ -13223,7 +13533,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
                         SmartVoiceRecorderComponent,
                         HighlightPipe,
                         UiActionButtonComponent,
-                        MenuComponent,
+                        ClickMenuComponent,
+                        HoverMenuComponent,
                         UploadWidgetComponent,
                         VoiceRecordWidgetComponent,
                         PhotoCaptureWidgetComponent,
@@ -13296,7 +13607,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
                         ComparableDropdownDirective,
                         ComparableMultiselectDirective,
                         UiActionButtonComponent,
-                        MenuComponent,
+                        ClickMenuComponent,
                         UploadWidgetComponent,
                         VoiceRecordWidgetComponent,
                         PhotoCaptureWidgetComponent,
@@ -18655,11 +18966,11 @@ class SmartTreeComponent {
         return `${cssClass}-${plusProperty}`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartTreeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartTreeComponent, selector: "smart-tree", inputs: { treeStyle: "treeStyle", treeService: "treeService" }, host: { properties: { "attr.data-testid": "this.testId" } }, viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true }, { propertyName: "trigger", predicate: MatMenuTrigger, descendants: true }], ngImport: i0, template: "<div class=\"smartTreeContainer\">\r\n  <smart-ui-action-toolbar\r\n    *ngIf=\"uiActionModels.length\"\r\n    [uiActionModels]=\"uiActionModels\"\r\n  ></smart-ui-action-toolbar>\r\n  <mat-tree\r\n    #tree\r\n    *ngIf=\"treeData\"\r\n    [dataSource]=\"dataSource\"\r\n    [treeControl]=\"treeControl\"\r\n    class=\"sm-tree\"\r\n  >\r\n    <mat-nested-tree-node\r\n      *matTreeNodeDef=\"let node; when: hasChild\"\r\n      matTreeNodeToggle=\"{{ getIfExpanded(node) }}\"\r\n      [ngClass]=\"getClassesForTreeNode(node)\"\r\n      [ngStyle]=\"getNodeStyle(node)\"\r\n    >\r\n      <div\r\n        [ngStyle]=\"getNodePadding(node)\"\r\n        [ngClass]=\"getInnerClassesForTreeNode(node)\"\r\n        class=\"mat-tree-node sm-tree-node\"\r\n        (click)=\"onNodeClick($event, node)\"\r\n      >\r\n        <button mat-icon-button matTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\r\n          <mat-icon class=\"mat-icon-rtl-mirror\" (click)=\"onOpenNode($event, node)\">\r\n            <div *ngIf=\"hasChild(node.level, node)\">\r\n              {{ treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n            </div>\r\n          </mat-icon>\r\n        </button>\r\n        <smart-icon [icon]=\"node.icon\"> </smart-icon>\r\n        <div class=\"sm-tree-row\" [ngClass]=\"node.classes\">\r\n          <div class=\"sm-tree-row-caption\">\r\n            {{ node.caption }}\r\n          </div>\r\n          <div class=\"sm-shortDescription-spacer\"></div>\r\n          <div class=\"sm-tree-row-shortDescription\">\r\n            {{ node.shortDescription }}\r\n          </div>\r\n          <div class=\"sm-shortDescription-button-spacer\"></div>\r\n          <div *ngIf=\"node.button\" class=\"sm-tree-node-button\" [ngSwitch]=\"node.button.type\">\r\n            <button\r\n              (click)=\"customButtonClicked($event, node.button)\"\r\n              *ngSwitchCase=\"smartTreeNodeButtonType.ICON\"\r\n              mat-icon-button\r\n            >\r\n              <smart-icon title=\"{{ node.button.icon }}\" [icon]=\"node.button.icon\"></smart-icon>\r\n            </button>\r\n            <div *ngSwitchCase=\"smartTreeNodeButtonType.MENU\">\r\n              <button\r\n                mat-button\r\n                [matMenuTriggerFor]=\"menu\"\r\n                (click)=\"customButtonClicked($event, node.button, true)\"\r\n              >\r\n                <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon\r\n                >{{ node.button.label }}\r\n              </button>\r\n              <mat-menu #menu=\"matMenu\">\r\n                <button\r\n                  *ngFor=\"let button of node.button.menuItemButtons\"\r\n                  (click)=\"customButtonClicked($event, button, true)\"\r\n                  mat-menu-item\r\n                  [attr.data-testid]=\"button.code ?? null\"\r\n                >\r\n                  <smart-icon *ngIf=\"button.icon\" [icon]=\"button.icon\"></smart-icon\r\n                  >{{ button.label }}\r\n                </button>\r\n              </mat-menu>\r\n            </div>\r\n            <button\r\n              (click)=\"customButtonClicked($event, node.button)\"\r\n              *ngSwitchCase=\"smartTreeNodeButtonType.NORMAL\"\r\n              mat-raised-button\r\n            >\r\n              <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon>\r\n              {{ node.button.icon }}\r\n            </button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div\r\n        [class.sm-tree-invisible]=\"!treeControl.isExpanded(node)\"\r\n        [ngClass]=\"getClassesForTreeNodeChildren(node)\"\r\n        role=\"group\"\r\n      >\r\n        <ng-container matTreeNodeOutlet></ng-container>\r\n      </div>\r\n    </mat-nested-tree-node>\r\n  </mat-tree>\r\n  <div *ngIf=\"!treeData\">\r\n    <h3>\r\n      {{ errorMessage }}\r\n    </h3>\r\n  </div>\r\n</div>\r\n", styles: [".smartTreeContainer{display:flex;flex-direction:column;gap:.5rem}.sm-tree-invisible{display:none}.sm-tree ul,.sm-tree li{margin-top:0;margin-bottom:0;list-style-type:none}.sm-tree div[role=group]>.mat-tree-node{padding-left:40px}.sm-tee-node{padding-left:40px}.sm-tree-node-name{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tree-node-name-row{padding-left:15px;padding-top:15px;display:flex;flex-direction:row;justify-content:space-between}.sm-tree-node-name-col{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tee-node-id{font-weight:lighter}.mat-tree-node:hover{cursor:pointer}::ng-deep .mat-icon-rtl-mirror{display:flex;flex-direction:row}.sm-tree-row{display:flex;flex-direction:row;flex:1;align-items:center}.sm-shortDescription-spacer{flex:1}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i5.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i11$1.MatNestedTreeNode, selector: "mat-nested-tree-node", inputs: ["matNestedTreeNode", "disabled", "tabIndex"], exportAs: ["matNestedTreeNode"] }, { kind: "directive", type: i11$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i11$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i11$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i11$1.MatTreeNodeOutlet, selector: "[matTreeNodeOutlet]" }, { kind: "component", type: i5$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i5$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "scrollOnWrap", "toolbarPropertes"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SmartTreeComponent, selector: "smart-tree", inputs: { treeStyle: "treeStyle", treeService: "treeService" }, host: { properties: { "attr.data-testid": "this.testId" } }, viewQueries: [{ propertyName: "tree", first: true, predicate: ["tree"], descendants: true }, { propertyName: "trigger", predicate: MatMenuTrigger, descendants: true }], ngImport: i0, template: "<div class=\"smartTreeContainer\">\r\n  <smart-ui-action-toolbar\r\n    *ngIf=\"uiActionModels.length\"\r\n    [uiActionModels]=\"uiActionModels\"\r\n  ></smart-ui-action-toolbar>\r\n  <mat-tree\r\n    #tree\r\n    *ngIf=\"treeData\"\r\n    [dataSource]=\"dataSource\"\r\n    [treeControl]=\"treeControl\"\r\n    class=\"sm-tree\"\r\n  >\r\n    <mat-nested-tree-node\r\n      *matTreeNodeDef=\"let node; when: hasChild\"\r\n      matTreeNodeToggle=\"{{ getIfExpanded(node) }}\"\r\n      [ngClass]=\"getClassesForTreeNode(node)\"\r\n      [ngStyle]=\"getNodeStyle(node)\"\r\n    >\r\n      <div\r\n        [ngStyle]=\"getNodePadding(node)\"\r\n        [ngClass]=\"getInnerClassesForTreeNode(node)\"\r\n        class=\"mat-tree-node sm-tree-node\"\r\n        (click)=\"onNodeClick($event, node)\"\r\n      >\r\n        <button mat-icon-button matTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\r\n          <mat-icon class=\"mat-icon-rtl-mirror\" (click)=\"onOpenNode($event, node)\">\r\n            <div *ngIf=\"hasChild(node.level, node)\">\r\n              {{ treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n            </div>\r\n          </mat-icon>\r\n        </button>\r\n        <smart-icon [icon]=\"node.icon\"> </smart-icon>\r\n        <div class=\"sm-tree-row\" [ngClass]=\"node.classes\">\r\n          <div class=\"sm-tree-row-caption\">\r\n            {{ node.caption }}\r\n          </div>\r\n          <div class=\"sm-shortDescription-spacer\"></div>\r\n          <div class=\"sm-tree-row-shortDescription\">\r\n            {{ node.shortDescription }}\r\n          </div>\r\n          <div class=\"sm-shortDescription-button-spacer\"></div>\r\n          <div *ngIf=\"node.button\" class=\"sm-tree-node-button\" [ngSwitch]=\"node.button.type\">\r\n            <button\r\n              (click)=\"customButtonClicked($event, node.button)\"\r\n              *ngSwitchCase=\"smartTreeNodeButtonType.ICON\"\r\n              mat-icon-button\r\n            >\r\n              <smart-icon title=\"{{ node.button.icon }}\" [icon]=\"node.button.icon\"></smart-icon>\r\n            </button>\r\n            <div *ngSwitchCase=\"smartTreeNodeButtonType.MENU\">\r\n              <button\r\n                mat-button\r\n                [matMenuTriggerFor]=\"menu\"\r\n                (click)=\"customButtonClicked($event, node.button, true)\"\r\n              >\r\n                <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon\r\n                >{{ node.button.label }}\r\n              </button>\r\n              <mat-menu #menu=\"matMenu\">\r\n                <button\r\n                  *ngFor=\"let button of node.button.menuItemButtons\"\r\n                  (click)=\"customButtonClicked($event, button, true)\"\r\n                  mat-menu-item\r\n                  [attr.data-testid]=\"button.code ?? null\"\r\n                >\r\n                  <smart-icon *ngIf=\"button.icon\" [icon]=\"button.icon\"></smart-icon\r\n                  >{{ button.label }}\r\n                </button>\r\n              </mat-menu>\r\n            </div>\r\n            <button\r\n              (click)=\"customButtonClicked($event, node.button)\"\r\n              *ngSwitchCase=\"smartTreeNodeButtonType.NORMAL\"\r\n              mat-raised-button\r\n            >\r\n              <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon>\r\n              {{ node.button.icon }}\r\n            </button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div\r\n        [class.sm-tree-invisible]=\"!treeControl.isExpanded(node)\"\r\n        [ngClass]=\"getClassesForTreeNodeChildren(node)\"\r\n        role=\"group\"\r\n      >\r\n        <ng-container matTreeNodeOutlet></ng-container>\r\n      </div>\r\n    </mat-nested-tree-node>\r\n  </mat-tree>\r\n  <div *ngIf=\"!treeData\">\r\n    <div *ngIf=\"!treeData\" class=\"tree-skeleton\" aria-hidden=\"true\">\r\n      <div class=\"skeleton-row\" style=\"--depth: 0; --w: 58%\">\r\n        <span class=\"skeleton-caret\"></span>\r\n        <span class=\"skeleton-label\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 1; --w: 72%\">\r\n        <span class=\"skeleton-caret\"></span>\r\n        <span class=\"skeleton-label\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 2; --w: 45%\">\r\n        <span class=\"skeleton-label leaf\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 2; --w: 60%\">\r\n        <span class=\"skeleton-label leaf\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 1; --w: 50%\">\r\n        <span class=\"skeleton-caret\"></span>\r\n        <span class=\"skeleton-label\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 2; --w: 65%\">\r\n        <span class=\"skeleton-label leaf\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 0; --w: 40%\">\r\n        <span class=\"skeleton-caret\"></span>\r\n        <span class=\"skeleton-label\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 1; --w: 55%\">\r\n        <span class=\"skeleton-label leaf\"></span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".smartTreeContainer{display:flex;flex-direction:column;gap:.5rem}.sm-tree-invisible{display:none}.sm-tree ul,.sm-tree li{margin-top:0;margin-bottom:0;list-style-type:none}.sm-tree div[role=group]>.mat-tree-node{padding-left:40px}.sm-tee-node{padding-left:40px}.sm-tree-node-name{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tree-node-name-row{padding-left:15px;padding-top:15px;display:flex;flex-direction:row;justify-content:space-between}.sm-tree-node-name-col{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tee-node-id{font-weight:lighter}.mat-tree-node:hover{cursor:pointer}::ng-deep .mat-icon-rtl-mirror{display:flex;flex-direction:row}.sm-tree-row{display:flex;flex-direction:row;flex:1;align-items:center}.sm-shortDescription-spacer{flex:1}.tree-skeleton{--skeleton-bg-color: #c7cbd1;display:flex;flex-direction:column;gap:.5rem;padding:.5rem 0}.skeleton-row{display:flex;align-items:center;gap:.5rem;padding-left:calc(var(--depth, 0) * 1.25rem)}.skeleton-caret{width:.9rem;height:.9rem;border-radius:2px;background:var(--skeleton-bg-color);flex-shrink:0;animation:skeleton-pulse 2s ease-in-out infinite}.skeleton-label{height:1.2rem;width:var(--w);border-radius:4px;background:var(--skeleton-bg-color);animation:skeleton-pulse 2s ease-in-out infinite}.skeleton-label.leaf{margin-left:1.1rem}@keyframes skeleton-pulse{0%,to{opacity:.35}50%{opacity:1}}@media (prefers-reduced-motion: reduce){.skeleton-caret,.skeleton-label{animation:none}}\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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i5.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i5.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i11$1.MatNestedTreeNode, selector: "mat-nested-tree-node", inputs: ["matNestedTreeNode", "disabled", "tabIndex"], exportAs: ["matNestedTreeNode"] }, { kind: "directive", type: i11$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i11$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i11$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i11$1.MatTreeNodeOutlet, selector: "[matTreeNodeOutlet]" }, { kind: "component", type: i5$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i5$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: SmartIconComponent, selector: "smart-icon", inputs: ["icon", "color", "imageResource"] }, { kind: "component", type: UiActionToolbarComponent, selector: "smart-ui-action-toolbar", inputs: ["uiActionModels", "uiActionDescriptorService", "id", "scrollOnWrap", "toolbarPropertes"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SmartTreeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'smart-tree', template: "<div class=\"smartTreeContainer\">\r\n  <smart-ui-action-toolbar\r\n    *ngIf=\"uiActionModels.length\"\r\n    [uiActionModels]=\"uiActionModels\"\r\n  ></smart-ui-action-toolbar>\r\n  <mat-tree\r\n    #tree\r\n    *ngIf=\"treeData\"\r\n    [dataSource]=\"dataSource\"\r\n    [treeControl]=\"treeControl\"\r\n    class=\"sm-tree\"\r\n  >\r\n    <mat-nested-tree-node\r\n      *matTreeNodeDef=\"let node; when: hasChild\"\r\n      matTreeNodeToggle=\"{{ getIfExpanded(node) }}\"\r\n      [ngClass]=\"getClassesForTreeNode(node)\"\r\n      [ngStyle]=\"getNodeStyle(node)\"\r\n    >\r\n      <div\r\n        [ngStyle]=\"getNodePadding(node)\"\r\n        [ngClass]=\"getInnerClassesForTreeNode(node)\"\r\n        class=\"mat-tree-node sm-tree-node\"\r\n        (click)=\"onNodeClick($event, node)\"\r\n      >\r\n        <button mat-icon-button matTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\r\n          <mat-icon class=\"mat-icon-rtl-mirror\" (click)=\"onOpenNode($event, node)\">\r\n            <div *ngIf=\"hasChild(node.level, node)\">\r\n              {{ treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n            </div>\r\n          </mat-icon>\r\n        </button>\r\n        <smart-icon [icon]=\"node.icon\"> </smart-icon>\r\n        <div class=\"sm-tree-row\" [ngClass]=\"node.classes\">\r\n          <div class=\"sm-tree-row-caption\">\r\n            {{ node.caption }}\r\n          </div>\r\n          <div class=\"sm-shortDescription-spacer\"></div>\r\n          <div class=\"sm-tree-row-shortDescription\">\r\n            {{ node.shortDescription }}\r\n          </div>\r\n          <div class=\"sm-shortDescription-button-spacer\"></div>\r\n          <div *ngIf=\"node.button\" class=\"sm-tree-node-button\" [ngSwitch]=\"node.button.type\">\r\n            <button\r\n              (click)=\"customButtonClicked($event, node.button)\"\r\n              *ngSwitchCase=\"smartTreeNodeButtonType.ICON\"\r\n              mat-icon-button\r\n            >\r\n              <smart-icon title=\"{{ node.button.icon }}\" [icon]=\"node.button.icon\"></smart-icon>\r\n            </button>\r\n            <div *ngSwitchCase=\"smartTreeNodeButtonType.MENU\">\r\n              <button\r\n                mat-button\r\n                [matMenuTriggerFor]=\"menu\"\r\n                (click)=\"customButtonClicked($event, node.button, true)\"\r\n              >\r\n                <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon\r\n                >{{ node.button.label }}\r\n              </button>\r\n              <mat-menu #menu=\"matMenu\">\r\n                <button\r\n                  *ngFor=\"let button of node.button.menuItemButtons\"\r\n                  (click)=\"customButtonClicked($event, button, true)\"\r\n                  mat-menu-item\r\n                  [attr.data-testid]=\"button.code ?? null\"\r\n                >\r\n                  <smart-icon *ngIf=\"button.icon\" [icon]=\"button.icon\"></smart-icon\r\n                  >{{ button.label }}\r\n                </button>\r\n              </mat-menu>\r\n            </div>\r\n            <button\r\n              (click)=\"customButtonClicked($event, node.button)\"\r\n              *ngSwitchCase=\"smartTreeNodeButtonType.NORMAL\"\r\n              mat-raised-button\r\n            >\r\n              <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon>\r\n              {{ node.button.icon }}\r\n            </button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div\r\n        [class.sm-tree-invisible]=\"!treeControl.isExpanded(node)\"\r\n        [ngClass]=\"getClassesForTreeNodeChildren(node)\"\r\n        role=\"group\"\r\n      >\r\n        <ng-container matTreeNodeOutlet></ng-container>\r\n      </div>\r\n    </mat-nested-tree-node>\r\n  </mat-tree>\r\n  <div *ngIf=\"!treeData\">\r\n    <h3>\r\n      {{ errorMessage }}\r\n    </h3>\r\n  </div>\r\n</div>\r\n", styles: [".smartTreeContainer{display:flex;flex-direction:column;gap:.5rem}.sm-tree-invisible{display:none}.sm-tree ul,.sm-tree li{margin-top:0;margin-bottom:0;list-style-type:none}.sm-tree div[role=group]>.mat-tree-node{padding-left:40px}.sm-tee-node{padding-left:40px}.sm-tree-node-name{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tree-node-name-row{padding-left:15px;padding-top:15px;display:flex;flex-direction:row;justify-content:space-between}.sm-tree-node-name-col{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tee-node-id{font-weight:lighter}.mat-tree-node:hover{cursor:pointer}::ng-deep .mat-icon-rtl-mirror{display:flex;flex-direction:row}.sm-tree-row{display:flex;flex-direction:row;flex:1;align-items:center}.sm-shortDescription-spacer{flex:1}\n"] }]
+            args: [{ selector: 'smart-tree', template: "<div class=\"smartTreeContainer\">\r\n  <smart-ui-action-toolbar\r\n    *ngIf=\"uiActionModels.length\"\r\n    [uiActionModels]=\"uiActionModels\"\r\n  ></smart-ui-action-toolbar>\r\n  <mat-tree\r\n    #tree\r\n    *ngIf=\"treeData\"\r\n    [dataSource]=\"dataSource\"\r\n    [treeControl]=\"treeControl\"\r\n    class=\"sm-tree\"\r\n  >\r\n    <mat-nested-tree-node\r\n      *matTreeNodeDef=\"let node; when: hasChild\"\r\n      matTreeNodeToggle=\"{{ getIfExpanded(node) }}\"\r\n      [ngClass]=\"getClassesForTreeNode(node)\"\r\n      [ngStyle]=\"getNodeStyle(node)\"\r\n    >\r\n      <div\r\n        [ngStyle]=\"getNodePadding(node)\"\r\n        [ngClass]=\"getInnerClassesForTreeNode(node)\"\r\n        class=\"mat-tree-node sm-tree-node\"\r\n        (click)=\"onNodeClick($event, node)\"\r\n      >\r\n        <button mat-icon-button matTreeNodeToggle [attr.aria-label]=\"'Toggle ' + node.name\">\r\n          <mat-icon class=\"mat-icon-rtl-mirror\" (click)=\"onOpenNode($event, node)\">\r\n            <div *ngIf=\"hasChild(node.level, node)\">\r\n              {{ treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}\r\n            </div>\r\n          </mat-icon>\r\n        </button>\r\n        <smart-icon [icon]=\"node.icon\"> </smart-icon>\r\n        <div class=\"sm-tree-row\" [ngClass]=\"node.classes\">\r\n          <div class=\"sm-tree-row-caption\">\r\n            {{ node.caption }}\r\n          </div>\r\n          <div class=\"sm-shortDescription-spacer\"></div>\r\n          <div class=\"sm-tree-row-shortDescription\">\r\n            {{ node.shortDescription }}\r\n          </div>\r\n          <div class=\"sm-shortDescription-button-spacer\"></div>\r\n          <div *ngIf=\"node.button\" class=\"sm-tree-node-button\" [ngSwitch]=\"node.button.type\">\r\n            <button\r\n              (click)=\"customButtonClicked($event, node.button)\"\r\n              *ngSwitchCase=\"smartTreeNodeButtonType.ICON\"\r\n              mat-icon-button\r\n            >\r\n              <smart-icon title=\"{{ node.button.icon }}\" [icon]=\"node.button.icon\"></smart-icon>\r\n            </button>\r\n            <div *ngSwitchCase=\"smartTreeNodeButtonType.MENU\">\r\n              <button\r\n                mat-button\r\n                [matMenuTriggerFor]=\"menu\"\r\n                (click)=\"customButtonClicked($event, node.button, true)\"\r\n              >\r\n                <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon\r\n                >{{ node.button.label }}\r\n              </button>\r\n              <mat-menu #menu=\"matMenu\">\r\n                <button\r\n                  *ngFor=\"let button of node.button.menuItemButtons\"\r\n                  (click)=\"customButtonClicked($event, button, true)\"\r\n                  mat-menu-item\r\n                  [attr.data-testid]=\"button.code ?? null\"\r\n                >\r\n                  <smart-icon *ngIf=\"button.icon\" [icon]=\"button.icon\"></smart-icon\r\n                  >{{ button.label }}\r\n                </button>\r\n              </mat-menu>\r\n            </div>\r\n            <button\r\n              (click)=\"customButtonClicked($event, node.button)\"\r\n              *ngSwitchCase=\"smartTreeNodeButtonType.NORMAL\"\r\n              mat-raised-button\r\n            >\r\n              <smart-icon *ngIf=\"node.button.icon\" [icon]=\"node.button.icon\"></smart-icon>\r\n              {{ node.button.icon }}\r\n            </button>\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div\r\n        [class.sm-tree-invisible]=\"!treeControl.isExpanded(node)\"\r\n        [ngClass]=\"getClassesForTreeNodeChildren(node)\"\r\n        role=\"group\"\r\n      >\r\n        <ng-container matTreeNodeOutlet></ng-container>\r\n      </div>\r\n    </mat-nested-tree-node>\r\n  </mat-tree>\r\n  <div *ngIf=\"!treeData\">\r\n    <div *ngIf=\"!treeData\" class=\"tree-skeleton\" aria-hidden=\"true\">\r\n      <div class=\"skeleton-row\" style=\"--depth: 0; --w: 58%\">\r\n        <span class=\"skeleton-caret\"></span>\r\n        <span class=\"skeleton-label\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 1; --w: 72%\">\r\n        <span class=\"skeleton-caret\"></span>\r\n        <span class=\"skeleton-label\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 2; --w: 45%\">\r\n        <span class=\"skeleton-label leaf\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 2; --w: 60%\">\r\n        <span class=\"skeleton-label leaf\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 1; --w: 50%\">\r\n        <span class=\"skeleton-caret\"></span>\r\n        <span class=\"skeleton-label\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 2; --w: 65%\">\r\n        <span class=\"skeleton-label leaf\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 0; --w: 40%\">\r\n        <span class=\"skeleton-caret\"></span>\r\n        <span class=\"skeleton-label\"></span>\r\n      </div>\r\n      <div class=\"skeleton-row\" style=\"--depth: 1; --w: 55%\">\r\n        <span class=\"skeleton-label leaf\"></span>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n", styles: [".smartTreeContainer{display:flex;flex-direction:column;gap:.5rem}.sm-tree-invisible{display:none}.sm-tree ul,.sm-tree li{margin-top:0;margin-bottom:0;list-style-type:none}.sm-tree div[role=group]>.mat-tree-node{padding-left:40px}.sm-tee-node{padding-left:40px}.sm-tree-node-name{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tree-node-name-row{padding-left:15px;padding-top:15px;display:flex;flex-direction:row;justify-content:space-between}.sm-tree-node-name-col{padding-left:15px;padding-top:15px;display:flex;flex-direction:column}.sm-tee-node-id{font-weight:lighter}.mat-tree-node:hover{cursor:pointer}::ng-deep .mat-icon-rtl-mirror{display:flex;flex-direction:row}.sm-tree-row{display:flex;flex-direction:row;flex:1;align-items:center}.sm-shortDescription-spacer{flex:1}.tree-skeleton{--skeleton-bg-color: #c7cbd1;display:flex;flex-direction:column;gap:.5rem;padding:.5rem 0}.skeleton-row{display:flex;align-items:center;gap:.5rem;padding-left:calc(var(--depth, 0) * 1.25rem)}.skeleton-caret{width:.9rem;height:.9rem;border-radius:2px;background:var(--skeleton-bg-color);flex-shrink:0;animation:skeleton-pulse 2s ease-in-out infinite}.skeleton-label{height:1.2rem;width:var(--w);border-radius:4px;background:var(--skeleton-bg-color);animation:skeleton-pulse 2s ease-in-out infinite}.skeleton-label.leaf{margin-left:1.1rem}@keyframes skeleton-pulse{0%,to{opacity:.35}50%{opacity:1}}@media (prefers-reduced-motion: reduce){.skeleton-caret,.skeleton-label{animation:none}}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { trigger: [{
                 type: ViewChildren,
                 args: [MatMenuTrigger]
@@ -24437,5 +24748,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { APIS$5 as APIS, AbstractMap, ApiModule$5 as ApiModule, ApiQueueService, BASE_PATH$7 as BASE_PATH, COLLECTION_FORMATS$7 as COLLECTION_FORMATS, COMPONENT_LIBRARY, CUSTOM_DIAGRAM_OPTIONS, CloseResult, ComparableDropdownDirective, ComparableMultiselectDirective, ComponentFactoryService, ComponentFactoryServiceModule, ComponentLibrary, ComponentType, ComponentWidgetType, Configuration$7 as Configuration, DIALOG_DISABLE_CLOSE, DataChangeKind, DefaultChartOptionsProvider, DefaultUiActionCode_CLOSE, DrawTime, EMPTY_PARAMS, ExpandableSectionButtonIconPosition, ExpandableSectionButtonType, ExpandableSectionComponent, FilterExpressionBoolOperator$1 as FilterExpressionBoolOperator, FilterExpressionBuilderGroupBuilderGroupKindEnum, FilterExpressionDataType, FilterExpressionFieldWidgetType, FilterExpressionOperation, FilterExpressionOrderByOrderEnum, GeoMapDataLoadingMode, GeoMapDataSourceType, GeoMapItemKind, GeoMapOperationMode, GeoMapSelectionMode, GeoMapTextType, GoogleMap, GridColumnContentType, GridDataAccessConfigKindEnum, GridSelectionMode, GridSelectionType, GridUiActionType, GridViewDescriptorKindEnum, HighlightPipe, IS_ASYNC_PARAM_NAME, IconPosition, ImageResourceKindEnum, LayoutDirection, LeafletMap, LinkTargetEnum, MAP_ENGINE, MapEngine, MenuComponent, MessageOptionType, MessageTextType, MessageType, NAMED_VALIDATOR, NamedValidatorOperationEnum, NamedValidatorService, PhotoCaptureWidgetComponent, RecordingUploaderPropertiesOpenDirectionEnum, SelectionDefinitionTypeEnum, SelectionDefinitionValueSetValueTypeEnum, ServerRequestType, SessionAPIS, SessionErrorBehaviour, SessionService, SharedModule, SimplifiedTabGroupComponent, SmartActionType, SmartBackendBootstrapService, SmartComponent, SmartComponentApiClient, SmartComponentLayoutComponent, SmartComponentLayoutModule, SmartComponentLayoutUtility, SmartDatePipe, SmartDateTimePipe, SmartDefaultErrorUiService, SmartDiagramComponent, SmartDiagramModule, SmartDialog, SmartEmbeddedSlotDirective, SmartExpandableSectionModule, SmartExpandableSectionService, SmartFileEditorComponent, SmartFileUploaderComponent, SmartFilterComponent, SmartFilterEditorContentComponent, SmartFilterEditorModule, SmartFilterEditorService, SmartFilterExpressionItemComponent, SmartFilterExpressionItemsComponent, SmartFilterModule, SmartFilterParamComponent, SmartFilterParamsComponent, SmartFilterPosition, SmartFilterType, SmartFormInputMode, SmartFormTextFieldButtonIconPosition, SmartFormWidgetDirection, SmartFormWidgetType, SmartFormWidgetWidth, SmartGridButtonType, SmartGridComponent, SmartGridDataLayout, SmartGridModule, SmartGridService, SmartGridType, SmartIconComponent, SmartIconModule, SmartIconService, SmartLayoutDef, SmartLinkChannelVariableInPath, SmartLinkMigrationStatusStatusEnum, SmartLinkUuidVariableInPath, SmartMapComponent, SmartMapModule, SmartMultiFileEditorComponent, SmartNavbarComponent, SmartNavbarModule, SmartNavbarService, SmartNavigationModule, SmartNavigationService, SmartNgClientModule, SmartNgClientService, SmartService, SmartSessionModule, SmartSessionService, SmartSessionTimerComponent, SmartSubject, SmartTabGroupModule, SmartTabGroupService, SmartTable, SmartTableButtonType, SmartTableHeaderPropertyType, SmartTableInterfaceTypeEnum, SmartTableOptionButtonDirection, SmartTableOrder, SmartTableType, SmartTimePipe, SmartTooltipDirective, SmartTreeComponent, SmartTreeNodeButtonType, SmartUserSettinsIconPosition, SmartValidationModule, SmartValidatorName, SmartViewContextErrorDialogButtonLabel, SmartViewContextErrorDialogMessage, SmartViewContextErrorDialogTitle, SmartViewContextModule, SmartViewContextService, SmartViewRedirect, SmartVoiceRecorderComponent, SmartWidgetHintPosition, SmartWidgetHintPositionEnum, SmartWidgetSettings, SmartdialogModule, SmartdialogService, SmartfileuploaderComponent, SmartformComponent, SmartformLayoutDefinitionService, SmartformwidgetComponent, SmarttableComponent, SmarttableModule, SmarttableService, SmarttreeGenericService, SmarttreeModule, SmarttreeService, TabGroupComponent, ThemeService, ToggleLabelPosition, ToolbarDirection, UiActionButtonComponent, UiActionButtonType, UiActionConfirmDialogComponent, UiActionConfirmDialogService, UiActionDescriptorService, UiActionDialogButtonComponent, UiActionDialogType, UiActionFeedbackType, UiActionInputDialogComponent, UiActionInputDialogService, UiActionInputType, UiActionService, UiActionToolbarComponent, UiActionTooltipTooltipPositionEnum, UiBadgeComponent, UiBadgeDirective, UploadWidgetComponent, UploadWidgetType, ValueChangeMode, ViewContextRebuiltError, ViewEventHandlerViewEventTypeEnum, ViewService, ViewState, ViewType, VoiceRecordWidgetComponent, barChart, bubbleChart, createBasicOptions, doughnutChart, horizontalBarChart, horizontalStackedBarChart, multiAxisLineChart, pieChart, polarAreaChart, radarChart, scatterChart, stackedBarChart, transformDataToBarLikeDataSet, transformDataToBasicDataSets, transformDataToBubble, transformDataToScatter };
+export { APIS$5 as APIS, AbstractMap, ApiModule$5 as ApiModule, ApiQueueService, BASE_PATH$7 as BASE_PATH, COLLECTION_FORMATS$7 as COLLECTION_FORMATS, COMPONENT_LIBRARY, CUSTOM_DIAGRAM_OPTIONS, ClickMenuComponent, CloseResult, ComparableDropdownDirective, ComparableMultiselectDirective, ComponentFactoryService, ComponentFactoryServiceModule, ComponentLibrary, ComponentType, ComponentWidgetType, Configuration$7 as Configuration, DIALOG_DISABLE_CLOSE, DataChangeKind, DefaultChartOptionsProvider, DefaultUiActionCode_CLOSE, DrawTime, EMPTY_PARAMS, ExpandableSectionButtonIconPosition, ExpandableSectionButtonType, ExpandableSectionComponent, FilterExpressionBoolOperator$1 as FilterExpressionBoolOperator, FilterExpressionBuilderGroupBuilderGroupKindEnum, FilterExpressionDataType, FilterExpressionFieldWidgetType, FilterExpressionOperation, FilterExpressionOrderByOrderEnum, GeoMapDataLoadingMode, GeoMapDataSourceType, GeoMapItemKind, GeoMapOperationMode, GeoMapSelectionMode, GeoMapTextType, GoogleMap, GridColumnContentType, GridDataAccessConfigKindEnum, GridSelectionMode, GridSelectionType, GridUiActionType, GridViewDescriptorKindEnum, HighlightPipe, HoverMenuComponent, IS_ASYNC_PARAM_NAME, IconPosition, ImageResourceKindEnum, LayoutDirection, LeafletMap, LinkTargetEnum, MAP_ENGINE, MapEngine, MenuTriggerType, MessageOptionType, MessageTextType, MessageType, NAMED_VALIDATOR, NamedValidatorOperationEnum, NamedValidatorService, PhotoCaptureWidgetComponent, RecordingUploaderPropertiesOpenDirectionEnum, SelectionDefinitionTypeEnum, SelectionDefinitionValueSetValueTypeEnum, ServerRequestType, SessionAPIS, SessionErrorBehaviour, SessionService, SharedModule, SimplifiedTabGroupComponent, SmartActionType, SmartBackendBootstrapService, SmartComponent, SmartComponentApiClient, SmartComponentLayoutComponent, SmartComponentLayoutModule, SmartComponentLayoutUtility, SmartDatePipe, SmartDateTimePipe, SmartDefaultErrorUiService, SmartDiagramComponent, SmartDiagramModule, SmartDialog, SmartEmbeddedSlotDirective, SmartExpandableSectionModule, SmartExpandableSectionService, SmartFileEditorComponent, SmartFileUploaderComponent, SmartFilterComponent, SmartFilterEditorContentComponent, SmartFilterEditorModule, SmartFilterEditorService, SmartFilterExpressionItemComponent, SmartFilterExpressionItemsComponent, SmartFilterModule, SmartFilterParamComponent, SmartFilterParamsComponent, SmartFilterPosition, SmartFilterType, SmartFormInputMode, SmartFormTextFieldButtonIconPosition, SmartFormWidgetDirection, SmartFormWidgetType, SmartFormWidgetWidth, SmartGridButtonType, SmartGridComponent, SmartGridDataLayout, SmartGridModule, SmartGridService, SmartGridType, SmartIconComponent, SmartIconModule, SmartIconService, SmartLayoutDef, SmartLinkChannelVariableInPath, SmartLinkMigrationStatusStatusEnum, SmartLinkUuidVariableInPath, SmartMapComponent, SmartMapModule, SmartMultiFileEditorComponent, SmartNavbarComponent, SmartNavbarModule, SmartNavbarService, SmartNavigationModule, SmartNavigationService, SmartNgClientModule, SmartNgClientService, SmartService, SmartSessionModule, SmartSessionService, SmartSessionTimerComponent, SmartSubject, SmartTabGroupModule, SmartTabGroupService, SmartTable, SmartTableButtonType, SmartTableHeaderPropertyType, SmartTableInterfaceTypeEnum, SmartTableOptionButtonDirection, SmartTableOrder, SmartTableType, SmartTimePipe, SmartTooltipDirective, SmartTreeComponent, SmartTreeNodeButtonType, SmartUserSettinsIconPosition, SmartValidationModule, SmartValidatorName, SmartViewContextErrorDialogButtonLabel, SmartViewContextErrorDialogMessage, SmartViewContextErrorDialogTitle, SmartViewContextModule, SmartViewContextService, SmartViewRedirect, SmartVoiceRecorderComponent, SmartWidgetHintPosition, SmartWidgetHintPositionEnum, SmartWidgetSettings, SmartdialogModule, SmartdialogService, SmartfileuploaderComponent, SmartformComponent, SmartformLayoutDefinitionService, SmartformwidgetComponent, SmarttableComponent, SmarttableModule, SmarttableService, SmarttreeGenericService, SmarttreeModule, SmarttreeService, TabGroupComponent, ThemeService, ToggleLabelPosition, ToolbarDirection, UiActionButtonComponent, UiActionButtonType, UiActionConfirmDialogComponent, UiActionConfirmDialogService, UiActionDescriptorService, UiActionDialogButtonComponent, UiActionDialogType, UiActionFeedbackType, UiActionInputDialogComponent, UiActionInputDialogService, UiActionInputType, UiActionService, UiActionToolbarComponent, UiActionTooltipTooltipPositionEnum, UiBadgeComponent, UiBadgeDirective, UploadWidgetComponent, UploadWidgetType, ValueChangeMode, ViewContextRebuiltError, ViewEventHandlerViewEventTypeEnum, ViewService, ViewState, ViewType, VoiceRecordWidgetComponent, barChart, bubbleChart, createBasicOptions, doughnutChart, horizontalBarChart, horizontalStackedBarChart, multiAxisLineChart, pieChart, polarAreaChart, radarChart, scatterChart, stackedBarChart, transformDataToBarLikeDataSet, transformDataToBasicDataSets, transformDataToBubble, transformDataToScatter };
 //# sourceMappingURL=smartbit4all-ng-client.mjs.map