@acorex/components 19.11.5 → 19.11.7

package/fesm2022/acorex-components-time-line.mjs

@@ -21,10 +21,10 @@ class AXTimeLineComponent {
         });
     }
     #modeChange;
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTimeLineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.1", type: AXTimeLineComponent, isStandalone: true, selector: "ax-time-line", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"ax-time-line-item-container\" [style]=\"containerStyle()\">\n  <ng-content></ng-content>\n</div>\n", styles: ["ax-time-line{width:100%;display:block}ax-time-line .ax-time-line-item-container{position:relative;display:flex;flex-direction:column}ax-time-line .ax-time-line-item-container:before,ax-time-line .ax-time-line-item-container:after{display:block;content:\"\";position:absolute;background-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-time-line .ax-time-line-item-container:before{width:1px;height:100%;top:0;inset-inline-start:.875rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTimeLineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.5", type: AXTimeLineComponent, isStandalone: true, selector: "ax-time-line", inputs: { mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"ax-time-line-item-container\" [style]=\"containerStyle()\">\n  <ng-content></ng-content>\n</div>\n", styles: ["ax-time-line{width:100%;display:block}ax-time-line .ax-time-line-item-container{position:relative;display:flex;flex-direction:column}ax-time-line .ax-time-line-item-container:before,ax-time-line .ax-time-line-item-container:after{display:block;content:\"\";position:absolute;background-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-time-line .ax-time-line-item-container:before{width:1px;height:100%;top:0;inset-inline-start:.875rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTimeLineComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTimeLineComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-time-line', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ax-time-line-item-container\" [style]=\"containerStyle()\">\n  <ng-content></ng-content>\n</div>\n", styles: ["ax-time-line{width:100%;display:block}ax-time-line .ax-time-line-item-container{position:relative;display:flex;flex-direction:column}ax-time-line .ax-time-line-item-container:before,ax-time-line .ax-time-line-item-container:after{display:block;content:\"\";position:absolute;background-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-time-line .ax-time-line-item-container:before{width:1px;height:100%;top:0;inset-inline-start:.875rem}\n"] }]
         }] });
