@praxisui/list 8.0.0-beta.85 → 8.0.0-beta.87

package/fesm2022/praxisui-list.mjs

@@ -31,7 +31,7 @@ import { MatTooltipModule } from '@angular/material/tooltip';
 import * as i1$1 from '@angular/forms';
 import { FormsModule, FormControl, ReactiveFormsModule, FormGroup } from '@angular/forms';
 import { BehaviorSubject, combineLatest, of, Subject, debounceTime, takeUntil, firstValueFrom, distinctUntilChanged as distinctUntilChanged$1, Subscription } from 'rxjs';
-import { auditTime, switchMap, map, catchError, finalize, shareReplay, debounceTime as debounceTime$1, distinctUntilChanged, tap, take, takeUntil as takeUntil$1 } from 'rxjs/operators';
+import { map, distinctUntilChanged, switchMap, catchError, finalize, shareReplay, debounceTime as debounceTime$1, tap, take, takeUntil as takeUntil$1 } from 'rxjs/operators';
 import { PraxisRichContent } from '@praxisui/rich-content';
 import { SETTINGS_PANEL_DATA, SettingsPanelService } from '@praxisui/settings-panel';
 import * as i3$3 from '@angular/material/tabs';
@@ -60,9 +60,7 @@ function evalExpr(expr, ctx, options) {
     return expr.replace(/\$\{([^}]+)\}/g, (_, raw) => {
         try {
             const { baseExpr, pipe } = splitFirstPipe(raw);
-            const value = baseExpr
-                .split('.')
-                .reduce((acc, k) => (acc == null ? undefined : acc[k]), ctx);
+            const value = resolveTemplateExpressionValue(baseExpr, ctx);
             let out = value == null ? '' : String(value);
             if (pipe) {
                 const { name, args } = parsePipe(pipe);
@@ -73,7 +71,9 @@ function evalExpr(expr, ctx, options) {
                 }
                 if (name === 'date') {
                     const [localeArg, styleArg] = parseTwoArgs(args);
-                    const dt = value ? new Date(value) : null;
+                    const dt = value
+                        ? new Date(value)
+                        : null;
                     if (dt && !isNaN(dt.getTime())) {
                         const presentation = resolveTemplatePresentation('date', {
                             localeArg,
@@ -132,6 +132,30 @@ function evalExpr(expr, ctx, options) {
         }
     });
 }
+function resolveTemplateExpressionValue(expr, ctx) {
+    const candidates = expr
+        .split(/\?\?/)
+        .map((candidate) => candidate.trim())
+        .filter(Boolean);
+    for (const candidate of candidates.length ? candidates : [expr]) {
+        const value = resolvePathValue(candidate, ctx);
+        if (isPresentTemplateValue(value)) {
+            return value;
+        }
+    }
+    return undefined;
+}
+function resolvePathValue(expr, ctx) {
+    return expr
+        .split('.')
+        .map((part) => part.trim())
+        .reduce((acc, key) => (acc == null ? undefined : acc[key]), ctx);
+}
+function isPresentTemplateValue(value) {
+    return typeof value === 'string'
+        ? value.trim().length > 0
+        : value !== undefined && value !== null;
+}
 /**
  * Evaluate a template definition with basic pipe support.
  * Supported top-level pipes:
@@ -436,8 +460,8 @@ class ListDataService {
         const changed = sig !== this.lastSig;
         this.lastSig = sig;
         if (changed) {
-            this.config$.next(config);
             const ps = config.layout?.pageSize ?? 10;
+            this.config$.next(null);
             this.pageable$.next({
                 ...this.pageable$.value,
                 pageNumber: 0,
@@ -445,6 +469,7 @@ class ListDataService {
                 sort: config.dataSource?.sort,
             });
             this.query$.next(config.dataSource?.query || {});
+            this.config$.next(config);
         }
     }
     refresh() {
@@ -458,7 +483,12 @@ class ListDataService {
                 this.pageable$,
                 this.query$,
                 this.refresh$,
-            ]).pipe(auditTime(0), switchMap(([cfg, pageable, query]) => {
+            ]).pipe(map(([cfg, pageable, query]) => ({
+                cfg,
+                pageable,
+                query,
+                signature: this.buildRequestSignature(cfg, pageable, query),
+            })), distinctUntilChanged((previous, current) => previous.signature === current.signature), switchMap(({ cfg, pageable, query }) => {
                 if (!cfg)
                     return of([]);
                 const ds = cfg.dataSource;
@@ -582,6 +612,19 @@ class ListDataService {
             localData: this.buildLocalDataSignature(dataSource?.data),
         });
     }
+    buildRequestSignature(config, pageable, query) {
+        if (!config)
+            return 'no-config';
+        const dataSource = config.dataSource;
+        return this.safeSerialize({
+            resourcePath: dataSource?.resourcePath || '',
+            localData: this.buildLocalDataSignature(dataSource?.data),
+            query: query || {},
+            pageNumber: pageable.pageNumber,
+            pageSize: pageable.pageSize,
+            sort: pageable.sort || [],
+        });
+    }
     buildLocalDataSignature(data) {
         if (!Array.isArray(data))
             return 'none';
@@ -11212,7 +11255,14 @@ class PraxisList {
     listId;
     componentInstanceId;
     configPersistenceStrategy = 'local-first';
-    queryContext;
+    runtimeQueryContext;
+    set queryContext(value) {
+        this.runtimeQueryContext = value ?? null;
+        this.applyRuntimeQueryContext();
+    }
+    get queryContext() {
+        return this.runtimeQueryContext;
+    }
     form;
     set enableCustomization(value) {
         this.customizationEnabled = value;
@@ -11971,7 +12021,8 @@ class PraxisList {
                 : [];
         const items = itemDefs
             .map((node) => this.evaluateTemplateNode(node, item, true))
-            .filter((node) => !!node);
+            .filter((node) => !!node)
+            .filter((node) => !this.isEmptyComposeNode(node));
         const direction = compose.direction ||
             (compose.orientation === 'vertical' ? 'column' : 'row');
         return {
@@ -12012,6 +12063,15 @@ class PraxisList {
             style: this.joinStyles(this.metricCssVar('--p-list-metric-progress-fill', color), this.metricCssVar('--p-list-metric-progress-track', progress.trackColor)),
         };
     }
+    isEmptyComposeNode(node) {
+        if (node.type === 'compose') {
+            return !Array.isArray(node.items) || node.items.length === 0;
+        }
+        if (node.type === 'component')
+            return false;
+        const value = node.value;
+        return value === null || value === undefined || String(value).trim() === '';
+    }
     metricLayout(metric, icon, caption, subcaption) {
         const explicit = metric?.layout;
         if (explicit)
@@ -13003,7 +13063,7 @@ class PraxisList {
     }
     applyRuntimeQueryContext() {
         this.initializeDataStreams();
-        const normalized = normalizePraxisDataQueryContext(this.queryContext);
+        const normalized = normalizePraxisDataQueryContext(this.runtimeQueryContext);
         const baseQuery = this.config?.dataSource?.query || {};
         const nextQuery = {
             ...baseQuery,
@@ -13051,6 +13111,7 @@ class PraxisList {
         if (plan.runtime?.applyConfig) {
             this.data.setConfig(this.config);
             this.lastQuery = this.config?.dataSource?.query || {};
+            this.lastRuntimeQueryContextSignature = '';
             this.applyRuntimeQueryContext();
         }
         if (plan.runtime?.rebindSelection) {
@@ -13666,9 +13727,7 @@ class PraxisList {
     }
     // trackBy helpers for ngFor
     trackBySection = (_, s) => s?.key ?? _;
-    trackByItem = (i, it) => this.config?.selection?.compareBy
-        ? (it?.[this.config.selection.compareBy] ?? i)
-        : (it?.id ?? i);
+    trackByItem = (i, it) => this.itemStableKey(it) ?? i;
     isActionLoading(actionId, item, index) {
         const key = this.buildActionLoadingKey(actionId, item, index);
         return this.actionLoadingState[key] === true;
@@ -13752,13 +13811,8 @@ class PraxisList {
         return merged;
     }
     buildActionLoadingKey(actionId, item, index) {
-        const compareBy = this.config?.selection?.compareBy;
-        const idCandidate = compareBy && item && typeof item === 'object'
-            ? item?.[compareBy]
-            : item?.id;
-        if (idCandidate !== null &&
-            idCandidate !== undefined &&
-            idCandidate !== '') {
+        const idCandidate = this.itemStableKey(item);
+        if (idCandidate !== null && idCandidate !== undefined) {
             return `${actionId}::${String(idCandidate)}`;
         }
         if (item && typeof item === 'object') {
@@ -13816,8 +13870,8 @@ class PraxisList {
         }
     }
     itemExpansionKey(item, index) {
-        const candidate = item?.id;
-        if (candidate !== null && candidate !== undefined && candidate !== '') {
+        const candidate = this.itemStableKey(item, false);
+        if (candidate !== null && candidate !== undefined) {
             return String(candidate);
         }
         if (item && typeof item === 'object') {
@@ -13825,6 +13879,36 @@ class PraxisList {
         }
         return `idx-${index}`;
     }
+    itemStableKey(item, includeSelectionCompareBy = true) {
+        if (!item || typeof item !== 'object')
+            return null;
+        const fields = [
+            includeSelectionCompareBy ? this.config?.selection?.compareBy : undefined,
+            'id',
+            'uuid',
+            'key',
+            'value',
+            'code',
+            'codigo',
+            'slug',
+            'cpf',
+            'email',
+        ].filter((field) => !!field);
+        for (const field of fields) {
+            const candidate = item?.[field];
+            if (this.isStablePrimitiveKey(candidate)) {
+                return candidate;
+            }
+        }
+        return null;
+    }
+    isStablePrimitiveKey(value) {
+        if (value === null || value === undefined || value === '')
+            return false;
+        return (typeof value === 'string' ||
+            typeof value === 'number' ||
+            typeof value === 'boolean');
+    }
     t(key, fallback) {
         return this.i18n.t(key, undefined, fallback, PRAXIS_LIST_I18N_NAMESPACE);
     }

package/package.json

@@ -1,19 +1,19 @@
 {
   "name": "@praxisui/list",
-  "version": "8.0.0-beta.85",
+  "version": "8.0.0-beta.87",
   "description": "List components and helpers for Praxis UI.",
   "peerDependencies": {
     "@angular/common": "^21.0.0",
     "@angular/core": "^21.0.0",
     "@angular/material": "^21.0.0",
-    "@praxisui/dynamic-fields": "^8.0.0-beta.85",
+    "@praxisui/dynamic-fields": "^8.0.0-beta.87",
     "rxjs": ">=7 <9",
     "@angular/forms": "^21.0.0",
     "@angular/router": "^21.0.0",
-    "@praxisui/ai": "^8.0.0-beta.85",
-    "@praxisui/core": "^8.0.0-beta.85",
-    "@praxisui/rich-content": "^8.0.0-beta.85",
-    "@praxisui/settings-panel": "^8.0.0-beta.85"
+    "@praxisui/ai": "^8.0.0-beta.87",
+    "@praxisui/core": "^8.0.0-beta.87",
+    "@praxisui/rich-content": "^8.0.0-beta.87",
+    "@praxisui/settings-panel": "^8.0.0-beta.87"
   },
   "dependencies": {
     "tslib": "^2.3.0",

package/types/praxisui-list.d.ts

@@ -401,6 +401,7 @@ declare class ListDataService<T = any> {
     getQuerySnapshot(): Record<string, any>;
     groupedStream(): Observable<ListSection<T>[]>;
     private buildConfigSignature;
+    private buildRequestSignature;
     private buildLocalDataSignature;
     private ensureObjectId;
     private safeSerialize;
@@ -464,7 +465,9 @@ declare class PraxisList implements OnInit, OnChanges, OnDestroy {
     listId: string;
     componentInstanceId?: string;
     configPersistenceStrategy: 'local-first' | 'input-first';
-    queryContext?: PraxisDataQueryContext | null;
+    private runtimeQueryContext?;
+    set queryContext(value: PraxisDataQueryContext | null | undefined);
+    get queryContext(): PraxisDataQueryContext | null | undefined;
     form?: FormGroup | null;
     set enableCustomization(value: boolean);
     get enableCustomization(): boolean;
@@ -614,6 +617,7 @@ declare class PraxisList implements OnInit, OnChanges, OnDestroy {
     private buildMetricView;
     private buildComposeView;
     private buildMetricProgress;
+    private isEmptyComposeNode;
     private metricLayout;
     private metricAlign;
     private metricIconPosition;
@@ -793,7 +797,7 @@ declare class PraxisList implements OnInit, OnChanges, OnDestroy {
     ratingIconStyle(def?: any): string;
     ratingRange(def?: any): number[];
     trackBySection: (_: number, s: ListSection<any>) => string | number;
-    trackByItem: (i: number, it: any) => any;
+    trackByItem: (i: number, it: any) => string | number | boolean;
     isActionLoading(actionId: string, item: any, index: number): boolean;
     private evaluateActionVisibility;
     private evaluateRuntimeCondition;
@@ -807,6 +811,8 @@ declare class PraxisList implements OnInit, OnChanges, OnDestroy {
     private toggleExpanded;
     private syncExpansionState;
     private itemExpansionKey;
+    private itemStableKey;
+    private isStablePrimitiveKey;
     t(key: string, fallback: string): string;
     private tWithLocale;
     private ensureExpansionItemObjectId;