@acorex/components 22.0.0-next.20 → 22.0.0-next.22

package/fesm2022/acorex-components-list.mjs

@@ -267,79 +267,35 @@ class AXListComponent extends MXSelectionValueComponent {
         }
         this.viewport.checkViewportSize();
         requestAnimationFrame(() => {
-            // Re-measure after layout — dropdown height is often applied in the same tick.
-            this.viewport.checkViewportSize();
             const index = this.resolveSelectedIndex();
-            if (index < 0) {
-                return;
+            if (index >= 0) {
+                this.lastIndex = index;
+                this.viewport.scrollToIndex(index);
             }
-            this.lastIndex = index;
-            this.viewport.scrollToIndex(index);
-            // After virtual rows mount, keep the selected row fully inside the visible area.
-            requestAnimationFrame(() => this.ensureSelectedItemVisible());
         });
     }
-    /**
-     * Scrolls the selected row into the visible viewport when it is cropped at the edge.
-     * @ignore
-     */
-    ensureSelectedItemVisible() {
-        const selected = this.getHostElement().querySelector('li.ax-state-selected');
-        if (!selected) {
-            return;
-        }
-        const scrollParent = this.viewport.elementRef.nativeElement ||
-            selected.closest('.cdk-virtual-scroll-viewport');
-        if (!scrollParent) {
-            return;
-        }
-        const selectedRect = selected.getBoundingClientRect();
-        const parentRect = scrollParent.getBoundingClientRect();
-        const isCropped = selectedRect.top < parentRect.top + 1 || selectedRect.bottom > parentRect.bottom - 1;
-        if (isCropped) {
-            selected.scrollIntoView({ block: 'nearest', inline: 'nearest' });
-        }
-    }
     /**
      * Resolves the selected item index from values already loaded in the list source.
      * Only considers loaded entries so lazy sources are not scanned by a global index.
-     * For multiple selection, scrolls to the first selected item.
      * @ignore
      */
     resolveSelectedIndex() {
-        if (!this.listDataSource) {
+        if (this.multiple || !this.listDataSource) {
             return -1;
         }
-        const selectedKeys = this.getSelectedKeys();
-        if (selectedKeys.length === 0) {
+        const selectedValue = this.getSelectedKey();
+        if (selectedValue == null) {
             return -1;
         }
         const items = this.listDataSource.source.cachedItems;
         for (let index = 0; index < items.length; index++) {
             const item = items[index];
-            if (item == null) {
-                continue;
-            }
-            const itemKey = this.getValue(item);
-            if (selectedKeys.some((key) => key == itemKey)) {
+            if (item != null && this.getValue(item) == selectedValue) {
                 return index;
             }
         }
         return -1;
     }
-    /**
-     * @ignore
-     */
-    getSelectedKeys() {
-        if (this.multiple) {
-            const items = this.selectedItems?.length ? this.selectedItems : Array.isArray(this.value) ? this.value : [];
-            return items
-                .map((item) => (item != null && typeof item === 'object' ? this.getValue(item) : item))
-                .filter((key) => key != null);
-        }
-        const key = this.getSelectedKey();
-        return key == null ? [] : [key];
-    }
     /**
      * @ignore
      */
@@ -369,29 +325,17 @@ class AXListComponent extends MXSelectionValueComponent {
         this.viewport.scrollToIndex(index);
     }
     /**
-     * Sets focus to the selected list item (or the first item). Scrolls it into view first so
-     * virtualized rows are mounted, and uses preventScroll so the browser does not jump away.
+     * Sets focus to the first selectable list item. If no item is available, postpones focus.
      */
     focus() {
-        if (!isPlatformBrowser(this.platformID)) {
-            return;
+        const list = this.getHostElement().querySelector('ul');
+        const focusable = list.querySelector('li.ax-state-selected') ?? list.querySelector('li.list-item');
+        if (focusable) {
+            focusable.focus();
+        }
+        else {
+            this.postponeFocus = true;
         }
-        this.scrollTo();
-        requestAnimationFrame(() => {
-            const list = this.getHostElement().querySelector('ul');
-            if (!list) {
-                this.postponeFocus = true;
-                return;
-            }
-            const focusable = list.querySelector('li.ax-state-selected') ?? list.querySelector('li.list-item');
-            if (focusable) {
-                focusable.focus({ preventScroll: true });
-                this.ensureSelectedItemVisible();
-            }
-            else {
-                this.postponeFocus = true;
-            }
-        });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.8", type: AXListComponent, isStandalone: true, selector: "ax-list", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: false, isRequired: false, transformFunction: null }, valueField: { classPropertyName: "valueField", publicName: "valueField", isSignal: false, isRequired: false, transformFunction: null }, textField: { classPropertyName: "textField", publicName: "textField", isSignal: false, isRequired: false, transformFunction: null }, textTemplate: { classPropertyName: "textTemplate", publicName: "textTemplate", isSignal: false, isRequired: false, transformFunction: null }, disabledField: { classPropertyName: "disabledField", publicName: "disabledField", isSignal: false, isRequired: false, transformFunction: null }, multiple: { classPropertyName: "multiple", publicName: "multiple", isSignal: false, isRequired: false, transformFunction: null }, selectionMode: { classPropertyName: "selectionMode", publicName: "selectionMode", isSignal: false, isRequired: false, transformFunction: null }, isItemTruncated: { classPropertyName: "isItemTruncated", publicName: "isItemTruncated", isSignal: true, isRequired: false, transformFunction: null }, showItemTooltip: { classPropertyName: "showItemTooltip", publicName: "showItemTooltip", isSignal: true, isRequired: false, transformFunction: null }, dataSource: { classPropertyName: "dataSource", publicName: "dataSource", isSignal: false, isRequired: false, transformFunction: null }, itemHeight: { classPropertyName: "itemHeight", publicName: "itemHeight", isSignal: false, isRequired: false, transformFunction: null }, itemTemplate: { classPropertyName: "itemTemplate", publicName: "itemTemplate", isSignal: false, isRequired: false, transformFunction: null }, emptyTemplate: { classPropertyName: "emptyTemplate", publicName: "emptyTemplate", isSignal: false, isRequired: false, transformFunction: null }, loadingTemplate: { classPropertyName: "loadingTemplate", publicName: "loadingTemplate", isSignal: false, isRequired: false, transformFunction: null }, checkbox: { classPropertyName: "checkbox", publicName: "checkbox", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onValueChanged: "onValueChanged", disabledChange: "disabledChange", readonlyChange: "readonlyChange", onBlur: "onBlur", onFocus: "onFocus", onItemClick: "onItemClick", onItemSelected: "onItemSelected", onScrolledIndexChanged: "onScrolledIndexChanged" }, host: { listeners: { "keydown": "_handleKeydown($event)" } }, providers: [
@@ -410,7 +354,7 @@ class AXListComponent extends MXSelectionValueComponent {
                 },
                 deps: [[new Optional(), new SkipSelf(), AX_SELECTION_DATA_TOKEN]],
             },
-        ], viewQueries: [{ propertyName: "tooltipRef", predicate: AXTooltipDirective, descendants: true, isSignal: true }, { propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"list-container\" cdkVirtualScrollingElement [class.ax-height-auto]=\"showEmptyTemplate()\">\n  <ng-content select=\"ax-header\"></ng-content>\n  <cdk-virtual-scroll-viewport\n    [itemSize]=\"cdkItemSize()\"\n    [style.--ax-comp-list-item-height]=\"itemHeightCss()\"\n    (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\"\n    [class.ax-truncated-container]=\"isItemTruncated()\"\n  >\n    <ul>\n      <!--  Item Template  -->\n      <ng-container *cdkVirtualFor=\"let item of listDataSource; let i = index; trackBy: trackByIdx\">\n        @if (item !== null && item !== undefined) {\n          <li\n            [class.ax-state-selected]=\"isItemSelected(item)\"\n            class=\"list-item\"\n            [class.ax-state-disabled]=\"isItemDisabled(item)\"\n            [attr.tabindex]=\"i\"\n            (click)=\"_handleOnItemClick($event, item)\"\n            [attr.data-id]=\"getValue(item)\"\n          >\n            <!--  Custom Item Template  -->\n            @if (itemTemplate) {\n              <ng-container [ngTemplateOutlet]=\"itemTemplate\" [ngTemplateOutletContext]=\"{ $implicit: { data: item } }\">\n              </ng-container>\n            } @else {\n              <ng-container [ngTemplateOutlet]=\"defaultItemTpl\"></ng-container>\n            }\n            <!--  Default Item Template  -->\n            <ng-template #defaultItemTpl>\n              @if (item !== null && item !== undefined) {\n                <div class=\"ax-label-container\">\n                  @if (multiple && checkbox) {\n                    <input\n                      class=\"ax-checkbox\"\n                      type=\"checkbox\"\n                      [checked]=\"isItemSelected(item)\"\n                      [disabled]=\"isItemDisabled(item)\"\n                      tabindex=\"0\"\n                    />\n                  }\n\n                  <span\n                    [class.ax-checkbox-label]=\"multiple && checkbox\"\n                    [class.ax-truncated]=\"isItemTruncated()\"\n                    [axTooltip]=\"getDisplayText(item)\"\n                    [axTooltipDisabled]=\"!showItemTooltip()\"\n                  >\n                    {{ getDisplayText(item) | translate | async }}\n                  </span>\n                </div>\n                <!-- @if (isItemSelected(item)) {\n                  <i class=\"ax-icon ax-icon-check ax-selected-icon\"></i>\n                } -->\n              } @else {\n                <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n              }\n            </ng-template>\n          </li>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n        }\n      </ng-container>\n    </ul>\n  </cdk-virtual-scroll-viewport>\n  <ng-content select=\"ax-footer\"></ng-content>\n</div>\n\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n  <!--  Custom Loading Template  -->\n  @if (loadingTemplate) {\n    <ng-container [ngTemplateOutlet]=\"loadingTemplate\"> </ng-container>\n  } @else {\n    <ng-container [ngTemplateOutlet]=\"defaultLoadingTpl\"> </ng-container>\n  }\n  <!--  Default Loading Template  -->\n  <ng-template #defaultLoadingTpl>\n    <li>{{ '@acorex:common.status.loading' | translate | async }}</li>\n  </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n@if (showEmptyTemplate()) {\n  <div class=\"empty-container\">\n    <ng-container [ngTemplateOutlet]=\"emptyTemplate\"></ng-container>\n  </div>\n}\n", styles: ["@layer properties;@layer components{ax-list{display:block;width:100%;height:100%;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5)}ax-list .list-container{display:flex;height:100%;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column}ax-list .list-container.ax-height-auto{height:auto}ax-list ax-footer,ax-list ax-header{background-color:rgba(var(--ax-sys-color-lighter-surface))}ax-list .empty-container{display:flex;height:calc(var(--spacing, .25rem) * 10);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3)}ax-list .cdk-virtual-scroll-viewport{height:100%;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex:1 1 auto}ax-list .cdk-virtual-scroll-viewport.ax-truncated-container .cdk-virtual-scroll-content-wrapper{width:100%;min-width:unset}ax-list .cdk-virtual-scroll-viewport ul li{position:relative;box-sizing:border-box;display:flex!important;cursor:pointer;align-items:center;justify-content:space-between;overflow:hidden;padding-inline-start:calc(var(--spacing, .25rem) * 3);padding-inline-end:calc(var(--spacing, .25rem) * 4);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);-webkit-user-select:none;user-select:none;height:var(--ax-comp-list-item-height, 2.5rem);min-height:var(--ax-comp-list-item-height, 2.5rem)}ax-list .cdk-virtual-scroll-viewport ul li:hover{background-color:rgba(var(--ax-sys-color-surface))}ax-list .cdk-virtual-scroll-viewport ul li:focus,ax-list .cdk-virtual-scroll-viewport ul li:focus-within,ax-list .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:var(--ax-comp-list-item-focus-outline-width, 2px);outline-offset:var(--ax-comp-list-item-focus-outline-offset, -4px);outline-color:var(--color-primary)}ax-list .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;width:100%;align-items:center}ax-list .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{margin-inline-start:calc(var(--spacing, .25rem) * 2)}ax-list .cdk-virtual-scroll-viewport ul li.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-list .cdk-virtual-scroll-viewport ul li.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 20%,transparent)}}ax-list .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:50%}ax-list .cdk-virtual-scroll-viewport ul li .ax-truncated{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: CdkVirtualScrollableElement, selector: "[cdkVirtualScrollingElement]" }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXTooltipModule }, { kind: "directive", type: i1.AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "tooltipRef", predicate: AXTooltipDirective, descendants: true, isSignal: true }, { propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"list-container\" cdkVirtualScrollingElement [class.ax-height-auto]=\"showEmptyTemplate()\">\n  <ng-content select=\"ax-header\"></ng-content>\n  <cdk-virtual-scroll-viewport\n    [itemSize]=\"cdkItemSize()\"\n    [style.--ax-comp-list-item-height]=\"itemHeightCss()\"\n    (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\"\n    [class.ax-truncated-container]=\"isItemTruncated()\"\n  >\n    <ul>\n      <!--  Item Template  -->\n      <ng-container *cdkVirtualFor=\"let item of listDataSource; let i = index; trackBy: trackByIdx\">\n        @if (item !== null && item !== undefined) {\n          <li\n            [class.ax-state-selected]=\"isItemSelected(item)\"\n            class=\"list-item\"\n            [class.ax-state-disabled]=\"isItemDisabled(item)\"\n            [attr.tabindex]=\"i\"\n            (click)=\"_handleOnItemClick($event, item)\"\n            [attr.data-id]=\"getValue(item)\"\n          >\n            <!--  Custom Item Template  -->\n            @if (itemTemplate) {\n              <ng-container [ngTemplateOutlet]=\"itemTemplate\" [ngTemplateOutletContext]=\"{ $implicit: { data: item } }\">\n              </ng-container>\n            } @else {\n              <ng-container [ngTemplateOutlet]=\"defaultItemTpl\"></ng-container>\n            }\n            <!--  Default Item Template  -->\n            <ng-template #defaultItemTpl>\n              @if (item !== null && item !== undefined) {\n                <div class=\"ax-label-container\">\n                  @if (multiple && checkbox) {\n                    <input\n                      class=\"ax-checkbox\"\n                      type=\"checkbox\"\n                      [checked]=\"isItemSelected(item)\"\n                      [disabled]=\"isItemDisabled(item)\"\n                      tabindex=\"0\"\n                    />\n                  }\n\n                  <span\n                    [class.ax-checkbox-label]=\"multiple && checkbox\"\n                    [class.ax-truncated]=\"isItemTruncated()\"\n                    [axTooltip]=\"getDisplayText(item)\"\n                    [axTooltipDisabled]=\"!showItemTooltip()\"\n                  >\n                    {{ getDisplayText(item) | translate | async }}\n                  </span>\n                </div>\n                <!-- @if (isItemSelected(item)) {\n                  <i class=\"ax-icon ax-icon-check ax-selected-icon\"></i>\n                } -->\n              } @else {\n                <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n              }\n            </ng-template>\n          </li>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n        }\n      </ng-container>\n    </ul>\n  </cdk-virtual-scroll-viewport>\n  <ng-content select=\"ax-footer\"></ng-content>\n</div>\n\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n  <!--  Custom Loading Template  -->\n  @if (loadingTemplate) {\n    <ng-container [ngTemplateOutlet]=\"loadingTemplate\"> </ng-container>\n  } @else {\n    <ng-container [ngTemplateOutlet]=\"defaultLoadingTpl\"> </ng-container>\n  }\n  <!--  Default Loading Template  -->\n  <ng-template #defaultLoadingTpl>\n    <li>{{ '@acorex:common.status.loading' | translate | async }}</li>\n  </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n@if (showEmptyTemplate()) {\n  <div class=\"empty-container\">\n    <ng-container [ngTemplateOutlet]=\"emptyTemplate\"></ng-container>\n  </div>\n}\n", styles: ["@layer properties;@layer components{ax-list{display:block;width:100%;height:100%;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5)}ax-list .list-container{display:flex;height:100%;flex-direction:column}ax-list .list-container.ax-height-auto{height:auto}ax-list ax-footer,ax-list ax-header{background-color:rgba(var(--ax-sys-color-lighter-surface))}ax-list .empty-container{display:flex;height:calc(var(--spacing, .25rem) * 10);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3)}ax-list .cdk-virtual-scroll-viewport{height:100%;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex:1 1 auto}ax-list .cdk-virtual-scroll-viewport.ax-truncated-container .cdk-virtual-scroll-content-wrapper{width:100%;min-width:unset}ax-list .cdk-virtual-scroll-viewport ul li{position:relative;box-sizing:border-box;display:flex!important;cursor:pointer;align-items:center;justify-content:space-between;overflow:hidden;padding-inline-start:calc(var(--spacing, .25rem) * 3);padding-inline-end:calc(var(--spacing, .25rem) * 4);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);-webkit-user-select:none;user-select:none;height:100%;min-height:2rem}ax-list .cdk-virtual-scroll-viewport ul li:hover{background-color:rgba(var(--ax-sys-color-surface))}ax-list .cdk-virtual-scroll-viewport ul li:focus,ax-list .cdk-virtual-scroll-viewport ul li:focus-within,ax-list .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:var(--ax-comp-list-item-focus-outline-width, 2px);outline-offset:var(--ax-comp-list-item-focus-outline-offset, -4px);outline-color:var(--color-primary)}ax-list .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;width:100%;align-items:center}ax-list .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{margin-inline-start:calc(var(--spacing, .25rem) * 2)}ax-list .cdk-virtual-scroll-viewport ul li.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-list .cdk-virtual-scroll-viewport ul li.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 20%,transparent)}}ax-list .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:50%}ax-list .cdk-virtual-scroll-viewport ul li .ax-truncated{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: CdkVirtualScrollableElement, selector: "[cdkVirtualScrollingElement]" }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: AXTooltipModule }, { kind: "directive", type: i1.AXTooltipDirective, selector: "[axTooltip]", inputs: ["axTooltipDisabled", "axTooltip", "axTooltipContext", "axTooltipPlacement", "axTooltipOffsetX", "axTooltipOffsetY", "axTooltipOpenAfter", "axTooltipCloseAfter"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXListComponent, decorators: [{
             type: Component,
@@ -451,7 +395,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
                         AXTranslatorPipe,
                         AXTooltipModule,
                         AXTooltipDirective,
-                    ], template: "<div class=\"list-container\" cdkVirtualScrollingElement [class.ax-height-auto]=\"showEmptyTemplate()\">\n  <ng-content select=\"ax-header\"></ng-content>\n  <cdk-virtual-scroll-viewport\n    [itemSize]=\"cdkItemSize()\"\n    [style.--ax-comp-list-item-height]=\"itemHeightCss()\"\n    (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\"\n    [class.ax-truncated-container]=\"isItemTruncated()\"\n  >\n    <ul>\n      <!--  Item Template  -->\n      <ng-container *cdkVirtualFor=\"let item of listDataSource; let i = index; trackBy: trackByIdx\">\n        @if (item !== null && item !== undefined) {\n          <li\n            [class.ax-state-selected]=\"isItemSelected(item)\"\n            class=\"list-item\"\n            [class.ax-state-disabled]=\"isItemDisabled(item)\"\n            [attr.tabindex]=\"i\"\n            (click)=\"_handleOnItemClick($event, item)\"\n            [attr.data-id]=\"getValue(item)\"\n          >\n            <!--  Custom Item Template  -->\n            @if (itemTemplate) {\n              <ng-container [ngTemplateOutlet]=\"itemTemplate\" [ngTemplateOutletContext]=\"{ $implicit: { data: item } }\">\n              </ng-container>\n            } @else {\n              <ng-container [ngTemplateOutlet]=\"defaultItemTpl\"></ng-container>\n            }\n            <!--  Default Item Template  -->\n            <ng-template #defaultItemTpl>\n              @if (item !== null && item !== undefined) {\n                <div class=\"ax-label-container\">\n                  @if (multiple && checkbox) {\n                    <input\n                      class=\"ax-checkbox\"\n                      type=\"checkbox\"\n                      [checked]=\"isItemSelected(item)\"\n                      [disabled]=\"isItemDisabled(item)\"\n                      tabindex=\"0\"\n                    />\n                  }\n\n                  <span\n                    [class.ax-checkbox-label]=\"multiple && checkbox\"\n                    [class.ax-truncated]=\"isItemTruncated()\"\n                    [axTooltip]=\"getDisplayText(item)\"\n                    [axTooltipDisabled]=\"!showItemTooltip()\"\n                  >\n                    {{ getDisplayText(item) | translate | async }}\n                  </span>\n                </div>\n                <!-- @if (isItemSelected(item)) {\n                  <i class=\"ax-icon ax-icon-check ax-selected-icon\"></i>\n                } -->\n              } @else {\n                <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n              }\n            </ng-template>\n          </li>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n        }\n      </ng-container>\n    </ul>\n  </cdk-virtual-scroll-viewport>\n  <ng-content select=\"ax-footer\"></ng-content>\n</div>\n\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n  <!--  Custom Loading Template  -->\n  @if (loadingTemplate) {\n    <ng-container [ngTemplateOutlet]=\"loadingTemplate\"> </ng-container>\n  } @else {\n    <ng-container [ngTemplateOutlet]=\"defaultLoadingTpl\"> </ng-container>\n  }\n  <!--  Default Loading Template  -->\n  <ng-template #defaultLoadingTpl>\n    <li>{{ '@acorex:common.status.loading' | translate | async }}</li>\n  </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n@if (showEmptyTemplate()) {\n  <div class=\"empty-container\">\n    <ng-container [ngTemplateOutlet]=\"emptyTemplate\"></ng-container>\n  </div>\n}\n", styles: ["@layer properties;@layer components{ax-list{display:block;width:100%;height:100%;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5)}ax-list .list-container{display:flex;height:100%;min-height:calc(var(--spacing, .25rem) * 0);flex-direction:column}ax-list .list-container.ax-height-auto{height:auto}ax-list ax-footer,ax-list ax-header{background-color:rgba(var(--ax-sys-color-lighter-surface))}ax-list .empty-container{display:flex;height:calc(var(--spacing, .25rem) * 10);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3)}ax-list .cdk-virtual-scroll-viewport{height:100%;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex:1 1 auto}ax-list .cdk-virtual-scroll-viewport.ax-truncated-container .cdk-virtual-scroll-content-wrapper{width:100%;min-width:unset}ax-list .cdk-virtual-scroll-viewport ul li{position:relative;box-sizing:border-box;display:flex!important;cursor:pointer;align-items:center;justify-content:space-between;overflow:hidden;padding-inline-start:calc(var(--spacing, .25rem) * 3);padding-inline-end:calc(var(--spacing, .25rem) * 4);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);-webkit-user-select:none;user-select:none;height:var(--ax-comp-list-item-height, 2.5rem);min-height:var(--ax-comp-list-item-height, 2.5rem)}ax-list .cdk-virtual-scroll-viewport ul li:hover{background-color:rgba(var(--ax-sys-color-surface))}ax-list .cdk-virtual-scroll-viewport ul li:focus,ax-list .cdk-virtual-scroll-viewport ul li:focus-within,ax-list .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:var(--ax-comp-list-item-focus-outline-width, 2px);outline-offset:var(--ax-comp-list-item-focus-outline-offset, -4px);outline-color:var(--color-primary)}ax-list .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;width:100%;align-items:center}ax-list .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{margin-inline-start:calc(var(--spacing, .25rem) * 2)}ax-list .cdk-virtual-scroll-viewport ul li.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-list .cdk-virtual-scroll-viewport ul li.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 20%,transparent)}}ax-list .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:50%}ax-list .cdk-virtual-scroll-viewport ul li .ax-truncated{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
+                    ], template: "<div class=\"list-container\" cdkVirtualScrollingElement [class.ax-height-auto]=\"showEmptyTemplate()\">\n  <ng-content select=\"ax-header\"></ng-content>\n  <cdk-virtual-scroll-viewport\n    [itemSize]=\"cdkItemSize()\"\n    [style.--ax-comp-list-item-height]=\"itemHeightCss()\"\n    (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\"\n    [class.ax-truncated-container]=\"isItemTruncated()\"\n  >\n    <ul>\n      <!--  Item Template  -->\n      <ng-container *cdkVirtualFor=\"let item of listDataSource; let i = index; trackBy: trackByIdx\">\n        @if (item !== null && item !== undefined) {\n          <li\n            [class.ax-state-selected]=\"isItemSelected(item)\"\n            class=\"list-item\"\n            [class.ax-state-disabled]=\"isItemDisabled(item)\"\n            [attr.tabindex]=\"i\"\n            (click)=\"_handleOnItemClick($event, item)\"\n            [attr.data-id]=\"getValue(item)\"\n          >\n            <!--  Custom Item Template  -->\n            @if (itemTemplate) {\n              <ng-container [ngTemplateOutlet]=\"itemTemplate\" [ngTemplateOutletContext]=\"{ $implicit: { data: item } }\">\n              </ng-container>\n            } @else {\n              <ng-container [ngTemplateOutlet]=\"defaultItemTpl\"></ng-container>\n            }\n            <!--  Default Item Template  -->\n            <ng-template #defaultItemTpl>\n              @if (item !== null && item !== undefined) {\n                <div class=\"ax-label-container\">\n                  @if (multiple && checkbox) {\n                    <input\n                      class=\"ax-checkbox\"\n                      type=\"checkbox\"\n                      [checked]=\"isItemSelected(item)\"\n                      [disabled]=\"isItemDisabled(item)\"\n                      tabindex=\"0\"\n                    />\n                  }\n\n                  <span\n                    [class.ax-checkbox-label]=\"multiple && checkbox\"\n                    [class.ax-truncated]=\"isItemTruncated()\"\n                    [axTooltip]=\"getDisplayText(item)\"\n                    [axTooltipDisabled]=\"!showItemTooltip()\"\n                  >\n                    {{ getDisplayText(item) | translate | async }}\n                  </span>\n                </div>\n                <!-- @if (isItemSelected(item)) {\n                  <i class=\"ax-icon ax-icon-check ax-selected-icon\"></i>\n                } -->\n              } @else {\n                <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n              }\n            </ng-template>\n          </li>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n        }\n      </ng-container>\n    </ul>\n  </cdk-virtual-scroll-viewport>\n  <ng-content select=\"ax-footer\"></ng-content>\n</div>\n\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n  <!--  Custom Loading Template  -->\n  @if (loadingTemplate) {\n    <ng-container [ngTemplateOutlet]=\"loadingTemplate\"> </ng-container>\n  } @else {\n    <ng-container [ngTemplateOutlet]=\"defaultLoadingTpl\"> </ng-container>\n  }\n  <!--  Default Loading Template  -->\n  <ng-template #defaultLoadingTpl>\n    <li>{{ '@acorex:common.status.loading' | translate | async }}</li>\n  </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n@if (showEmptyTemplate()) {\n  <div class=\"empty-container\">\n    <ng-container [ngTemplateOutlet]=\"emptyTemplate\"></ng-container>\n  </div>\n}\n", styles: ["@layer properties;@layer components{ax-list{display:block;width:100%;height:100%;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5)}ax-list .list-container{display:flex;height:100%;flex-direction:column}ax-list .list-container.ax-height-auto{height:auto}ax-list ax-footer,ax-list ax-header{background-color:rgba(var(--ax-sys-color-lighter-surface))}ax-list .empty-container{display:flex;height:calc(var(--spacing, .25rem) * 10);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3)}ax-list .cdk-virtual-scroll-viewport{height:100%;min-height:calc(var(--spacing, .25rem) * 0);width:100%;flex:1 1 auto}ax-list .cdk-virtual-scroll-viewport.ax-truncated-container .cdk-virtual-scroll-content-wrapper{width:100%;min-width:unset}ax-list .cdk-virtual-scroll-viewport ul li{position:relative;box-sizing:border-box;display:flex!important;cursor:pointer;align-items:center;justify-content:space-between;overflow:hidden;padding-inline-start:calc(var(--spacing, .25rem) * 3);padding-inline-end:calc(var(--spacing, .25rem) * 4);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: calc(var(--spacing, .25rem) * 5);line-height:calc(var(--spacing, .25rem) * 5);-webkit-user-select:none;user-select:none;height:100%;min-height:2rem}ax-list .cdk-virtual-scroll-viewport ul li:hover{background-color:rgba(var(--ax-sys-color-surface))}ax-list .cdk-virtual-scroll-viewport ul li:focus,ax-list .cdk-virtual-scroll-viewport ul li:focus-within,ax-list .cdk-virtual-scroll-viewport ul li:focus-visible{outline-width:var(--ax-comp-list-item-focus-outline-width, 2px);outline-offset:var(--ax-comp-list-item-focus-outline-offset, -4px);outline-color:var(--color-primary)}ax-list .cdk-virtual-scroll-viewport ul li .ax-label-container{display:flex;width:100%;align-items:center}ax-list .cdk-virtual-scroll-viewport ul li .ax-checkbox-label{margin-inline-start:calc(var(--spacing, .25rem) * 2)}ax-list .cdk-virtual-scroll-viewport ul li.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){ax-list .cdk-virtual-scroll-viewport ul li.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 20%,transparent)}}ax-list .cdk-virtual-scroll-viewport ul li.ax-state-disabled{cursor:not-allowed;opacity:50%}ax-list .cdk-virtual-scroll-viewport ul li .ax-truncated{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}@property --tw-leading{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-leading: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
         }], propDecorators: { tooltipRef: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => AXTooltipDirective), { isSignal: true }] }], isItemTruncated: [{ type: i0.Input, args: [{ isSignal: true, alias: "isItemTruncated", required: false }] }], showItemTooltip: [{ type: i0.Input, args: [{ isSignal: true, alias: "showItemTooltip", required: false }] }], dataSource: [{
                 type: Input
             }], itemHeight: [{

package/fesm2022/acorex-components-list.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"acorex-components-list.mjs","sources":["../../../../packages/components/list/src/lib/list.component.ts","../../../../packages/components/list/src/lib/list.component.html","../../../../packages/components/list/src/lib/list.module.ts","../../../../packages/components/list/src/acorex-components-list.ts"],"sourcesContent":["import {\n  AXComponent,\n  AXDataSource,\n  AXEvent,\n  AXFocusableComponent,\n  AXListDataSource,\n  AXValuableComponent,\n  AX_SELECTION_DATA_TOKEN,\n  MXSelectionBridgeService,\n  MXSelectionValueComponent,\n  convertArrayToDataSource,\n} from '@acorex/cdk/common';\nimport { AXTooltipDirective, AXTooltipModule } from '@acorex/components/tooltip';\nimport { AXTranslatorPipe } from '@acorex/core/translation';\nimport {\n  CdkFixedSizeVirtualScroll,\n  CdkVirtualForOf,\n  CdkVirtualScrollViewport,\n  CdkVirtualScrollableElement,\n} from '@angular/cdk/scrolling';\nimport { AsyncPipe, NgTemplateOutlet, isPlatformBrowser } from '@angular/common';\nimport {\n  Component,\n  EventEmitter,\n  HostListener,\n  Input,\n  OnInit,\n  Optional,\n  Output,\n  SkipSelf,\n  TemplateRef,\n  ViewChild,\n  ViewEncapsulation,\n  WritableSignal,\n  computed,\n  forwardRef,\n  input,\n  signal,\n  viewChildren,\n} from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { Subscription } from 'rxjs';\n\nexport interface AXListScrollIndexChanged extends AXEvent {\n  index: number;\n}\n\n/**\n * provides a list control with various input options and events for user interaction.\n *\n * @category Components\n */\n@Component({\n  selector: 'ax-list',\n  templateUrl: './list.component.html',\n  styleUrls: ['./list.component.css'],\n\n  encapsulation: ViewEncapsulation.None,\n  inputs: [\n    'id',\n    'name',\n    'disabled',\n    'readonly',\n    'valueField',\n    'textField',\n    'textTemplate',\n    'disabledField',\n    'multiple',\n    'selectionMode',\n  ],\n  outputs: ['onValueChanged', 'disabledChange', 'readonlyChange', 'onBlur', 'onFocus', 'onItemClick', 'onItemSelected'],\n  providers: [\n    { provide: AXComponent, useExisting: AXListComponent },\n    { provide: AXFocusableComponent, useExisting: AXListComponent },\n    { provide: AXValuableComponent, useExisting: AXListComponent },\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => AXListComponent),\n      multi: true,\n    },\n    {\n      provide: AX_SELECTION_DATA_TOKEN,\n      useFactory: (existingService: MXSelectionBridgeService) => {\n        return existingService || new MXSelectionBridgeService();\n      },\n      deps: [[new Optional(), new SkipSelf(), AX_SELECTION_DATA_TOKEN]],\n    },\n  ],\n  imports: [\n    CdkVirtualScrollableElement,\n    CdkVirtualScrollViewport,\n    CdkFixedSizeVirtualScroll,\n    CdkVirtualForOf,\n    NgTemplateOutlet,\n    AsyncPipe,\n    AXTranslatorPipe,\n    AXTooltipModule,\n    AXTooltipDirective,\n  ],\n})\nexport class AXListComponent extends MXSelectionValueComponent implements OnInit {\n  private tooltipRef = viewChildren(AXTooltipDirective);\n\n  /**\n   * Determines if an item is truncated.\n   *\n   * @defaultValue true\n   */\n  isItemTruncated = input(true);\n\n  /**\n   * Determines if a tooltip is shown for an item.\n   *\n   * @defaultValue false\n   */\n  showItemTooltip = input(false);\n\n  /** @ignore */\n  private _dataSource: AXDataSource<unknown> = convertArrayToDataSource([]);\n\n  /** @ignore */\n  private _isInitialized = false;\n\n  /** @ignore */\n  private _onChangedSub?: Subscription;\n\n  /** @ignore */\n  private _onLoadingChangedSub?: Subscription;\n\n  /**\n   * Defines the data source for the list.\n   *\n   *  @defaultValue convertArrayToDataSource([])\n   */\n  @Input()\n  public set dataSource(v: AXDataSource<unknown>) {\n    if (!v || v === this._dataSource) {\n      return;\n    }\n    this._dataSource = v;\n    if (this._isInitialized) {\n      this._setupListDataSource();\n    }\n  }\n\n  public get dataSource(): AXDataSource<unknown> {\n    return this._dataSource;\n  }\n\n  /**\n   *  @ignore\n   */\n  itemHeightSignal: WritableSignal<number | 'auto'> = signal(40);\n\n  /**\n   * Fixed pixel size for CDK virtual scroll. Falls back to 40 when `itemHeight` is `'auto'`.\n   * @ignore\n   */\n  protected cdkItemSize = computed(() => {\n    const height = this.itemHeightSignal();\n    return typeof height === 'number' ? height : 40;\n  });\n\n  /**\n   * CSS value applied to `--ax-comp-list-item-height` so rendered rows match the virtual slot.\n   * @ignore\n   */\n  protected itemHeightCss = computed(() => `${this.cdkItemSize()}px`);\n\n  /**\n   * Sets the height of each item in the list.\n   */\n  @Input()\n  public set itemHeight(v: number | 'auto') {\n    this.itemHeightSignal.set(v);\n  }\n\n  /**\n   * Template for rendering individual items in the list.\n   */\n  @Input()\n  itemTemplate: TemplateRef<unknown>;\n\n  /**\n   * Template to display when the list is empty.\n   */\n  @Input()\n  emptyTemplate: TemplateRef<unknown>;\n\n  /**\n   * Template to show while the list is loading.\n   */\n  @Input()\n  loadingTemplate: TemplateRef<unknown>;\n\n  /**\n   * Emitted when the index of the scrolled item changes.\n   *\n   * @event\n   */\n  @Output()\n  onScrolledIndexChanged: EventEmitter<AXListScrollIndexChanged> = new EventEmitter<AXListScrollIndexChanged>();\n\n  /**\n   * Specifies whether the checkbox is enabled.\n   *\n   *  @defaultValue true\n   */\n  @Input()\n  checkbox = true;\n\n  /**\n   *  @ignore\n   */\n  protected listDataSource: AXListDataSource<unknown>;\n\n  /**\n   *  @ignore\n   */\n  protected isLoading = signal(true);\n\n  /**\n   *  @ignore\n   */\n  protected hasItems = false;\n\n  /**\n   *  @ignore\n   */\n  private lastIndex = 0;\n\n  /**\n   *  @ignore\n   */\n  private postponeFocus = false;\n\n  /**\n   *  @ignore\n   */\n  @ViewChild(CdkVirtualScrollViewport)\n  private viewport: CdkVirtualScrollViewport;\n\n  trackByIdx(i) {\n    return i;\n  }\n\n  /**\n   *  @ignore\n   */\n  override ngOnInit() {\n    super.ngOnInit();\n    this._setupListDataSource();\n    this._isInitialized = true;\n  }\n\n  /**\n   *  @ignore\n   */\n  protected override ngOnDestroy(): void {\n    this._onChangedSub?.unsubscribe();\n    this._onLoadingChangedSub?.unsubscribe();\n    super.ngOnDestroy();\n  }\n\n  /**\n   * (Re)creates the internal `AXListDataSource` wrapper used by `cdkVirtualFor`\n   * and (re)subscribes to the underlying source's events. This is invoked\n   * whenever the `dataSource` input changes so that the list properly reflects\n   * the new source.\n   * @ignore\n   */\n  private _setupListDataSource(): void {\n    this._onChangedSub?.unsubscribe();\n    this._onLoadingChangedSub?.unsubscribe();\n\n    this.listDataSource = new AXListDataSource<unknown>({\n      source: this._dataSource,\n    });\n\n    // Only mirror the source's state if it has already produced data.\n    // Otherwise keep `isLoading=true` so the empty template doesn't render,\n    // which would add `.ax-height-auto` and collapse the container, starving\n    // the virtual viewport of size — preventing `viewChange` from firing and\n    // the data source's `load` callback from ever being invoked.\n    const hasLoadedItems = this._dataSource.totalCount > 0;\n    this.isLoading.set(hasLoadedItems ? this._dataSource.isLoading : true);\n    this.hasItems = hasLoadedItems;\n\n    this._onLoadingChangedSub = this.listDataSource.source.onLoadingChanged.subscribe((data) => {\n      this.isLoading.set(data);\n    });\n    this._onChangedSub = this.listDataSource.source.onChanged.subscribe((data) => {\n      this.hasItems = data.totalCount > 0;\n      setTimeout(() => {\n        this.render();\n      }, 0);\n    });\n  }\n  /**\n   *  @ignore\n   */\n  _handleOnItemClick(e: MouseEvent, item: any) {\n    if (this.readonly || this.disabled) {\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n    if (this.isItemDisabled(item)) {\n      return;\n    }\n\n    this.tooltipRef().forEach((item) => {\n      item.close();\n    });\n    this.toggleSelect(item);\n    this.onItemClick.emit({\n      component: this,\n      item,\n      htmlElement: e.target as HTMLElement,\n      isUserInteraction: true,\n      nativeEvent: e,\n    });\n  }\n\n  /**\n   *  @ignore\n   */\n  @HostListener('keydown', ['$event'])\n  _handleKeydown(e: KeyboardEvent) {\n    if ((e.code === 'ArrowDown' || e.code === 'ArrowUp') && this.hasItems) {\n      this.focusItemByNav(e.key === 'ArrowDown' ? 1 : -1);\n      e.preventDefault();\n    }\n    if ((e.code === 'Space' || e.code === 'Enter') && this.hasItems) {\n      if (this.readonly || this.disabled) {\n        e.preventDefault();\n        e.stopPropagation();\n        return;\n      }\n      if (isPlatformBrowser(this.platformID)) {\n        const id = this.document.activeElement?.closest('li')?.dataset['id'];\n        this.toggleSelect(id);\n      }\n      e.preventDefault();\n      e.stopPropagation();\n    }\n  }\n\n  /**\n   *  @ignore\n   */\n  private focusItemByNav(sign: -1 | 1): void {\n    if (isPlatformBrowser(this.platformID)) {\n      const list = this.getHostElement().querySelector('ul');\n      const fn = (s) => list.querySelector<HTMLDivElement>(s);\n      const itemDiv: HTMLElement = this.document.activeElement?.closest('li') || fn(`li.ax-state-selected`) || fn(`li`);\n      const next = (sign == 1 ? itemDiv.nextElementSibling : itemDiv.previousElementSibling) as HTMLElement;\n      if (next) {\n        next.focus();\n      }\n    }\n  }\n\n  /**\n   *  @ignore\n   */\n  protected _handleOnscrolledIndexChange(e: number) {\n    this.lastIndex = e;\n    this.onScrolledIndexChanged.emit({\n      component: this,\n      index: this.lastIndex,\n      isUserInteraction: true,\n    });\n  }\n\n  /**\n   * Retrieves an item from the data source based on the provided key.\n   *\n   * @param key The key used to identify the item.\n   * @ignore\n   */\n  getItemByKey(key: unknown): Promise<unknown> | unknown {\n    return this.dataSource.find(key);\n  }\n\n  /**\n   * Renders the component by updating the viewport size, scrolling to the selected item, and optionally focusing the element.\n   */\n  public render() {\n    if (!this.viewport) {\n      return;\n    }\n\n    this.scrollTo();\n    if (this.postponeFocus) {\n      this.postponeFocus = false;\n      this.focus();\n    }\n  }\n\n  /**\n   * Scrolls the viewport to the currently selected list item.\n   */\n  public scrollTo(): void {\n    if (!this.viewport || !isPlatformBrowser(this.platformID)) {\n      return;\n    }\n\n    this.viewport.checkViewportSize();\n\n    requestAnimationFrame(() => {\n      // Re-measure after layout — dropdown height is often applied in the same tick.\n      this.viewport.checkViewportSize();\n      const index = this.resolveSelectedIndex();\n      if (index < 0) {\n        return;\n      }\n\n      this.lastIndex = index;\n      this.viewport.scrollToIndex(index);\n\n      // After virtual rows mount, keep the selected row fully inside the visible area.\n      requestAnimationFrame(() => this.ensureSelectedItemVisible());\n    });\n  }\n\n  /**\n   * Scrolls the selected row into the visible viewport when it is cropped at the edge.\n   * @ignore\n   */\n  private ensureSelectedItemVisible(): void {\n    const selected = this.getHostElement().querySelector<HTMLElement>('li.ax-state-selected');\n    if (!selected) {\n      return;\n    }\n\n    const scrollParent =\n      (this.viewport.elementRef.nativeElement as HTMLElement) ||\n      (selected.closest('.cdk-virtual-scroll-viewport') as HTMLElement | null);\n    if (!scrollParent) {\n      return;\n    }\n\n    const selectedRect = selected.getBoundingClientRect();\n    const parentRect = scrollParent.getBoundingClientRect();\n    const isCropped = selectedRect.top < parentRect.top + 1 || selectedRect.bottom > parentRect.bottom - 1;\n\n    if (isCropped) {\n      selected.scrollIntoView({ block: 'nearest', inline: 'nearest' });\n    }\n  }\n\n  /**\n   * Resolves the selected item index from values already loaded in the list source.\n   * Only considers loaded entries so lazy sources are not scanned by a global index.\n   * For multiple selection, scrolls to the first selected item.\n   * @ignore\n   */\n  private resolveSelectedIndex(): number {\n    if (!this.listDataSource) {\n      return -1;\n    }\n\n    const selectedKeys = this.getSelectedKeys();\n    if (selectedKeys.length === 0) {\n      return -1;\n    }\n\n    const items = this.listDataSource.source.cachedItems;\n\n    for (let index = 0; index < items.length; index++) {\n      const item = items[index];\n      if (item == null) {\n        continue;\n      }\n      const itemKey = this.getValue(item);\n      if (selectedKeys.some((key) => key == itemKey)) {\n        return index;\n      }\n    }\n\n    return -1;\n  }\n\n  /**\n   * @ignore\n   */\n  private getSelectedKeys(): unknown[] {\n    if (this.multiple) {\n      const items = this.selectedItems?.length ? this.selectedItems : Array.isArray(this.value) ? this.value : [];\n      return items\n        .map((item) => (item != null && typeof item === 'object' ? this.getValue(item) : item))\n        .filter((key) => key != null);\n    }\n\n    const key = this.getSelectedKey();\n    return key == null ? [] : [key];\n  }\n\n  /**\n   * @ignore\n   */\n  private getSelectedKey(): unknown {\n    const item = this.selectedItems[0] ?? this.value;\n    if (item == null) {\n      return null;\n    }\n\n    return typeof item === 'object' ? this.getValue(item) : item;\n  }\n\n  /**\n   * Refreshes the list by clearing the selection cache and reloading the data source.\n   * @ignore\n   */\n  public refresh(clearSelection = true) {\n    if (clearSelection) {\n      this.clearSelectionCache();\n    }\n    this.listDataSource.refresh();\n  }\n\n  /**\n   * Scrolls the viewport to the specified item index.\n   * @param index The index of the item to scroll to.\n   * @ignore\n   */\n  public scrollToIndex(index: number) {\n    this.viewport.scrollToIndex(index);\n  }\n  /**\n   * Sets focus to the selected list item (or the first item). Scrolls it into view first so\n   * virtualized rows are mounted, and uses preventScroll so the browser does not jump away.\n   */\n  override focus(): void {\n    if (!isPlatformBrowser(this.platformID)) {\n      return;\n    }\n\n    this.scrollTo();\n\n    requestAnimationFrame(() => {\n      const list = this.getHostElement().querySelector('ul');\n      if (!list) {\n        this.postponeFocus = true;\n        return;\n      }\n\n      const focusable =\n        list.querySelector<HTMLElement>('li.ax-state-selected') ?? list.querySelector<HTMLElement>('li.list-item');\n      if (focusable) {\n        focusable.focus({ preventScroll: true });\n        this.ensureSelectedItemVisible();\n      } else {\n        this.postponeFocus = true;\n      }\n    });\n  }\n\n  /**\n   * Determines whether to show the empty template based on the presence of items and loading state.\n   * @ignore\n   */\n  showEmptyTemplate = computed(() => this.isLoading() === false && this.emptyTemplate && this.hasItems === false);\n}\n","<div class=\"list-container\" cdkVirtualScrollingElement [class.ax-height-auto]=\"showEmptyTemplate()\">\n  <ng-content select=\"ax-header\"></ng-content>\n  <cdk-virtual-scroll-viewport\n    [itemSize]=\"cdkItemSize()\"\n    [style.--ax-comp-list-item-height]=\"itemHeightCss()\"\n    (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\"\n    [class.ax-truncated-container]=\"isItemTruncated()\"\n  >\n    <ul>\n      <!--  Item Template  -->\n      <ng-container *cdkVirtualFor=\"let item of listDataSource; let i = index; trackBy: trackByIdx\">\n        @if (item !== null && item !== undefined) {\n          <li\n            [class.ax-state-selected]=\"isItemSelected(item)\"\n            class=\"list-item\"\n            [class.ax-state-disabled]=\"isItemDisabled(item)\"\n            [attr.tabindex]=\"i\"\n            (click)=\"_handleOnItemClick($event, item)\"\n            [attr.data-id]=\"getValue(item)\"\n          >\n            <!--  Custom Item Template  -->\n            @if (itemTemplate) {\n              <ng-container [ngTemplateOutlet]=\"itemTemplate\" [ngTemplateOutletContext]=\"{ $implicit: { data: item } }\">\n              </ng-container>\n            } @else {\n              <ng-container [ngTemplateOutlet]=\"defaultItemTpl\"></ng-container>\n            }\n            <!--  Default Item Template  -->\n            <ng-template #defaultItemTpl>\n              @if (item !== null && item !== undefined) {\n                <div class=\"ax-label-container\">\n                  @if (multiple && checkbox) {\n                    <input\n                      class=\"ax-checkbox\"\n                      type=\"checkbox\"\n                      [checked]=\"isItemSelected(item)\"\n                      [disabled]=\"isItemDisabled(item)\"\n                      tabindex=\"0\"\n                    />\n                  }\n\n                  <span\n                    [class.ax-checkbox-label]=\"multiple && checkbox\"\n                    [class.ax-truncated]=\"isItemTruncated()\"\n                    [axTooltip]=\"getDisplayText(item)\"\n                    [axTooltipDisabled]=\"!showItemTooltip()\"\n                  >\n                    {{ getDisplayText(item) | translate | async }}\n                  </span>\n                </div>\n                <!-- @if (isItemSelected(item)) {\n                  <i class=\"ax-icon ax-icon-check ax-selected-icon\"></i>\n                } -->\n              } @else {\n                <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n              }\n            </ng-template>\n          </li>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n        }\n      </ng-container>\n    </ul>\n  </cdk-virtual-scroll-viewport>\n  <ng-content select=\"ax-footer\"></ng-content>\n</div>\n\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n  <!--  Custom Loading Template  -->\n  @if (loadingTemplate) {\n    <ng-container [ngTemplateOutlet]=\"loadingTemplate\"> </ng-container>\n  } @else {\n    <ng-container [ngTemplateOutlet]=\"defaultLoadingTpl\"> </ng-container>\n  }\n  <!--  Default Loading Template  -->\n  <ng-template #defaultLoadingTpl>\n    <li>{{ '@acorex:common.status.loading' | translate | async }}</li>\n  </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n@if (showEmptyTemplate()) {\n  <div class=\"empty-container\">\n    <ng-container [ngTemplateOutlet]=\"emptyTemplate\"></ng-container>\n  </div>\n}\n","import { NgModule } from '@angular/core';\nimport { AXListComponent } from './list.component';\n\n@NgModule({\n  imports: [AXListComponent],\n  exports: [AXListComponent],\n})\nexport class AXListModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"acorex-components-list.mjs","sources":["../../../../packages/components/list/src/lib/list.component.ts","../../../../packages/components/list/src/lib/list.component.html","../../../../packages/components/list/src/lib/list.module.ts","../../../../packages/components/list/src/acorex-components-list.ts"],"sourcesContent":["import {\n  AXComponent,\n  AXDataSource,\n  AXEvent,\n  AXFocusableComponent,\n  AXListDataSource,\n  AXValuableComponent,\n  AX_SELECTION_DATA_TOKEN,\n  MXSelectionBridgeService,\n  MXSelectionValueComponent,\n  convertArrayToDataSource,\n} from '@acorex/cdk/common';\nimport { AXTooltipDirective, AXTooltipModule } from '@acorex/components/tooltip';\nimport { AXTranslatorPipe } from '@acorex/core/translation';\nimport {\n  CdkFixedSizeVirtualScroll,\n  CdkVirtualForOf,\n  CdkVirtualScrollViewport,\n  CdkVirtualScrollableElement,\n} from '@angular/cdk/scrolling';\nimport { AsyncPipe, NgTemplateOutlet, isPlatformBrowser } from '@angular/common';\nimport {\n  Component,\n  EventEmitter,\n  HostListener,\n  Input,\n  OnInit,\n  Optional,\n  Output,\n  SkipSelf,\n  TemplateRef,\n  ViewChild,\n  ViewEncapsulation,\n  WritableSignal,\n  computed,\n  forwardRef,\n  input,\n  signal,\n  viewChildren,\n} from '@angular/core';\nimport { NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { Subscription } from 'rxjs';\n\nexport interface AXListScrollIndexChanged extends AXEvent {\n  index: number;\n}\n\n/**\n * provides a list control with various input options and events for user interaction.\n *\n * @category Components\n */\n@Component({\n  selector: 'ax-list',\n  templateUrl: './list.component.html',\n  styleUrls: ['./list.component.css'],\n\n  encapsulation: ViewEncapsulation.None,\n  inputs: [\n    'id',\n    'name',\n    'disabled',\n    'readonly',\n    'valueField',\n    'textField',\n    'textTemplate',\n    'disabledField',\n    'multiple',\n    'selectionMode',\n  ],\n  outputs: ['onValueChanged', 'disabledChange', 'readonlyChange', 'onBlur', 'onFocus', 'onItemClick', 'onItemSelected'],\n  providers: [\n    { provide: AXComponent, useExisting: AXListComponent },\n    { provide: AXFocusableComponent, useExisting: AXListComponent },\n    { provide: AXValuableComponent, useExisting: AXListComponent },\n    {\n      provide: NG_VALUE_ACCESSOR,\n      useExisting: forwardRef(() => AXListComponent),\n      multi: true,\n    },\n    {\n      provide: AX_SELECTION_DATA_TOKEN,\n      useFactory: (existingService: MXSelectionBridgeService) => {\n        return existingService || new MXSelectionBridgeService();\n      },\n      deps: [[new Optional(), new SkipSelf(), AX_SELECTION_DATA_TOKEN]],\n    },\n  ],\n  imports: [\n    CdkVirtualScrollableElement,\n    CdkVirtualScrollViewport,\n    CdkFixedSizeVirtualScroll,\n    CdkVirtualForOf,\n    NgTemplateOutlet,\n    AsyncPipe,\n    AXTranslatorPipe,\n    AXTooltipModule,\n    AXTooltipDirective,\n  ],\n})\nexport class AXListComponent extends MXSelectionValueComponent implements OnInit {\n  private tooltipRef = viewChildren(AXTooltipDirective);\n\n  /**\n   * Determines if an item is truncated.\n   *\n   * @defaultValue true\n   */\n  isItemTruncated = input(true);\n\n  /**\n   * Determines if a tooltip is shown for an item.\n   *\n   * @defaultValue false\n   */\n  showItemTooltip = input(false);\n\n  /** @ignore */\n  private _dataSource: AXDataSource<unknown> = convertArrayToDataSource([]);\n\n  /** @ignore */\n  private _isInitialized = false;\n\n  /** @ignore */\n  private _onChangedSub?: Subscription;\n\n  /** @ignore */\n  private _onLoadingChangedSub?: Subscription;\n\n  /**\n   * Defines the data source for the list.\n   *\n   *  @defaultValue convertArrayToDataSource([])\n   */\n  @Input()\n  public set dataSource(v: AXDataSource<unknown>) {\n    if (!v || v === this._dataSource) {\n      return;\n    }\n    this._dataSource = v;\n    if (this._isInitialized) {\n      this._setupListDataSource();\n    }\n  }\n\n  public get dataSource(): AXDataSource<unknown> {\n    return this._dataSource;\n  }\n\n  /**\n   *  @ignore\n   */\n  itemHeightSignal: WritableSignal<number | 'auto'> = signal(40);\n\n  /**\n   * Fixed pixel size for CDK virtual scroll. Falls back to 40 when `itemHeight` is `'auto'`.\n   * @ignore\n   */\n  protected cdkItemSize = computed(() => {\n    const height = this.itemHeightSignal();\n    return typeof height === 'number' ? height : 40;\n  });\n\n  /**\n   * CSS value applied to `--ax-comp-list-item-height` so rendered rows match the virtual slot.\n   * @ignore\n   */\n  protected itemHeightCss = computed(() => `${this.cdkItemSize()}px`);\n\n  /**\n   * Sets the height of each item in the list.\n   */\n  @Input()\n  public set itemHeight(v: number | 'auto') {\n    this.itemHeightSignal.set(v);\n  }\n\n  /**\n   * Template for rendering individual items in the list.\n   */\n  @Input()\n  itemTemplate: TemplateRef<unknown>;\n\n  /**\n   * Template to display when the list is empty.\n   */\n  @Input()\n  emptyTemplate: TemplateRef<unknown>;\n\n  /**\n   * Template to show while the list is loading.\n   */\n  @Input()\n  loadingTemplate: TemplateRef<unknown>;\n\n  /**\n   * Emitted when the index of the scrolled item changes.\n   *\n   * @event\n   */\n  @Output()\n  onScrolledIndexChanged: EventEmitter<AXListScrollIndexChanged> = new EventEmitter<AXListScrollIndexChanged>();\n\n  /**\n   * Specifies whether the checkbox is enabled.\n   *\n   *  @defaultValue true\n   */\n  @Input()\n  checkbox = true;\n\n  /**\n   *  @ignore\n   */\n  protected listDataSource: AXListDataSource<unknown>;\n\n  /**\n   *  @ignore\n   */\n  protected isLoading = signal(true);\n\n  /**\n   *  @ignore\n   */\n  protected hasItems = false;\n\n  /**\n   *  @ignore\n   */\n  private lastIndex = 0;\n\n  /**\n   *  @ignore\n   */\n  private postponeFocus = false;\n\n  /**\n   *  @ignore\n   */\n  @ViewChild(CdkVirtualScrollViewport)\n  private viewport: CdkVirtualScrollViewport;\n\n  trackByIdx(i) {\n    return i;\n  }\n\n  /**\n   *  @ignore\n   */\n  override ngOnInit() {\n    super.ngOnInit();\n    this._setupListDataSource();\n    this._isInitialized = true;\n  }\n\n  /**\n   *  @ignore\n   */\n  protected override ngOnDestroy(): void {\n    this._onChangedSub?.unsubscribe();\n    this._onLoadingChangedSub?.unsubscribe();\n    super.ngOnDestroy();\n  }\n\n  /**\n   * (Re)creates the internal `AXListDataSource` wrapper used by `cdkVirtualFor`\n   * and (re)subscribes to the underlying source's events. This is invoked\n   * whenever the `dataSource` input changes so that the list properly reflects\n   * the new source.\n   * @ignore\n   */\n  private _setupListDataSource(): void {\n    this._onChangedSub?.unsubscribe();\n    this._onLoadingChangedSub?.unsubscribe();\n\n    this.listDataSource = new AXListDataSource<unknown>({\n      source: this._dataSource,\n    });\n\n    // Only mirror the source's state if it has already produced data.\n    // Otherwise keep `isLoading=true` so the empty template doesn't render,\n    // which would add `.ax-height-auto` and collapse the container, starving\n    // the virtual viewport of size — preventing `viewChange` from firing and\n    // the data source's `load` callback from ever being invoked.\n    const hasLoadedItems = this._dataSource.totalCount > 0;\n    this.isLoading.set(hasLoadedItems ? this._dataSource.isLoading : true);\n    this.hasItems = hasLoadedItems;\n\n    this._onLoadingChangedSub = this.listDataSource.source.onLoadingChanged.subscribe((data) => {\n      this.isLoading.set(data);\n    });\n    this._onChangedSub = this.listDataSource.source.onChanged.subscribe((data) => {\n      this.hasItems = data.totalCount > 0;\n      setTimeout(() => {\n        this.render();\n      }, 0);\n    });\n  }\n  /**\n   *  @ignore\n   */\n  _handleOnItemClick(e: MouseEvent, item: any) {\n    if (this.readonly || this.disabled) {\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n    if (this.isItemDisabled(item)) {\n      return;\n    }\n\n    this.tooltipRef().forEach((item) => {\n      item.close();\n    });\n    this.toggleSelect(item);\n    this.onItemClick.emit({\n      component: this,\n      item,\n      htmlElement: e.target as HTMLElement,\n      isUserInteraction: true,\n      nativeEvent: e,\n    });\n  }\n\n  /**\n   *  @ignore\n   */\n  @HostListener('keydown', ['$event'])\n  _handleKeydown(e: KeyboardEvent) {\n    if ((e.code === 'ArrowDown' || e.code === 'ArrowUp') && this.hasItems) {\n      this.focusItemByNav(e.key === 'ArrowDown' ? 1 : -1);\n      e.preventDefault();\n    }\n    if ((e.code === 'Space' || e.code === 'Enter') && this.hasItems) {\n      if (this.readonly || this.disabled) {\n        e.preventDefault();\n        e.stopPropagation();\n        return;\n      }\n      if (isPlatformBrowser(this.platformID)) {\n        const id = this.document.activeElement?.closest('li')?.dataset['id'];\n        this.toggleSelect(id);\n      }\n      e.preventDefault();\n      e.stopPropagation();\n    }\n  }\n\n  /**\n   *  @ignore\n   */\n  private focusItemByNav(sign: -1 | 1): void {\n    if (isPlatformBrowser(this.platformID)) {\n      const list = this.getHostElement().querySelector('ul');\n      const fn = (s) => list.querySelector<HTMLDivElement>(s);\n      const itemDiv: HTMLElement = this.document.activeElement?.closest('li') || fn(`li.ax-state-selected`) || fn(`li`);\n      const next = (sign == 1 ? itemDiv.nextElementSibling : itemDiv.previousElementSibling) as HTMLElement;\n      if (next) {\n        next.focus();\n      }\n    }\n  }\n\n  /**\n   *  @ignore\n   */\n  protected _handleOnscrolledIndexChange(e: number) {\n    this.lastIndex = e;\n    this.onScrolledIndexChanged.emit({\n      component: this,\n      index: this.lastIndex,\n      isUserInteraction: true,\n    });\n  }\n\n  /**\n   * Retrieves an item from the data source based on the provided key.\n   *\n   * @param key The key used to identify the item.\n   * @ignore\n   */\n  getItemByKey(key: unknown): Promise<unknown> | unknown {\n    return this.dataSource.find(key);\n  }\n\n  /**\n   * Renders the component by updating the viewport size, scrolling to the selected item, and optionally focusing the element.\n   */\n  public render() {\n    if (!this.viewport) {\n      return;\n    }\n\n    this.scrollTo();\n    if (this.postponeFocus) {\n      this.postponeFocus = false;\n      this.focus();\n    }\n  }\n\n  /**\n   * Scrolls the viewport to the currently selected list item.\n   */\n  public scrollTo(): void {\n    if (!this.viewport || !isPlatformBrowser(this.platformID)) {\n      return;\n    }\n\n    this.viewport.checkViewportSize();\n\n    requestAnimationFrame(() => {\n      const index = this.resolveSelectedIndex();\n      if (index >= 0) {\n        this.lastIndex = index;\n        this.viewport.scrollToIndex(index);\n      }\n    });\n  }\n\n  /**\n   * Resolves the selected item index from values already loaded in the list source.\n   * Only considers loaded entries so lazy sources are not scanned by a global index.\n   * @ignore\n   */\n  private resolveSelectedIndex(): number {\n    if (this.multiple || !this.listDataSource) {\n      return -1;\n    }\n\n    const selectedValue = this.getSelectedKey();\n    if (selectedValue == null) {\n      return -1;\n    }\n\n    const items = this.listDataSource.source.cachedItems;\n\n    for (let index = 0; index < items.length; index++) {\n      const item = items[index];\n      if (item != null && this.getValue(item) == selectedValue) {\n        return index;\n      }\n    }\n\n    return -1;\n  }\n\n  /**\n   * @ignore\n   */\n  private getSelectedKey(): unknown {\n    const item = this.selectedItems[0] ?? this.value;\n    if (item == null) {\n      return null;\n    }\n\n    return typeof item === 'object' ? this.getValue(item) : item;\n  }\n\n  /**\n   * Refreshes the list by clearing the selection cache and reloading the data source.\n   * @ignore\n   */\n  public refresh(clearSelection = true) {\n    if (clearSelection) {\n      this.clearSelectionCache();\n    }\n    this.listDataSource.refresh();\n  }\n\n  /**\n   * Scrolls the viewport to the specified item index.\n   * @param index The index of the item to scroll to.\n   * @ignore\n   */\n  public scrollToIndex(index: number) {\n    this.viewport.scrollToIndex(index);\n  }\n  /**\n   * Sets focus to the first selectable list item. If no item is available, postpones focus.\n   */\n  override focus(): void {\n    const list = this.getHostElement().querySelector('ul');\n    const focusable =\n      list.querySelector<HTMLElement>('li.ax-state-selected') ?? list.querySelector<HTMLElement>('li.list-item');\n    if (focusable) {\n      focusable.focus();\n    } else {\n      this.postponeFocus = true;\n    }\n  }\n\n  /**\n   * Determines whether to show the empty template based on the presence of items and loading state.\n   * @ignore\n   */\n  showEmptyTemplate = computed(() => this.isLoading() === false && this.emptyTemplate && this.hasItems === false);\n}\n","<div class=\"list-container\" cdkVirtualScrollingElement [class.ax-height-auto]=\"showEmptyTemplate()\">\n  <ng-content select=\"ax-header\"></ng-content>\n  <cdk-virtual-scroll-viewport\n    [itemSize]=\"cdkItemSize()\"\n    [style.--ax-comp-list-item-height]=\"itemHeightCss()\"\n    (scrolledIndexChange)=\"_handleOnscrolledIndexChange($event)\"\n    [class.ax-truncated-container]=\"isItemTruncated()\"\n  >\n    <ul>\n      <!--  Item Template  -->\n      <ng-container *cdkVirtualFor=\"let item of listDataSource; let i = index; trackBy: trackByIdx\">\n        @if (item !== null && item !== undefined) {\n          <li\n            [class.ax-state-selected]=\"isItemSelected(item)\"\n            class=\"list-item\"\n            [class.ax-state-disabled]=\"isItemDisabled(item)\"\n            [attr.tabindex]=\"i\"\n            (click)=\"_handleOnItemClick($event, item)\"\n            [attr.data-id]=\"getValue(item)\"\n          >\n            <!--  Custom Item Template  -->\n            @if (itemTemplate) {\n              <ng-container [ngTemplateOutlet]=\"itemTemplate\" [ngTemplateOutletContext]=\"{ $implicit: { data: item } }\">\n              </ng-container>\n            } @else {\n              <ng-container [ngTemplateOutlet]=\"defaultItemTpl\"></ng-container>\n            }\n            <!--  Default Item Template  -->\n            <ng-template #defaultItemTpl>\n              @if (item !== null && item !== undefined) {\n                <div class=\"ax-label-container\">\n                  @if (multiple && checkbox) {\n                    <input\n                      class=\"ax-checkbox\"\n                      type=\"checkbox\"\n                      [checked]=\"isItemSelected(item)\"\n                      [disabled]=\"isItemDisabled(item)\"\n                      tabindex=\"0\"\n                    />\n                  }\n\n                  <span\n                    [class.ax-checkbox-label]=\"multiple && checkbox\"\n                    [class.ax-truncated]=\"isItemTruncated()\"\n                    [axTooltip]=\"getDisplayText(item)\"\n                    [axTooltipDisabled]=\"!showItemTooltip()\"\n                  >\n                    {{ getDisplayText(item) | translate | async }}\n                  </span>\n                </div>\n                <!-- @if (isItemSelected(item)) {\n                  <i class=\"ax-icon ax-icon-check ax-selected-icon\"></i>\n                } -->\n              } @else {\n                <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n              }\n            </ng-template>\n          </li>\n        } @else {\n          <ng-container [ngTemplateOutlet]=\"loadingTpl\"> </ng-container>\n        }\n      </ng-container>\n    </ul>\n  </cdk-virtual-scroll-viewport>\n  <ng-content select=\"ax-footer\"></ng-content>\n</div>\n\n<!--  Loading Template  -->\n<ng-template #loadingTpl>\n  <!--  Custom Loading Template  -->\n  @if (loadingTemplate) {\n    <ng-container [ngTemplateOutlet]=\"loadingTemplate\"> </ng-container>\n  } @else {\n    <ng-container [ngTemplateOutlet]=\"defaultLoadingTpl\"> </ng-container>\n  }\n  <!--  Default Loading Template  -->\n  <ng-template #defaultLoadingTpl>\n    <li>{{ '@acorex:common.status.loading' | translate | async }}</li>\n  </ng-template>\n</ng-template>\n<!--  Empty Template  -->\n@if (showEmptyTemplate()) {\n  <div class=\"empty-container\">\n    <ng-container [ngTemplateOutlet]=\"emptyTemplate\"></ng-container>\n  </div>\n}\n","import { NgModule } from '@angular/core';\nimport { AXListComponent } from './list.component';\n\n@NgModule({\n  imports: [AXListComponent],\n  exports: [AXListComponent],\n})\nexport class AXListModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/fesm2022/acorex-components-phone-box.mjs

@@ -2,7 +2,7 @@ import { MXInputBaseValueComponent, MXLookComponent, AXDataSource, AXComponent,
 import { AXDecoratorGenericComponent, AXDecoratorClearButtonComponent, AXDecoratorModule } from '@acorex/components/decorators';
 import { AXFormModule } from '@acorex/components/form';
 import { AXSearchBoxComponent, AXSearchBoxModule } from '@acorex/components/search-box';
-import { AXComboBoxComponent, AXComboBoxModule } from '@acorex/components/combo-box';
+import { AXSelectBoxComponent, AXSelectBoxModule } from '@acorex/components/select-box';
 import { AXTextBoxComponent, AXTextBoxModule } from '@acorex/components/text-box';
 import { COUNTRIES_FLAG_BASE64, COUNTRIES } from '@acorex/core/constants';
 import { AXTranslationService } from '@acorex/core/translation';
@@ -287,7 +287,7 @@ class AXPhoneBoxComponent extends classes((MXInputBaseValueComponent), MXLookCom
                 useExisting: forwardRef(() => AXPhoneBoxComponent),
                 multi: true,
             },
-        ], viewQueries: [{ propertyName: "selectBox", first: true, predicate: ["s"], descendants: true, isSignal: true }, { propertyName: "textbox", first: true, predicate: AXTextBoxComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ax-text-box\n  dir=\"ltr\"\n  [look]=\"look\"\n  [name]=\"name\"\n  [disabled]=\"disabled\"\n  [readonly]=\"readonly\"\n  [maskPattern]=\"$safeNavigationMigration(selectedCountry()?.mask)\"\n  [placeholder]=\"$safeNavigationMigration(selectedCountry()?.format)\"\n  [ngModel]=\"value\"\n  (onValueChanged)=\"_handleModelChange($event)\"\n  (onBlur)=\"emitOnBlurEvent($event.nativeEvent)\"\n  (onFocus)=\"emitOnFocusEvent($event.nativeEvent)\"\n  (onKeyDown)=\"handleKeyDown($event.nativeEvent)\"\n  (onKeyPress)=\"emitOnKeypressEvent($event.nativeEvent)\"\n  (onKeyUp)=\"emitOnKeyupEvent($event.nativeEvent)\"\n>\n  <ng-content select=\"ax-validation-rule\"> </ng-content>\n\n  <ax-prefix>\n    @if (precode()) {\n      <ax-text>{{ precode() }}</ax-text>\n    } @else {\n      <ax-combo-box\n        #s\n        [name]=\"name\"\n        look=\"blank\"\n        [disabled]=\"disabled || readonly\"\n        [readonly]=\"readonly\"\n        [dropdownWidth]=\"'320px'\"\n        [dataSource]=\"dataSource\"\n        [ngModel]=\"selectedCountry()\"\n        [textField]=\"'iso2code'\"\n        [multiple]=\"false\"\n        [valueField]=\"'code'\"\n        [itemTemplate]=\"customItemTemplate\"\n        [selectedTemplate]=\"selectedTemplate\"\n        (onValueChanged)=\"_handleCountryValueChanged($event)\"\n        (onClosed)=\"handleCountryOnClosed()\"\n        [tabIndex]=\"included().length === 1 ? '-1' : '1'\"\n      >\n        <ax-search-box class=\"ax-sm\" look=\"fill\">\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        <ng-template #customItemTemplate let-item>\n          <div class=\"ax-country-item\">\n            <div\n              class=\"ax-country-flag\"\n              [ngStyle]=\"{\n                'background-position': $safeNavigationMigration(item.data.bkPosition?.x) + ' ' + $safeNavigationMigration(item.data.bkPosition?.y),\n                'background-image': 'url(' + flags() + ')',\n              }\"\n            ></div>\n            <div>\n              <span class=\"ax-country-name\">{{ item.data.name }}</span>\n              <span class=\"ax-iso2code\">{{ item.data.iso2code }}</span>\n            </div>\n          </div>\n        </ng-template>\n        <ng-template #selectedTemplate let-item>\n          <div class=\"ax-selected-country\">\n            <span>{{ item.data.iso2code }}</span>\n          </div>\n        </ng-template>\n        <ng-template #loading></ng-template>\n      </ax-combo-box>\n    }\n  </ax-prefix>\n</ax-text-box>\n\n<ng-content select=\"ax-clear-button \"></ng-content>\n<div class=\"ax-error-container\"></div>\n", styles: ["@layer properties;@layer components{ax-phone-box ax-combo-box ax-dropdown-box .ax-content{padding-top:calc(var(--spacing, .25rem) * 0)!important}.ax-country-item{display:flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 3)}.ax-country-item:hover{background-color:rgba(var(--ax-sys-color-surface))}.ax-country-item .ax-country-name{margin-inline-end:calc(var(--spacing, .25rem) * 2);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-country-item .ax-iso2code{opacity:70%}.ax-country-flag{height:calc(var(--spacing, .25rem) * 5)!important;width:calc(var(--spacing, .25rem) * 6)!important;background-repeat:no-repeat}.ax-selected-country{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline-end:calc(var(--spacing, .25rem) * 2)}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { 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: AXComboBoxComponent, selector: "ax-combo-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: AXFormModule }], encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "selectBox", first: true, predicate: ["s"], descendants: true, isSignal: true }, { propertyName: "textbox", first: true, predicate: AXTextBoxComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ax-text-box\n  dir=\"ltr\"\n  [look]=\"look\"\n  [name]=\"name\"\n  [disabled]=\"disabled\"\n  [readonly]=\"readonly\"\n  [maskPattern]=\"$safeNavigationMigration(selectedCountry()?.mask)\"\n  [placeholder]=\"$safeNavigationMigration(selectedCountry()?.format)\"\n  [ngModel]=\"value\"\n  (onValueChanged)=\"_handleModelChange($event)\"\n  (onBlur)=\"emitOnBlurEvent($event.nativeEvent)\"\n  (onFocus)=\"emitOnFocusEvent($event.nativeEvent)\"\n  (onKeyDown)=\"handleKeyDown($event.nativeEvent)\"\n  (onKeyPress)=\"emitOnKeypressEvent($event.nativeEvent)\"\n  (onKeyUp)=\"emitOnKeyupEvent($event.nativeEvent)\"\n>\n  <ng-content select=\"ax-validation-rule\"> </ng-content>\n\n  <ax-prefix>\n    @if (precode()) {\n      <ax-text>{{ precode() }}</ax-text>\n    } @else {\n      <ax-select-box\n        #s\n        [name]=\"name\"\n        look=\"blank\"\n        [disabled]=\"disabled || readonly\"\n        [readonly]=\"readonly\"\n        [dropdownWidth]=\"'320px'\"\n        [dataSource]=\"dataSource\"\n        [ngModel]=\"selectedCountry()\"\n        [textField]=\"'iso2code'\"\n        [multiple]=\"false\"\n        [valueField]=\"'code'\"\n        [itemTemplate]=\"customItemTemplate\"\n        [selectedTemplate]=\"selectedTemplate\"\n        (onValueChanged)=\"_handleCountryValueChanged($event)\"\n        (onClosed)=\"handleCountryOnClosed()\"\n        [tabIndex]=\"included().length === 1 ? '-1' : '1'\"\n      >\n        <ax-search-box class=\"ax-sm\" look=\"fill\">\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        <ng-template #customItemTemplate let-item>\n          <div class=\"ax-country-item\">\n            <div\n              class=\"ax-country-flag\"\n              [ngStyle]=\"{\n                'background-position': $safeNavigationMigration(item.data.bkPosition?.x) + ' ' + $safeNavigationMigration(item.data.bkPosition?.y),\n                'background-image': 'url(' + flags() + ')',\n              }\"\n            ></div>\n            <div>\n              <span class=\"ax-country-name\">{{ item.data.name }}</span>\n              <span class=\"ax-iso2code\">{{ item.data.iso2code }}</span>\n            </div>\n          </div>\n        </ng-template>\n        <ng-template #selectedTemplate let-item>\n          <div class=\"ax-selected-country\">\n            <span>{{ item.data.iso2code }}</span>\n          </div>\n        </ng-template>\n        <ng-template #loading></ng-template>\n      </ax-select-box>\n    }\n  </ax-prefix>\n</ax-text-box>\n\n<ng-content select=\"ax-clear-button \"></ng-content>\n<div class=\"ax-error-container\"></div>\n", styles: ["@layer properties;@layer components{ax-phone-box ax-select-box ax-dropdown-box .ax-content{padding-top:calc(var(--spacing, .25rem) * 0)!important}.ax-country-item{display:flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 3)}.ax-country-item:hover{background-color:rgba(var(--ax-sys-color-surface))}.ax-country-item .ax-country-name{margin-inline-end:calc(var(--spacing, .25rem) * 2);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-country-item .ax-iso2code{opacity:70%}.ax-country-flag{height:calc(var(--spacing, .25rem) * 5)!important;width:calc(var(--spacing, .25rem) * 6)!important;background-repeat:no-repeat}.ax-selected-country{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline-end:calc(var(--spacing, .25rem) * 2)}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "component", type: AXTextBoxComponent, selector: "ax-text-box", inputs: ["disabled", "tabIndex", "readonly", "value", "state", "name", "id", "placeholder", "maxLength", "allowNull", "type", "autoComplete", "look", "maskPattern", "customTokens", "class"], outputs: ["onBlur", "onFocus", "valueChange", "stateChange", "onValueChanged", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress", "onMaskChanged"] }, { 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: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "minValue", "maxValue", "value", "state", "name", "id", "type", "look", "multiple", "valueField", "textField", "disabledField", "textTemplate", "selectedItems", "isItemTruncated", "showItemTooltip", "itemHeight", "maxVisibleItems", "dataSource", "minRecordsForSearch", "caption", "itemTemplate", "selectedTemplate", "emptyTemplate", "loadingTemplate", "dropdownWidth", "searchBoxAutoFocus"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onOpened", "onClosed", "onItemSelected", "onItemClick"] }, { kind: "component", type: AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "component", type: AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: AXFormModule }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXPhoneBoxComponent, decorators: [{
             type: Component,
@@ -332,12 +332,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
                         AXTextBoxComponent,
                         FormsModule,
                         AXDecoratorGenericComponent,
-                        AXComboBoxComponent,
+                        AXSelectBoxComponent,
                         AXSearchBoxComponent,
                         AXDecoratorClearButtonComponent,
                         NgStyle,
                         AXFormModule,
-                    ], template: "<ax-text-box\n  dir=\"ltr\"\n  [look]=\"look\"\n  [name]=\"name\"\n  [disabled]=\"disabled\"\n  [readonly]=\"readonly\"\n  [maskPattern]=\"$safeNavigationMigration(selectedCountry()?.mask)\"\n  [placeholder]=\"$safeNavigationMigration(selectedCountry()?.format)\"\n  [ngModel]=\"value\"\n  (onValueChanged)=\"_handleModelChange($event)\"\n  (onBlur)=\"emitOnBlurEvent($event.nativeEvent)\"\n  (onFocus)=\"emitOnFocusEvent($event.nativeEvent)\"\n  (onKeyDown)=\"handleKeyDown($event.nativeEvent)\"\n  (onKeyPress)=\"emitOnKeypressEvent($event.nativeEvent)\"\n  (onKeyUp)=\"emitOnKeyupEvent($event.nativeEvent)\"\n>\n  <ng-content select=\"ax-validation-rule\"> </ng-content>\n\n  <ax-prefix>\n    @if (precode()) {\n      <ax-text>{{ precode() }}</ax-text>\n    } @else {\n      <ax-combo-box\n        #s\n        [name]=\"name\"\n        look=\"blank\"\n        [disabled]=\"disabled || readonly\"\n        [readonly]=\"readonly\"\n        [dropdownWidth]=\"'320px'\"\n        [dataSource]=\"dataSource\"\n        [ngModel]=\"selectedCountry()\"\n        [textField]=\"'iso2code'\"\n        [multiple]=\"false\"\n        [valueField]=\"'code'\"\n        [itemTemplate]=\"customItemTemplate\"\n        [selectedTemplate]=\"selectedTemplate\"\n        (onValueChanged)=\"_handleCountryValueChanged($event)\"\n        (onClosed)=\"handleCountryOnClosed()\"\n        [tabIndex]=\"included().length === 1 ? '-1' : '1'\"\n      >\n        <ax-search-box class=\"ax-sm\" look=\"fill\">\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        <ng-template #customItemTemplate let-item>\n          <div class=\"ax-country-item\">\n            <div\n              class=\"ax-country-flag\"\n              [ngStyle]=\"{\n                'background-position': $safeNavigationMigration(item.data.bkPosition?.x) + ' ' + $safeNavigationMigration(item.data.bkPosition?.y),\n                'background-image': 'url(' + flags() + ')',\n              }\"\n            ></div>\n            <div>\n              <span class=\"ax-country-name\">{{ item.data.name }}</span>\n              <span class=\"ax-iso2code\">{{ item.data.iso2code }}</span>\n            </div>\n          </div>\n        </ng-template>\n        <ng-template #selectedTemplate let-item>\n          <div class=\"ax-selected-country\">\n            <span>{{ item.data.iso2code }}</span>\n          </div>\n        </ng-template>\n        <ng-template #loading></ng-template>\n      </ax-combo-box>\n    }\n  </ax-prefix>\n</ax-text-box>\n\n<ng-content select=\"ax-clear-button \"></ng-content>\n<div class=\"ax-error-container\"></div>\n", styles: ["@layer properties;@layer components{ax-phone-box ax-combo-box ax-dropdown-box .ax-content{padding-top:calc(var(--spacing, .25rem) * 0)!important}.ax-country-item{display:flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 3)}.ax-country-item:hover{background-color:rgba(var(--ax-sys-color-surface))}.ax-country-item .ax-country-name{margin-inline-end:calc(var(--spacing, .25rem) * 2);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-country-item .ax-iso2code{opacity:70%}.ax-country-flag{height:calc(var(--spacing, .25rem) * 5)!important;width:calc(var(--spacing, .25rem) * 6)!important;background-repeat:no-repeat}.ax-selected-country{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline-end:calc(var(--spacing, .25rem) * 2)}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
+                    ], template: "<ax-text-box\n  dir=\"ltr\"\n  [look]=\"look\"\n  [name]=\"name\"\n  [disabled]=\"disabled\"\n  [readonly]=\"readonly\"\n  [maskPattern]=\"$safeNavigationMigration(selectedCountry()?.mask)\"\n  [placeholder]=\"$safeNavigationMigration(selectedCountry()?.format)\"\n  [ngModel]=\"value\"\n  (onValueChanged)=\"_handleModelChange($event)\"\n  (onBlur)=\"emitOnBlurEvent($event.nativeEvent)\"\n  (onFocus)=\"emitOnFocusEvent($event.nativeEvent)\"\n  (onKeyDown)=\"handleKeyDown($event.nativeEvent)\"\n  (onKeyPress)=\"emitOnKeypressEvent($event.nativeEvent)\"\n  (onKeyUp)=\"emitOnKeyupEvent($event.nativeEvent)\"\n>\n  <ng-content select=\"ax-validation-rule\"> </ng-content>\n\n  <ax-prefix>\n    @if (precode()) {\n      <ax-text>{{ precode() }}</ax-text>\n    } @else {\n      <ax-select-box\n        #s\n        [name]=\"name\"\n        look=\"blank\"\n        [disabled]=\"disabled || readonly\"\n        [readonly]=\"readonly\"\n        [dropdownWidth]=\"'320px'\"\n        [dataSource]=\"dataSource\"\n        [ngModel]=\"selectedCountry()\"\n        [textField]=\"'iso2code'\"\n        [multiple]=\"false\"\n        [valueField]=\"'code'\"\n        [itemTemplate]=\"customItemTemplate\"\n        [selectedTemplate]=\"selectedTemplate\"\n        (onValueChanged)=\"_handleCountryValueChanged($event)\"\n        (onClosed)=\"handleCountryOnClosed()\"\n        [tabIndex]=\"included().length === 1 ? '-1' : '1'\"\n      >\n        <ax-search-box class=\"ax-sm\" look=\"fill\">\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        <ng-template #customItemTemplate let-item>\n          <div class=\"ax-country-item\">\n            <div\n              class=\"ax-country-flag\"\n              [ngStyle]=\"{\n                'background-position': $safeNavigationMigration(item.data.bkPosition?.x) + ' ' + $safeNavigationMigration(item.data.bkPosition?.y),\n                'background-image': 'url(' + flags() + ')',\n              }\"\n            ></div>\n            <div>\n              <span class=\"ax-country-name\">{{ item.data.name }}</span>\n              <span class=\"ax-iso2code\">{{ item.data.iso2code }}</span>\n            </div>\n          </div>\n        </ng-template>\n        <ng-template #selectedTemplate let-item>\n          <div class=\"ax-selected-country\">\n            <span>{{ item.data.iso2code }}</span>\n          </div>\n        </ng-template>\n        <ng-template #loading></ng-template>\n      </ax-select-box>\n    }\n  </ax-prefix>\n</ax-text-box>\n\n<ng-content select=\"ax-clear-button \"></ng-content>\n<div class=\"ax-error-container\"></div>\n", styles: ["@layer properties;@layer components{ax-phone-box ax-select-box ax-dropdown-box .ax-content{padding-top:calc(var(--spacing, .25rem) * 0)!important}.ax-country-item{display:flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 2);padding-block:calc(var(--spacing, .25rem) * 3)}.ax-country-item:hover{background-color:rgba(var(--ax-sys-color-surface))}.ax-country-item .ax-country-name{margin-inline-end:calc(var(--spacing, .25rem) * 2);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-country-item .ax-iso2code{opacity:70%}.ax-country-flag{height:calc(var(--spacing, .25rem) * 5)!important;width:calc(var(--spacing, .25rem) * 6)!important;background-repeat:no-repeat}.ax-selected-country{display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline-end:calc(var(--spacing, .25rem) * 2)}}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
         }], propDecorators: { textbox: [{
                 type: ViewChild,
                 args: [AXTextBoxComponent, { static: true }]
@@ -354,7 +354,7 @@ const MODULES = [
     CommonModule,
     FormsModule,
     IMaskModule,
-    AXComboBoxModule,
+    AXSelectBoxModule,
     AXSearchBoxModule,
     AXDecoratorModule,
     AXButtonModule,
@@ -365,7 +365,7 @@ class AXPhoneBoxModule {
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.8", ngImport: i0, type: AXPhoneBoxModule, imports: [CommonModule,
             FormsModule,
             IMaskModule,
-            AXComboBoxModule,
+            AXSelectBoxModule,
             AXSearchBoxModule,
             AXDecoratorModule,
             AXButtonModule,