@@ -46,8 +46,8 @@ class AXTimeLineItemComponent {
     get __hostClass() {
         return [`ax-mode-${this.mode()}`, `${this.isActive() ? 'ax-state-active' : ''}`];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTimeLineItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: AXTimeLineItemComponent, isStandalone: true, selector: "ax-time-line-item", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, isCollapsed: { classPropertyName: "isCollapsed", publicName: "isCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isCollapsed: "isCollapsedChange" }, host: { properties: { "class": "this.__hostClass" } }, ngImport: i0, template: "<div class=\"ax-time-line-header\" (click)=\"handleClick()\">\n  @switch (mode()) {\n    @case ('bullet') {\n      <span class=\"ax-time-line-bullet\"></span>\n    }\n    @case ('icon') {\n      <span class=\"ax-time-line-icon\">\n        <ng-content select=\"ax-icon\"></ng-content>\n      </span>\n    }\n  }\n  <span class=\"ax-time-line-text\">{{ text() }}</span>\n  <span\n    class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow\"\n    [ngClass]=\"{ '-rotation-90': isCollapsed(), 'rotation-90': !isCollapsed() }\"\n  ></span>\n</div>\n<div class=\"ax-time-line-content\" [@collapse]=\"isCollapsed()\"><ng-content></ng-content></div>\n", styles: ["ax-time-line{--ax-comp-time-line-deactivate-bg-color: var(--ax-sys-color-darkest-surface);--ax-comp-time-line-bullet-active-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-time-line-active-bg-color: var(--ax-sys-color-primary-lightest-surface);--ax-comp-time-line-active-text-color: var(--ax-sys-color-on-primary-lightest-surface);--ax-comp-time-line-icon-bg-color: var(--ax-sys-color-surface);--ax-comp-time-line-icon-text-color: var(--ax-sys-color-on-surface)}.ax-dark ax-time-line{--ax-comp-time-line-deactivate-bg-color: var(--ax-sys-color-lightest-surface)}ax-time-line-item{position:relative;display:flex;flex-direction:column;gap:.75rem}ax-time-line-item.ax-mode-icon{padding-inline-start:3rem}ax-time-line-item.ax-mode-bullet{padding-inline-start:1.75rem}ax-time-line-item.ax-state-active .ax-time-line-bullet{background-color:rgba(var(--ax-comp-time-line-bullet-active-bg-color))!important}ax-time-line-item.ax-state-active .ax-time-line-icon{background-color:rgba(var(--ax-comp-time-line-active-bg-color))!important;color:rgba(var(--ax-comp-time-line-active-text-color))!important}ax-time-line-item .ax-time-line-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}ax-time-line-item .ax-time-line-header .ax-time-line-bullet,ax-time-line-item .ax-time-line-header .ax-time-line-icon{position:absolute;border-radius:999rem}ax-time-line-item .ax-time-line-header .ax-time-line-bullet{width:.75rem;height:.75rem;inset-inline-start:.5rem;background-color:rgba(var(--ax-comp-time-line-deactivate-bg-color))}ax-time-line-item .ax-time-line-header .ax-time-line-icon{width:2.5rem;height:2.5rem;inset-inline-start:-.25rem;display:flex;align-items:center;justify-content:center;background-color:rgba(var(--ax-comp-time-line-icon-bg-color));color:rgba(var(--ax-comp-time-line-icon-text-color))}ax-time-line-item .ax-time-line-header .ax-time-line-text{flex:1}ax-time-line-item .ax-time-line-header .ax-collapse-arrow{transition-property:all;transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function);display:block}ax-time-line-item .ax-time-line-header .ax-collapse-arrow.-rotation-90{transform:rotate(-90deg)}ax-time-line-item .ax-time-line-header .ax-collapse-arrow.rotation-90{transform:rotate(90deg)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTimeLineItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AXTimeLineItemComponent, isStandalone: true, selector: "ax-time-line-item", inputs: { text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, isCollapsed: { classPropertyName: "isCollapsed", publicName: "isCollapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isCollapsed: "isCollapsedChange" }, host: { properties: { "class": "this.__hostClass" } }, ngImport: i0, template: "<div class=\"ax-time-line-header\" (click)=\"handleClick()\">\n  @switch (mode()) {\n    @case ('bullet') {\n      <span class=\"ax-time-line-bullet\"></span>\n    }\n    @case ('icon') {\n      <span class=\"ax-time-line-icon\">\n        <ng-content select=\"ax-icon\"></ng-content>\n      </span>\n    }\n  }\n  <span class=\"ax-time-line-text\">{{ text() }}</span>\n  <span\n    class=\"ax-icon ax-icon-chevron-left ax-collapse-arrow\"\n    [ngClass]=\"{ '-rotation-90': isCollapsed(), 'rotation-90': !isCollapsed() }\"\n  ></span>\n</div>\n<div class=\"ax-time-line-content\" [@collapse]=\"isCollapsed()\"><ng-content></ng-content></div>\n", styles: ["ax-time-line{--ax-comp-time-line-deactivate-bg-color: var(--ax-sys-color-darkest-surface);--ax-comp-time-line-bullet-active-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-time-line-active-bg-color: var(--ax-sys-color-primary-lightest-surface);--ax-comp-time-line-active-text-color: var(--ax-sys-color-on-primary-lightest-surface);--ax-comp-time-line-icon-bg-color: var(--ax-sys-color-surface);--ax-comp-time-line-icon-text-color: var(--ax-sys-color-on-surface)}.ax-dark ax-time-line{--ax-comp-time-line-deactivate-bg-color: var(--ax-sys-color-lightest-surface)}ax-time-line-item{position:relative;display:flex;flex-direction:column;gap:.75rem}ax-time-line-item.ax-mode-icon{padding-inline-start:3rem}ax-time-line-item.ax-mode-bullet{padding-inline-start:1.75rem}ax-time-line-item.ax-state-active .ax-time-line-bullet{background-color:rgba(var(--ax-comp-time-line-bullet-active-bg-color))!important}ax-time-line-item.ax-state-active .ax-time-line-icon{background-color:rgba(var(--ax-comp-time-line-active-bg-color))!important;color:rgba(var(--ax-comp-time-line-active-text-color))!important}ax-time-line-item .ax-time-line-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none}ax-time-line-item .ax-time-line-header .ax-time-line-bullet,ax-time-line-item .ax-time-line-header .ax-time-line-icon{position:absolute;border-radius:999rem}ax-time-line-item .ax-time-line-header .ax-time-line-bullet{width:.75rem;height:.75rem;inset-inline-start:.5rem;background-color:rgba(var(--ax-comp-time-line-deactivate-bg-color))}ax-time-line-item .ax-time-line-header .ax-time-line-icon{width:2.5rem;height:2.5rem;inset-inline-start:-.25rem;display:flex;align-items:center;justify-content:center;background-color:rgba(var(--ax-comp-time-line-icon-bg-color));color:rgba(var(--ax-comp-time-line-icon-text-color))}ax-time-line-item .ax-time-line-header .ax-time-line-text{flex:1}ax-time-line-item .ax-time-line-header .ax-collapse-arrow{transition-property:all;transition-duration:var(--ax-sys-transition-duration);transition-timing-function:var(--ax-sys-transition-timing-function);display:block}ax-time-line-item .ax-time-line-header .ax-collapse-arrow.-rotation-90{transform:rotate(-90deg)}ax-time-line-item .ax-time-line-header .ax-collapse-arrow.rotation-90{transform:rotate(90deg)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], animations: [
             trigger('collapse', [
                 state('false', style({ height: AUTO_STYLE, visibility: AUTO_STYLE })),
                 state('true', style({ height: '0', visibility: 'hidden' })),
@@ -56,7 +56,7 @@ class AXTimeLineItemComponent {
             ]),
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTimeLineItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTimeLineItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-time-line-item', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [
                         trigger('collapse', [
@@ -72,11 +72,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
             }] } });
 
 class AXTimeLineModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTimeLineModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: AXTimeLineModule, imports: [CommonModule, AXTimeLineComponent, AXTimeLineItemComponent], exports: [AXTimeLineComponent, AXTimeLineItemComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTimeLineModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTimeLineModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: AXTimeLineModule, imports: [CommonModule, AXTimeLineComponent, AXTimeLineItemComponent], exports: [AXTimeLineComponent, AXTimeLineItemComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTimeLineModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTimeLineModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTimeLineModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, AXTimeLineComponent, AXTimeLineItemComponent],

package/fesm2022/acorex-components-toast.mjs

@@ -264,10 +264,10 @@ class AXToastService {
                 break;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToastService, deps: [{ token: i1.ScrollStrategyOptions }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToastService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToastService, deps: [{ token: i1.ScrollStrategyOptions }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToastService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToastService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToastService, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: i1.ScrollStrategyOptions }] });
 
@@ -373,10 +373,10 @@ class AXToastComponent extends MXBaseComponent {
     closeAll() {
         this.toastService.hideAll();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToastComponent, deps: [{ token: DIALOG_DATA }, { token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: AXToastComponent, isStandalone: true, selector: "ax-toast", host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXClosbaleComponent, useExisting: AXToastComponent }], usesInheritance: true, ngImport: i0, template: "<span class=\"ax-toast-icon ax-icon-solid {{ _icon }}\"></span>\n<div class=\"ax-toast-content\">\n  <div class=\"ax-toast-title\" [class.ax-mb-2]=\"config.title && config.content\">\n    {{ config.title | translate | async }}\n  </div>\n  <div class=\"ax-toast-content\" [innerHTML]=\"config.content\"></div>\n</div>\n@if (config.closeButton) {\n  <ax-close-button></ax-close-button>\n} @else if (config.closeAllButton) {\n  <ax-close-button [closeAll]=\"true\"></ax-close-button>\n}\n@if (config.timeOutProgress && config.timeOut) {\n  <div class=\"ax-toast-progress\" [style.transition-duration]=\"transitionDuration()\" [style.width]=\"(remainingTime() * 100) / config.timeOut + '%'\"></div>\n}\n", styles: ["ax-toast.ax-default{--ax-comp-toast-bg-color: var(--ax-sys-color-lighter-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-lighter-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-darkest-surface)}.ax-dark ax-toast.ax-default{--ax-comp-toast-bg-color: var(--ax-sys-color-darker-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-darker-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-lightest-surface)}ax-toast.ax-primary{--ax-comp-toast-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-primary-darker-surface)}ax-toast.ax-secondary{--ax-comp-toast-bg-color: var(--ax-sys-color-secondary-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-secondary-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-secondary-darker-surface)}ax-toast.ax-success{--ax-comp-toast-bg-color: var(--ax-sys-color-success-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-success-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-success-darker-surface)}ax-toast.ax-warning{--ax-comp-toast-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-warning-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-warning-darker-surface)}ax-toast.ax-danger{--ax-comp-toast-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-danger-darker-surface)}ax-toast{position:relative;display:flex;width:98vw;overflow:hidden;padding:.75rem 1rem;--ax-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--ax-shadow-colored: 0 4px 6px -1px var(--ax-shadow-color), 0 2px 4px -2px var(--ax-shadow-color);box-shadow:var(--ax-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)),var(--ax-ring-shadow, 0 0 rgba(0, 0, 0, 0)),var(--ax-shadow);color:rgba(var(--ax-comp-toast-text-color));background-color:rgba(var(--ax-comp-toast-bg-color));font-size:var(--ax-comp-toast-font-size, .875rem);line-height:var(--ax-comp-toast-line-height, 1.25rem);border-radius:var(--ax-comp-toast-border-radius, var(--ax-sys-border-radius))}@media (min-width: 768px){ax-toast{width:24rem}}ax-toast .ax-toast-icon,ax-toast .ax-icon-close{font-size:1.25rem;max-width:fit-content;align-items:start}ax-toast .ax-toast-icon{margin-inline-end:.5rem}ax-toast .ax-toast-content{display:flex;flex:1 1 0%;flex-direction:column}ax-toast .ax-toast-content .ax-toast-title{font-weight:500;line-height:1.5rem}ax-toast .ax-toast-content .ax-toast-buttons{margin-top:.75rem;margin-bottom:.75rem;display:flex;gap:.5rem}ax-toast ax-icon-close{height:fit-content}ax-toast ax-icon-close:hover{opacity:.75}ax-toast .ax-toast-progress{width:100%;bottom:0;height:.25rem;position:absolute;inset-inline-end:0px;inset-inline-start:0px;transition-property:width;transition-timing-function:linear;transition-duration:var(--ax-sys-transition-duration);background-color:rgba(var(--ax-comp-toast-progress-bg-color, 255, 255, 255, .46))}\n"], dependencies: [{ kind: "component", type: AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["closeAll", "icon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToastComponent, deps: [{ token: DIALOG_DATA }, { token: i1$1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AXToastComponent, isStandalone: true, selector: "ax-toast", host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXClosbaleComponent, useExisting: AXToastComponent }], usesInheritance: true, ngImport: i0, template: "<span class=\"ax-toast-icon ax-icon-solid {{ _icon }}\"></span>\n<div class=\"ax-toast-content\">\n  <div class=\"ax-toast-title\" [class.ax-mb-2]=\"config.title && config.content\">\n    {{ config.title | translate | async }}\n  </div>\n  <div class=\"ax-toast-content\" [innerHTML]=\"config.content\"></div>\n</div>\n@if (config.closeButton) {\n  <ax-close-button></ax-close-button>\n} @else if (config.closeAllButton) {\n  <ax-close-button [closeAll]=\"true\"></ax-close-button>\n}\n@if (config.timeOutProgress && config.timeOut) {\n  <div class=\"ax-toast-progress\" [style.transition-duration]=\"transitionDuration()\" [style.width]=\"(remainingTime() * 100) / config.timeOut + '%'\"></div>\n}\n", styles: ["ax-toast.ax-default{--ax-comp-toast-bg-color: var(--ax-sys-color-lighter-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-lighter-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-darkest-surface)}.ax-dark ax-toast.ax-default{--ax-comp-toast-bg-color: var(--ax-sys-color-darker-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-darker-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-lightest-surface)}ax-toast.ax-primary{--ax-comp-toast-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-primary-darker-surface)}ax-toast.ax-secondary{--ax-comp-toast-bg-color: var(--ax-sys-color-secondary-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-secondary-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-secondary-darker-surface)}ax-toast.ax-success{--ax-comp-toast-bg-color: var(--ax-sys-color-success-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-success-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-success-darker-surface)}ax-toast.ax-warning{--ax-comp-toast-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-warning-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-warning-darker-surface)}ax-toast.ax-danger{--ax-comp-toast-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-danger-darker-surface)}ax-toast{position:relative;display:flex;width:98vw;overflow:hidden;padding:.75rem 1rem;--ax-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--ax-shadow-colored: 0 4px 6px -1px var(--ax-shadow-color), 0 2px 4px -2px var(--ax-shadow-color);box-shadow:var(--ax-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)),var(--ax-ring-shadow, 0 0 rgba(0, 0, 0, 0)),var(--ax-shadow);color:rgba(var(--ax-comp-toast-text-color));background-color:rgba(var(--ax-comp-toast-bg-color));font-size:var(--ax-comp-toast-font-size, .875rem);line-height:var(--ax-comp-toast-line-height, 1.25rem);border-radius:var(--ax-comp-toast-border-radius, var(--ax-sys-border-radius))}@media (min-width: 768px){ax-toast{width:24rem}}ax-toast .ax-toast-icon,ax-toast .ax-icon-close{font-size:1.25rem;max-width:fit-content;align-items:start}ax-toast .ax-toast-icon{margin-inline-end:.5rem}ax-toast .ax-toast-content{display:flex;flex:1 1 0%;flex-direction:column}ax-toast .ax-toast-content .ax-toast-title{font-weight:500;line-height:1.5rem}ax-toast .ax-toast-content .ax-toast-buttons{margin-top:.75rem;margin-bottom:.75rem;display:flex;gap:.5rem}ax-toast ax-icon-close{height:fit-content}ax-toast ax-icon-close:hover{opacity:.75}ax-toast .ax-toast-progress{width:100%;bottom:0;height:.25rem;position:absolute;inset-inline-end:0px;inset-inline-start:0px;transition-property:width;transition-timing-function:linear;transition-duration:var(--ax-sys-transition-duration);background-color:rgba(var(--ax-comp-toast-progress-bg-color, 255, 255, 255, .46))}\n"], dependencies: [{ kind: "component", type: AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["closeAll", "icon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToastComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToastComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-toast', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: AXClosbaleComponent, useExisting: AXToastComponent }], imports: [AXDecoratorCloseButtonComponent, AsyncPipe, AXTranslatorPipe], template: "<span class=\"ax-toast-icon ax-icon-solid {{ _icon }}\"></span>\n<div class=\"ax-toast-content\">\n  <div class=\"ax-toast-title\" [class.ax-mb-2]=\"config.title && config.content\">\n    {{ config.title | translate | async }}\n  </div>\n  <div class=\"ax-toast-content\" [innerHTML]=\"config.content\"></div>\n</div>\n@if (config.closeButton) {\n  <ax-close-button></ax-close-button>\n} @else if (config.closeAllButton) {\n  <ax-close-button [closeAll]=\"true\"></ax-close-button>\n}\n@if (config.timeOutProgress && config.timeOut) {\n  <div class=\"ax-toast-progress\" [style.transition-duration]=\"transitionDuration()\" [style.width]=\"(remainingTime() * 100) / config.timeOut + '%'\"></div>\n}\n", styles: ["ax-toast.ax-default{--ax-comp-toast-bg-color: var(--ax-sys-color-lighter-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-lighter-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-darkest-surface)}.ax-dark ax-toast.ax-default{--ax-comp-toast-bg-color: var(--ax-sys-color-darker-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-darker-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-lightest-surface)}ax-toast.ax-primary{--ax-comp-toast-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-primary-darker-surface)}ax-toast.ax-secondary{--ax-comp-toast-bg-color: var(--ax-sys-color-secondary-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-secondary-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-secondary-darker-surface)}ax-toast.ax-success{--ax-comp-toast-bg-color: var(--ax-sys-color-success-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-success-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-success-darker-surface)}ax-toast.ax-warning{--ax-comp-toast-bg-color: var(--ax-sys-color-warning-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-warning-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-warning-darker-surface)}ax-toast.ax-danger{--ax-comp-toast-bg-color: var(--ax-sys-color-danger-surface);--ax-comp-toast-text-color: var(--ax-sys-color-on-danger-surface);--ax-comp-toast-progress-bg-color: var(--ax-sys-color-danger-darker-surface)}ax-toast{position:relative;display:flex;width:98vw;overflow:hidden;padding:.75rem 1rem;--ax-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--ax-shadow-colored: 0 4px 6px -1px var(--ax-shadow-color), 0 2px 4px -2px var(--ax-shadow-color);box-shadow:var(--ax-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)),var(--ax-ring-shadow, 0 0 rgba(0, 0, 0, 0)),var(--ax-shadow);color:rgba(var(--ax-comp-toast-text-color));background-color:rgba(var(--ax-comp-toast-bg-color));font-size:var(--ax-comp-toast-font-size, .875rem);line-height:var(--ax-comp-toast-line-height, 1.25rem);border-radius:var(--ax-comp-toast-border-radius, var(--ax-sys-border-radius))}@media (min-width: 768px){ax-toast{width:24rem}}ax-toast .ax-toast-icon,ax-toast .ax-icon-close{font-size:1.25rem;max-width:fit-content;align-items:start}ax-toast .ax-toast-icon{margin-inline-end:.5rem}ax-toast .ax-toast-content{display:flex;flex:1 1 0%;flex-direction:column}ax-toast .ax-toast-content .ax-toast-title{font-weight:500;line-height:1.5rem}ax-toast .ax-toast-content .ax-toast-buttons{margin-top:.75rem;margin-bottom:.75rem;display:flex;gap:.5rem}ax-toast ax-icon-close{height:fit-content}ax-toast ax-icon-close:hover{opacity:.75}ax-toast .ax-toast-progress{width:100%;bottom:0;height:.25rem;position:absolute;inset-inline-end:0px;inset-inline-start:0px;transition-property:width;transition-timing-function:linear;transition-duration:var(--ax-sys-transition-duration);background-color:rgba(var(--ax-comp-toast-progress-bg-color, 255, 255, 255, .46))}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -390,11 +390,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
 const COMPONENT = [AXToastComponent];
 const MODULES = [CommonModule, AXButtonModule, AXDecoratorModule, AXLoadingModule, DialogModule, AXTranslationModule];
 class AXToastModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToastModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: AXToastModule, imports: [CommonModule, AXButtonModule, AXDecoratorModule, AXLoadingModule, DialogModule, AXTranslationModule, AXToastComponent], exports: [AXToastComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToastModule, providers: [AXToastService], imports: [MODULES, COMPONENT] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToastModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: AXToastModule, imports: [CommonModule, AXButtonModule, AXDecoratorModule, AXLoadingModule, DialogModule, AXTranslationModule, AXToastComponent], exports: [AXToastComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToastModule, providers: [AXToastService], imports: [MODULES, COMPONENT] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToastModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToastModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...MODULES, ...COMPONENT],

package/fesm2022/acorex-components-toolbar.mjs

@@ -34,10 +34,10 @@ class AXToolBarComponent {
     get __hostClass() {
         return `ax-sm`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToolBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: AXToolBarComponent, isStandalone: true, selector: "ax-toolbar", host: { properties: { "class": "this.__hostClass" } }, queries: [{ propertyName: "buttons", predicate: AXButtonComponent, descendants: true, isSignal: true }, { propertyName: "decorators", predicate: AXDecoratorGenericComponent, isSignal: true }], ngImport: i0, template: "<ng-content select=\"ax-prefix\"> </ng-content>\n@if (prefixState() && (contentState() || suffixState())) {\n  <ax-divider class=\"ax-start-toolbar-divider\"></ax-divider>\n}\n\n<ng-content select=\"ax-content\"></ng-content>\n\n@if (contentState() && suffixState()) {\n  <ax-divider class=\"ax-end-toolbar-divider\"></ax-divider>\n}\n\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["ax-toolbar{display:flex;align-items:center;flex-wrap:wrap;padding-block:.25rem;padding-inline:.5rem;width:100%}ax-toolbar ax-divider{display:block;margin-inline:.5rem;width:1px;min-height:25px;background-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-toolbar ax-suffix,ax-toolbar ax-prefix,ax-toolbar ax-content{display:flex;justify-content:space-between;align-items:center;min-height:100%;flex-wrap:wrap}ax-toolbar ax-button,ax-toolbar ax-select-box,ax-toolbar ax-text-box,ax-toolbar ax-number-box{margin-inline:.15rem}\n"], dependencies: [{ kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToolBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AXToolBarComponent, isStandalone: true, selector: "ax-toolbar", host: { properties: { "class": "this.__hostClass" } }, queries: [{ propertyName: "buttons", predicate: AXButtonComponent, descendants: true, isSignal: true }, { propertyName: "decorators", predicate: AXDecoratorGenericComponent, isSignal: true }], ngImport: i0, template: "<ng-content select=\"ax-prefix\"> </ng-content>\n@if (prefixState() && (contentState() || suffixState())) {\n  <ax-divider class=\"ax-start-toolbar-divider\"></ax-divider>\n}\n\n<ng-content select=\"ax-content\"></ng-content>\n\n@if (contentState() && suffixState()) {\n  <ax-divider class=\"ax-end-toolbar-divider\"></ax-divider>\n}\n\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["ax-toolbar{display:flex;align-items:center;flex-wrap:wrap;padding-block:.25rem;padding-inline:.5rem;width:100%}ax-toolbar ax-divider{display:block;margin-inline:.5rem;width:1px;min-height:25px;background-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-toolbar ax-suffix,ax-toolbar ax-prefix,ax-toolbar ax-content{display:flex;justify-content:space-between;align-items:center;min-height:100%;flex-wrap:wrap}ax-toolbar ax-button,ax-toolbar ax-select-box,ax-toolbar ax-text-box,ax-toolbar ax-number-box{margin-inline:.15rem}\n"], dependencies: [{ kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToolBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToolBarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [AXDecoratorGenericComponent], template: "<ng-content select=\"ax-prefix\"> </ng-content>\n@if (prefixState() && (contentState() || suffixState())) {\n  <ax-divider class=\"ax-start-toolbar-divider\"></ax-divider>\n}\n\n<ng-content select=\"ax-content\"></ng-content>\n\n@if (contentState() && suffixState()) {\n  <ax-divider class=\"ax-end-toolbar-divider\"></ax-divider>\n}\n\n<ng-content select=\"ax-suffix\"></ng-content>\n", styles: ["ax-toolbar{display:flex;align-items:center;flex-wrap:wrap;padding-block:.25rem;padding-inline:.5rem;width:100%}ax-toolbar ax-divider{display:block;margin-inline:.5rem;width:1px;min-height:25px;background-color:rgba(var(--ax-sys-color-border-lightest-surface))}ax-toolbar ax-suffix,ax-toolbar ax-prefix,ax-toolbar ax-content{display:flex;justify-content:space-between;align-items:center;min-height:100%;flex-wrap:wrap}ax-toolbar ax-button,ax-toolbar ax-select-box,ax-toolbar ax-text-box,ax-toolbar ax-number-box{margin-inline:.15rem}\n"] }]
         }], propDecorators: { __hostClass: [{
@@ -48,11 +48,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
 const COMPONENT = [AXToolBarComponent];
 const MODULES = [AXDecoratorModule];
 class AXToolBarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToolBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: AXToolBarModule, imports: [AXDecoratorModule, AXToolBarComponent], exports: [AXToolBarComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToolBarModule, imports: [MODULES, COMPONENT] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToolBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: AXToolBarModule, imports: [AXDecoratorModule, AXToolBarComponent], exports: [AXToolBarComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToolBarModule, imports: [MODULES, COMPONENT] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXToolBarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXToolBarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...MODULES, ...COMPONENT],

package/fesm2022/acorex-components-tooltip.mjs

@@ -10,10 +10,10 @@ import { CommonModule } from '@angular/common';
  * @category Components
  */
 class AXTooltipComponent extends MXBaseComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTooltipComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: AXTooltipComponent, isStandalone: true, selector: "ax-tooltip", inputs: { text: "text", position: "position" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-tooltip-container\">\n  <div class=\"ax-tooltip\">\n    {{ text }}\n  </div>\n  <!-- <div class=\"ax-tooltip-tringle ax-tooltip-tringle-{{ position }}\"></div> -->\n</div>", styles: ["ax-tooltip{--ax-comp-tooltip-border-radius: .25rem;--ax-comp-tooltip-bg-color: var(--ax-sys-color-dark);--ax-comp-tooltip-text-color: var(--ax-sys-color-light)}.ax-dark ax-tooltip{--ax-comp-tooltip-bg-color: var(--ax-sys-color-light);--ax-comp-tooltip-text-color: var(--ax-sys-color-dark)}.ax-tooltip-container{position:relative}.ax-tooltip-container .ax-tooltip{display:block;padding:.25rem .5rem;background-color:rgba(var(--ax-comp-tooltip-bg-color));color:rgba(var(--ax-comp-tooltip-text-color));border-radius:var(--ax-comp-tooltip-border-radius);font-size:.75rem;font-weight:400}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTooltipComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.5", type: AXTooltipComponent, isStandalone: true, selector: "ax-tooltip", inputs: { text: "text", position: "position" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-tooltip-container\">\n  <div class=\"ax-tooltip\">\n    {{ text }}\n  </div>\n  <!-- <div class=\"ax-tooltip-tringle ax-tooltip-tringle-{{ position }}\"></div> -->\n</div>", styles: ["ax-tooltip{--ax-comp-tooltip-border-radius: .25rem;--ax-comp-tooltip-bg-color: var(--ax-sys-color-dark);--ax-comp-tooltip-text-color: var(--ax-sys-color-light)}.ax-dark ax-tooltip{--ax-comp-tooltip-bg-color: var(--ax-sys-color-light);--ax-comp-tooltip-text-color: var(--ax-sys-color-dark)}.ax-tooltip-container{position:relative}.ax-tooltip-container .ax-tooltip{display:block;padding:.25rem .5rem;background-color:rgba(var(--ax-comp-tooltip-bg-color));color:rgba(var(--ax-comp-tooltip-text-color));border-radius:var(--ax-comp-tooltip-border-radius);font-size:.75rem;font-weight:400}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTooltipComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTooltipComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-tooltip', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"ax-tooltip-container\">\n  <div class=\"ax-tooltip\">\n    {{ text }}\n  </div>\n  <!-- <div class=\"ax-tooltip-tringle ax-tooltip-tringle-{{ position }}\"></div> -->\n</div>", styles: ["ax-tooltip{--ax-comp-tooltip-border-radius: .25rem;--ax-comp-tooltip-bg-color: var(--ax-sys-color-dark);--ax-comp-tooltip-text-color: var(--ax-sys-color-light)}.ax-dark ax-tooltip{--ax-comp-tooltip-bg-color: var(--ax-sys-color-light);--ax-comp-tooltip-text-color: var(--ax-sys-color-dark)}.ax-tooltip-container{position:relative}.ax-tooltip-container .ax-tooltip{display:block;padding:.25rem .5rem;background-color:rgba(var(--ax-comp-tooltip-bg-color));color:rgba(var(--ax-comp-tooltip-text-color));border-radius:var(--ax-comp-tooltip-border-radius);font-size:.75rem;font-weight:400}\n"] }]
         }], propDecorators: { text: [{
@@ -78,10 +78,10 @@ class AXTooltipDirective {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTooltipDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: AXTooltipDirective, isStandalone: true, selector: "[axTooltip]", inputs: { content: ["axTooltip", "content"], placement: ["axTooltipPlacement", "placement"], openAfter: ["axTooltipOpenAfter", "openAfter"], closeAfter: ["axTooltipCloseAfter", "closeAfter"] }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTooltipDirective, deps: [{ token: i0.ElementRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.5", type: AXTooltipDirective, isStandalone: true, selector: "[axTooltip]", inputs: { content: ["axTooltip", "content"], placement: ["axTooltipPlacement", "placement"], openAfter: ["axTooltipOpenAfter", "openAfter"], closeAfter: ["axTooltipCloseAfter", "closeAfter"] }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTooltipDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTooltipDirective, decorators: [{
             type: Directive,
             args: [{ selector: '[axTooltip]' }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ViewContainerRef }], propDecorators: { content: [{
@@ -101,11 +101,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
 const COMPONENT = [AXTooltipComponent, AXTooltipDirective];
 const MODULES = [CommonModule, OverlayModule];
 class AXTooltipModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTooltipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: AXTooltipModule, imports: [CommonModule, OverlayModule, AXTooltipComponent, AXTooltipDirective], exports: [AXTooltipComponent, AXTooltipDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTooltipModule, imports: [MODULES] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTooltipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: AXTooltipModule, imports: [CommonModule, OverlayModule, AXTooltipComponent, AXTooltipDirective], exports: [AXTooltipComponent, AXTooltipDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTooltipModule, imports: [MODULES] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTooltipModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTooltipModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...MODULES, ...COMPONENT],

package/fesm2022/acorex-components-tree-view.mjs

@@ -1,4 +1,4 @@
-import { NXComponent, AXClickEvent, AXCommonModule } from '@acorex/components/common';
+import { NXComponent, AXComponent, AXClickEvent, AXCommonModule } from '@acorex/components/common';
 import { AXLoadingComponent, AXLoadingModule } from '@acorex/components/loading';
 import { AXTooltipDirective, AXTooltipModule } from '@acorex/components/tooltip';
 import { AXPlatform } from '@acorex/core/platform';
@@ -78,40 +78,32 @@ class AXTreeViewComponent extends NXComponent {
         if (this.selectionMode() === 'single' && event.isUserInteraction) {
             this.handleUnSelectNode(this.itemsSignal());
         }
-        item[this.selectedField()] = event.value;
-        if (event.value !== null) {
-            switch (this.selectionBehavior()) {
-                case 'autoExpand':
-                    if (event.value) {
-                        if (this.itemsPromise && item[this.hasChildField()] && !item?.[this.childrenField()]?.length) {
-                            this.fetchData(item);
-                            this.setNodeLoading(item[this.valueField()], true);
+        if (event.isUserInteraction) {
+            item[this.selectedField()] = event.value;
+            if (event.value !== null) {
+                switch (this.selectionBehavior()) {
+                    case 'autoExpand':
+                        if (event.value) {
+                            if (this.itemsPromise && item[this.hasChildField()] && !item?.[this.childrenField()]?.length) {
+                                this.fetchData(item);
+                                this.setNodeLoading(item[this.valueField()], true);
+                            }
+                            this.toggleExpand(item);
                         }
-                        this.toggleExpand(item);
-                    }
-                    break;
-                case 'cascade':
-                    if (this.itemsPromise) {
-                        console.error('This mode only available client Side');
-                        return;
-                    }
-                    if (this.selectionMode() === 'single') {
-                        console.error('This mode only available selectionMode multiple');
-                        return;
-                    }
-                    this.expandAndToggleSelection(item, event.value);
-                    break;
-                case 'indeterminate':
-                    if (item?.[this.childrenField()]?.length) {
-                        this.applySelectionToChildren(item, event.value, item[this.valueField()]);
-                    }
-                    this.updateParentSelection(item, event.value);
-                    break;
-                default:
-                    break;
+                        break;
+                    case 'cascade':
+                        this.expandAndToggleSelection(item, event.value);
+                        break;
+                    case 'indeterminate':
+                        if (item?.[this.childrenField()]?.length) {
+                            this.applySelectionToChildren(item, event.value, item[this.valueField()]);
+                        }
+                        this.updateParentSelection(item, event.value);
+                        break;
+                    default:
+                        break;
+                }
             }
-        }
-        if (event.isUserInteraction) {
             const result = this.findSelectedNodes(this.itemsSignal());
             this.onSelectionChanged.emit({
                 component: this,
@@ -135,14 +127,26 @@ class AXTreeViewComponent extends NXComponent {
      * expand and change value parent change
      *
      */
-    expandAndToggleSelection(item, selected) {
+    async expandAndToggleSelection(item, selected) {
+        if (this.itemsPromise && item[this.hasChildField()] && !item?.[this.childrenField()]?.length) {
+            await this.fetchData(item);
+            await this.setNodeLoading(item[this.valueField()], true);
+        }
         this.toggleExpand(item);
         if (item[this.childrenField()]?.length) {
             this.applySelectionToChildren(item, selected, item[this.valueField()]);
         }
     }
     applySelectionToChildren(item, isSelected, parentId) {
-        item[this.childrenField()].forEach((child) => {
+        item[this.childrenField()].forEach(async (child) => {
+            if (this.itemsPromise &&
+                child[this.hasChildField()] &&
+                !child?.[this.childrenField()]?.length &&
+                this.selectionBehavior() === 'cascade') {
+                await this.fetchData(child);
+                await this.setNodeLoading(child[this.valueField()], true);
+                this.toggleExpand(child);
+            }
             child[this.parentField()] = parentId;
             child[this.selectedField()] = isSelected;
             if (child[this.childrenField()]?.length) {
@@ -317,10 +321,10 @@ class AXTreeViewComponent extends NXComponent {
          */
         this.executorChanges.set(operation);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTreeViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: AXTreeViewComponent, isStandalone: true, selector: "ax-tree-view", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, showCheckbox: { classPropertyName: "showCheckbox", publicName: "showCheckbox", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selectionBehavior: { classPropertyName: "selectionBehavior", publicName: "selectionBehavior", isSignal: true, isRequired: false, transformFunction: null }, focusNodeEnabled: { classPropertyName: "focusNodeEnabled", publicName: "focusNodeEnabled", isSignal: true, isRequired: false, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: true, isRequired: false, transformFunction: null }, textField: { classPropertyName: "textField", publicName: "textField", isSignal: true, isRequired: false, transformFunction: null }, visibleField: { classPropertyName: "visibleField", publicName: "visibleField", isSignal: true, isRequired: false, transformFunction: null }, disableField: { classPropertyName: "disableField", publicName: "disableField", isSignal: true, isRequired: false, transformFunction: null }, hasChildField: { classPropertyName: "hasChildField", publicName: "hasChildField", isSignal: true, isRequired: false, transformFunction: null }, selectedField: { classPropertyName: "selectedField", publicName: "selectedField", isSignal: true, isRequired: false, transformFunction: null }, expandedField: { classPropertyName: "expandedField", publicName: "expandedField", isSignal: true, isRequired: false, transformFunction: null }, tooltipField: { classPropertyName: "tooltipField", publicName: "tooltipField", isSignal: true, isRequired: false, transformFunction: null }, childrenField: { classPropertyName: "childrenField", publicName: "childrenField", isSignal: true, isRequired: false, transformFunction: null }, activeField: { classPropertyName: "activeField", publicName: "activeField", isSignal: true, isRequired: false, transformFunction: null }, indeterminateField: { classPropertyName: "indeterminateField", publicName: "indeterminateField", isSignal: true, isRequired: false, transformFunction: null }, parentField: { classPropertyName: "parentField", publicName: "parentField", isSignal: true, isRequired: false, transformFunction: null }, iconField: { classPropertyName: "iconField", publicName: "iconField", isSignal: true, isRequired: false, transformFunction: null }, toggleIcons: { classPropertyName: "toggleIcons", publicName: "toggleIcons", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, customTemplate: { classPropertyName: "customTemplate", publicName: "customTemplate", isSignal: false, isRequired: false, transformFunction: null }, expandOn: { classPropertyName: "expandOn", publicName: "expandOn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSelectionChanged: "onSelectionChanged", onNodeClick: "onNodeClick", onCollapsedChanged: "onCollapsedChanged", onNodedbClick: "onNodedbClick" }, host: { properties: { "class": "this.__hostClass" } }, usesInheritance: true, ngImport: i0, template: "@for (node of resolvedItems; track $index) {\n  <ng-container [ngTemplateOutlet]=\"recursion\" [ngTemplateOutletContext]=\"{ $implicit: node }\"></ng-container>\n}\n\n<ng-template #recursion let-item>\n  @if (item[visibleField()] !== false) {\n    <ng-container\n      [ngTemplateOutlet]=\"customTemplate || defaultTemplate\"\n      [ngTemplateOutletContext]=\"{ $implicit: item }\"\n    ></ng-container>\n  }\n</ng-template>\n\n<ng-template #defaultTemplate let-item>\n  @if (item[visibleField()] !== false) {\n    <ax-tree-view-item\n      [item]=\"item\"\n      [(isExpanded)]=\"item[expandedField()]\"\n      [(isActive)]=\"item[activeField()]\"\n      [isLoading]=\"isNodeLoading(item[valueField()])\"\n      [executorChanges]=\"executorChanges()\"\n    >\n      @if (this.showCheckbox()) {\n        <ax-check-box\n          [disabled]=\"item[disableField()]\"\n          [indeterminate]=\"item[indeterminateField()]\"\n          [(ngModel)]=\"item[selectedField()]\"\n          (onValueChanged)=\"handleNodeSelectionClick($event, item)\"\n        ></ax-check-box>\n      }\n      <ax-prefix>\n        @if (item[iconField()]) {\n          <ax-icon [icon]=\"item[iconField()]\"></ax-icon>\n        } @else {\n          <i></i>\n        }\n      </ax-prefix>\n      @if (item[textField()]) {\n        <ax-text>{{ item[textField()] }}</ax-text>\n      }\n\n      <ax-suffix></ax-suffix>\n      @for (child of item?.[childrenField()]; track $index) {\n        <ng-container [ngTemplateOutlet]=\"recursion\" [ngTemplateOutletContext]=\"{ $implicit: child }\"></ng-container>\n      }\n    </ax-tree-view-item>\n  }\n</ng-template>\n", styles: ["ax-tree-view{--ax-comp-tree-view-arrow-size: .875rem;--ax-comp-tree-view-text-size: .875rem;--ax-comp-tree-view-active-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-tree-view-active-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-tree-view-hover-bg-color: var(--ax-sys-color-dark-surface);--ax-comp-tree-view-indicator-size: 2px}ax-tree-view.ax-look-with-line ax-tree-view-item{position:relative}ax-tree-view.ax-look-with-line ax-tree-view-item:before{content:\"\";position:absolute;top:0;inset-inline-start:.625rem;width:1px;height:100%;background-color:#ccc}ax-tree-view.ax-look-with-line ax-tree-view-item .ax-tree-view-container{padding-inline-start:1.25rem}ax-tree-view.ax-look-with-line ax-tree-view-item .ax-tree-view-container:not(:has(i)){padding-inline-start:1.75rem}ax-tree-view ax-tree-view-item ax-check-box{margin-inline-start:.5rem}ax-tree-view ax-tree-view-item .ax-tree-view-container{display:flex;align-items:center;margin-bottom:.125rem;cursor:pointer}ax-tree-view ax-tree-view-item .ax-tree-view-container:not(:has(i)){padding-inline-start:.5rem}ax-tree-view ax-tree-view-item .ax-tree-view-container ax-text{font-size:var(--ax-comp-tree-view-text-size)}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-checkbox-end-side{display:none!important}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-arrow{font-size:var(--ax-comp-tree-view-arrow-size)!important}ax-tree-view ax-tree-view-item .ax-tree-view-container ax-suffix:empty{display:none}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items{display:flex;align-items:center}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix{display:flex;align-items:center;gap:.5rem;padding:.25rem .5rem;border-radius:.25rem;overflow-x:auto;margin-inline-start:.25rem}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.noselect-tree-view{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.ax-state-tree-view-active{background-color:rgba(var(--ax-comp-tree-view-active-bg-color));color:rgba(var(--ax-comp-tree-view-active-text-color))}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix:hover:not(.ax-state-tree-view-active){background-color:rgba(var(--ax-comp-tree-view-hover-bg-color))}ax-tree-view ax-tree-view-item .ax-tree-view-child{padding-inline-start:1rem}ax-tree-view ax-tree-view-item .ax-state-disabled{cursor:not-allowed!important;opacity:.5!important}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXTreeViewItemComponent, selector: "ax-tree-view-item", inputs: ["item", "isExpanded", "isActive", "isLoading", "executorChanges"], outputs: ["isExpandedChange", "isActiveChange"] }, { kind: "component", type: AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "checked", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTreeViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AXTreeViewComponent, isStandalone: true, selector: "ax-tree-view", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, showCheckbox: { classPropertyName: "showCheckbox", publicName: "showCheckbox", isSignal: true, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: true, isRequired: false, transformFunction: null }, selectionBehavior: { classPropertyName: "selectionBehavior", publicName: "selectionBehavior", isSignal: true, isRequired: false, transformFunction: null }, focusNodeEnabled: { classPropertyName: "focusNodeEnabled", publicName: "focusNodeEnabled", isSignal: true, isRequired: false, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: true, isRequired: false, transformFunction: null }, textField: { classPropertyName: "textField", publicName: "textField", isSignal: true, isRequired: false, transformFunction: null }, visibleField: { classPropertyName: "visibleField", publicName: "visibleField", isSignal: true, isRequired: false, transformFunction: null }, disableField: { classPropertyName: "disableField", publicName: "disableField", isSignal: true, isRequired: false, transformFunction: null }, hasChildField: { classPropertyName: "hasChildField", publicName: "hasChildField", isSignal: true, isRequired: false, transformFunction: null }, selectedField: { classPropertyName: "selectedField", publicName: "selectedField", isSignal: true, isRequired: false, transformFunction: null }, expandedField: { classPropertyName: "expandedField", publicName: "expandedField", isSignal: true, isRequired: false, transformFunction: null }, tooltipField: { classPropertyName: "tooltipField", publicName: "tooltipField", isSignal: true, isRequired: false, transformFunction: null }, childrenField: { classPropertyName: "childrenField", publicName: "childrenField", isSignal: true, isRequired: false, transformFunction: null }, activeField: { classPropertyName: "activeField", publicName: "activeField", isSignal: true, isRequired: false, transformFunction: null }, indeterminateField: { classPropertyName: "indeterminateField", publicName: "indeterminateField", isSignal: true, isRequired: false, transformFunction: null }, parentField: { classPropertyName: "parentField", publicName: "parentField", isSignal: true, isRequired: false, transformFunction: null }, iconField: { classPropertyName: "iconField", publicName: "iconField", isSignal: true, isRequired: false, transformFunction: null }, toggleIcons: { classPropertyName: "toggleIcons", publicName: "toggleIcons", isSignal: true, isRequired: false, transformFunction: null }, look: { classPropertyName: "look", publicName: "look", isSignal: true, isRequired: false, transformFunction: null }, customTemplate: { classPropertyName: "customTemplate", publicName: "customTemplate", isSignal: false, isRequired: false, transformFunction: null }, expandOn: { classPropertyName: "expandOn", publicName: "expandOn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSelectionChanged: "onSelectionChanged", onNodeClick: "onNodeClick", onCollapsedChanged: "onCollapsedChanged", onNodedbClick: "onNodedbClick" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: AXComponent, useExisting: AXTreeViewComponent }], usesInheritance: true, ngImport: i0, template: "@for (node of resolvedItems; track $index) {\n  <ng-container [ngTemplateOutlet]=\"recursion\" [ngTemplateOutletContext]=\"{ $implicit: node }\"></ng-container>\n}\n\n<ng-template #recursion let-item>\n  @if (item[visibleField()] !== false) {\n    <ng-container\n      [ngTemplateOutlet]=\"customTemplate || defaultTemplate\"\n      [ngTemplateOutletContext]=\"{ $implicit: item }\"\n    ></ng-container>\n  }\n</ng-template>\n\n<ng-template #defaultTemplate let-item>\n  @if (item[visibleField()] !== false) {\n    <ax-tree-view-item\n      [item]=\"item\"\n      [(isExpanded)]=\"item[expandedField()]\"\n      [(isActive)]=\"item[activeField()]\"\n      [isLoading]=\"isNodeLoading(item[valueField()])\"\n      [executorChanges]=\"executorChanges()\"\n    >\n      @if (this.showCheckbox()) {\n        <ax-check-box\n          [disabled]=\"item[disableField()]\"\n          [indeterminate]=\"item[indeterminateField()]\"\n          [(ngModel)]=\"item[selectedField()]\"\n          (onValueChanged)=\"handleNodeSelectionClick($event, item)\"\n        ></ax-check-box>\n      }\n      <ax-prefix>\n        @if (item[iconField()]) {\n          <ax-icon [icon]=\"item[iconField()]\"></ax-icon>\n        } @else {\n          <i></i>\n        }\n      </ax-prefix>\n      @if (item[textField()]) {\n        <ax-text>{{ item[textField()] }}</ax-text>\n      }\n\n      <ax-suffix></ax-suffix>\n      @for (child of item?.[childrenField()]; track $index) {\n        <ng-container [ngTemplateOutlet]=\"recursion\" [ngTemplateOutletContext]=\"{ $implicit: child }\"></ng-container>\n      }\n    </ax-tree-view-item>\n  }\n</ng-template>\n", styles: ["ax-tree-view{--ax-comp-tree-view-arrow-size: .875rem;--ax-comp-tree-view-text-size: .875rem;--ax-comp-tree-view-active-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-tree-view-active-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-tree-view-hover-bg-color: var(--ax-sys-color-dark-surface);--ax-comp-tree-view-indicator-size: 2px}ax-tree-view.ax-look-with-line ax-tree-view-item{position:relative}ax-tree-view.ax-look-with-line ax-tree-view-item:before{content:\"\";position:absolute;top:0;inset-inline-start:.625rem;width:1px;height:100%;background-color:#ccc}ax-tree-view.ax-look-with-line ax-tree-view-item .ax-tree-view-container{padding-inline-start:1.25rem}ax-tree-view.ax-look-with-line ax-tree-view-item .ax-tree-view-container:not(:has(i)){padding-inline-start:1.75rem}ax-tree-view ax-tree-view-item ax-check-box{margin-inline-start:.5rem}ax-tree-view ax-tree-view-item .ax-tree-view-container{display:flex;align-items:center;margin-bottom:.125rem;cursor:pointer}ax-tree-view ax-tree-view-item .ax-tree-view-container:not(:has(i)){padding-inline-start:.5rem}ax-tree-view ax-tree-view-item .ax-tree-view-container ax-text{font-size:var(--ax-comp-tree-view-text-size)}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-checkbox-end-side{display:none!important}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-arrow{font-size:var(--ax-comp-tree-view-arrow-size)!important}ax-tree-view ax-tree-view-item .ax-tree-view-container ax-suffix:empty{display:none}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items{display:flex;align-items:center}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix{display:flex;align-items:center;gap:.5rem;padding:.25rem .5rem;border-radius:.25rem;overflow-x:auto;margin-inline-start:.25rem}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.noselect-tree-view{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.ax-state-tree-view-active{background-color:rgba(var(--ax-comp-tree-view-active-bg-color));color:rgba(var(--ax-comp-tree-view-active-text-color))}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix:hover:not(.ax-state-tree-view-active){background-color:rgba(var(--ax-comp-tree-view-hover-bg-color))}ax-tree-view ax-tree-view-item .ax-tree-view-child{padding-inline-start:1rem}ax-tree-view ax-tree-view-item .ax-state-disabled{cursor:not-allowed!important;opacity:.5!important}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXTreeViewItemComponent, selector: "ax-tree-view-item", inputs: ["item", "isExpanded", "isActive", "isLoading", "executorChanges"], outputs: ["isExpandedChange", "isActiveChange"] }, { kind: "component", type: AXCheckBoxComponent, selector: "ax-check-box", inputs: ["disabled", "tabIndex", "readonly", "color", "value", "name", "id", "checked", "indeterminate"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title, ax-subtitle, ax-placeholder, ax-overlay" }, { kind: "component", type: AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTreeViewComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTreeViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-tree-view', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         NgTemplateOutlet,
@@ -329,7 +333,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
                         FormsModule,
                         AXDecoratorGenericComponent,
                         AXDecoratorIconComponent,
-                    ], template: "@for (node of resolvedItems; track $index) {\n  <ng-container [ngTemplateOutlet]=\"recursion\" [ngTemplateOutletContext]=\"{ $implicit: node }\"></ng-container>\n}\n\n<ng-template #recursion let-item>\n  @if (item[visibleField()] !== false) {\n    <ng-container\n      [ngTemplateOutlet]=\"customTemplate || defaultTemplate\"\n      [ngTemplateOutletContext]=\"{ $implicit: item }\"\n    ></ng-container>\n  }\n</ng-template>\n\n<ng-template #defaultTemplate let-item>\n  @if (item[visibleField()] !== false) {\n    <ax-tree-view-item\n      [item]=\"item\"\n      [(isExpanded)]=\"item[expandedField()]\"\n      [(isActive)]=\"item[activeField()]\"\n      [isLoading]=\"isNodeLoading(item[valueField()])\"\n      [executorChanges]=\"executorChanges()\"\n    >\n      @if (this.showCheckbox()) {\n        <ax-check-box\n          [disabled]=\"item[disableField()]\"\n          [indeterminate]=\"item[indeterminateField()]\"\n          [(ngModel)]=\"item[selectedField()]\"\n          (onValueChanged)=\"handleNodeSelectionClick($event, item)\"\n        ></ax-check-box>\n      }\n      <ax-prefix>\n        @if (item[iconField()]) {\n          <ax-icon [icon]=\"item[iconField()]\"></ax-icon>\n        } @else {\n          <i></i>\n        }\n      </ax-prefix>\n      @if (item[textField()]) {\n        <ax-text>{{ item[textField()] }}</ax-text>\n      }\n\n      <ax-suffix></ax-suffix>\n      @for (child of item?.[childrenField()]; track $index) {\n        <ng-container [ngTemplateOutlet]=\"recursion\" [ngTemplateOutletContext]=\"{ $implicit: child }\"></ng-container>\n      }\n    </ax-tree-view-item>\n  }\n</ng-template>\n", styles: ["ax-tree-view{--ax-comp-tree-view-arrow-size: .875rem;--ax-comp-tree-view-text-size: .875rem;--ax-comp-tree-view-active-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-tree-view-active-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-tree-view-hover-bg-color: var(--ax-sys-color-dark-surface);--ax-comp-tree-view-indicator-size: 2px}ax-tree-view.ax-look-with-line ax-tree-view-item{position:relative}ax-tree-view.ax-look-with-line ax-tree-view-item:before{content:\"\";position:absolute;top:0;inset-inline-start:.625rem;width:1px;height:100%;background-color:#ccc}ax-tree-view.ax-look-with-line ax-tree-view-item .ax-tree-view-container{padding-inline-start:1.25rem}ax-tree-view.ax-look-with-line ax-tree-view-item .ax-tree-view-container:not(:has(i)){padding-inline-start:1.75rem}ax-tree-view ax-tree-view-item ax-check-box{margin-inline-start:.5rem}ax-tree-view ax-tree-view-item .ax-tree-view-container{display:flex;align-items:center;margin-bottom:.125rem;cursor:pointer}ax-tree-view ax-tree-view-item .ax-tree-view-container:not(:has(i)){padding-inline-start:.5rem}ax-tree-view ax-tree-view-item .ax-tree-view-container ax-text{font-size:var(--ax-comp-tree-view-text-size)}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-checkbox-end-side{display:none!important}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-arrow{font-size:var(--ax-comp-tree-view-arrow-size)!important}ax-tree-view ax-tree-view-item .ax-tree-view-container ax-suffix:empty{display:none}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items{display:flex;align-items:center}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix{display:flex;align-items:center;gap:.5rem;padding:.25rem .5rem;border-radius:.25rem;overflow-x:auto;margin-inline-start:.25rem}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.noselect-tree-view{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.ax-state-tree-view-active{background-color:rgba(var(--ax-comp-tree-view-active-bg-color));color:rgba(var(--ax-comp-tree-view-active-text-color))}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix:hover:not(.ax-state-tree-view-active){background-color:rgba(var(--ax-comp-tree-view-hover-bg-color))}ax-tree-view ax-tree-view-item .ax-tree-view-child{padding-inline-start:1rem}ax-tree-view ax-tree-view-item .ax-state-disabled{cursor:not-allowed!important;opacity:.5!important}\n"] }]
+                    ], providers: [{ provide: AXComponent, useExisting: AXTreeViewComponent }], template: "@for (node of resolvedItems; track $index) {\n  <ng-container [ngTemplateOutlet]=\"recursion\" [ngTemplateOutletContext]=\"{ $implicit: node }\"></ng-container>\n}\n\n<ng-template #recursion let-item>\n  @if (item[visibleField()] !== false) {\n    <ng-container\n      [ngTemplateOutlet]=\"customTemplate || defaultTemplate\"\n      [ngTemplateOutletContext]=\"{ $implicit: item }\"\n    ></ng-container>\n  }\n</ng-template>\n\n<ng-template #defaultTemplate let-item>\n  @if (item[visibleField()] !== false) {\n    <ax-tree-view-item\n      [item]=\"item\"\n      [(isExpanded)]=\"item[expandedField()]\"\n      [(isActive)]=\"item[activeField()]\"\n      [isLoading]=\"isNodeLoading(item[valueField()])\"\n      [executorChanges]=\"executorChanges()\"\n    >\n      @if (this.showCheckbox()) {\n        <ax-check-box\n          [disabled]=\"item[disableField()]\"\n          [indeterminate]=\"item[indeterminateField()]\"\n          [(ngModel)]=\"item[selectedField()]\"\n          (onValueChanged)=\"handleNodeSelectionClick($event, item)\"\n        ></ax-check-box>\n      }\n      <ax-prefix>\n        @if (item[iconField()]) {\n          <ax-icon [icon]=\"item[iconField()]\"></ax-icon>\n        } @else {\n          <i></i>\n        }\n      </ax-prefix>\n      @if (item[textField()]) {\n        <ax-text>{{ item[textField()] }}</ax-text>\n      }\n\n      <ax-suffix></ax-suffix>\n      @for (child of item?.[childrenField()]; track $index) {\n        <ng-container [ngTemplateOutlet]=\"recursion\" [ngTemplateOutletContext]=\"{ $implicit: child }\"></ng-container>\n      }\n    </ax-tree-view-item>\n  }\n</ng-template>\n", styles: ["ax-tree-view{--ax-comp-tree-view-arrow-size: .875rem;--ax-comp-tree-view-text-size: .875rem;--ax-comp-tree-view-active-bg-color: var(--ax-sys-color-primary-surface);--ax-comp-tree-view-active-text-color: var(--ax-sys-color-on-primary-surface);--ax-comp-tree-view-hover-bg-color: var(--ax-sys-color-dark-surface);--ax-comp-tree-view-indicator-size: 2px}ax-tree-view.ax-look-with-line ax-tree-view-item{position:relative}ax-tree-view.ax-look-with-line ax-tree-view-item:before{content:\"\";position:absolute;top:0;inset-inline-start:.625rem;width:1px;height:100%;background-color:#ccc}ax-tree-view.ax-look-with-line ax-tree-view-item .ax-tree-view-container{padding-inline-start:1.25rem}ax-tree-view.ax-look-with-line ax-tree-view-item .ax-tree-view-container:not(:has(i)){padding-inline-start:1.75rem}ax-tree-view ax-tree-view-item ax-check-box{margin-inline-start:.5rem}ax-tree-view ax-tree-view-item .ax-tree-view-container{display:flex;align-items:center;margin-bottom:.125rem;cursor:pointer}ax-tree-view ax-tree-view-item .ax-tree-view-container:not(:has(i)){padding-inline-start:.5rem}ax-tree-view ax-tree-view-item .ax-tree-view-container ax-text{font-size:var(--ax-comp-tree-view-text-size)}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-checkbox-end-side{display:none!important}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-arrow{font-size:var(--ax-comp-tree-view-arrow-size)!important}ax-tree-view ax-tree-view-item .ax-tree-view-container ax-suffix:empty{display:none}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items{display:flex;align-items:center}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix{display:flex;align-items:center;gap:.5rem;padding:.25rem .5rem;border-radius:.25rem;overflow-x:auto;margin-inline-start:.25rem}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.noselect-tree-view{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix.ax-state-tree-view-active{background-color:rgba(var(--ax-comp-tree-view-active-bg-color));color:rgba(var(--ax-comp-tree-view-active-text-color))}ax-tree-view ax-tree-view-item .ax-tree-view-container .ax-tree-view-items .ax-tree-view-items-prefix:hover:not(.ax-state-tree-view-active){background-color:rgba(var(--ax-comp-tree-view-hover-bg-color))}ax-tree-view ax-tree-view-item .ax-tree-view-child{padding-inline-start:1rem}ax-tree-view ax-tree-view-item .ax-state-disabled{cursor:not-allowed!important;opacity:.5!important}\n"] }]
         }], propDecorators: { __hostClass: [{
                 type: HostBinding,
                 args: ['class']
@@ -395,8 +399,8 @@ class AXTreeViewItemComponent extends NXComponent {
         }
         this.treeView.onNodedbClick.emit({ component: this, data: item, nativeElement: this.nativeElement });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTreeViewItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: AXTreeViewItemComponent, isStandalone: true, selector: "ax-tree-view-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, isExpanded: { classPropertyName: "isExpanded", publicName: "isExpanded", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, executorChanges: { classPropertyName: "executorChanges", publicName: "executorChanges", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isExpanded: "isExpandedChange", isActive: "isActiveChange" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-tree-view-container\">\n  @if ((item()[this.treeView.childrenField()] && !isLoading()) || (item()[treeView.hasChildField()] && !isLoading())) {\n    <i\n      [class.ax-state-disabled]=\"item()[treeView.disableField()]\"\n      (click)=\"handleArrowNodeClick()\"\n      class=\"{{ arrowIcon() }}\"\n    ></i>\n  } @else if (isLoading()) {\n    <ax-loading></ax-loading>\n  }\n\n  <div class=\"ax-tree-view-items\">\n    <ng-content select=\"ax-check-box\"></ng-content>\n    <div\n      [class.ax-state-disabled]=\"item()[treeView.disableField()]\"\n      [axTooltip]=\"item()[treeView.tooltipField()]\"\n      axTooltipPlacement=\"end-bottom\"\n      (click)=\"handleTextClick(item())\"\n      (dblclick)=\"handleTextDbClick(item())\"\n      class=\"ax-tree-view-items-prefix noselect-tree-view\"\n      [class.ax-state-tree-view-active]=\"item()[treeView.activeField()]\"\n    >\n      <ng-content select=\"ax-prefix\"></ng-content>\n      <ng-content select=\"ax-text\"></ng-content>\n      <ng-content select=\"ax-suffix\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<div class=\"ax-tree-view-child\" [@collapseExpand]=\"isExpanded() ? 'expanded' : 'collapsed'\">\n  <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltip", "axTooltipPlacement", "axTooltipOpenAfter", "axTooltipCloseAfter"] }], animations: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTreeViewItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.5", type: AXTreeViewItemComponent, isStandalone: true, selector: "ax-tree-view-item", inputs: { item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, isExpanded: { classPropertyName: "isExpanded", publicName: "isExpanded", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, executorChanges: { classPropertyName: "executorChanges", publicName: "executorChanges", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isExpanded: "isExpandedChange", isActive: "isActiveChange" }, usesInheritance: true, ngImport: i0, template: "<div class=\"ax-tree-view-container\">\n  @if ((item()[this.treeView.childrenField()] && !isLoading()) || (item()[treeView.hasChildField()] && !isLoading())) {\n    <i\n      [class.ax-state-disabled]=\"item()[treeView.disableField()]\"\n      (click)=\"handleArrowNodeClick()\"\n      class=\"{{ arrowIcon() }}\"\n    ></i>\n  } @else if (isLoading()) {\n    <ax-loading></ax-loading>\n  }\n\n  <div class=\"ax-tree-view-items\">\n    <ng-content select=\"ax-check-box\"></ng-content>\n    <div\n      [class.ax-state-disabled]=\"item()[treeView.disableField()]\"\n      [axTooltip]=\"item()[treeView.tooltipField()]\"\n      axTooltipPlacement=\"end-bottom\"\n      (click)=\"handleTextClick(item())\"\n      (dblclick)=\"handleTextDbClick(item())\"\n      class=\"ax-tree-view-items-prefix noselect-tree-view\"\n      [class.ax-state-tree-view-active]=\"item()[treeView.activeField()]\"\n    >\n      <ng-content select=\"ax-prefix\"></ng-content>\n      <ng-content select=\"ax-text\"></ng-content>\n      <ng-content select=\"ax-suffix\"></ng-content>\n    </div>\n  </div>\n</div>\n\n<div class=\"ax-tree-view-child\" [@collapseExpand]=\"isExpanded() ? 'expanded' : 'collapsed'\">\n  <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "component", type: AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "directive", type: AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltip", "axTooltipPlacement", "axTooltipOpenAfter", "axTooltipCloseAfter"] }], animations: [
             trigger('collapseExpand', [
                 state('collapsed', style({
                     height: '0',
@@ -412,7 +416,7 @@ class AXTreeViewItemComponent extends NXComponent {
             ]),
         ], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTreeViewItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTreeViewItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-tree-view-item', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [
                         trigger('collapseExpand', [
@@ -434,46 +438,34 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
 class AXTreeItemClickBaseEvent extends AXClickEvent {
 }
 
+const COMPONENT = [AXTreeViewComponent, AXTreeViewItemComponent];
+const MODULES = [
+    CommonModule,
+    AXCommonModule,
+    AXDecoratorModule,
+    AXCheckBoxModule,
+    AXFormModule,
+    FormsModule,
+    AXTooltipModule,
+    AXLoadingModule,
+];
 class AXTreeViewModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTreeViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: AXTreeViewModule, imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTreeViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.5", ngImport: i0, type: AXTreeViewModule, imports: [AXTreeViewComponent, AXTreeViewItemComponent, CommonModule,
             AXCommonModule,
             AXDecoratorModule,
             AXCheckBoxModule,
             AXFormModule,
             FormsModule,
             AXTooltipModule,
-            AXLoadingModule,
-            AXTreeViewComponent,
-            AXTreeViewItemComponent], exports: [AXTreeViewComponent, AXTreeViewItemComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTreeViewModule, imports: [CommonModule,
-            AXCommonModule,
-            AXDecoratorModule,
-            AXCheckBoxModule,
-            AXFormModule,
-            FormsModule,
-            AXTooltipModule,
-            AXLoadingModule,
-            AXTreeViewComponent,
-            AXTreeViewItemComponent] }); }
+            AXLoadingModule], exports: [AXTreeViewComponent, AXTreeViewItemComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTreeViewModule, imports: [COMPONENT, MODULES] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AXTreeViewModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.5", ngImport: i0, type: AXTreeViewModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [
-                        CommonModule,
-                        AXCommonModule,
-                        AXDecoratorModule,
-                        AXCheckBoxModule,
-                        AXFormModule,
-                        FormsModule,
-                        AXTooltipModule,
-                        AXLoadingModule,
-                        AXTreeViewComponent,
-                        AXTreeViewItemComponent,
-                    ],
-                    exports: [AXTreeViewComponent, AXTreeViewItemComponent],
-                    providers: [],
+                    imports: [...COMPONENT, ...MODULES],
+                    exports: [...COMPONENT],
                 }]
         }] });