@acorex/components 22.1.0-next.14 → 22.1.0-next.15

package/fesm2022/acorex-components-lookup.mjs

@@ -609,19 +609,18 @@ class AXLookupMultiColumnComponent {
             const source = this.dataSource();
             this.tableDataSource.config.key = source.config.key || this.valueField();
             untracked(() => {
-                this.#loadedItems = [];
-                this.#totalCount.set(0);
-                this.#syncTablePageSize();
-                this.tableDataSource.refresh({ reset: true });
+                this.#applyLoadedItems(source.cachedItems, source.totalCount);
             });
             const changedSub = source.onChanged.subscribe((event) => {
-                this.#loadedItems = event.cachedItems.filter((item) => item != null);
-                this.#totalCount.set(event.totalCount);
-                this.#syncTablePageSize();
-                this.tableDataSource.refresh({ reset: true });
+                this.#applyLoadedItems(event.cachedItems, event.totalCount);
+            });
+            // Fetch page 0 only when the source has never loaded. Reopen remounts this
+            // view; setPage(0) is a no-op on a warm source and must not force a new API call.
+            queueMicrotask(() => {
+                if (!source.cachedItems.some((item) => item != null)) {
+                    source.setPage(0);
+                }
             });
-            // Kick the first page; later pages come from scroll.
-            queueMicrotask(() => source.setPage(0));
             onCleanup(() => changedSub.unsubscribe());
         });
         effect((onCleanup) => {
@@ -656,6 +655,12 @@ class AXLookupMultiColumnComponent {
         }
         return width;
     }
+    #applyLoadedItems(cachedItems, totalCount) {
+        this.#loadedItems = cachedItems.filter((item) => item != null);
+        this.#totalCount.set(totalCount);
+        this.#syncTablePageSize();
+        this.tableDataSource.refresh({ reset: true });
+    }
     #syncTablePageSize() {
         this.tableDataSource.config.pageSize = Math.max(this.#loadedItems.length, 1);
     }
@@ -1083,6 +1088,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
 class AXLookupComponent extends NXValueComponent {
     #platform;
     #destroyRef;
+    /**
+     * Tree callback results keyed by parent id. Survives popup remount so
+     * drop-down-tree / multi-select-tree do not refetch on every open.
+     */
+    #treeChildrenCache;
     #itemsCache;
     #isUserInteraction;
     #lastValue;
@@ -1311,6 +1321,22 @@ class AXLookupComponent extends NXValueComponent {
                 : source;
         }, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "resolvedDataSource" }] : /* istanbul ignore next */ []));
