@acorex/platform 20.9.9 → 20.9.11

package/fesm2022/acorex-platform-layout-widgets.mjs

@@ -7182,6 +7182,9 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
         this.destroyRef = inject(DestroyRef);
         /** Toggled to force ax-select-box to re-render after locale / language changes. */
         this.selectBoxKey = signal(true, ...(ngDevMode ? [{ debugName: "selectBoxKey" }] : /* istanbul ignore next */ []));
+        /** Registry list query runs only after the user interacts (not on form mount). */
+        this.listLoadEnabled = signal(false, ...(ngDevMode ? [{ debugName: "listLoadEnabled" }] : /* istanbul ignore next */ []));
+        this.isLazyRegistrySelect = computed(() => !this.filterMode() && !!this.registryDataSourceName(), ...(ngDevMode ? [{ debugName: "isLazyRegistrySelect" }] : /* istanbul ignore next */ []));
         this.selectBoxLocaleChanged = merge(this.translationService.langChanges$, this.localeService.profileChanged$)
             .pipe(takeUntilDestroyed(this.destroyRef))
             .subscribe(() => this.rerenderSelectBox());
@@ -7203,6 +7206,33 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
         this.isItemTruncated = computed(() => this.options()['isItemTruncated'] ?? true, ...(ngDevMode ? [{ debugName: "isItemTruncated" }] : /* istanbul ignore next */ []));
         this.filter = computed(() => this.options()['filter'], ...(ngDevMode ? [{ debugName: "filter" }] : /* istanbul ignore next */ []));
         this.filterMode = computed(() => this.options()['filterMode'] ?? false, ...(ngDevMode ? [{ debugName: "filterMode" }] : /* istanbul ignore next */ []));
+        /**
+         * True when a cascade/parent filter is configured but required values are still empty
+         * (e.g. state select before country is chosen).
+         */
+        this.hasPendingCascadeFilter = computed(() => {
+            if (this.filterMode()) {
+                return false;
+            }
+            const rawFilter = this.filter();
+            if (!rawFilter) {
+                return false;
+            }
+            return AXPCleanNestedFilters([rawFilter]).length === 0;
+        }, ...(ngDevMode ? [{ debugName: "hasPendingCascadeFilter" }] : /* istanbul ignore next */ []));
+        /**
+         * Registry-backed selects defer list loading until the user opens the dropdown.
+         * Existing values are still resolved via `byKey` in the base widget.
+         */
+        this.shouldDeferListLoad = computed(() => this.isLazyRegistrySelect() && !this.listLoadEnabled(), ...(ngDevMode ? [{ debugName: "shouldDeferListLoad" }] : /* istanbul ignore next */ []));
+        /** Only swap datasource when cascade parent is missing; defer load via patched `load` instead. */
+        this.effectiveDataSource = computed(() => {
+            if (this.hasPendingCascadeFilter()) {
+                return AXPSelectBoxWidgetEditComponent.emptyDataSource;
+            }
+            return this.dataSource();
+        }, ...(ngDevMode ? [{ debugName: "effectiveDataSource" }] : /* istanbul ignore next */ []));
+        this.isSelectBoxDisabled = computed(() => this.disabled() || this.hasPendingCascadeFilter(), ...(ngDevMode ? [{ debugName: "isSelectBoxDisabled" }] : /* istanbul ignore next */ []));
         /** For filter mode: display valueField from object to avoid [object Object] when value is stored as full item */
         this.selectFilterDisplayValue = computed(() => {
             const raw = this.getValue();
@@ -7269,21 +7299,31 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
                 }
             }
         }, ...(ngDevMode ? [{ debugName: "#focusEffect" }] : /* istanbul ignore next */ []));
