@lesterarte/sefin-ui 0.0.81 → 0.0.83

package/fesm2022/lesterarte-sefin-ui.mjs

@@ -6582,7 +6582,11 @@ class TableComponent {
     /** Column definitions */
     columns = [];
     /** Table data */
-    data = [];
+    set data(value) {
+        this.dataSignal.set(value ?? []);
+    }
+    /** Internal signal for data so computed signals react to Input changes (OnPush + computed require signal deps) */
+    dataSignal = signal([], ...(ngDevMode ? [{ debugName: "dataSignal" }] : []));
     /** Property key used for tracking rows (default: 'id') */
     trackByKey = 'id';
     /** Empty state message */
@@ -6657,24 +6661,25 @@ class TableComponent {
     currentPageSize = signal(this.pageSize, ...(ngDevMode ? [{ debugName: "currentPageSize" }] : []));
     // Computed sorted and paginated data
     sortedData = computed(() => {
+        const data = this.dataSignal();
         // Early returns for performance
         if (!this.sort || !this.currentSortColumn() || this.serverSide) {
-            return this.data;
+            return data;
         }
         const column = this.columns.find((col) => col.key === this.currentSortColumn());
         if (!column || !column.sortable) {
-            return this.data;
+            return data;
         }
         const direction = this.currentSortDirection();
         if (!direction) {
-            return this.data;
+            return data;
         }
         // Early return if no data to sort
-        if (!this.data || this.data.length === 0) {
-            return this.data;
+        if (!data || data.length === 0) {
+            return data;
         }
         // Create a copy to avoid mutating original data
-        const sorted = [...this.data].sort((a, b) => {
+        const sorted = [...data].sort((a, b) => {
             const aValue = this.getCellValue(a, column);
             const bValue = this.getCellValue(b, column);
             // Handle null/undefined values - place them at the end
@@ -6791,8 +6796,11 @@ class TableComponent {
             else if (page !== undefined && page < 1) {
                 this.currentPage.set(1);
             }
+            // OnPush: ensure view updates when parent syncs page (e.g. server-side, navigating back to cached page).
+            this.cdr.markForCheck();
         }
-        if (changes['data'] && this.serverSide) {
+        if (changes['data']) {
+            // OnPush: ensure view updates when parent passes new data (e.g. new reference when navigating back to cached page).
             this.cdr.markForCheck();
         }
         if (changes['columns'] || changes['data']) {