+        /**
+         * Tree callback results keyed by parent id. Survives popup remount so
+         * drop-down-tree / multi-select-tree do not refetch on every open.
+         */
+        this.#treeChildrenCache = new WeakMap();
+        this.resolvedTreeDataSource = computed(() => {
+            const source = this.treeDataSource();
+            if (!source) {
+                return [];
+            }
+            if (Array.isArray(source)) {
+                return source;
+            }
+            return (nodeId) => this.#loadCachedTreeNodes(source, nodeId);
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "resolvedTreeDataSource" }] : /* istanbul ignore next */ []));
         /** The current selection normalized to an array. */
         this.selectedValues = computed(() => {
             const value = this.value();
@@ -1736,6 +1762,24 @@ class AXLookupComponent extends NXValueComponent {
         }
         this.focusListFirst();
     }
+    #loadCachedTreeNodes(source, nodeId) {
+        let byParent = this.#treeChildrenCache.get(source);
+        if (!byParent) {
+            byParent = new Map();
+            this.#treeChildrenCache.set(source, byParent);
+        }
+        const key = nodeId ?? '';
+        const cached = byParent.get(key);
+        if (cached) {
+            return cached;
+        }
+        const request = Promise.resolve(source(nodeId)).then((nodes) => nodes ?? [], (error) => {
+            byParent.delete(key);
+            throw error;
+        });
+        byParent.set(key, request);
+        return request;
+    }
     #applyFilterDebounced(text) {
         if (this.#searchDebounce) {
             clearTimeout(this.#searchDebounce);
@@ -1883,7 +1927,7 @@ class AXLookupComponent extends NXValueComponent {
             { provide: AXClearableComponent, useExisting: AXLookupComponent },
             { provide: AXClosableComponent, useExisting: AXLookupComponent },
             { provide: AXValuableComponent, useExisting: AXLookupComponent },
-        ], viewQueries: [{ propertyName: "popoverRef", first: true, predicate: AXPopoverComponent, descendants: true, isSignal: true }, { propertyName: "triggerSearchInput", first: true, predicate: ["triggerSearchInput"], descendants: true, isSignal: true }, { propertyName: "listView", first: true, predicate: AXLookupListViewBase, descendants: true, isSignal: true }, { propertyName: "sheetSearchRef", first: true, predicate: ["sheetSearch"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  #origin\n  class=\"ax-editor-container ax-{{ look() }} ax-default\"\n  [class.ax-lookup-trigger]=\"!isEditableTrigger()\"\n  [class.ax-lookup-trigger-multiple]=\"isMultiple()\"\n  [class.ax-state-disabled]=\"disabled()\"\n  [class.ax-state-readonly]=\"readonly()\"\n  (click)=\"onTriggerClick()\"\n>\n  <ng-content select=\"ax-prefix\"></ng-content>\n\n  @if (isMultiple()) {\n    <div class=\"ax-lookup-chips\">\n      @for (item of selectedItems(); track trackSelectedKey(item)) {\n        <ax-chips class=\"ax-sm\" color=\"primary\" look=\"twotone\" [text]=\"selectedTemplate() ? '' : getItemText(item)\">\n          @if (selectedTemplate()) {\n            <ax-prefix>\n              <ng-container\n                [ngTemplateOutlet]=\"selectedTemplate()!\"\n                [ngTemplateOutletContext]=\"{ $implicit: item }\"\n              />\n            </ax-prefix>\n          }\n          @if (!disabled() && !readonly()) {\n            <ax-suffix>\n              <button type=\"button\" tabindex=\"-1\" (click)=\"removeChip($event, item)\">\n                <span class=\"ax-icon ax-icon-close\"></span>\n              </button>\n            </ax-suffix>\n          }\n        </ax-chips>\n      }\n      <input\n        #triggerSearchInput\n        type=\"text\"\n        class=\"ax-input ax-lookup-trigger-search\"\n        [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n        [placeholder]=\"triggerSearchPlaceholder()\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readonly() || !isEditableTrigger()\"\n        [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n        [value]=\"searchText()\"\n        (input)=\"onTriggerSearchInput($any($event.target).value)\"\n        (keydown)=\"onTriggerKeydown($event)\"\n        (beforeinput)=\"onBeforeInput($event)\"\n        (focus)=\"emitOnFocus($event)\"\n        (blur)=\"emitOnBlur($event)\"\n      />\n    </div>\n  } @else {\n    <div class=\"ax-lookup-value\">\n      @if (showSelectedTemplate()) {\n        <div class=\"ax-lookup-selected-content\" aria-hidden=\"true\">\n          <ng-container\n            [ngTemplateOutlet]=\"selectedTemplate()!\"\n            [ngTemplateOutletContext]=\"{ $implicit: selectedItems()[0] }\"\n          />\n        </div>\n      }\n      <input\n        #triggerSearchInput\n        type=\"text\"\n        class=\"ax-input\"\n        [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n        [class.ax-lookup-input-overlay]=\"showSelectedTemplate()\"\n        [placeholder]=\"placeholder()\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readonly() || !isEditableTrigger()\"\n        [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n        [value]=\"searchText()\"\n        (input)=\"onTriggerSearchInput($any($event.target).value)\"\n        (keydown)=\"onTriggerKeydown($event)\"\n        (beforeinput)=\"onBeforeInput($event)\"\n        (focus)=\"emitOnFocus($event)\"\n        (blur)=\"emitOnBlur($event)\"\n      />\n    </div>\n  }\n\n  @if (selectedValues().length > 0 && !disabled() && !readonly()) {\n    <ng-content select=\"ax-clear-button\"></ng-content>\n  }\n\n  <button\n    type=\"button\"\n    class=\"ax-general-button-icon\"\n    tabindex=\"-1\"\n    [disabled]=\"disabled() || readonly()\"\n  >\n    <span\n      class=\"ax-icon\"\n      [class.ax-icon-chevron-down]=\"!expanded()\"\n      [class.ax-icon-chevron-up]=\"expanded()\"\n    ></span>\n  </button>\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n\n<ax-popover\n  [target]=\"origin\"\n  [openOn]=\"'manual'\"\n  [closeOn]=\"'clickOut'\"\n  [placement]=\"'bottom-start'\"\n  [width]=\"isActionsheetStyle() ? '100%' : origin.offsetWidth + 'px'\"\n  [adaptivityEnabled]=\"isActionsheetStyle()\"\n  [disabled]=\"disabled() || readonly()\"\n  (onClosed)=\"onPopoverClosed()\"\n>\n  <div class=\"ax-lookup-popup\" [class.ax-is-actionsheet]=\"isActionsheetStyle()\" [class.ax-is-alternate]=\"alternate()\" (keydown.escape)=\"close()\">\n    @if (isActionsheetStyle()) {\n      <ax-header class=\"ax-solid\">\n        <ax-title>{{ caption() || placeholder() || ('@acorex:selectbox.popover.title' | translate | async) }}</ax-title>\n        <ax-close-button [icon]=\"isMultiple() ? 'ax-icon ax-icon-check' : 'ax-icon ax-icon-close'\"></ax-close-button>\n      </ax-header>\n    }\n    @if (isSheetSearchEnabled()) {\n      <div class=\"ax-lookup-sheet-search\">\n        <ax-search-box\n          #sheetSearch\n          class=\"ax-sm\"\n          look=\"fill\"\n          [autoSearch]=\"false\"\n          [delayTime]=\"0\"\n          [placeholder]=\"searchPlaceholder()\"\n          (onValueChanged)=\"onSheetSearchInput()\"\n          (onKeyUp)=\"onSheetSearchInput()\"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n      </div>\n    }\n    <ng-content select=\"ax-header\"></ng-content>\n    @if (expanded()) {\n      @switch (mode()) {\n        @case ('drop-down-list') {\n          <ax-lookup-drop-down-list\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleSinglePick($event)\"\n            (navigateOut)=\"onListNavigateOut($event)\"\n          />\n        }\n        @case ('multi-select') {\n          <ax-lookup-multi-select\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleMultiToggle($event)\"\n            (navigateOut)=\"onListNavigateOut($event)\"\n          />\n        }\n        @case ('drop-down-tree') {\n          <ax-lookup-drop-down-tree\n            [dataSource]=\"treeDataSource()!\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [nodeTemplate]=\"$any(itemTemplate())\"\n            (itemClick)=\"handleSinglePick($event)\"\n          />\n        }\n        @case ('multi-select-tree') {\n          <ax-lookup-multi-select-tree\n            [dataSource]=\"treeDataSource()!\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [selectionBehavior]=\"treeSelectionBehavior()\"\n            [nodeTemplate]=\"$any(itemTemplate())\"\n            (selectionChange)=\"handleTreeSelectionChange($event)\"\n          />\n        }\n        @case ('multi-column') {\n          <ax-lookup-multi-column\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [columns]=\"columns()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleSinglePick($event)\"\n          />\n        }\n      }\n    }\n    <ng-content select=\"ax-footer\"></ng-content>\n  </div>\n</ax-popover>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-lookup{display:block;width:100%}ax-lookup .ax-editor-container{justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger{cursor:pointer;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-trigger-multiple{height:auto;min-height:calc(var(--spacing, .25rem) * 9);padding-block:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-value{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-select-input{cursor:pointer;caret-color:transparent;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-selected-content{pointer-events:none;position:relative;z-index:0;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-input-overlay{position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:10;margin:calc(var(--spacing, .25rem) * 0)!important;height:100%;width:100%;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)!important;color:transparent;caret-color:transparent}ax-lookup .ax-lookup-chips{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger-search{margin:calc(var(--spacing, .25rem) * 0)!important;height:calc(var(--spacing, .25rem) * 7.5);width:auto!important;min-width:calc(var(--spacing, .25rem) * 16);flex:1;flex-basis:calc(var(--spacing, .25rem) * 16)}ax-lookup .ax-lookup-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){ax-lookup .ax-lookup-placeholder{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}ax-lookup ax-chips ax-prefix,ax-lookup ax-chips ax-suffix{padding:calc(var(--spacing, .25rem) * 0)!important}ax-lookup ax-chips ax-suffix button{display:flex;cursor:pointer;align-items:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup{box-sizing:border-box;display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-darkest-surface))}.ax-lookup-popup.ax-is-actionsheet{border-bottom-right-radius:0;border-bottom-left-radius:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid .ax-icon-check{color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-title{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: calc(var(--spacing, .25rem) * 6);line-height:calc(var(--spacing, .25rem) * 6);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-lookup-popup .ax-lookup-sheet-search{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-lookup-popup>ax-header:not(.ax-solid),.ax-lookup-popup>ax-footer{flex-shrink:0;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup>ax-header:not(.ax-solid){border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.ax-lookup-popup>ax-footer{border-top-style:var(--tw-border-style);border-top-width:1px}.ax-lookup-viewport{width:100%}.ax-lookup-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-empty{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 60%,transparent)}}.ax-lookup-option-host{box-sizing:border-box;display:flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-style:var(--tw-border-style);border-width:1px;border-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface));--tw-outline-style: none;outline-style:none}.ax-lookup-option-host.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-option-host.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 10%,transparent)}}.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}.ax-lookup-option-host .ax-lookup-checkbox{pointer-events:none;width:calc(var(--spacing, .25rem) * 4);height:calc(var(--spacing, .25rem) * 4);flex-shrink:0;accent-color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-option-host .ax-lookup-option-loading{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host .ax-lookup-option-loading{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}.ax-lookup-option{justify-content:space-between}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option.ax-state-selected{color:rgba(var(--ax-sys-color-primary-surface))!important}.ax-lookup-option-host.ax-state-selected .ax-lookup-option-text,.ax-lookup-option-host.ax-state-selected .ax-lookup-option-check,.ax-lookup-option-host.ax-state-selected ax-icon{color:rgba(var(--ax-sys-color-primary-surface))!important}.ax-lookup-option-text{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-lookup-option-check{margin-inline-start:auto;flex-shrink:0;color:rgba(var(--ax-sys-color-primary-surface))!important}ax-lookup-multi-column,.ax-lookup-multi-column{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%}:is(ax-lookup-multi-column,.ax-lookup-multi-column) .ax-lookup-multi-column-table,:is(ax-lookup-multi-column,.ax-lookup-multi-column) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0);border-style:var(--tw-border-style)!important;border-width:0px!important}:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-disabled{pointer-events:none;opacity:50%}.ax-lookup-tree{max-height:calc(var(--spacing, .25rem) * 80);overflow:auto;padding:calc(var(--spacing, .25rem) * 2)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@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-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXChipsComponent, selector: "ax-chips", inputs: ["tabIndex", "color", "look", "text"], outputs: ["textChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i1$1.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["closeAll", "icon"] }, { kind: "component", type: i1$1.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: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { 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: AXLookupDropDownListComponent, selector: "ax-lookup-drop-down-list" }, { kind: "component", type: AXLookupMultiSelectComponent, selector: "ax-lookup-multi-select" }, { kind: "component", type: AXLookupDropDownTreeComponent, selector: "ax-lookup-drop-down-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "nodeTemplate"], outputs: ["itemClick"] }, { kind: "component", type: AXLookupMultiSelectTreeComponent, selector: "ax-lookup-multi-select-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "selectionBehavior", "nodeTemplate"], outputs: ["selectionChange"] }, { kind: "component", type: AXLookupMultiColumnComponent, selector: "ax-lookup-multi-column", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "itemHeight", "maxVisibleItems", "columns", "itemTemplate", "emptyTemplate", "loadingTemplate", "alternate"], outputs: ["itemClick"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], viewQueries: [{ propertyName: "popoverRef", first: true, predicate: AXPopoverComponent, descendants: true, isSignal: true }, { propertyName: "triggerSearchInput", first: true, predicate: ["triggerSearchInput"], descendants: true, isSignal: true }, { propertyName: "listView", first: true, predicate: AXLookupListViewBase, descendants: true, isSignal: true }, { propertyName: "sheetSearchRef", first: true, predicate: ["sheetSearch"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\n  #origin\n  class=\"ax-editor-container ax-{{ look() }} ax-default\"\n  [class.ax-lookup-trigger]=\"!isEditableTrigger()\"\n  [class.ax-lookup-trigger-multiple]=\"isMultiple()\"\n  [class.ax-state-disabled]=\"disabled()\"\n  [class.ax-state-readonly]=\"readonly()\"\n  (click)=\"onTriggerClick()\"\n>\n  <ng-content select=\"ax-prefix\"></ng-content>\n\n  @if (isMultiple()) {\n    <div class=\"ax-lookup-chips\">\n      @for (item of selectedItems(); track trackSelectedKey(item)) {\n        <ax-chips class=\"ax-sm\" color=\"primary\" look=\"twotone\" [text]=\"selectedTemplate() ? '' : getItemText(item)\">\n          @if (selectedTemplate()) {\n            <ax-prefix>\n              <ng-container\n                [ngTemplateOutlet]=\"selectedTemplate()!\"\n                [ngTemplateOutletContext]=\"{ $implicit: item }\"\n              />\n            </ax-prefix>\n          }\n          @if (!disabled() && !readonly()) {\n            <ax-suffix>\n              <button type=\"button\" tabindex=\"-1\" (click)=\"removeChip($event, item)\">\n                <span class=\"ax-icon ax-icon-close\"></span>\n              </button>\n            </ax-suffix>\n          }\n        </ax-chips>\n      }\n      <input\n        #triggerSearchInput\n        type=\"text\"\n        class=\"ax-input ax-lookup-trigger-search\"\n        [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n        [placeholder]=\"triggerSearchPlaceholder()\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readonly() || !isEditableTrigger()\"\n        [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n        [value]=\"searchText()\"\n        (input)=\"onTriggerSearchInput($any($event.target).value)\"\n        (keydown)=\"onTriggerKeydown($event)\"\n        (beforeinput)=\"onBeforeInput($event)\"\n        (focus)=\"emitOnFocus($event)\"\n        (blur)=\"emitOnBlur($event)\"\n      />\n    </div>\n  } @else {\n    <div class=\"ax-lookup-value\">\n      @if (showSelectedTemplate()) {\n        <div class=\"ax-lookup-selected-content\" aria-hidden=\"true\">\n          <ng-container\n            [ngTemplateOutlet]=\"selectedTemplate()!\"\n            [ngTemplateOutletContext]=\"{ $implicit: selectedItems()[0] }\"\n          />\n        </div>\n      }\n      <input\n        #triggerSearchInput\n        type=\"text\"\n        class=\"ax-input\"\n        [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n        [class.ax-lookup-input-overlay]=\"showSelectedTemplate()\"\n        [placeholder]=\"placeholder()\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readonly() || !isEditableTrigger()\"\n        [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n        [value]=\"searchText()\"\n        (input)=\"onTriggerSearchInput($any($event.target).value)\"\n        (keydown)=\"onTriggerKeydown($event)\"\n        (beforeinput)=\"onBeforeInput($event)\"\n        (focus)=\"emitOnFocus($event)\"\n        (blur)=\"emitOnBlur($event)\"\n      />\n    </div>\n  }\n\n  @if (selectedValues().length > 0 && !disabled() && !readonly()) {\n    <ng-content select=\"ax-clear-button\"></ng-content>\n  }\n\n  <button\n    type=\"button\"\n    class=\"ax-general-button-icon\"\n    tabindex=\"-1\"\n    [disabled]=\"disabled() || readonly()\"\n  >\n    <span\n      class=\"ax-icon\"\n      [class.ax-icon-chevron-down]=\"!expanded()\"\n      [class.ax-icon-chevron-up]=\"expanded()\"\n    ></span>\n  </button>\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n\n<ax-popover\n  [target]=\"origin\"\n  [openOn]=\"'manual'\"\n  [closeOn]=\"'clickOut'\"\n  [placement]=\"'bottom-start'\"\n  [width]=\"isActionsheetStyle() ? '100%' : origin.offsetWidth + 'px'\"\n  [adaptivityEnabled]=\"isActionsheetStyle()\"\n  [disabled]=\"disabled() || readonly()\"\n  (onClosed)=\"onPopoverClosed()\"\n>\n  <div class=\"ax-lookup-popup\" [class.ax-is-actionsheet]=\"isActionsheetStyle()\" [class.ax-is-alternate]=\"alternate()\" (keydown.escape)=\"close()\">\n    @if (isActionsheetStyle()) {\n      <ax-header class=\"ax-solid\">\n        <ax-title>{{ caption() || placeholder() || ('@acorex:selectbox.popover.title' | translate | async) }}</ax-title>\n        <ax-close-button [icon]=\"isMultiple() ? 'ax-icon ax-icon-check' : 'ax-icon ax-icon-close'\"></ax-close-button>\n      </ax-header>\n    }\n    @if (isSheetSearchEnabled()) {\n      <div class=\"ax-lookup-sheet-search\">\n        <ax-search-box\n          #sheetSearch\n          class=\"ax-sm\"\n          look=\"fill\"\n          [autoSearch]=\"false\"\n          [delayTime]=\"0\"\n          [placeholder]=\"searchPlaceholder()\"\n          (onValueChanged)=\"onSheetSearchInput()\"\n          (onKeyUp)=\"onSheetSearchInput()\"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n      </div>\n    }\n    <ng-content select=\"ax-header\"></ng-content>\n    @if (expanded()) {\n      @switch (mode()) {\n        @case ('drop-down-list') {\n          <ax-lookup-drop-down-list\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleSinglePick($event)\"\n            (navigateOut)=\"onListNavigateOut($event)\"\n          />\n        }\n        @case ('multi-select') {\n          <ax-lookup-multi-select\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleMultiToggle($event)\"\n            (navigateOut)=\"onListNavigateOut($event)\"\n          />\n        }\n        @case ('drop-down-tree') {\n          <ax-lookup-drop-down-tree\n            [dataSource]=\"resolvedTreeDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [nodeTemplate]=\"$any(itemTemplate())\"\n            (itemClick)=\"handleSinglePick($event)\"\n          />\n        }\n        @case ('multi-select-tree') {\n          <ax-lookup-multi-select-tree\n            [dataSource]=\"resolvedTreeDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [selectionBehavior]=\"treeSelectionBehavior()\"\n            [nodeTemplate]=\"$any(itemTemplate())\"\n            (selectionChange)=\"handleTreeSelectionChange($event)\"\n          />\n        }\n        @case ('multi-column') {\n          <ax-lookup-multi-column\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [columns]=\"columns()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleSinglePick($event)\"\n          />\n        }\n      }\n    }\n    <ng-content select=\"ax-footer\"></ng-content>\n  </div>\n</ax-popover>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-lookup{display:block;width:100%}ax-lookup .ax-editor-container{justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger{cursor:pointer;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-trigger-multiple{height:auto;min-height:calc(var(--spacing, .25rem) * 9);padding-block:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-value{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-select-input{cursor:pointer;caret-color:transparent;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-selected-content{pointer-events:none;position:relative;z-index:0;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-input-overlay{position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:10;margin:calc(var(--spacing, .25rem) * 0)!important;height:100%;width:100%;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)!important;color:transparent;caret-color:transparent}ax-lookup .ax-lookup-chips{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger-search{margin:calc(var(--spacing, .25rem) * 0)!important;height:calc(var(--spacing, .25rem) * 7.5);width:auto!important;min-width:calc(var(--spacing, .25rem) * 16);flex:1;flex-basis:calc(var(--spacing, .25rem) * 16)}ax-lookup .ax-lookup-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){ax-lookup .ax-lookup-placeholder{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}ax-lookup ax-chips ax-prefix,ax-lookup ax-chips ax-suffix{padding:calc(var(--spacing, .25rem) * 0)!important}ax-lookup ax-chips ax-suffix button{display:flex;cursor:pointer;align-items:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup{box-sizing:border-box;display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-darkest-surface))}.ax-lookup-popup.ax-is-actionsheet{border-bottom-right-radius:0;border-bottom-left-radius:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid .ax-icon-check{color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-title{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: calc(var(--spacing, .25rem) * 6);line-height:calc(var(--spacing, .25rem) * 6);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-lookup-popup .ax-lookup-sheet-search{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-lookup-popup>ax-header:not(.ax-solid),.ax-lookup-popup>ax-footer{flex-shrink:0;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup>ax-header:not(.ax-solid){border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.ax-lookup-popup>ax-footer{border-top-style:var(--tw-border-style);border-top-width:1px}.ax-lookup-viewport{width:100%}.ax-lookup-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-empty{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 60%,transparent)}}.ax-lookup-option-host{box-sizing:border-box;display:flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-style:var(--tw-border-style);border-width:1px;border-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface));--tw-outline-style: none;outline-style:none}.ax-lookup-option-host.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-option-host.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 10%,transparent)}}.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}.ax-lookup-option-host .ax-lookup-checkbox{pointer-events:none;width:calc(var(--spacing, .25rem) * 4);height:calc(var(--spacing, .25rem) * 4);flex-shrink:0;accent-color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-option-host .ax-lookup-option-loading{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host .ax-lookup-option-loading{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}.ax-lookup-option{justify-content:space-between}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option.ax-state-selected{color:rgba(var(--ax-sys-color-primary-surface))!important}.ax-lookup-option-host.ax-state-selected .ax-lookup-option-text,.ax-lookup-option-host.ax-state-selected .ax-lookup-option-check,.ax-lookup-option-host.ax-state-selected ax-icon{color:rgba(var(--ax-sys-color-primary-surface))!important}.ax-lookup-option-text{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-lookup-option-check{margin-inline-start:auto;flex-shrink:0;color:rgba(var(--ax-sys-color-primary-surface))!important}ax-lookup-multi-column,.ax-lookup-multi-column{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%}:is(ax-lookup-multi-column,.ax-lookup-multi-column) .ax-lookup-multi-column-table,:is(ax-lookup-multi-column,.ax-lookup-multi-column) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0);border-style:var(--tw-border-style)!important;border-width:0px!important}:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-disabled{pointer-events:none;opacity:50%}.ax-lookup-tree{max-height:calc(var(--spacing, .25rem) * 80);overflow:auto;padding:calc(var(--spacing, .25rem) * 2)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@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-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXChipsComponent, selector: "ax-chips", inputs: ["tabIndex", "color", "look", "text"], outputs: ["textChange"] }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i1$1.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "component", type: i1$1.AXDecoratorCloseButtonComponent, selector: "ax-close-button", inputs: ["closeAll", "icon"] }, { kind: "component", type: i1$1.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: AXPopoverComponent, selector: "ax-popover", inputs: ["width", "disablePanelClass", "visualContextScope", "disabled", "offsetX", "offsetY", "target", "placement", "content", "openOn", "closeOn", "hasBackdrop", "openAfter", "closeAfter", "closeOnScroll", "backdropClass", "panelClass", "adaptivityEnabled"], outputs: ["onOpened", "onClosed"] }, { 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: AXLookupDropDownListComponent, selector: "ax-lookup-drop-down-list" }, { kind: "component", type: AXLookupMultiSelectComponent, selector: "ax-lookup-multi-select" }, { kind: "component", type: AXLookupDropDownTreeComponent, selector: "ax-lookup-drop-down-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "nodeTemplate"], outputs: ["itemClick"] }, { kind: "component", type: AXLookupMultiSelectTreeComponent, selector: "ax-lookup-multi-select-tree", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "selectionBehavior", "nodeTemplate"], outputs: ["selectionChange"] }, { kind: "component", type: AXLookupMultiColumnComponent, selector: "ax-lookup-multi-column", inputs: ["dataSource", "valueField", "textField", "disabledField", "selectedValues", "itemHeight", "maxVisibleItems", "columns", "itemTemplate", "emptyTemplate", "loadingTemplate", "alternate"], outputs: ["itemClick"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImport: i0, type: AXLookupComponent, decorators: [{
             type: Component,
@@ -1905,7 +1949,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
                         { provide: AXClearableComponent, useExisting: AXLookupComponent },
                         { provide: AXClosableComponent, useExisting: AXLookupComponent },
                         { provide: AXValuableComponent, useExisting: AXLookupComponent },
-                    ], template: "<div\n  #origin\n  class=\"ax-editor-container ax-{{ look() }} ax-default\"\n  [class.ax-lookup-trigger]=\"!isEditableTrigger()\"\n  [class.ax-lookup-trigger-multiple]=\"isMultiple()\"\n  [class.ax-state-disabled]=\"disabled()\"\n  [class.ax-state-readonly]=\"readonly()\"\n  (click)=\"onTriggerClick()\"\n>\n  <ng-content select=\"ax-prefix\"></ng-content>\n\n  @if (isMultiple()) {\n    <div class=\"ax-lookup-chips\">\n      @for (item of selectedItems(); track trackSelectedKey(item)) {\n        <ax-chips class=\"ax-sm\" color=\"primary\" look=\"twotone\" [text]=\"selectedTemplate() ? '' : getItemText(item)\">\n          @if (selectedTemplate()) {\n            <ax-prefix>\n              <ng-container\n                [ngTemplateOutlet]=\"selectedTemplate()!\"\n                [ngTemplateOutletContext]=\"{ $implicit: item }\"\n              />\n            </ax-prefix>\n          }\n          @if (!disabled() && !readonly()) {\n            <ax-suffix>\n              <button type=\"button\" tabindex=\"-1\" (click)=\"removeChip($event, item)\">\n                <span class=\"ax-icon ax-icon-close\"></span>\n              </button>\n            </ax-suffix>\n          }\n        </ax-chips>\n      }\n      <input\n        #triggerSearchInput\n        type=\"text\"\n        class=\"ax-input ax-lookup-trigger-search\"\n        [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n        [placeholder]=\"triggerSearchPlaceholder()\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readonly() || !isEditableTrigger()\"\n        [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n        [value]=\"searchText()\"\n        (input)=\"onTriggerSearchInput($any($event.target).value)\"\n        (keydown)=\"onTriggerKeydown($event)\"\n        (beforeinput)=\"onBeforeInput($event)\"\n        (focus)=\"emitOnFocus($event)\"\n        (blur)=\"emitOnBlur($event)\"\n      />\n    </div>\n  } @else {\n    <div class=\"ax-lookup-value\">\n      @if (showSelectedTemplate()) {\n        <div class=\"ax-lookup-selected-content\" aria-hidden=\"true\">\n          <ng-container\n            [ngTemplateOutlet]=\"selectedTemplate()!\"\n            [ngTemplateOutletContext]=\"{ $implicit: selectedItems()[0] }\"\n          />\n        </div>\n      }\n      <input\n        #triggerSearchInput\n        type=\"text\"\n        class=\"ax-input\"\n        [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n        [class.ax-lookup-input-overlay]=\"showSelectedTemplate()\"\n        [placeholder]=\"placeholder()\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readonly() || !isEditableTrigger()\"\n        [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n        [value]=\"searchText()\"\n        (input)=\"onTriggerSearchInput($any($event.target).value)\"\n        (keydown)=\"onTriggerKeydown($event)\"\n        (beforeinput)=\"onBeforeInput($event)\"\n        (focus)=\"emitOnFocus($event)\"\n        (blur)=\"emitOnBlur($event)\"\n      />\n    </div>\n  }\n\n  @if (selectedValues().length > 0 && !disabled() && !readonly()) {\n    <ng-content select=\"ax-clear-button\"></ng-content>\n  }\n\n  <button\n    type=\"button\"\n    class=\"ax-general-button-icon\"\n    tabindex=\"-1\"\n    [disabled]=\"disabled() || readonly()\"\n  >\n    <span\n      class=\"ax-icon\"\n      [class.ax-icon-chevron-down]=\"!expanded()\"\n      [class.ax-icon-chevron-up]=\"expanded()\"\n    ></span>\n  </button>\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n\n<ax-popover\n  [target]=\"origin\"\n  [openOn]=\"'manual'\"\n  [closeOn]=\"'clickOut'\"\n  [placement]=\"'bottom-start'\"\n  [width]=\"isActionsheetStyle() ? '100%' : origin.offsetWidth + 'px'\"\n  [adaptivityEnabled]=\"isActionsheetStyle()\"\n  [disabled]=\"disabled() || readonly()\"\n  (onClosed)=\"onPopoverClosed()\"\n>\n  <div class=\"ax-lookup-popup\" [class.ax-is-actionsheet]=\"isActionsheetStyle()\" [class.ax-is-alternate]=\"alternate()\" (keydown.escape)=\"close()\">\n    @if (isActionsheetStyle()) {\n      <ax-header class=\"ax-solid\">\n        <ax-title>{{ caption() || placeholder() || ('@acorex:selectbox.popover.title' | translate | async) }}</ax-title>\n        <ax-close-button [icon]=\"isMultiple() ? 'ax-icon ax-icon-check' : 'ax-icon ax-icon-close'\"></ax-close-button>\n      </ax-header>\n    }\n    @if (isSheetSearchEnabled()) {\n      <div class=\"ax-lookup-sheet-search\">\n        <ax-search-box\n          #sheetSearch\n          class=\"ax-sm\"\n          look=\"fill\"\n          [autoSearch]=\"false\"\n          [delayTime]=\"0\"\n          [placeholder]=\"searchPlaceholder()\"\n          (onValueChanged)=\"onSheetSearchInput()\"\n          (onKeyUp)=\"onSheetSearchInput()\"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n      </div>\n    }\n    <ng-content select=\"ax-header\"></ng-content>\n    @if (expanded()) {\n      @switch (mode()) {\n        @case ('drop-down-list') {\n          <ax-lookup-drop-down-list\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleSinglePick($event)\"\n            (navigateOut)=\"onListNavigateOut($event)\"\n          />\n        }\n        @case ('multi-select') {\n          <ax-lookup-multi-select\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleMultiToggle($event)\"\n            (navigateOut)=\"onListNavigateOut($event)\"\n          />\n        }\n        @case ('drop-down-tree') {\n          <ax-lookup-drop-down-tree\n            [dataSource]=\"treeDataSource()!\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [nodeTemplate]=\"$any(itemTemplate())\"\n            (itemClick)=\"handleSinglePick($event)\"\n          />\n        }\n        @case ('multi-select-tree') {\n          <ax-lookup-multi-select-tree\n            [dataSource]=\"treeDataSource()!\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [selectionBehavior]=\"treeSelectionBehavior()\"\n            [nodeTemplate]=\"$any(itemTemplate())\"\n            (selectionChange)=\"handleTreeSelectionChange($event)\"\n          />\n        }\n        @case ('multi-column') {\n          <ax-lookup-multi-column\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [columns]=\"columns()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleSinglePick($event)\"\n          />\n        }\n      }\n    }\n    <ng-content select=\"ax-footer\"></ng-content>\n  </div>\n</ax-popover>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-lookup{display:block;width:100%}ax-lookup .ax-editor-container{justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger{cursor:pointer;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-trigger-multiple{height:auto;min-height:calc(var(--spacing, .25rem) * 9);padding-block:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-value{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-select-input{cursor:pointer;caret-color:transparent;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-selected-content{pointer-events:none;position:relative;z-index:0;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-input-overlay{position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:10;margin:calc(var(--spacing, .25rem) * 0)!important;height:100%;width:100%;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)!important;color:transparent;caret-color:transparent}ax-lookup .ax-lookup-chips{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger-search{margin:calc(var(--spacing, .25rem) * 0)!important;height:calc(var(--spacing, .25rem) * 7.5);width:auto!important;min-width:calc(var(--spacing, .25rem) * 16);flex:1;flex-basis:calc(var(--spacing, .25rem) * 16)}ax-lookup .ax-lookup-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){ax-lookup .ax-lookup-placeholder{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}ax-lookup ax-chips ax-prefix,ax-lookup ax-chips ax-suffix{padding:calc(var(--spacing, .25rem) * 0)!important}ax-lookup ax-chips ax-suffix button{display:flex;cursor:pointer;align-items:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup{box-sizing:border-box;display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-darkest-surface))}.ax-lookup-popup.ax-is-actionsheet{border-bottom-right-radius:0;border-bottom-left-radius:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid .ax-icon-check{color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-title{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: calc(var(--spacing, .25rem) * 6);line-height:calc(var(--spacing, .25rem) * 6);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-lookup-popup .ax-lookup-sheet-search{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-lookup-popup>ax-header:not(.ax-solid),.ax-lookup-popup>ax-footer{flex-shrink:0;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup>ax-header:not(.ax-solid){border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.ax-lookup-popup>ax-footer{border-top-style:var(--tw-border-style);border-top-width:1px}.ax-lookup-viewport{width:100%}.ax-lookup-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-empty{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 60%,transparent)}}.ax-lookup-option-host{box-sizing:border-box;display:flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-style:var(--tw-border-style);border-width:1px;border-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface));--tw-outline-style: none;outline-style:none}.ax-lookup-option-host.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-option-host.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 10%,transparent)}}.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}.ax-lookup-option-host .ax-lookup-checkbox{pointer-events:none;width:calc(var(--spacing, .25rem) * 4);height:calc(var(--spacing, .25rem) * 4);flex-shrink:0;accent-color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-option-host .ax-lookup-option-loading{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host .ax-lookup-option-loading{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}.ax-lookup-option{justify-content:space-between}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option.ax-state-selected{color:rgba(var(--ax-sys-color-primary-surface))!important}.ax-lookup-option-host.ax-state-selected .ax-lookup-option-text,.ax-lookup-option-host.ax-state-selected .ax-lookup-option-check,.ax-lookup-option-host.ax-state-selected ax-icon{color:rgba(var(--ax-sys-color-primary-surface))!important}.ax-lookup-option-text{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-lookup-option-check{margin-inline-start:auto;flex-shrink:0;color:rgba(var(--ax-sys-color-primary-surface))!important}ax-lookup-multi-column,.ax-lookup-multi-column{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%}:is(ax-lookup-multi-column,.ax-lookup-multi-column) .ax-lookup-multi-column-table,:is(ax-lookup-multi-column,.ax-lookup-multi-column) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0);border-style:var(--tw-border-style)!important;border-width:0px!important}:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-disabled{pointer-events:none;opacity:50%}.ax-lookup-tree{max-height:calc(var(--spacing, .25rem) * 80);overflow:auto;padding:calc(var(--spacing, .25rem) * 2)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@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-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
+                    ], template: "<div\n  #origin\n  class=\"ax-editor-container ax-{{ look() }} ax-default\"\n  [class.ax-lookup-trigger]=\"!isEditableTrigger()\"\n  [class.ax-lookup-trigger-multiple]=\"isMultiple()\"\n  [class.ax-state-disabled]=\"disabled()\"\n  [class.ax-state-readonly]=\"readonly()\"\n  (click)=\"onTriggerClick()\"\n>\n  <ng-content select=\"ax-prefix\"></ng-content>\n\n  @if (isMultiple()) {\n    <div class=\"ax-lookup-chips\">\n      @for (item of selectedItems(); track trackSelectedKey(item)) {\n        <ax-chips class=\"ax-sm\" color=\"primary\" look=\"twotone\" [text]=\"selectedTemplate() ? '' : getItemText(item)\">\n          @if (selectedTemplate()) {\n            <ax-prefix>\n              <ng-container\n                [ngTemplateOutlet]=\"selectedTemplate()!\"\n                [ngTemplateOutletContext]=\"{ $implicit: item }\"\n              />\n            </ax-prefix>\n          }\n          @if (!disabled() && !readonly()) {\n            <ax-suffix>\n              <button type=\"button\" tabindex=\"-1\" (click)=\"removeChip($event, item)\">\n                <span class=\"ax-icon ax-icon-close\"></span>\n              </button>\n            </ax-suffix>\n          }\n        </ax-chips>\n      }\n      <input\n        #triggerSearchInput\n        type=\"text\"\n        class=\"ax-input ax-lookup-trigger-search\"\n        [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n        [placeholder]=\"triggerSearchPlaceholder()\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readonly() || !isEditableTrigger()\"\n        [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n        [value]=\"searchText()\"\n        (input)=\"onTriggerSearchInput($any($event.target).value)\"\n        (keydown)=\"onTriggerKeydown($event)\"\n        (beforeinput)=\"onBeforeInput($event)\"\n        (focus)=\"emitOnFocus($event)\"\n        (blur)=\"emitOnBlur($event)\"\n      />\n    </div>\n  } @else {\n    <div class=\"ax-lookup-value\">\n      @if (showSelectedTemplate()) {\n        <div class=\"ax-lookup-selected-content\" aria-hidden=\"true\">\n          <ng-container\n            [ngTemplateOutlet]=\"selectedTemplate()!\"\n            [ngTemplateOutletContext]=\"{ $implicit: selectedItems()[0] }\"\n          />\n        </div>\n      }\n      <input\n        #triggerSearchInput\n        type=\"text\"\n        class=\"ax-input\"\n        [class.ax-lookup-select-input]=\"!isEditableTrigger()\"\n        [class.ax-lookup-input-overlay]=\"showSelectedTemplate()\"\n        [placeholder]=\"placeholder()\"\n        [disabled]=\"disabled()\"\n        [readonly]=\"readonly() || !isEditableTrigger()\"\n        [attr.inputmode]=\"isEditableTrigger() ? null : 'none'\"\n        [value]=\"searchText()\"\n        (input)=\"onTriggerSearchInput($any($event.target).value)\"\n        (keydown)=\"onTriggerKeydown($event)\"\n        (beforeinput)=\"onBeforeInput($event)\"\n        (focus)=\"emitOnFocus($event)\"\n        (blur)=\"emitOnBlur($event)\"\n      />\n    </div>\n  }\n\n  @if (selectedValues().length > 0 && !disabled() && !readonly()) {\n    <ng-content select=\"ax-clear-button\"></ng-content>\n  }\n\n  <button\n    type=\"button\"\n    class=\"ax-general-button-icon\"\n    tabindex=\"-1\"\n    [disabled]=\"disabled() || readonly()\"\n  >\n    <span\n      class=\"ax-icon\"\n      [class.ax-icon-chevron-down]=\"!expanded()\"\n      [class.ax-icon-chevron-up]=\"expanded()\"\n    ></span>\n  </button>\n  <ng-content select=\"ax-suffix\"></ng-content>\n</div>\n\n<ax-popover\n  [target]=\"origin\"\n  [openOn]=\"'manual'\"\n  [closeOn]=\"'clickOut'\"\n  [placement]=\"'bottom-start'\"\n  [width]=\"isActionsheetStyle() ? '100%' : origin.offsetWidth + 'px'\"\n  [adaptivityEnabled]=\"isActionsheetStyle()\"\n  [disabled]=\"disabled() || readonly()\"\n  (onClosed)=\"onPopoverClosed()\"\n>\n  <div class=\"ax-lookup-popup\" [class.ax-is-actionsheet]=\"isActionsheetStyle()\" [class.ax-is-alternate]=\"alternate()\" (keydown.escape)=\"close()\">\n    @if (isActionsheetStyle()) {\n      <ax-header class=\"ax-solid\">\n        <ax-title>{{ caption() || placeholder() || ('@acorex:selectbox.popover.title' | translate | async) }}</ax-title>\n        <ax-close-button [icon]=\"isMultiple() ? 'ax-icon ax-icon-check' : 'ax-icon ax-icon-close'\"></ax-close-button>\n      </ax-header>\n    }\n    @if (isSheetSearchEnabled()) {\n      <div class=\"ax-lookup-sheet-search\">\n        <ax-search-box\n          #sheetSearch\n          class=\"ax-sm\"\n          look=\"fill\"\n          [autoSearch]=\"false\"\n          [delayTime]=\"0\"\n          [placeholder]=\"searchPlaceholder()\"\n          (onValueChanged)=\"onSheetSearchInput()\"\n          (onKeyUp)=\"onSheetSearchInput()\"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n      </div>\n    }\n    <ng-content select=\"ax-header\"></ng-content>\n    @if (expanded()) {\n      @switch (mode()) {\n        @case ('drop-down-list') {\n          <ax-lookup-drop-down-list\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleSinglePick($event)\"\n            (navigateOut)=\"onListNavigateOut($event)\"\n          />\n        }\n        @case ('multi-select') {\n          <ax-lookup-multi-select\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleMultiToggle($event)\"\n            (navigateOut)=\"onListNavigateOut($event)\"\n          />\n        }\n        @case ('drop-down-tree') {\n          <ax-lookup-drop-down-tree\n            [dataSource]=\"resolvedTreeDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [nodeTemplate]=\"$any(itemTemplate())\"\n            (itemClick)=\"handleSinglePick($event)\"\n          />\n        }\n        @case ('multi-select-tree') {\n          <ax-lookup-multi-select-tree\n            [dataSource]=\"resolvedTreeDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [selectionBehavior]=\"treeSelectionBehavior()\"\n            [nodeTemplate]=\"$any(itemTemplate())\"\n            (selectionChange)=\"handleTreeSelectionChange($event)\"\n          />\n        }\n        @case ('multi-column') {\n          <ax-lookup-multi-column\n            [dataSource]=\"resolvedDataSource()\"\n            [valueField]=\"valueField()\"\n            [textField]=\"textField()\"\n            [disabledField]=\"disabledField()\"\n            [selectedValues]=\"selectedValues()\"\n            [itemHeight]=\"itemHeight()\"\n            [maxVisibleItems]=\"maxVisibleItems()\"\n            [columns]=\"columns()\"\n            [itemTemplate]=\"itemTemplate()\"\n            [emptyTemplate]=\"emptyTemplate()\"\n            [loadingTemplate]=\"loadingTemplate()\"\n            [alternate]=\"alternate()\"\n            (itemClick)=\"handleSinglePick($event)\"\n          />\n        }\n      }\n    }\n    <ng-content select=\"ax-footer\"></ng-content>\n  </div>\n</ax-popover>\n<ng-content select=\"ax-validation-rule\"></ng-content>\n", styles: ["@layer properties;@layer components{ax-lookup{display:block;width:100%}ax-lookup .ax-editor-container{justify-content:flex-start;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger{cursor:pointer;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-trigger-multiple{height:auto;min-height:calc(var(--spacing, .25rem) * 9);padding-block:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-value{position:relative;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-select-input{cursor:pointer;caret-color:transparent;-webkit-user-select:none;user-select:none}ax-lookup .ax-lookup-selected-content{pointer-events:none;position:relative;z-index:0;display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;align-items:center;overflow:hidden}ax-lookup .ax-lookup-input-overlay{position:absolute;inset:calc(var(--spacing, .25rem) * 0);z-index:10;margin:calc(var(--spacing, .25rem) * 0)!important;height:100%;width:100%;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)!important;color:transparent;caret-color:transparent}ax-lookup .ax-lookup-chips{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-wrap:wrap;align-items:center;gap:calc(var(--spacing, .25rem) * 1)}ax-lookup .ax-lookup-trigger-search{margin:calc(var(--spacing, .25rem) * 0)!important;height:calc(var(--spacing, .25rem) * 7.5);width:auto!important;min-width:calc(var(--spacing, .25rem) * 16);flex:1;flex-basis:calc(var(--spacing, .25rem) * 16)}ax-lookup .ax-lookup-placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){ax-lookup .ax-lookup-placeholder{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}ax-lookup ax-chips ax-prefix,ax-lookup ax-chips ax-suffix{padding:calc(var(--spacing, .25rem) * 0)!important}ax-lookup ax-chips ax-suffix button{display:flex;cursor:pointer;align-items:center;border-style:var(--tw-border-style);border-width:0px;background-color:transparent;padding:calc(var(--spacing, .25rem) * 0)}.ax-lookup-popup{box-sizing:border-box;display:flex;width:100%;flex-direction:column;overflow:hidden;border-radius:var(--ax-sys-border-radius);border-style:var(--tw-border-style);border-width:1px;border-color:rgba(var(--ax-sys-color-border-surface));background-color:rgba(var(--ax-sys-color-lightest-surface));--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-darkest-surface))}.ax-lookup-popup.ax-is-actionsheet{border-bottom-right-radius:0;border-bottom-left-radius:0;--tw-shadow: 0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid{border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid .ax-icon-check{color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-popup.ax-is-actionsheet>ax-header.ax-solid ax-title{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: calc(var(--spacing, .25rem) * 6);line-height:calc(var(--spacing, .25rem) * 6);--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500)}.ax-lookup-popup .ax-lookup-sheet-search{flex-shrink:0;border-bottom-style:var(--tw-border-style);border-bottom-width:1px;border-color:rgba(var(--ax-sys-color-border-lightest-surface));padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 2)}.ax-lookup-popup>ax-header:not(.ax-solid),.ax-lookup-popup>ax-footer{flex-shrink:0;border-color:rgba(var(--ax-sys-color-border-lightest-surface))}.ax-lookup-popup>ax-header:not(.ax-solid){border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.ax-lookup-popup>ax-footer{border-top-style:var(--tw-border-style);border-top-width:1px}.ax-lookup-viewport{width:100%}.ax-lookup-empty{display:flex;min-height:calc(var(--spacing, .25rem) * 12);width:100%;align-items:center;justify-content:center;padding-inline:calc(var(--spacing, .25rem) * 3);padding-block:calc(var(--spacing, .25rem) * 3);text-align:center;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-empty{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 60%,transparent)}}.ax-lookup-option-host{box-sizing:border-box;display:flex;cursor:pointer;align-items:center;gap:calc(var(--spacing, .25rem) * 2);border-style:var(--tw-border-style);border-width:1px;border-color:transparent;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface));--tw-outline-style: none;outline-style:none}.ax-lookup-option-host.ax-state-alternate{background-color:rgba(var(--ax-sys-color-light-surface))}.ax-lookup-option-host.ax-state-alternate:where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-surface))}.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host:hover,.ax-lookup-option-host.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 10%,transparent)}}.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 15%,transparent)}}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected,.ax-lookup-option-host.ax-state-selected:hover,.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate,.ax-lookup-option-host.ax-state-selected.ax-state-alternate:hover,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 25%,transparent)}}.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-lightest-surface)) 80%,transparent)}}:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:rgba(var(--ax-sys-color-primary-darkest-surface))}@supports (color: color-mix(in lab,red,red)){:is(.ax-lookup-option-host.ax-state-selected.ax-state-active,.ax-lookup-option-host.ax-state-selected.ax-state-alternate.ax-state-active):where(.ax-dark,.ax-dark *):not(:where(.ax-light,.ax-light *)){background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-darkest-surface)) 40%,transparent)}}.ax-lookup-option-host .ax-lookup-checkbox{pointer-events:none;width:calc(var(--spacing, .25rem) * 4);height:calc(var(--spacing, .25rem) * 4);flex-shrink:0;accent-color:rgba(var(--ax-sys-color-primary-surface))}.ax-lookup-option-host .ax-lookup-option-loading{width:100%;padding-inline:calc(var(--spacing, .25rem) * 3);font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));color:rgba(var(--ax-sys-color-on-surface))}@supports (color: color-mix(in lab,red,red)){.ax-lookup-option-host .ax-lookup-option-loading{color:color-mix(in oklab,rgba(var(--ax-sys-color-on-surface)) 50%,transparent)}}.ax-lookup-option{justify-content:space-between}.ax-lookup-option-host.ax-state-selected,.ax-lookup-option.ax-state-selected{color:rgba(var(--ax-sys-color-primary-surface))!important}.ax-lookup-option-host.ax-state-selected .ax-lookup-option-text,.ax-lookup-option-host.ax-state-selected .ax-lookup-option-check,.ax-lookup-option-host.ax-state-selected ax-icon{color:rgba(var(--ax-sys-color-primary-surface))!important}.ax-lookup-option-text{min-width:calc(var(--spacing, .25rem) * 0);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ax-lookup-option-check{margin-inline-start:auto;flex-shrink:0;color:rgba(var(--ax-sys-color-primary-surface))!important}ax-lookup-multi-column,.ax-lookup-multi-column{display:block;min-height:calc(var(--spacing, .25rem) * 0);width:100%}:is(ax-lookup-multi-column,.ax-lookup-multi-column) .ax-lookup-multi-column-table,:is(ax-lookup-multi-column,.ax-lookup-multi-column) ax-data-table{height:100%;min-height:calc(var(--spacing, .25rem) * 0);border-style:var(--tw-border-style)!important;border-width:0px!important}:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-selected{background-color:rgba(var(--ax-sys-color-primary-surface))}@supports (color: color-mix(in lab,red,red)){:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-selected{background-color:color-mix(in oklab,rgba(var(--ax-sys-color-primary-surface)) 10%,transparent)}}:is(ax-lookup-multi-column,.ax-lookup-multi-column) tr.ax-state-disabled{pointer-events:none;opacity:50%}.ax-lookup-tree{max-height:calc(var(--spacing, .25rem) * 80);overflow:auto;padding:calc(var(--spacing, .25rem) * 2)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-leading{syntax: \"*\"; inherits: false;}@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-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-leading: initial;--tw-font-weight: initial}}}\n/*! tailwindcss v4.1.16 | MIT License | https://tailwindcss.com */\n"] }]
         }], ctorParameters: () => [], propDecorators: { name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }], treeDataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeDataSource", required: false }] }], valueField: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueField", required: false }] }], textField: [{ type: i0.Input, args: [{ isSignal: true, alias: "textField", required: false }] }], disabledField: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabledField", required: false }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: false }] }], searchable: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchable", required: false }] }], adaptivityEnabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "adaptivityEnabled", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], alternate: [{ type: i0.Input, args: [{ isSignal: true, alias: "alternate", required: false }] }], searchPlaceholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchPlaceholder", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], look: [{ type: i0.Input, args: [{ isSignal: true, alias: "look", required: false }] }, { type: i0.Output, args: ["lookChange"] }], itemHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemHeight", required: false }] }], maxVisibleItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleItems", required: false }] }], treeSelectionBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "treeSelectionBehavior", required: false }] }], itemTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemTemplate", required: false }] }], selectedTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedTemplate", required: false }] }], emptyTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "emptyTemplate", required: false }] }], loadingTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "loadingTemplate", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], valueItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "valueItems", required: false }] }], onValueChanged: [{ type: i0.Output, args: ["onValueChanged"] }], onSelectionChanged: [{ type: i0.Output, args: ["onSelectionChanged"] }], onFocus: [{ type: i0.Output, args: ["onFocus"] }], onBlur: [{ type: i0.Output, args: ["onBlur"] }], onItemClick: [{ type: i0.Output, args: ["onItemClick"] }], onItemSelected: [{ type: i0.Output, args: ["onItemSelected"] }], onOpened: [{ type: i0.Output, args: ["onOpened"] }], onClosed: [{ type: i0.Output, args: ["onClosed"] }], popoverRef: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXPopoverComponent), { isSignal: true }] }], triggerSearchInput: [{ type: i0.ViewChild, args: ['triggerSearchInput', { isSignal: true }] }], listView: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXLookupListViewBase), { isSignal: true }] }], sheetSearchRef: [{ type: i0.ViewChild, args: ['sheetSearch', { isSignal: true }] }] } });
 
 class AXLookupModule {