-        this.#effect = effect(() => {
-            if (this.filter()) {
-                const cleanedFilters = AXPCleanNestedFilters([this.filter()]);
-                if (cleanedFilters.length > 0) {
-                    untracked(() => {
-                        setTimeout(() => {
-                            const normalized = this.filterMode()
-                                ? this.normalizeFilterValues(cleanedFilters[0])
-                                : cleanedFilters[0];
-                            this.dataSource()?.filter(normalized);
-                        });
-                    });
-                }
+        /** Applies widget filter to the isolated datasource whenever options change (cascade parent id). */
+        this.#filterEffect = effect(() => {
+            const filterOption = this.filter();
+            const registryReady = this.registryDataSourceReady();
+            if (!registryReady || !filterOption || this.filterMode() || this.hasPendingCascadeFilter()) {
+                return;
             }
-        }, ...(ngDevMode ? [{ debugName: "#effect" }] : /* istanbul ignore next */ []));
+            const widgetFilter = this.resolveActiveWidgetFilter();
+            if (!widgetFilter) {
+                return;
+            }
+            untracked(() => {
+                this.dataSource()?.filter(widgetFilter);
+            });
+        }, ...(ngDevMode ? [{ debugName: "#filterEffect" }] : /* istanbul ignore next */ []));
+        this.#registryDataSourceEffect = effect(() => {
+            const registryReady = this.registryDataSourceReady();
+            const registryName = this.registryDataSourceName();
+            if (!registryReady || !registryName || this.filterMode()) {
+                return;
+            }
+            untracked(() => {
+                this.patchRegistryDataSourceLoad();
+            });
+        }, ...(ngDevMode ? [{ debugName: "#registryDataSourceEffect" }] : /* istanbul ignore next */ []));
         this.#clearOnDataSourceChangedEffect = effect(() => {
             const currentDataSource = this.options()['dataSource'];
             if (!this.hasSeenDataSource) {
@@ -7301,6 +7341,7 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
             this.refresh();
         }, ...(ngDevMode ? [{ debugName: "#clearOnDataSourceChangedEffect" }] : /* istanbul ignore next */ []));
     }
+    static { this.emptyDataSource = convertArrayToDataSource([]); }
     /**
      * In filter mode the stored value is wrapped as `{ value, operation, displayText }`.
      * Item resolution in the base widget needs the unwrapped key(s), so expose the same
@@ -7428,12 +7469,15 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
     handleSearchValueChange(e) {
         if (e.isUserInteraction) {
             this.searchValue.set(e.value);
+            if (this.shouldDeferListLoad()) {
+                return;
+            }
+            const baseFilter = this.resolveActiveWidgetFilter();
             const searchFilter = this.filterOperatorMiddleware.transformFilter({
                 field: this.textField(),
                 operator: { type: 'contains' },
                 value: e.value,
             });
-            const baseFilter = this.filter() ? AXPCleanNestedFilters([this.filter()])[0] : null;
             let mergedFilter = searchFilter;
             if (baseFilter) {
                 if (this.searchValue() !== undefined) {
@@ -7453,20 +7497,74 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
             this.dataSource()?.refresh();
         }
     }
-    #effect;
+    /** Normalized, middleware-ready filter for the current widget options (or null). */
+    resolveActiveWidgetFilter() {
+        const filterOption = this.filter();
+        if (!filterOption) {
+            return null;
+        }
+        const cleanedFilters = AXPCleanNestedFilters([filterOption]);
+        if (cleanedFilters.length === 0) {
+            return null;
+        }
+        return this.filterOperatorMiddleware.transformFilter(this.normalizeDataSourceFilter(cleanedFilters[0]));
+    }
+    /** Applies widget filter to the isolated datasource whenever options change (cascade parent id). */
+    #filterEffect;
+    #registryDataSourceEffect;
+    /**
+     * Patches registry `load` to defer list fetch until the user opens the dropdown.
+     * Filtering is handled via {@link #filterEffect} on the datasource (lookup-select pattern).
+     */
+    patchRegistryDataSourceLoad() {
+        const ds = this.dataSource();
+        const config = ds?.config;
+        if (!config?.load || config.__axpSelectFilterPatched) {
+            return;
+        }
+        const originalLoad = config.load.bind(ds);
+        config.load = async (event) => {
+            if (this.shouldDeferListLoad() || this.hasPendingCascadeFilter()) {
+                return { items: [], total: 0 };
+            }
+            return originalLoad(event);
+        };
+        config.__axpSelectFilterPatched = true;
+    }
     #clearOnDataSourceChangedEffect;
