najm-kit 2.11.3 → 2.11.4

package/CHANGELOG.md

@@ -1,11 +1,14 @@
 # Changelog
 
-## 2.11.3 - 2026-08-12
+## 2.11.4 - 2026-08-12
 
 - Fixed server-paginated card grids briefly rendering at a placeholder-derived
   page size before correcting to the real card height. Card mode now waits for
   real rows and publishes the measured fit before their first paint; fixed-row
   table sizing remains immediate during loading.
+
+## 2.11.3 - 2026-08-12
+
 - Fixed `NTable` replacing or clipping an explicit Rows/page choice when
   `dynamicHeight` was enabled. Automatic fit sizing still owns the initial page
   size; after the reader chooses a value, the table preserves it and scrolls

package/dist/index.mjs

@@ -11887,6 +11887,9 @@ function calculateCardPageSize(input) {
 function shouldDeferCardPageSizeUntilRows(renderedMode, hasDataRows) {
   return renderedMode === "cards" && !hasDataRows;
 }
+function shouldCommitDynamicPageSizeImmediately(reportedMode, renderedMode) {
+  return reportedMode === null || reportedMode !== renderedMode;
+}
 function fallbackCardColumns(width) {
   if (width >= 1280) return 4;
   if (width >= 1024) return 3;
@@ -11900,6 +11903,7 @@ function useDynamicPageSize(containerRef, effectiveViewMode) {
   const isLoading = useTableStore.use.isLoading();
   const error = useTableStore.use.error();
   const hasNoData = useTableStore.use.hasNoData();
+  const hasDataRows = useTableStore.use.hasData();
   const isFilteredEmpty = useTableStore.use.isFilteredEmpty();
   const syncWithProps = useTableStore.use.syncWithProps();
   const lastMeasurementRef = useRef("");
@@ -11936,7 +11940,8 @@ function useDynamicPageSize(containerRef, effectiveViewMode) {
       const cardGap = Number.parseFloat(gridStyles?.rowGap || gridStyles?.gap || "") || DEFAULT_CARD_GAP;
       const firstCard = cardsGridEl?.querySelector("[data-ntable-loading-card], [data-row]");
       const cardRowHeight = firstCard?.offsetHeight || firstCard?.getBoundingClientRect().height || DEFAULT_CARD_HEIGHT;
-      const cardPageSize = calculateCardPageSize({
+      const measuredMode = effectiveViewMode ?? viewMode;
+      const cardPageSize = shouldDeferCardPageSizeUntilRows(measuredMode, hasDataRows) ? 0 : calculateCardPageSize({
         bodyHeight,
         columnCount: cardColumnCount,
         cardHeight: cardRowHeight,
@@ -11978,7 +11983,7 @@ function useDynamicPageSize(containerRef, effectiveViewMode) {
     ).forEach((el) => resizeObserver.observe(el));
     if (container.parentElement) resizeObserver.observe(container.parentElement);
     return () => resizeObserver.disconnect();
-  }, [dynamicHeight, effectiveViewMode, viewMode, containerRef, syncWithProps, manualPagination, isLoading, error, hasNoData, isFilteredEmpty]);
+  }, [dynamicHeight, effectiveViewMode, viewMode, containerRef, syncWithProps, manualPagination, isLoading, error, hasNoData, hasDataRows, isFilteredEmpty]);
 }
 function useTable(effectiveViewModeOverride) {
   const [sorting, setSorting] = useState([]);
@@ -12149,18 +12154,14 @@ function useTable(effectiveViewModeOverride) {
     if (dynamicPageSizeTarget === storePagination.pageSize) return;
     if (shouldDeferCardPageSizeUntilRows(renderedMode, hasDataRows)) return;
     const reported = reportedGeometryRef.current;
-    if (reported?.key === geometryKey && reported.target === dynamicPageSizeTarget) return;
-    if (reported?.key === geometryKey && reported.count >= MAX_PAGE_SIZE_REPORTS_PER_GEOMETRY) return;
+    if (reported?.key === geometryKey && reported.mode === renderedMode && reported.target === dynamicPageSizeTarget) return;
+    if (reported?.key === geometryKey && reported.mode === renderedMode && reported.count >= MAX_PAGE_SIZE_REPORTS_PER_GEOMETRY) return;
     const commit = () => {
       const current = reportedGeometryRef.current;
-      reportedGeometryRef.current = current?.key === geometryKey ? { key: geometryKey, count: current.count + 1, target: dynamicPageSizeTarget } : { key: geometryKey, count: 1, target: dynamicPageSizeTarget };
+      reportedGeometryRef.current = current?.key === geometryKey && current.mode === renderedMode ? { key: geometryKey, count: current.count + 1, target: dynamicPageSizeTarget, mode: renderedMode } : { key: geometryKey, count: 1, target: dynamicPageSizeTarget, mode: renderedMode };
       setPagination({ pageIndex: storePagination.pageIndex, pageSize: dynamicPageSizeTarget });
     };
-    if (!hasDataRows) {
-      commit();
-      return;
-    }
-    if (!reported) {
+    if (shouldCommitDynamicPageSizeImmediately(reported?.mode ?? null, renderedMode)) {
       commit();
       return;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "najm-kit",
-  "version": "2.11.3",
+  "version": "2.11.4",
   "license": "MIT",
   "type": "module",
   "description": "Reusable React UI component package for Najm framework",