@fuentis/phoenix-ui 0.0.9-alpha.638 → 0.0.9-alpha.640

package/fesm2022/fuentis-phoenix-ui.mjs

@@ -2056,7 +2056,13 @@ class TableCaptionComponent {
         }
         // Normalize filters (backward compatible) before building form
         const normalizedFilters = this.normalizeFilters(this.filters);
-        const signature = this.buildSignature(this.tableConfiguration.key, normalizedFilters);
+        // Key the rebuild signature on the storage identity (FILTER_KEY), not just
+        // the table key. Sibling tabs that share the same filter columns (e.g. IT
+        // Systems vs Virtualization) but persist under different stateKeys must
+        // rebuild — and thus re-restore — when switched between while the caption
+        // instance is reused; otherwise the reused form keeps the previous tab's
+        // values and the persisted filter looks lost until a full reload.
+        const signature = this.buildSignature(this.FILTER_KEY, normalizedFilters);
         if (signature !== this.lastSignature) {
             this.lastSignature = signature;
             this.buildFiltersForm(normalizedFilters);
@@ -2119,8 +2125,9 @@ class TableCaptionComponent {
             const raw = this.filtersForm.getRawValue();
             const payload = this.normalizeOutgoingPayload(raw, filtersCfg);
             this.applyFiltersEvent.emit(payload);
+            // Initial/restore emit — save if there's something, but never DELETE here.
             if (hasFilterConfig)
-                this.persistState(payload, this.FILTER_KEY);
+                this.persistState(payload, this.FILTER_KEY, false);
         });
     }
     /**
@@ -2147,11 +2154,19 @@ class TableCaptionComponent {
     }
     buildSignature(tableKey, filtersCfg) {
         const keys = (filtersCfg ?? [])
-            .map((f) => 
-        // Range bounds are data-derived and can change without the key set
-        // changing; fold them into the signature so the form rebuilds when
-        // the min/max move.
-        f.type === 'range' ? `${f.key}:${f.min}-${f.max}` : f.key)
+            .map((f) => {
+            // Range bounds are data-derived and can change without the key set
+            // changing; fold them into the signature so the form rebuilds when
+            // the min/max move.
+            if (f.type === 'range')
+                return `${f.key}:${f.min}-${f.max}`;
+            // Options arrive after the data loads. Fold their presence in so the
+            // form rebuilds — and re-restores against real options — once they're
+            // available, instead of staying with the value dropped on the first
+            // (option-less) build.
+            const hasOptions = Array.isArray(f.options) && f.options.length > 0;
+            return `${f.key}${hasOptions ? ':o' : ''}`;
+        })
             .join('|');
         return `${tableKey ?? 'table'}::${keys}`;
     }
@@ -2176,7 +2191,8 @@ class TableCaptionComponent {
         if (Object.keys(patch).length > 0) {
             this.filtersForm.patchValue(patch, { emitEvent: true });
             const payload = this.normalizeOutgoingPayload(this.filtersForm.getRawValue(), cfg);
-            this.persistState(payload, this.FILTER_KEY);
+            // Programmatic valid-values sync — update, but never delete.
+            this.persistState(payload, this.FILTER_KEY, false);
         }
     }
     normalizeMultiInitial(selected) {
@@ -2388,10 +2404,11 @@ class TableCaptionComponent {
                 }
             }
             this.filtersForm.patchValue(patch, { emitEvent: false });
-            // Persist the pruned state so stale (non-existent) values don't linger in storage.
+            // Persist the pruned state so stale (non-existent) values don't linger in
+            // storage — but never DELETE here (empty after pruning ≠ user cleared).
             if (changed) {
                 const payload = this.normalizeOutgoingPayload(this.filtersForm.getRawValue(), cfg);
-                this.persistState(payload, this.FILTER_KEY);
+                this.persistState(payload, this.FILTER_KEY, false);
             }
         }
         catch {
@@ -2495,16 +2512,23 @@ class TableCaptionComponent {
         localStorage.removeItem(this.FILTER_KEY);
         this.filtersPopover?.hide();
     }
-    persistState(state, key) {
+    persistState(state, key, allowDelete = true) {
         const isEmpty = state == null ||
             (Array.isArray(state) && state.length === 0) ||
             (typeof state === 'object' &&
                 !Array.isArray(state) &&
                 Object.keys(state).length === 0);
-        if (isEmpty)
-            localStorage.removeItem(key);
-        else
-            localStorage.setItem(key, JSON.stringify(state));
+        if (isEmpty) {
+            // Only a USER-initiated clear (valueChanges) may delete a saved filter.
+            // Programmatic emits (initial rebuild, valid-values pruning, restore
+            // pruning) pass allowDelete=false, so a transient empty form — e.g. a
+            // caption rebuilt before its options loaded, which drops the restored
+            // value — never wipes a perfectly good persisted filter.
+            if (allowDelete)
+                localStorage.removeItem(key);
+            return;
+        }
+        localStorage.setItem(key, JSON.stringify(state));
     }
     getOptionLabelField(control) {
         return (control?.optionLabel ?? 'label');