+    // TODO: Duplicate registry list API calls — opening a cascade select (or country-change refresh)
+    // currently triggers two loads (e.g. dataSource.refresh + selectBox.refresh, and/or #filterEffect
+    // plus refresh/enableListLoad). Coalesce to a single load path without breaking cascade filter refresh.
     refresh() {
         setTimeout(() => {
             this.searchValue.set(undefined);
+            this.applyActiveFilterToDataSource();
+            this.listLoadEnabled.set(true);
+            this.dataSource()?.refresh();
             this.selectBox()?.refresh();
-        }, 100);
+        }, 0);
+    }
+    /** Push the current widget filter onto the isolated datasource. */
+    applyActiveFilterToDataSource() {
+        const widgetFilter = this.resolveActiveWidgetFilter();
+        if (widgetFilter) {
+            this.dataSource()?.filter(widgetFilter);
+        }
+    }
+    /** Allow the patched datasource `load` before the dropdown panel opens. */
+    enableListLoad() {
+        if (this.filterMode() || this.hasPendingCascadeFilter() || !this.isLazyRegistrySelect()) {
+            return;
+        }
+        this.listLoadEnabled.set(true);
+        this.applyActiveFilterToDataSource();
     }
     /** Re-mount ax-select-box so translate pipe picks up the active locale. */
     rerenderSelectBox() {
         this.refreshRegistryDataSource();
+        this.listLoadEnabled.set(false);
         this.selectBoxKey.set(false);
         setTimeout(() => {
-            this.dataSource()?.refresh();
             this.selectBoxKey.set(true);
             setTimeout(() => this.selectBox()?.refresh(), 0);
         }, 0);
@@ -7510,6 +7608,27 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
     singleOrMultiple(values) {
         return this.multiple() ? values : values[0];
     }
+    /**
+     * Normalizes filter payloads for datasource queries: unwraps filter-mode values and
+     * reduces selected row objects to scalar keys (default `id`).
+     */
+    normalizeDataSourceFilter(filter) {
+        if (!filter) {
+            return filter;
+        }
+        let normalized = this.filterMode() ? this.normalizeFilterValues(filter) : filter;
+        if (Array.isArray(normalized.filters) && normalized.filters.length > 0) {
+            return {
+                ...normalized,
+                filters: normalized.filters.map((entry) => this.normalizeDataSourceFilter(entry)),
+            };
+        }
+        const extracted = extractValue(normalized.value, 'id');
+        if (extracted != null && extracted !== normalized.value) {
+            normalized = { ...normalized, value: extracted };
+        }
+        return normalized;
+    }
     /**
      * In filterMode, widget context stores values as `{ value, operation, displayText }`.
      * DataSource filtering expects the raw scalar/array value, so unwrap `value.value`.
@@ -7540,8 +7659,8 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
     } @else if (selectBoxKey()) {
       <ax-select-box
         [placeholder]="(placeholder() | translate | async) ?? ''"
-        [dataSource]="dataSource()"
-        [disabled]="disabled()"
+        [dataSource]="effectiveDataSource()"
+        [disabled]="isSelectBoxDisabled()"
         [valueField]="valueField()"
         [textField]="textField()"
         [textTemplate]="textTemplate()"
@@ -7550,6 +7669,8 @@ class AXPSelectBoxWidgetEditComponent extends AXPDataListWidgetComponent {
         [showItemTooltip]="showItemTooltip()"
         [isItemTruncated]="isItemTruncated()"
         [ngModel]="selectBoxModel()"
+        (mousedown)="enableListLoad()"
+        (focus)="enableListLoad()"
         (onValueChanged)="handleValueChange($event)"
       >
         @if (allowSearch()) {
@@ -7579,8 +7700,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
     } @else if (selectBoxKey()) {
       <ax-select-box
         [placeholder]="(placeholder() | translate | async) ?? ''"
-        [dataSource]="dataSource()"
-        [disabled]="disabled()"
+        [dataSource]="effectiveDataSource()"
+        [disabled]="isSelectBoxDisabled()"
         [valueField]="valueField()"
         [textField]="textField()"
         [textTemplate]="textTemplate()"
@@ -7589,6 +7710,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
         [showItemTooltip]="showItemTooltip()"
         [isItemTruncated]="isItemTruncated()"
         [ngModel]="selectBoxModel()"
+        (mousedown)="enableListLoad()"
+        (focus)="enableListLoad()"
         (onValueChanged)="handleValueChange($event)"
       >
         @if (allowSearch()) {