npm - @acorex/components - Versions diffs - 7.19.5 → 7.20.0 - Mend

@acorex/components 7.19.5 → 7.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (270) hide show

package/fesm2022/acorex-components-dialog.mjs CHANGED Viewed

@@ -42,15 +42,15 @@ class AXDialogComponent extends MXBaseComponent {
     get tabIndex() {
         return '-1';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDialogComponent, deps: [{ token: DIALOG_DATA }, { token: i1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.9", type: AXDialogComponent, selector: "ax-dialog", host: { properties: { "attr.tabIndex": "this.tabIndex" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDialogComponent, deps: [{ token: DIALOG_DATA }, { token: i1.DialogRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.0", type: AXDialogComponent, selector: "ax-dialog", host: { properties: { "attr.tabIndex": "this.tabIndex" } }, providers: [
             {
                 provide: AXClosbaleComponent,
                 useExisting: AXDialogComponent,
             },
         ], usesInheritance: true, ngImport: i0, template: "<div class=\"ax-dialog ax-{{ data.type }}-default ax-orientation-{{ data.orientation }}\" cdkDrag cdkDragHandle\n  tabindex=\"-1\">\n  <div class=\"ax-dialog-content-wrapper\">\n    @if(data.icon !== 'none'){\n    <div class=\"ax-dialog-icon-side\">\n      <i class=\"ax-dialog-icon {{ data.icon }}\"></i>\n    </div>\n    }\n    <div class=\"ax-dialog-content-side\">\n      <div class=\"ax-dialog-title\">{{ data.title }}</div>\n      <div class=\"ax-dialog-content\">{{ data.content }}</div>\n    </div>\n    <div class=\"ax-dialog-dismiss-icon\">\n      @if(data.closeButton){\n      <i class=\"ax-icon ax-icon-close\"></i>\n      }\n    </div>\n  </div>\n  <ax-footer>\n    @for(button of data.buttons; let i = $index; track i){\n    <ax-button [text]=\"button.text | translate | async \" [tabindex]=\"i\" [axHotkey]=\"button.hotkey\"\n      [axAutoFocus]=\"_hasAutoFocus(button)\" (onClick)=\"_handleButtonClick(button)\" [look]=\"button.look\"\n      [disabled]=\"button.disabled\" [color]=\"button.color\">\n      @if(button.loading){\n      <ax-loading></ax-loading>\n      }\n    </ax-button>\n    }\n\n  </ax-footer>\n</div>", styles: [".ax-dark .ax-dialog.ax-primary-default .ax-dialog-icon{background-color:rgba(var(--ax-color-primary-200));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dark .ax-dialog.ax-secondary-default .ax-dialog-icon{background-color:rgba(var(--ax-color-secondary-200));color:rgba(var(--ax-color-secondary-fore-tint))}.ax-dark .ax-dialog.ax-success-default .ax-dialog-icon{background-color:rgba(var(--ax-color-success-200));color:rgba(var(--ax-color-success-fore-tint))}.ax-dark .ax-dialog.ax-warning-default .ax-dialog-icon{background-color:rgba(var(--ax-color-warning-200));color:rgba(var(--ax-color-warning-fore-tint))}.ax-dark .ax-dialog.ax-danger-default .ax-dialog-icon{background-color:rgba(var(--ax-color-danger-200));color:rgba(var(--ax-color-danger-fore-tint))}.ax-dark .ax-dialog.ax-info-default .ax-dialog-icon{background-color:rgba(var(--ax-color-info-200));color:rgba(var(--ax-color-info-fore-tint))}.ax-dialog{position:relative;display:flex;width:93vw;flex-direction:column;overflow:hidden;border-radius:var(--ax-rounded-border-default);border-width:1px;background-color:rgba(var(--ax-color-surface));color:rgba(var(--ax-color-surface-fore));outline:2px solid transparent;outline-offset:2px}@media (min-width: 768px){.ax-dialog{width:75vw}}@media (min-width: 1024px){.ax-dialog{width:50vw}}@media (min-width: 1280px){.ax-dialog{width:35vw}}@media (min-width: 1536px){.ax-dialog{width:25vw}}.ax-dialog.ax-orientation-horizontal .ax-dialog-content-wrapper{flex-direction:row}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper{flex-direction:column;align-items:center}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-icon-side{margin-bottom:1rem}.ax-dialog.ax-orientation-vertical .ax-dialog-content-wrapper .ax-dialog-content-side{margin:0;text-align:center}.ax-dialog.ax-orientation-vertical ax-footer ax-button{flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper{display:flex;gap:.5rem;padding:1.5rem 1.5rem 1rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-icon-side .ax-dialog-icon{display:flex;height:3rem;width:3rem;cursor:move;align-items:center;justify-content:center;border-radius:9999px;font-size:1.5rem;line-height:2rem}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side{-webkit-margin-start:1rem;margin-inline-start:1rem;flex:1 1 0%}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-title{margin-bottom:.5rem;font-size:1.125rem;line-height:1.5rem;font-weight:500}.ax-dialog .ax-dialog-content-wrapper .ax-dialog-content-side .ax-dialog-content{font-size:.875rem;line-height:1.25rem}.ax-dialog ax-footer{justify-content:flex-end;padding:.75rem 1.5rem}.ax-dialog.ax-primary-default .ax-dialog-icon{background-color:rgba(var(--ax-color-primary-100));color:rgba(var(--ax-color-primary-fore-tint))}.ax-dialog.ax-secondary-default .ax-dialog-icon{background-color:rgba(var(--ax-color-secondary-100));color:rgba(var(--ax-color-secondary-fore-tint))}.ax-dialog.ax-success-default .ax-dialog-icon{background-color:rgba(var(--ax-color-success-100));color:rgba(var(--ax-color-success-fore-tint))}.ax-dialog.ax-warning-default .ax-dialog-icon{background-color:rgba(var(--ax-color-warning-100));color:rgba(var(--ax-color-warning-fore-tint))}.ax-dialog.ax-danger-default .ax-dialog-icon{background-color:rgba(var(--ax-color-danger-100));color:rgba(var(--ax-color-danger-fore-tint))}.ax-dialog.ax-info-default .ax-dialog-icon{background-color:rgba(var(--ax-color-info-100));color:rgba(var(--ax-color-info-fore-tint))}\n"], dependencies: [{ kind: "directive", type: i2.AXAutoFocusDirective, selector: "[axAutoFocus]", inputs: ["axAutoFocus", "axAutoFocusTime"] }, { kind: "directive", type: i2.AXHotkeyDirective, selector: "[axHotkey]", inputs: ["axHotkey"] }, { kind: "directive", type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i3.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "component", type: i5.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i6.AXLoadingComponent, selector: "ax-loading", inputs: ["visible", "type", "context"], outputs: ["visibleChange"] }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDialogComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-dialog', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
                         {
@@ -219,10 +219,10 @@ class AXDialogService {
             },
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDialogService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDialogService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDialogService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDialogService, decorators: [{
             type: Injectable
         }] });
@@ -239,8 +239,8 @@ const MODULES = [
     AXTranslationModule
 ];
 class AXDialogModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: AXDialogModule, declarations: [AXDialogComponent], imports: [CommonModule,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDialogModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: AXDialogModule, declarations: [AXDialogComponent], imports: [CommonModule,
             AXCommonModule,
             DragDropModule,
             A11yModule,
@@ -249,9 +249,9 @@ class AXDialogModule {
             AXLoadingModule,
             DialogModule,
             AXTranslationModule], exports: [AXDialogComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDialogModule, providers: [AXDialogService, AXHotkeysService], imports: [MODULES] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDialogModule, providers: [AXDialogService, AXHotkeysService], imports: [MODULES] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDialogModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDialogModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...COMPONENT],

package/fesm2022/acorex-components-drawer.mjs CHANGED Viewed

@@ -12,14 +12,14 @@ class AXDrawerContainerComponent extends MXBaseComponent {
             ? host.classList.add('ax-visible')
             : host.classList.remove('ax-visible');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDrawerContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: AXDrawerContainerComponent, selector: "ax-drawer-container", usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDrawerContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: AXDrawerContainerComponent, selector: "ax-drawer-container", usesInheritance: true, ngImport: i0, template: `
     <ng-content select="ax-drawer[location='start']"> </ng-content>
     <ng-content select="ax-content"> </ng-content>
     <ng-content select="ax-drawer[location='end']"> </ng-content>
   `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDrawerContainerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDrawerContainerComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ax-drawer-container',
@@ -139,8 +139,8 @@ class AXDrawerComponent extends MXBaseComponent {
             }
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDrawerComponent, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: AXDrawerComponent, selector: "ax-drawer", inputs: { location: "location", showBackdrop: "showBackdrop", mode: "mode", collapsed: "collapsed" }, outputs: { locationChange: "locationChange", modeChange: "modeChange", collapsedChange: "collapsedChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDrawerComponent, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: AXDrawerComponent, selector: "ax-drawer", inputs: { location: "location", showBackdrop: "showBackdrop", mode: "mode", collapsed: "collapsed" }, outputs: { locationChange: "locationChange", modeChange: "modeChange", collapsedChange: "collapsedChange" }, host: { properties: { "class": "this.__hostClass" } }, providers: [
             { provide: AXComponent, useExisting: AXDrawerComponent },
             { provide: AXClosbaleComponent, useExisting: AXDrawerComponent },
         ], usesInheritance: true, ngImport: i0, template: `
@@ -148,7 +148,7 @@ class AXDrawerComponent extends MXBaseComponent {
     <ng-content select="ax-content"></ng-content>
   `, isInline: true, styles: ["ax-drawer-container{position:relative;display:flex;height:100%;width:100%;overflow:hidden}ax-drawer-container.ax-fixed{bottom:0;inset-inline-end:0px;inset-inline-start:0px;top:0;z-index:50;display:none}ax-drawer-container.ax-fixed.ax-visible{display:flex}ax-drawer-container .ax-backdrop{position:absolute;bottom:0;top:0;z-index:10;height:100%;width:100%;background-color:rgba(0,0,0,.2);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-drawer-container ax-drawer{display:flex;height:100%;max-width:95%;flex-direction:column;background-color:rgba(var(--ax-color-surface))}ax-drawer-container ax-drawer.ax-state-loaded{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-drawer-container ax-drawer ax-header,ax-drawer-container ax-drawer ax-footer{padding:.75rem}ax-drawer-container ax-drawer ax-footer{border-top-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-drawer-container ax-drawer ax-header{border-bottom-width:1px;border-color:rgba(var(--ax-color-border-default))}ax-drawer-container ax-drawer>ax-content{flex:1 1 0%;overflow:auto}ax-drawer-container ax-drawer.ax-drawer-overlay{position:absolute}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-expanded{z-index:20}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-collapsed{z-index:0}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-start.ax-expanded{inset-inline-start:0px}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-start.ax-collapsed{inset-inline-start:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-end.ax-expanded{inset-inline-end:0px}ax-drawer-container ax-drawer.ax-drawer-overlay.ax-drawer-end.ax-collapsed{inset-inline-end:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-push{flex:0 1 auto}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start{order:-9999}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start.ax-expanded{-webkit-margin-start:0px;margin-inline-start:0px}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-start.ax-collapsed{-webkit-margin-start:calc(-1 * var(--ax-el-width));margin-inline-start:calc(-1 * var(--ax-el-width))}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end{order:9999}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end.ax-expanded{-webkit-margin-end:0px;margin-inline-end:0px}ax-drawer-container ax-drawer.ax-drawer-push.ax-drawer-end.ax-collapsed{-webkit-margin-end:calc(-1 * var(--ax-el-width));margin-inline-end:calc(-1 * var(--ax-el-width))}ax-drawer-container>ax-content{height:100%;flex:1 1 0%;overflow:auto}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDrawerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDrawerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-drawer', template: `
     <ng-content select="ax-header"></ng-content>
@@ -179,11 +179,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImpor
 const COMPONENT = [AXDrawerComponent, AXDrawerContainerComponent];
 const MODULES = [CommonModule];
 class AXDrawerModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDrawerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: AXDrawerModule, declarations: [AXDrawerComponent, AXDrawerContainerComponent], imports: [CommonModule], exports: [AXDrawerComponent, AXDrawerContainerComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDrawerModule, imports: [MODULES] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDrawerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: AXDrawerModule, declarations: [AXDrawerComponent, AXDrawerContainerComponent], imports: [CommonModule], exports: [AXDrawerComponent, AXDrawerContainerComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDrawerModule, imports: [MODULES] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDrawerModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDrawerModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...COMPONENT],

package/fesm2022/acorex-components-dropdown.mjs CHANGED Viewed

@@ -39,10 +39,10 @@ class MXDropdownBoxBaseComponent extends MXInteractiveComponent {
     get isOpen() {
         return this.dropdown?.isOpen;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: MXDropdownBoxBaseComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: MXDropdownBoxBaseComponent }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MXDropdownBoxBaseComponent, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MXDropdownBoxBaseComponent }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: MXDropdownBoxBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MXDropdownBoxBaseComponent, decorators: [{
             type: Injectable
         }] });
@@ -120,10 +120,10 @@ class AXDropdownBoxComponent extends classes(MXInteractiveComponent, MXLookCompo
     get __hostClass() {
         return `ax-editor-container ax-look-${this.look} ${this.disabled ? 'ax-state-disabled' : ''}`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDropdownBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: AXDropdownBoxComponent, selector: "ax-dropdown-box", inputs: { disabled: "disabled", look: "look" }, outputs: { disabledChange: "disabledChange", onBlur: "onBlur", onFocus: "onFocus", onClick: "onClick", onOpened: "onOpened", onClosed: "onClosed" }, host: { listeners: { "keydown": "_handleKeydown($event)" }, properties: { "class": "this.__hostClass" } }, viewQueries: [{ propertyName: "_popover", first: true, predicate: AXPopoverComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"[input]\"> </ng-content>\n<ax-popover [target]=\"_target\" [placement]=\"_placement\" [openOn]=\"'manual'\" [closeOn]=\"'clickOut'\"\n  [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\"\n  #popover>\n  <div class=\"ax-overlay-pane\" [class.ax-w-full]=\"_isMobile\" aria-modal=\"true\" (keydown)=\"_handleKeydown($event)\"\n    [class.ax-overlay-actionsheet]=\"popover.isActionsheetStyle\">\n    <ng-content select=\"[panel]\"> </ng-content>\n  </div>\n</ax-popover>", dependencies: [{ kind: "component", type: i1.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDropdownBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: AXDropdownBoxComponent, selector: "ax-dropdown-box", inputs: { disabled: "disabled", look: "look" }, outputs: { disabledChange: "disabledChange", onBlur: "onBlur", onFocus: "onFocus", onClick: "onClick", onOpened: "onOpened", onClosed: "onClosed" }, host: { listeners: { "keydown": "_handleKeydown($event)" }, properties: { "class": "this.__hostClass" } }, viewQueries: [{ propertyName: "_popover", first: true, predicate: AXPopoverComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"[input]\"> </ng-content>\n<ax-popover [target]=\"_target\" [placement]=\"_placement\" [openOn]=\"'manual'\" [closeOn]=\"'clickOut'\"\n  [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\"\n  #popover>\n  <div class=\"ax-overlay-pane\" [class.ax-w-full]=\"_isMobile\" aria-modal=\"true\" (keydown)=\"_handleKeydown($event)\"\n    [class.ax-overlay-actionsheet]=\"popover.isActionsheetStyle\">\n    <ng-content select=\"[panel]\"> </ng-content>\n  </div>\n</ax-popover>", dependencies: [{ kind: "component", type: i1.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDropdownBoxComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDropdownBoxComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-dropdown-box', inputs: ['disabled', 'look'], outputs: ['disabledChange', 'onBlur', 'onFocus', 'onClick'], template: "<ng-content select=\"[input]\"> </ng-content>\n<ax-popover [target]=\"_target\" [placement]=\"_placement\" [openOn]=\"'manual'\" [closeOn]=\"'clickOut'\"\n  [adaptivityEnabled]=\"true\" (onOpened)=\"_handlePopupOnOpened($event)\" (onClosed)=\"_handlePopupOnClosed($event)\"\n  #popover>\n  <div class=\"ax-overlay-pane\" [class.ax-w-full]=\"_isMobile\" aria-modal=\"true\" (keydown)=\"_handleKeydown($event)\"\n    [class.ax-overlay-actionsheet]=\"popover.isActionsheetStyle\">\n    <ng-content select=\"[panel]\"> </ng-content>\n  </div>\n</ax-popover>" }]
         }], propDecorators: { _popover: [{
@@ -236,15 +236,15 @@ class AXDropdownPanelComponent extends MXInteractiveComponent {
     get __hostClass() {
         return ['ax-dropdown-panel'];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDropdownPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: { isOpen: "isOpen", fitParent: "fitParent", dropdownWidth: "dropdownWidth", position: "position", adaptivityEnabled: "adaptivityEnabled" }, outputs: { onOpened: "onOpened", onClosed: "onClosed" }, host: { properties: { "class": "this.__hostClass" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDropdownPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: AXDropdownPanelComponent, selector: "ax-dropdown-panel", inputs: { isOpen: "isOpen", fitParent: "fitParent", dropdownWidth: "dropdownWidth", position: "position", adaptivityEnabled: "adaptivityEnabled" }, outputs: { onOpened: "onOpened", onClosed: "onClosed" }, host: { properties: { "class": "this.__hostClass" } }, providers: [
             {
                 provide: AXClosbaleComponent,
                 useExisting: AXDropdownPanelComponent,
             },
         ], viewQueries: [{ propertyName: "_popover", first: true, predicate: AXPopoverComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ax-popover\n  [target]=\"_target\"\n  [placement]=\"_placement\"\n  [openOn]=\"'toggle'\"\n  [closeOn]=\"'clickOut'\"\n  [adaptivityEnabled]=\"adaptivityEnabled\"\n  (onOpened)=\"_handlePopupOnOpened($event)\"\n  (onClosed)=\"_handlePopupOnClosed($event)\"\n>\n  <div class=\"ax-overlay-pane\">\n    <ng-content> </ng-content>\n  </div>\n</ax-popover>\n", styles: [".ax-actionsheet-base .ax-overlay-pane{width:100%;border-radius:0}\n"], dependencies: [{ kind: "component", type: i1.AXPopoverComponent, selector: "ax-popover", inputs: ["offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "backdropClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDropdownPanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDropdownPanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-dropdown-panel', inputs: ['isOpen', 'fitParent', 'dropdownWidth', 'position'], outputs: ['onOpened', 'onClosed'], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
                         {
@@ -267,11 +267,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImpor
             }] } });
 class AXDropdownModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: AXDropdownModule, declarations: [AXDropdownPanelComponent, AXDropdownBoxComponent], imports: [CommonModule, AXCommonModule, A11yModule, OverlayModule, AXDecoratorModule, AXPopoverModule], exports: [AXDropdownPanelComponent, AXDropdownBoxComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDropdownModule, imports: [CommonModule, AXCommonModule, A11yModule, OverlayModule, AXDecoratorModule, AXPopoverModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: AXDropdownModule, declarations: [AXDropdownPanelComponent, AXDropdownBoxComponent], imports: [CommonModule, AXCommonModule, A11yModule, OverlayModule, AXDecoratorModule, AXPopoverModule], exports: [AXDropdownPanelComponent, AXDropdownBoxComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDropdownModule, imports: [CommonModule, AXCommonModule, A11yModule, OverlayModule, AXDecoratorModule, AXPopoverModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXDropdownModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXDropdownModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, AXCommonModule, A11yModule, OverlayModule, AXDecoratorModule, AXPopoverModule],

package/fesm2022/acorex-components-form.mjs CHANGED Viewed

@@ -38,10 +38,10 @@ class AXFormFieldComponent extends MXBaseComponent {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: AXFormFieldComponent, selector: "ax-form-field", providers: [AXUnsubscriber], queries: [{ propertyName: "input", first: true, predicate: AXValuableComponent, descendants: true }, { propertyName: "label", first: true, predicate: AXLabelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".ax-dark ax-form.ax-form-normal .ax-error-message{border-color:rgba(var(--ax-color-danger-500));background-color:rgba(var(--ax-color-danger-200));color:rgba(var(--ax-color-danger-fore-tint))}.ax-dark ax-form.ax-form-normal .ax-error-message:before,.ax-dark ax-form.ax-form-normal .ax-error-message:after{border-bottom-color:rgba(var(--ax-color-danger-500))}.ax-dark ax-form.ax-form-normal .ax-error-message:before{border-bottom-color:rgba(var(--ax-color-danger-500))}.ax-dark ax-form form.ax-float-error .ax-error-message{border-color:rgba(var(--ax-color-danger-700));background-color:rgba(var(--ax-color-danger-700));color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-form form.ax-float-error .ax-error-message:before,.ax-dark ax-form form.ax-float-error .ax-error-message:after{border-bottom-color:rgba(var(--ax-color-danger-700))}.ax-dark ax-form form.ax-float-error .ax-error-message:before{border-bottom-color:rgba(var(--ax-color-danger-700))}ax-form-field{position:relative;display:block;width:100%}ax-form-field .ax-error-message{margin-top:.25rem;margin-bottom:.25rem;display:block;font-size:.75rem;line-height:1rem}ax-form{width:100%}ax-form form.ax-bottom-error .ax-error-message{color:rgba(var(--ax-color-danger-500))}ax-form form.ax-float-error .ax-error-message{position:absolute;bottom:-2.5rem;z-index:10;display:block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border-radius:.375rem;border-width:1px;border-color:rgba(var(--ax-color-danger-500));background-color:rgba(var(--ax-color-danger-500));padding:.25rem .5rem;font-weight:400;color:rgba(var(--ax-color-danger-fore))}ax-form form.ax-float-error .ax-error-message:before,ax-form form.ax-float-error .ax-error-message:after{pointer-events:none;position:absolute;bottom:100%;inset-inline-start:.75rem;z-index:20;height:0px;width:0px;border-bottom-color:rgba(var(--ax-color-danger-500));border-inline-end-color:transparent;border-inline-start-color:transparent;border-top-color:transparent;content:\"\"}ax-form form.ax-float-error .ax-error-message:before{-webkit-margin-start:-1px;margin-inline-start:-1px;border-width:4px;border-bottom-color:rgba(var(--ax-color-danger-500))}ax-form form.ax-float-error .ax-error-message:after{border-width:4px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXFormFieldComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: AXFormFieldComponent, selector: "ax-form-field", providers: [AXUnsubscriber], queries: [{ propertyName: "input", first: true, predicate: AXValuableComponent, descendants: true }, { propertyName: "label", first: true, predicate: AXLabelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".ax-dark ax-form.ax-form-normal .ax-error-message{border-color:rgba(var(--ax-color-danger-500));background-color:rgba(var(--ax-color-danger-200));color:rgba(var(--ax-color-danger-fore-tint))}.ax-dark ax-form.ax-form-normal .ax-error-message:before,.ax-dark ax-form.ax-form-normal .ax-error-message:after{border-bottom-color:rgba(var(--ax-color-danger-500))}.ax-dark ax-form.ax-form-normal .ax-error-message:before{border-bottom-color:rgba(var(--ax-color-danger-500))}.ax-dark ax-form form.ax-float-error .ax-error-message{border-color:rgba(var(--ax-color-danger-700));background-color:rgba(var(--ax-color-danger-700));color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-form form.ax-float-error .ax-error-message:before,.ax-dark ax-form form.ax-float-error .ax-error-message:after{border-bottom-color:rgba(var(--ax-color-danger-700))}.ax-dark ax-form form.ax-float-error .ax-error-message:before{border-bottom-color:rgba(var(--ax-color-danger-700))}ax-form-field{position:relative;display:block;width:100%}ax-form-field .ax-error-message{margin-top:.25rem;margin-bottom:.25rem;display:block;font-size:.75rem;line-height:1rem}ax-form{width:100%}ax-form form.ax-bottom-error .ax-error-message{color:rgba(var(--ax-color-danger-500))}ax-form form.ax-float-error .ax-error-message{position:absolute;bottom:-2.5rem;z-index:10;display:block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border-radius:.375rem;border-width:1px;border-color:rgba(var(--ax-color-danger-500));background-color:rgba(var(--ax-color-danger-500));padding:.25rem .5rem;font-weight:400;color:rgba(var(--ax-color-danger-fore))}ax-form form.ax-float-error .ax-error-message:before,ax-form form.ax-float-error .ax-error-message:after{pointer-events:none;position:absolute;bottom:100%;inset-inline-start:.75rem;z-index:20;height:0px;width:0px;border-bottom-color:rgba(var(--ax-color-danger-500));border-inline-end-color:transparent;border-inline-start-color:transparent;border-top-color:transparent;content:\"\"}ax-form form.ax-float-error .ax-error-message:before{-webkit-margin-start:-1px;margin-inline-start:-1px;border-width:4px;border-bottom-color:rgba(var(--ax-color-danger-500))}ax-form form.ax-float-error .ax-error-message:after{border-width:4px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXFormFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXFormFieldComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-form-field', template: `<ng-content></ng-content>`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [AXUnsubscriber], styles: [".ax-dark ax-form.ax-form-normal .ax-error-message{border-color:rgba(var(--ax-color-danger-500));background-color:rgba(var(--ax-color-danger-200));color:rgba(var(--ax-color-danger-fore-tint))}.ax-dark ax-form.ax-form-normal .ax-error-message:before,.ax-dark ax-form.ax-form-normal .ax-error-message:after{border-bottom-color:rgba(var(--ax-color-danger-500))}.ax-dark ax-form.ax-form-normal .ax-error-message:before{border-bottom-color:rgba(var(--ax-color-danger-500))}.ax-dark ax-form form.ax-float-error .ax-error-message{border-color:rgba(var(--ax-color-danger-700));background-color:rgba(var(--ax-color-danger-700));color:rgba(var(--ax-color-danger-fore))}.ax-dark ax-form form.ax-float-error .ax-error-message:before,.ax-dark ax-form form.ax-float-error .ax-error-message:after{border-bottom-color:rgba(var(--ax-color-danger-700))}.ax-dark ax-form form.ax-float-error .ax-error-message:before{border-bottom-color:rgba(var(--ax-color-danger-700))}ax-form-field{position:relative;display:block;width:100%}ax-form-field .ax-error-message{margin-top:.25rem;margin-bottom:.25rem;display:block;font-size:.75rem;line-height:1rem}ax-form{width:100%}ax-form form.ax-bottom-error .ax-error-message{color:rgba(var(--ax-color-danger-500))}ax-form form.ax-float-error .ax-error-message{position:absolute;bottom:-2.5rem;z-index:10;display:block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border-radius:.375rem;border-width:1px;border-color:rgba(var(--ax-color-danger-500));background-color:rgba(var(--ax-color-danger-500));padding:.25rem .5rem;font-weight:400;color:rgba(var(--ax-color-danger-fore))}ax-form form.ax-float-error .ax-error-message:before,ax-form form.ax-float-error .ax-error-message:after{pointer-events:none;position:absolute;bottom:100%;inset-inline-start:.75rem;z-index:20;height:0px;width:0px;border-bottom-color:rgba(var(--ax-color-danger-500));border-inline-end-color:transparent;border-inline-start-color:transparent;border-top-color:transparent;content:\"\"}ax-form form.ax-float-error .ax-error-message:before{-webkit-margin-start:-1px;margin-inline-start:-1px;border-width:4px;border-bottom-color:rgba(var(--ax-color-danger-500))}ax-form form.ax-float-error .ax-error-message:after{border-width:4px}\n"] }]
         }], propDecorators: { input: [{
@@ -148,8 +148,8 @@ class AXFormComponent extends MXBaseComponent {
     ngOnDestroy() {
         this._clearSubs();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: AXFormComponent, selector: "ax-form", inputs: { messageStyle: "messageStyle", updateOn: "updateOn" }, outputs: { onValidate: "onValidate", updateOnChange: "updateOnChange" }, usesInheritance: true, ngImport: i0, template: `<form
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: AXFormComponent, selector: "ax-form", inputs: { messageStyle: "messageStyle", updateOn: "updateOn" }, outputs: { onValidate: "onValidate", updateOnChange: "updateOnChange" }, usesInheritance: true, ngImport: i0, template: `<form
     (submit)="_handleSubmit($event)"
     (reset)="_handleReset()"
     class="ax-{{ messageStyle }}-error"
@@ -157,7 +157,7 @@ class AXFormComponent extends MXBaseComponent {
     <ng-content></ng-content>
   </form>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXFormComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXFormComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ax-form',
@@ -246,8 +246,8 @@ class AXValidationSummaryComponent extends MXBaseComponent {
     ngOnDestroy() {
         this.sub?.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXValidationSummaryComponent, deps: [{ token: i1.AXToastService }, { token: AXFormComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.9", type: AXValidationSummaryComponent, selector: "ax-validation-summary", inputs: { title: "title", displayMode: "displayMode", timeOut: "timeOut", autoHide: "autoHide" }, usesInheritance: true, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXValidationSummaryComponent, deps: [{ token: i1.AXToastService }, { token: AXFormComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.0", type: AXValidationSummaryComponent, selector: "ax-validation-summary", inputs: { title: "title", displayMode: "displayMode", timeOut: "timeOut", autoHide: "autoHide" }, usesInheritance: true, ngImport: i0, template: `
     @if (displayMode === 'alert' && _content) {
       <ax-alert color="danger" [timeOut]="_timeOut" #a (onClosed)="_handleOnDismissed()">
         <ax-icon></ax-icon>
@@ -264,7 +264,7 @@ class AXValidationSummaryComponent extends MXBaseComponent {
     }
   `, isInline: true, dependencies: [{ kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorGenericComponent, selector: "ax-footer, ax-header, ax-content, ax-divider, ax-form-hint, ax-prefix, ax-suffix, ax-text, ax-title , ax-sub-title, ax-placeholder, ax-overlay" }, { kind: "component", type: i3.AXAlertComponent, selector: "ax-alert", inputs: ["color", "timeOut", "visible"], outputs: ["colorChange", "onClosed"] }, { kind: "component", type: i4.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "type"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXValidationSummaryComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXValidationSummaryComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'ax-validation-summary',
@@ -315,10 +315,10 @@ class AXValidationRuleDirective {
     get ruleOptions() {
         return Object.assign({ message: this.message, name: this.host.name }, this.options);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXValidationRuleDirective, deps: [{ token: i1$1.AXValuableComponent }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.9", type: AXValidationRuleDirective, selector: "ax-validation-rule", inputs: { rule: "rule", options: "options", message: "message" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXValidationRuleDirective, deps: [{ token: i1$1.AXValuableComponent }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: AXValidationRuleDirective, selector: "ax-validation-rule", inputs: { rule: "rule", options: "options", message: "message" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXValidationRuleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXValidationRuleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ax-validation-rule'
@@ -332,14 +332,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImpor
             }] } });
 class AXFormModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: AXFormModule, declarations: [AXFormFieldComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: AXFormModule, declarations: [AXFormFieldComponent,
             AXFormComponent,
             AXValidationRuleDirective,
             AXValidationSummaryComponent], imports: [CommonModule, AXDecoratorModule, AXAlertModule, AXButtonModule, AXValidationModule, AXTranslationModule], exports: [AXFormFieldComponent, AXFormComponent, AXValidationRuleDirective, AXValidationSummaryComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXFormModule, imports: [CommonModule, AXDecoratorModule, AXAlertModule, AXButtonModule, AXValidationModule, AXTranslationModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXFormModule, imports: [CommonModule, AXDecoratorModule, AXAlertModule, AXButtonModule, AXValidationModule, AXTranslationModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXFormModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXFormModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [

package/fesm2022/acorex-components-image.mjs CHANGED Viewed

@@ -47,10 +47,10 @@ class AXImageComponent extends MXBaseComponent {
             `${this._isLoading ? 'ax-state-loading' : ''}`,
         ];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXImageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.9", type: AXImageComponent, selector: "ax-image", inputs: { overlayMode: "overlayMode", src: "src", alt: "alt", priority: "priority", lazy: "lazy" }, outputs: { onLoad: "onLoad", onError: "onError" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], usesInheritance: true, ngImport: i0, template: "@if(src){\n<img class=\"ax-state-hidden\" [class.ax-state-loaded]=\"_isLoaded\" [src]=\"src\" [alt]=\"alt\" [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\" (load)=\"_handleLoadImage($event)\" (error)=\"_handleErrorImage($event)\" />\n}\n<ng-content select=\"ax-overlay\"></ng-content>\n@if(!src || _hasError){\n<ng-content select=\"ax-placeholder, ng-content\"></ng-content>\n}\n@if(_isLoading){\n<ng-content select=\"ax-loading, ax-loading-spinner\"></ng-content>\n}", styles: ["ax-image{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image img{display:block;height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image.ax-overlay-hover ax-overlay{display:none}ax-image.ax-overlay-hover:hover ax-overlay{display:flex}ax-image.ax-overlay-always ax-overlay{display:flex}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:rgba(0,0,0,.75)}ax-image ax-loading{display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:rgba(var(--ax-color-surface))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXImageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.0", type: AXImageComponent, selector: "ax-image", inputs: { overlayMode: "overlayMode", src: "src", alt: "alt", priority: "priority", lazy: "lazy" }, outputs: { onLoad: "onLoad", onError: "onError" }, host: { properties: { "class": "this.__hostClass" } }, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], usesInheritance: true, ngImport: i0, template: "@if(src){\n<img class=\"ax-state-hidden\" [class.ax-state-loaded]=\"_isLoaded\" [src]=\"src\" [alt]=\"alt\" [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\" (load)=\"_handleLoadImage($event)\" (error)=\"_handleErrorImage($event)\" />\n}\n<ng-content select=\"ax-overlay\"></ng-content>\n@if(!src || _hasError){\n<ng-content select=\"ax-placeholder, ng-content\"></ng-content>\n}\n@if(_isLoading){\n<ng-content select=\"ax-loading, ax-loading-spinner\"></ng-content>\n}", styles: ["ax-image{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image img{display:block;height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image.ax-overlay-hover ax-overlay{display:none}ax-image.ax-overlay-hover:hover ax-overlay{display:flex}ax-image.ax-overlay-always ax-overlay{display:flex}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:rgba(0,0,0,.75)}ax-image ax-loading{display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:rgba(var(--ax-color-surface))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXImageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXImageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-image', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: 'ax-image', useValue: AXImageComponent }], template: "@if(src){\n<img class=\"ax-state-hidden\" [class.ax-state-loaded]=\"_isLoaded\" [src]=\"src\" [alt]=\"alt\" [attr.fetchpriority]=\"priority\"\n  [attr.loading]=\"lazy ? 'lazy' : 'eager'\" (load)=\"_handleLoadImage($event)\" (error)=\"_handleErrorImage($event)\" />\n}\n<ng-content select=\"ax-overlay\"></ng-content>\n@if(!src || _hasError){\n<ng-content select=\"ax-placeholder, ng-content\"></ng-content>\n}\n@if(_isLoading){\n<ng-content select=\"ax-loading, ax-loading-spinner\"></ng-content>\n}", styles: ["ax-image{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}ax-image img{display:block;height:100%;width:100%}ax-image img.ax-state-hidden{display:none}ax-image img.ax-state-loaded{display:block!important}ax-image.ax-overlay-hover ax-overlay{display:none}ax-image.ax-overlay-hover:hover ax-overlay{display:flex}ax-image.ax-overlay-always ax-overlay{display:flex}ax-image ax-overlay{position:absolute;top:0;display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:rgba(0,0,0,.75)}ax-image ax-loading{display:flex;height:100%;width:100%;align-items:center;justify-content:center;background-color:rgba(var(--ax-color-surface))}\n"] }]
         }], propDecorators: { overlayMode: [{
@@ -73,11 +73,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImpor
             }] } });
 class AXImageModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXImageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: AXImageModule, declarations: [AXImageComponent], imports: [CommonModule], exports: [AXImageComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXImageModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXImageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: AXImageModule, declarations: [AXImageComponent], imports: [CommonModule], exports: [AXImageComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXImageModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXImageModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXImageModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [AXImageComponent],

package/fesm2022/acorex-components-label.mjs CHANGED Viewed

@@ -33,10 +33,10 @@ class AXLabelComponent extends MXBaseComponent {
             },
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXLabelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.9", type: AXLabelComponent, selector: "ax-label", inputs: { required: "required", for: "for" }, outputs: { requiredChange: "requiredChange" }, providers: [{ provide: MXBaseComponent, useExisting: AXLabelComponent }], usesInheritance: true, ngImport: i0, template: "<label (click)=\"for?.focus()\" [class.ax-cursor-pointer]=\"for\" [attr.for]=\"for?.getHostElement().id\">\n  <ng-content></ng-content>\n  @if(required || for?.isRequired){\n  <span class=\"ax-state-required\">&nbsp;*</span>\n  }\n</label>", styles: ["ax-label{color:rgb(var(--ax-color-text-default))}ax-label label{margin-bottom:.5rem;display:block;cursor:inherit;font-size:.875rem;line-height:1.25rem;font-weight:500}ax-label label .ax-state-required{color:rgba(var(--ax-color-danger-500))}ax-label.ax-state-error{color:rgba(var(--ax-color-danger-500))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXLabelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.0", type: AXLabelComponent, selector: "ax-label", inputs: { required: "required", for: "for" }, outputs: { requiredChange: "requiredChange" }, providers: [{ provide: MXBaseComponent, useExisting: AXLabelComponent }], usesInheritance: true, ngImport: i0, template: "<label (click)=\"for?.focus()\" [class.ax-cursor-pointer]=\"for\" [attr.for]=\"for?.getHostElement().id\">\n  <ng-content></ng-content>\n  @if(required || for?.isRequired){\n  <span class=\"ax-state-required\">&nbsp;*</span>\n  }\n</label>", styles: ["ax-label{color:rgb(var(--ax-color-text-default))}ax-label label{margin-bottom:.5rem;display:block;cursor:inherit;font-size:.875rem;line-height:1.25rem;font-weight:500}ax-label label .ax-state-required{color:rgba(var(--ax-color-danger-500))}ax-label.ax-state-error{color:rgba(var(--ax-color-danger-500))}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXLabelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXLabelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-label', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: MXBaseComponent, useExisting: AXLabelComponent }], template: "<label (click)=\"for?.focus()\" [class.ax-cursor-pointer]=\"for\" [attr.for]=\"for?.getHostElement().id\">\n  <ng-content></ng-content>\n  @if(required || for?.isRequired){\n  <span class=\"ax-state-required\">&nbsp;*</span>\n  }\n</label>", styles: ["ax-label{color:rgb(var(--ax-color-text-default))}ax-label label{margin-bottom:.5rem;display:block;cursor:inherit;font-size:.875rem;line-height:1.25rem;font-weight:500}ax-label label .ax-state-required{color:rgba(var(--ax-color-danger-500))}ax-label.ax-state-error{color:rgba(var(--ax-color-danger-500))}\n"] }]
         }], propDecorators: { requiredChange: [{
@@ -50,11 +50,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImpor
 const COMPONENT = [AXLabelComponent];
 const MODULES = [CommonModule];
 class AXLabelModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: AXLabelModule, declarations: [AXLabelComponent], imports: [CommonModule], exports: [AXLabelComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXLabelModule, imports: [MODULES] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: AXLabelModule, declarations: [AXLabelComponent], imports: [CommonModule], exports: [AXLabelComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXLabelModule, imports: [MODULES] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXLabelModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXLabelModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...COMPONENT],

package/fesm2022/acorex-components-list.mjs CHANGED Viewed

@@ -2,7 +2,7 @@ import { MXSelectionValueComponent, convertArrayToDataSource, AXListDataSource,
 import * as i2 from '@angular/cdk/scrolling';
 import { CdkVirtualScrollViewport, ScrollingModule } from '@angular/cdk/scrolling';
 import * as i0 from '@angular/core';
-import { EventEmitter, forwardRef, Optional, SkipSelf, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, Output, ViewChild, HostListener, HostBinding, NgModule } from '@angular/core';
+import { signal, EventEmitter, forwardRef, Optional, SkipSelf, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, Output, ViewChild, HostListener, HostBinding, NgModule } from '@angular/core';
 import { NG_VALUE_ACCESSOR } from '@angular/forms';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
@@ -13,7 +13,7 @@ class AXListComponent extends MXSelectionValueComponent {
     constructor() {
         super(...arguments);
         this.dataSource = convertArrayToDataSource([]);
-        this.itemHeight = 40;
+        this.itemHeightSignal = signal(40);
         this.onScrolledIndexChanged = new EventEmitter();
         this.checkbox = true;
         this.isLoading = true;
@@ -21,6 +21,9 @@ class AXListComponent extends MXSelectionValueComponent {
         this.lastIndex = 0;
         this.postponeFocus = false;
     }
+    set itemHeight(v) {
+        this.itemHeightSignal.set(v);
+    }
     trackByIdx(i) {
         return i;
     }
@@ -120,8 +123,8 @@ class AXListComponent extends MXSelectionValueComponent {
             this.postponeFocus = true;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.9", type: AXListComponent, selector: "ax-list", inputs: { id: "id", name: "name", disabled: "disabled", readonly: "readonly", valueField: "valueField", textField: "textField", disabledField: "disabledField", multiple: "multiple", selectionMode: "selectionMode", dataSource: "dataSource", itemHeight: "itemHeight", itemTemplate: "itemTemplate", emptyTemplate: "emptyTemplate", loadingTemplate: "loadingTemplate", checkbox: "checkbox" }, outputs: { onValueChanged: "onValueChanged", disabledChange: "disabledChange", readOnlyChange: "readOnlyChange", onBlur: "onBlur", onFocus: "onFocus", onScrolledIndexChanged: "onScrolledIndexChanged" }, host: { listeners: { "keydown": "_handleKeydown($event)" }, properties: { "class": "this.__hostClass" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: AXListComponent, selector: "ax-list", inputs: { id: "id", name: "name", disabled: "disabled", readonly: "readonly", valueField: "valueField", textField: "textField", disabledField: "disabledField", multiple: "multiple", selectionMode: "selectionMode", dataSource: "dataSource", itemHeight: "itemHeight", itemTemplate: "itemTemplate", emptyTemplate: "emptyTemplate", loadingTemplate: "loadingTemplate", checkbox: "checkbox" }, outputs: { onValueChanged: "onValueChanged", disabledChange: "disabledChange", readOnlyChange: "readOnlyChange", onBlur: "onBlur", onFocus: "onFocus", onScrolledIndexChanged: "onScrolledIndexChanged" }, host: { listeners: { "keydown": "_handleKeydown($event)" }, properties: { "class": "this.__hostClass" } }, providers: [
             { provide: AXComponent, useExisting: AXListComponent },
             { provide: AXFocusableComponent, useExisting: AXListComponent },
             { provide: AXValuableComponent, useExisting: AXListComponent },
@@ -135,11 +138,11 @@ class AXListComponent extends MXSelectionValueComponent {
                 useFactory: (existingService) => {
                     return existingService || new MXSelectionBridgeService();
                 },
-                deps: [[new Optional(), new SkipSelf(), AX_SELECTION_DATA_TOKEN]]
-            }
-        ], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"list-container\" cdkVirtualScrollingElement>\n    <ng-content select=\"ax-header\"></ng-content>\n    <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" [style.--item-height]=\"itemHeight+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <ul>\n            <!--  Item Template  -->\n            <ng-container *cdkVirtualFor=\"let item of listDataSource;let i = index; trackBy: trackByIdx\">\n                <ng-container *ngIf=\"item;else loadingTpl\">\n                    <li [class.ax-state-selected]=\"isItemSelected(item)\" class=\"list-item\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"getValue(item)\">\n                        <!--  Custom Item Template  -->\n                        <ng-container *ngIf=\"itemTemplate;else defaultItemTpl\">\n                            <ng-container *ngTemplateOutlet=\"itemTemplate;context: { $implicit: { data:item } }\">\n                            </ng-container>\n                        </ng-container>\n                        <!--  Default Item Template  -->\n                        <ng-template #defaultItemTpl>\n                            <ng-container *ngIf=\"item;else loadingTpl\">\n                                <div class=\"ax-label-container\">\n                                    <input class=\"ax-checkbox\" *ngIf=\"multiple && checkbox\" type=\"checkbox\"\n                                        [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\"\n                                        tabindex=\"0\" />\n                                    <span\n                                        [class.ax-checkbox-label]=\"multiple && checkbox\">{{getDisplayText(item)}}</span>\n                                </div>\n                                <i class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item) \"></i>\n                            </ng-container>\n                        </ng-template>\n                    </li>\n                </ng-container>\n            </ng-container>\n        </ul>\n    </cdk-virtual-scroll-viewport>\n    <ng-content select=\"ax-footer\"></ng-content>\n</div>\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n    <!--  Custom Loading Template  -->\n    <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n        <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n        </ng-container>\n    </ng-container>\n    <!--  Default Loading Template  -->\n    <ng-template #defaultLoadingTpl>\n        <li>{{'loading' | translate | async }}</li>\n    </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-container *ngIf=\"emptyTemplate && hasItems===false && isLoading===false\">\n    <div class=\"empty-container\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    </div>\n</ng-container>", styles: ["ax-list{display:block;height:100%;width:100%;font-size:.875rem;line-height:1.25rem}ax-list .list-container{display:flex;height:100%;flex-direction:column}ax-list .empty-container{display:flex;height:var(--ax-size-default);width:100%;align-items:center;justify-content:center;padding-left:.75rem;padding-right:.75rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li{position:relative;display:flex;height:var(--ax-size-default);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;justify-content:space-between;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-padding-start:.75rem;padding-inline-start:.75rem;font-size:.875rem;line-height:1.25rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-within,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:2px;outline-offset:-4px;outline-color:rgba(var(--ax-color-primary-500),1)}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;align-items:center}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{-webkit-margin-start:.5rem;margin-inline-start:.5rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-selected-icon{line-height:2rem;color:rgba(var(--ax-color-primary-500))}ax-list.ax-default .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:.5}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: i2.CdkVirtualScrollableElement, selector: "[cdkVirtualScrollingElement]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+                deps: [[new Optional(), new SkipSelf(), AX_SELECTION_DATA_TOKEN]],
+            },
+        ], viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"list-container\" cdkVirtualScrollingElement>\n    <ng-content select=\"ax-header\"></ng-content>\n    <cdk-virtual-scroll-viewport [itemSize]=\"itemHeightSignal()\" [style.--item-height]=\"itemHeightSignal()+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <ul>\n            <!--  Item Template  -->\n            <ng-container *cdkVirtualFor=\"let item of listDataSource;let i = index; trackBy: trackByIdx\">\n                <ng-container *ngIf=\"item;else loadingTpl\">\n                    <li\n                        [class.ax-state-selected]=\"isItemSelected(item)\" class=\"list-item\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"getValue(item)\">\n                        <!--  Custom Item Template  -->\n                        <ng-container *ngIf=\"itemTemplate;else defaultItemTpl\">\n                            <ng-container *ngTemplateOutlet=\"itemTemplate;context: { $implicit: { data:item } }\">\n                            </ng-container>\n                        </ng-container>\n                        <!--  Default Item Template  -->\n                        <ng-template #defaultItemTpl>\n                            <ng-container *ngIf=\"item;else loadingTpl\">\n                                <div class=\"ax-label-container\">\n                                    <input class=\"ax-checkbox\" *ngIf=\"multiple && checkbox\" type=\"checkbox\"\n                                        [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\"\n                                        tabindex=\"0\" />\n                                    <span\n                                        [class.ax-checkbox-label]=\"multiple && checkbox\">{{getDisplayText(item)}}</span>\n                                </div>\n                                <i class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item) \"></i>\n                            </ng-container>\n                        </ng-template>\n                    </li>\n                </ng-container>\n            </ng-container>\n        </ul>\n    </cdk-virtual-scroll-viewport>\n    <ng-content select=\"ax-footer\"></ng-content>\n</div>\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n    <!--  Custom Loading Template  -->\n    <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n        <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n        </ng-container>\n    </ng-container>\n    <!--  Default Loading Template  -->\n    <ng-template #defaultLoadingTpl>\n        <li>{{'loading' | translate | async }}</li>\n    </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-container *ngIf=\"emptyTemplate && hasItems===false && isLoading===false\">\n    <div class=\"empty-container\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    </div>\n</ng-container>", styles: ["ax-list{display:block;height:100%;width:100%;font-size:.875rem;line-height:1.25rem}ax-list .list-container{display:flex;height:100%;flex-direction:column}ax-list .empty-container{display:flex;height:var(--ax-size-default);width:100%;align-items:center;justify-content:center;padding-left:.75rem;padding-right:.75rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li{position:relative;display:flex;height:var(--ax-size-default);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;justify-content:space-between;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-padding-start:.75rem;padding-inline-start:.75rem;font-size:.875rem;line-height:1.25rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-within,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:2px;outline-offset:-4px;outline-color:rgba(var(--ax-color-primary-500),1)}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;align-items:center}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{-webkit-margin-start:.5rem;margin-inline-start:.5rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-selected-icon{line-height:2rem;color:rgba(var(--ax-color-primary-500))}ax-list.ax-default .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:.5}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: i2.CdkVirtualScrollableElement, selector: "[cdkVirtualScrollingElement]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ax-list', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, inputs: [
                         'id',
@@ -165,9 +168,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImpor
                             useFactory: (existingService) => {
                                 return existingService || new MXSelectionBridgeService();
                             },
-                            deps: [[new Optional(), new SkipSelf(), AX_SELECTION_DATA_TOKEN]]
-                        }
-                    ], template: "<div class=\"list-container\" cdkVirtualScrollingElement>\n    <ng-content select=\"ax-header\"></ng-content>\n    <cdk-virtual-scroll-viewport [itemSize]=\"itemHeight\" [style.--item-height]=\"itemHeight+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <ul>\n            <!--  Item Template  -->\n            <ng-container *cdkVirtualFor=\"let item of listDataSource;let i = index; trackBy: trackByIdx\">\n                <ng-container *ngIf=\"item;else loadingTpl\">\n                    <li [class.ax-state-selected]=\"isItemSelected(item)\" class=\"list-item\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"getValue(item)\">\n                        <!--  Custom Item Template  -->\n                        <ng-container *ngIf=\"itemTemplate;else defaultItemTpl\">\n                            <ng-container *ngTemplateOutlet=\"itemTemplate;context: { $implicit: { data:item } }\">\n                            </ng-container>\n                        </ng-container>\n                        <!--  Default Item Template  -->\n                        <ng-template #defaultItemTpl>\n                            <ng-container *ngIf=\"item;else loadingTpl\">\n                                <div class=\"ax-label-container\">\n                                    <input class=\"ax-checkbox\" *ngIf=\"multiple && checkbox\" type=\"checkbox\"\n                                        [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\"\n                                        tabindex=\"0\" />\n                                    <span\n                                        [class.ax-checkbox-label]=\"multiple && checkbox\">{{getDisplayText(item)}}</span>\n                                </div>\n                                <i class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item) \"></i>\n                            </ng-container>\n                        </ng-template>\n                    </li>\n                </ng-container>\n            </ng-container>\n        </ul>\n    </cdk-virtual-scroll-viewport>\n    <ng-content select=\"ax-footer\"></ng-content>\n</div>\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n    <!--  Custom Loading Template  -->\n    <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n        <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n        </ng-container>\n    </ng-container>\n    <!--  Default Loading Template  -->\n    <ng-template #defaultLoadingTpl>\n        <li>{{'loading' | translate | async }}</li>\n    </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-container *ngIf=\"emptyTemplate && hasItems===false && isLoading===false\">\n    <div class=\"empty-container\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    </div>\n</ng-container>", styles: ["ax-list{display:block;height:100%;width:100%;font-size:.875rem;line-height:1.25rem}ax-list .list-container{display:flex;height:100%;flex-direction:column}ax-list .empty-container{display:flex;height:var(--ax-size-default);width:100%;align-items:center;justify-content:center;padding-left:.75rem;padding-right:.75rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li{position:relative;display:flex;height:var(--ax-size-default);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;justify-content:space-between;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-padding-start:.75rem;padding-inline-start:.75rem;font-size:.875rem;line-height:1.25rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-within,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:2px;outline-offset:-4px;outline-color:rgba(var(--ax-color-primary-500),1)}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;align-items:center}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{-webkit-margin-start:.5rem;margin-inline-start:.5rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-selected-icon{line-height:2rem;color:rgba(var(--ax-color-primary-500))}ax-list.ax-default .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:.5}\n"] }]
+                            deps: [[new Optional(), new SkipSelf(), AX_SELECTION_DATA_TOKEN]],
+                        },
+                    ], template: "<div class=\"list-container\" cdkVirtualScrollingElement>\n    <ng-content select=\"ax-header\"></ng-content>\n    <cdk-virtual-scroll-viewport [itemSize]=\"itemHeightSignal()\" [style.--item-height]=\"itemHeightSignal()+'px'\"\n        (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\">\n        <ul>\n            <!--  Item Template  -->\n            <ng-container *cdkVirtualFor=\"let item of listDataSource;let i = index; trackBy: trackByIdx\">\n                <ng-container *ngIf=\"item;else loadingTpl\">\n                    <li\n                        [class.ax-state-selected]=\"isItemSelected(item)\" class=\"list-item\"\n                        [class.ax-state-disabled]=\"isItemDisabled(item)\" [attr.tabindex]=\"i\"\n                        (click)=\"_handleOnItemClick($event, item)\" [attr.data-id]=\"getValue(item)\">\n                        <!--  Custom Item Template  -->\n                        <ng-container *ngIf=\"itemTemplate;else defaultItemTpl\">\n                            <ng-container *ngTemplateOutlet=\"itemTemplate;context: { $implicit: { data:item } }\">\n                            </ng-container>\n                        </ng-container>\n                        <!--  Default Item Template  -->\n                        <ng-template #defaultItemTpl>\n                            <ng-container *ngIf=\"item;else loadingTpl\">\n                                <div class=\"ax-label-container\">\n                                    <input class=\"ax-checkbox\" *ngIf=\"multiple && checkbox\" type=\"checkbox\"\n                                        [checked]=\"isItemSelected(item)\" [disabled]=\"isItemDisabled(item)\"\n                                        tabindex=\"0\" />\n                                    <span\n                                        [class.ax-checkbox-label]=\"multiple && checkbox\">{{getDisplayText(item)}}</span>\n                                </div>\n                                <i class=\"ax-icon ax-icon-done ax-selected-icon\" *ngIf=\"isItemSelected(item) \"></i>\n                            </ng-container>\n                        </ng-template>\n                    </li>\n                </ng-container>\n            </ng-container>\n        </ul>\n    </cdk-virtual-scroll-viewport>\n    <ng-content select=\"ax-footer\"></ng-content>\n</div>\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n    <!--  Custom Loading Template  -->\n    <ng-container *ngIf=\"loadingTemplate;else defaultLoadingTpl\">\n        <ng-container *ngTemplateOutlet=\"loadingTemplate\">\n        </ng-container>\n    </ng-container>\n    <!--  Default Loading Template  -->\n    <ng-template #defaultLoadingTpl>\n        <li>{{'loading' | translate | async }}</li>\n    </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n<ng-container *ngIf=\"emptyTemplate && hasItems===false && isLoading===false\">\n    <div class=\"empty-container\">\n        <ng-container *ngTemplateOutlet=\"emptyTemplate\"></ng-container>\n    </div>\n</ng-container>", styles: ["ax-list{display:block;height:100%;width:100%;font-size:.875rem;line-height:1.25rem}ax-list .list-container{display:flex;height:100%;flex-direction:column}ax-list .empty-container{display:flex;height:var(--ax-size-default);width:100%;align-items:center;justify-content:center;padding-left:.75rem;padding-right:.75rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li{position:relative;display:flex;height:var(--ax-size-default);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;align-items:center;justify-content:space-between;-webkit-padding-end:1rem;padding-inline-end:1rem;-webkit-padding-start:.75rem;padding-inline-start:.75rem;font-size:.875rem;line-height:1.25rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-within,ax-list.ax-default .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:2px;outline-offset:-4px;outline-color:rgba(var(--ax-color-primary-500),1)}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;align-items:center}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{-webkit-margin-start:.5rem;margin-inline-start:.5rem}ax-list.ax-default .cdk-virtual-scroll-viewport ul li .ax-selected-icon{line-height:2rem;color:rgba(var(--ax-color-primary-500))}ax-list.ax-default .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:.5}\n"] }]
         }], propDecorators: { dataSource: [{
                 type: Input
             }], itemHeight: [{
@@ -196,11 +199,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImpor
 const COMPONENT = [AXListComponent];
 const MODULES = [CommonModule, ScrollingModule, AXTranslationModule];
 class AXListModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.9", ngImport: i0, type: AXListModule, declarations: [AXListComponent], imports: [CommonModule, ScrollingModule, AXTranslationModule], exports: [AXListComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXListModule, imports: [MODULES] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: AXListModule, declarations: [AXListComponent], imports: [CommonModule, ScrollingModule, AXTranslationModule], exports: [AXListComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXListModule, imports: [MODULES] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.9", ngImport: i0, type: AXListModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AXListModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [...COMPONENT],