@multiplatform.one/table 6.6.0 → 7.0.0

package/dist/esm/components/DataTable/DataTableMobileCards.native.js

@@ -9,7 +9,10 @@ import { useTranslation } from "react-i18next";
 import { TableCellContext } from "@multiplatform.one/table-primitives";
 import { withInterp } from "../../utils/withInterp.native.js";
 function getColumnLabel(cell) {
+  var _columnDef_meta;
   var columnDef = cell.column.columnDef;
+  var metaLabel = (_columnDef_meta = columnDef.meta) === null || _columnDef_meta === void 0 ? void 0 : _columnDef_meta.label;
+  if (typeof metaLabel === "string" && metaLabel) return metaLabel;
   return typeof columnDef.header === "string" ? columnDef.header : columnDef.id || cell.column.id;
 }
 function DataTableMobileCards(param) {
@@ -30,7 +33,8 @@ function DataTableMobileCards(param) {
     onToggleSelectAll,
     compact = false,
     selectRowLabel,
-    getRowPressProps
+    getRowPressProps,
+    queryInFlight = false
   } = param;
   var {
     t
@@ -178,7 +182,7 @@ function DataTableMobileCards(param) {
         color: "$color10",
         children: t("Select all")
       })]
-    }), tableRows.length === 0 ? /* @__PURE__ */_jsx(EmptyState, {
+    }), tableRows.length === 0 ? queryInFlight ? null : /* @__PURE__ */_jsx(EmptyState, {
       compact: true,
       backgroundColor: "$color1",
       ...knobProps.borderRadius,

package/dist/esm/components/DataTable/DataTableMobileCards.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","TrashIcon","EmptyState","Button","Checkbox","hairline","useResolvedKnobs","useCallback","Text","View","XStack","useTranslation","TableCellContext","withInterp","getColumnLabel","cell","columnDef","column","header","id","DataTableMobileCards","param","tableRows","enableRowSelection","showRowNumbers","showDeleteRow","readOnly","disabled","dataLength","minRows","hasActiveFilters","renderCellContent","onDeleteRow","selectAllChecked","selectAllIndeterminate","onToggleSelectAll","compact","selectRowLabel","getRowPressProps","t","knobProps","tableZebraOn","tableZebra","renderMobileCard","row","index","_ref","rowData","original","visibleCells","getVisibleCells","titleCell","detailCells","showDelete","testID","surface","cardSurface","elevation","borderColor","backgroundColor","children","alignItems","gap","length","paddingBottom","marginBottom","bottom","borderBottomColor","checked","getIsSelected","onChange","toggleSelected","checkboxProps","flex","minWidth","Provider","value","inTableCell","isHeader","fontSize","sizeToken","color","fontWeight","chromeless","circular","size","icon","onPress","map","flexDirection","paddingVertical","width","flexShrink","shouldSelect","borderRadius","title"],"sources":["../../../../src/components/DataTable/DataTableMobileCards.tsx"],"sourcesContent":[null],"mappings":"AAiBA,SAASA,GAAA,IAAAC,IAAA,EAAAC,IAAiB,IAAAC,KAAA;AAC1B,SAASC,SAAA,+BAAkB;AAC3B,SAASC,UAAQ,uCAAgB;AACjC,SAASC,MAAA,EAAAC,QAAU,kCAAwB;AAE3C,SAASC,QAAA,EAAAC,gBAAmB;AAC5B,SAASC,WAAM,QAAM,OAAc;AACnC,SAASC,IAAA,EAAAC,IAAA,EAAAC,MAAA,QAAsB;AAC/B,SAASC,cAAA,uBAAwB;AAEjC,SAASC,gBAAA,QAAkB;AAiGb,SAAAC,UAgCA,QAhCA;AA9Fd,SAASC,eAAeC,IAAA,EAAmB;EACzC,IAAAC,SAAM,GAAAD,IAAY,CAAAE,MAAK,CAAAD,SAAO;EAC9B,OAAO,OAAOA,SAAA,CAAUE,MAAA,KAAW,WAAWF,SAAA,CAAUE,MAAA,GAASF,SAAA,CAAUG,EAAA,IAAMJ,IAAA,CAAKE,MAAA,CAAOE,EAAA;AAC/F;AAiCO,SAASC,qBAAwDC,KAAA;EACtE;IAAAC,SAAA;IAAAC,kBAAA;IAAAC,cAAA;IAAAC,aAAA;IAAAC,QAAA;IAAAC,QAAA;IAAAC,UAAA;IAAAC,OAAA;IAAAC,gBAAA;IAAAC,iBAAA;IAAAC,WAAA;IAAAC,gBAAA;IAAAC,sBAAA;IAAAC,iBAAA;IAAAC,OAAA;IAAAC,cAAA;IAAAC;EAAA,IAAAjB,KAAA;EACA;IAAAkB;EAAA,IAAA5B,cAAqB;EACrB;IAAA6B;EAAA,IAAAlC,gBAAA;EACA,IAAAmC,YAAA,GAAAD,SAAA,CAAAE,UAAA;EACA,IAAAC,gBAAA,GAAApC,WAAA,WAAAqC,GAAA,EAAAC,KAAA;IACA,IAAAC,IAAA;IACA,IAAAC,OAAA,GAAAH,GAAA,CAAAI,QAAA;IACA,IAAAC,YAAA,GAAAL,GAAA,CAAAM,eAAA;IACA,KAAAC,SAAA,KAAAC,WAAA,IAAAH,YAAA;IACA,IAAAI,UAAA,GAAA5B,aAAA,KAAAC,QAAA;IACA,sBAAA1B,KAAA,CAAAS,IAAA;MACA6C,MAAA,mBAAmB;MACnB,GAAAd,SAAA,CAAAe,OAAA;MACA,GAAAf,SAAA,CAAAgB,WAAA;MACAC,SAAU,EAAAjB,SAAA,CAAAiB,SAAA;MACVC,WAAA;MACA,IAAAjB,YAAA,IAAAI,KAAA;QACmCc,eAAA;MACnC,IAAQ,EAAE;MACV,GAAM;QACA,kBAAe,EAAAlB,YAAU,GAAAI,KAAe;MAE9C;MACG,IAAAP,gBAA4B,GAAAA,gBAAA,CAAAM,GAAA,EAAAC,KAAA;MAC3Be,QAAM,GACN;MACA,eAAkB5D,KAAG,CAAAU,MAAA,EAAW;QAChCmD,UAAM,UAAa;QAEnBC,GACE;QAAC,IAAAV,WAAA,CAAAW,MAAA;UAAAC,aAAA;UAECC,YAAO;UACN,GAAG5D,QAAU,CAAA6D,MAAA;UACbC,iBAAa;QACd;QACAP,QAAA,GACCrC,kBAAoB,mBAAoBzB,IAAA,CAAAM,QAAA;UACpCgE,OAAA,EAAAxB,GAAA,CAAAyB,aAAA;UACHC,QAAA,WAAoBA,SAAAF,OAAgB;YACtC,IAAAzC,QAAA;YACKiB,GAAA,CAAA2B,cAAoB,GAAAH,OAAA;UAGzB;UAAAzC,QAAA;UAAC6C,aAAA;YAAA,eAAA1B,IAAA,GAAAT,cAAA,aAAAA,cAAA,uBAAAA,cAAA,CAAAO,GAAA,EAAAC,KAAA,eAAAC,IAAA,cAAAA,IAAA,GAAAjC,UAAA,CAAA0B,CAAA;cACCK,GAAA,EAAAC,KAAW;YACX;cACCD,GAAI,EAAAC,KAAA,GAAY;YACb;UACiB;UACDT;QACF,IACOe,SAEpB,kBAAArD,IAAA,CAAAW,IAAA;UAAAgE,IAEJ;UAAAC,QAAA;UACC,YAAC,EAAA5D,cAAA,CAAAqC,SAAA;UAAA;YAAA,gBACU;UAAkB;UAEzBS,QAAA,iBAAc9D,IAAA,CAAAc,gBAAA,CAAA+D,QAAA;YACdC,KAAA;cAA4BC,WAC9B;cAAAC,QACA;YAAA;YACelB,QACb,EAAA7B,iBACE,CAAAoB,SAAA,EAAiBN,KAAK,EAAAE,OAAK;UAC6B;QACzC,oBACdjD,IAAA,CAAAW,IAAA;UAAAgE,IAAA;QACL,IACAjD,cAAA,mBAAAxB,KAAA,CAAAQ,IAAA;UAAAuE,QACF,EAAAvC,SAAA,CAAAwC,SAAA;UAAAC,KAED,YACC;UAAAC,UAAC;UAAAtB,QAAA,QACOf,KAAA,GACN;QACoC,IACHQ,UAEjC,mBAAAvD,IAAA,CAAAK,MAAC;UAEDgF,UAAA;UAAAC,QAGF;UAAeC,IAEhB;UACwEC,IAAA,EAAArF,SAAA;UAAA0B,QACnE,EAAAA,QAAQ,IAAAC,UAAA,IAAAC,OAAA;UAAA0D,OACZ,WAAAA,QAAA;YAAA,OAEDvD,WACC,CAAAa,KAAA;UAAA;UAAC,cAAAhC,UAAA,CAAA0B,CAAA;YAAAK,GAAA,EAAAC,KACC;UAAU;YACFD,GAAA,EAAAC,KACR,GAAK;UAAA;QACC;MAE0B,IACoC;MACrDO,WAAA,CAAAoC,GACd,WAAAzE,IAAA;QAAA,sBAAAf,KAAA,CAAAS,IAAA;UAAAgF,aACH;UAAA5B,UAAA;UAAA6B,eAAA;UAEJ5B,GAAA;UAGCF,QAAA,GACE,eAAA9D,IAAA,CAAAU,IAAA;YAAAuE,QAAA,EAAAvC,SAAA,CAAAwC,SAAA;YAECC,KAAA,YAAc;YACdC,UAAA,EAAW;YACXS,KAAA;YACAC,UAAI;YAEJhC,QAAA,EAAA9C,cAAA,CAAAC,IAAA;UAAA,mBAACjB,IAAA,CAAAW,IAAA;YAAAgE,IAAA;YAAAC,QACC;YAAoBd,QACpB,iBAAM9D,IAAA,CAAAc,gBAAA,CAAA+D,QAAA;cAAAC,KACN;gBAAWC,WACL;gBAAAC,QACN;cAAY;cAEQlB,QAAA,EAAA7B,iBAAA,CAAAhB,IAAA,EAAA8B,KAAA,EAAAE,OAAA;YAAA;UACtB;QAKA,GAAAhC,IAAA,CAAAI,EAAA;MAAA;IAEH,MAAAyB,GAAA,CAAAzB,EAAA,IAAA0B,KAAA;EAAA,IAAAtB,kBArGiB,EAAKC,cAsGzB,EAEJC,aAAA,EACAC,QAAA,EAAAC,QACE,EAAAC,UACA,EAAAC,OACA,EAAAE,iBACA,EAAAC,WACA,EAAAI,OACA,EAAAI,SACA,EAAAC,YACA,EAAAF,CAAA,EACAF,cACA,EAAAC,gBACA;EACA,OACA,eAAAtC,KAAA,CAAAS,IAAA;IAAAgF,aACA;IAAA,GACAjD,SAAA,CAAAsB,GAAA;IACFR,MAAA;IACF;IAEA;IACG,IAAAhB,gBAAA;MAAA;IAAA,IACC;IAAcsB,QACV,GACJrC,kBAAO,IAAAD,SAAA,CAAAyC,MAAA,uBAAA/D,KAAA,CAAAU,MAAA;MAGNmD,UAAI,UAAoB;MAExBC,GAAA;MAAAE,aAAA;MAEGJ,QAAA,kBAAC9D,IAAA,CAAAM,QAAA;QAAAgE,OAAA,EAAAlC,sBAAA,qBAAAD,gBAAA;QAAAqC,QACC,WAASA,SAAAF,OAAA,EAAyB;UAClC,IAAAzC,QAAW,IAAAyC,OAAY;UACrB,IAAAyB,YAAI,GAAYzB,OAAA,KAAY;UAC5B,IAAAyB,YAAM,KAAA5D,gBAA2B,EAAAE,iBAAA,aAAAA,iBAAA,uBAAAA,iBAAA;QACjC;QAA2DR,QAC7D;QAAA6C,aACA;UACA,cAAAjC,CAAe,kBAAkB;QAAmB;QACpDH;MACF,IACA,eAAAtC,IAAC,CAAAU,IAAA;QAGHuE,QAAA,EAAAvC,SAAA,CAAAwC,SAAA;QAEDC,KAAA,EAAU,UAAW;QACnBrB,QAAA,EAAArB,CAAA;MAAA;IACQ,IACSjB,SACZ,CAAAyC,MAAA,KAAU,mBAAAjE,IAAA,CAAAI,UAAA;MAAAkC,OACd;MAAUuB,eACH;MAAgE,GAAAnB,SAAA,CAAAsD,YAAA;MACzE,WAEA,UAAe;MAAwDC,KAAA,EAAAjE,gBAAA,GAAAS,CAAA,uBAAAA,CAAA;IAAA,KAAAjB,SAAA,CAAAkE,GAAA,WAAA5C,GAAA,EAAAC,KAAA;MAE3E,OAAAF,gBAAA,CAAAC,GAAA,EAAAC,KAAA;IAEJ","ignoreList":[]}
+{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","TrashIcon","EmptyState","Button","Checkbox","hairline","useResolvedKnobs","useCallback","Text","View","XStack","useTranslation","TableCellContext","withInterp","getColumnLabel","cell","_columnDef_meta","columnDef","column","metaLabel","meta","label","header","id","DataTableMobileCards","param","tableRows","enableRowSelection","showRowNumbers","showDeleteRow","readOnly","disabled","dataLength","minRows","hasActiveFilters","renderCellContent","onDeleteRow","selectAllChecked","selectAllIndeterminate","onToggleSelectAll","compact","selectRowLabel","getRowPressProps","queryInFlight","t","knobProps","tableZebraOn","tableZebra","renderMobileCard","row","index","_ref","rowData","original","visibleCells","getVisibleCells","titleCell","detailCells","showDelete","testID","surface","cardSurface","elevation","borderColor","backgroundColor","children","alignItems","gap","length","paddingBottom","marginBottom","bottom","borderBottomColor","checked","getIsSelected","onChange","toggleSelected","checkboxProps","flex","minWidth","Provider","value","inTableCell","isHeader","fontSize","sizeToken","color","fontWeight","chromeless","circular","size","icon","onPress","map","flexDirection","paddingVertical","width","flexShrink","shouldSelect","borderRadius","title"],"sources":["../../../../src/components/DataTable/DataTableMobileCards.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/components/DataTable/DataTableRoot.mjs

@@ -1,5 +1,5 @@
 import { CaretDownIcon, CaretLeftIcon, CaretRightIcon, CaretUpDownIcon, PlusIcon, TrashIcon } from "@phosphor-icons/react";
-import { Button, Checkbox, Field, Spinner, useFormField, zIndex } from "@multiplatform.one/forms";
+import { Button, Checkbox, Field, useFormField } from "@multiplatform.one/forms";
 import { flexRender } from "@tanstack/react-table";
 import { useVirtualizer } from "@tanstack/react-virtual";
 import { ensureFocusVisibleRing, useResolvedKnobs } from "@multiplatform.one/theme";
@@ -22,7 +22,9 @@ import { DataTableContext } from "./DataTableContext.mjs";
 import { DataTableStateContext } from "./DataTableStateContext.mjs";
 import { DataTableCardControls } from "./DataTableCardControls.mjs";
 import { DataTableMobileCards } from "./DataTableMobileCards.mjs";
+import { DataTableDocumentList } from "./DataTableDocumentList.mjs";
 import { DataTableVirtualized } from "./DataTableVirtualized.mjs";
+import { tableCellKeyboardProps, tableRowStateProps } from "./rowStateChrome.mjs";
 import { alignToFlex, getDefaultColumnAlign } from "../../utils/columnAlign.mjs";
 import { mapFieldToFilterType } from "../../utils/filterFields.mjs";
 import { INFINITE_TRIGGER_ROWS } from "../../utils/paginationDefaults.mjs";
@@ -48,8 +50,11 @@ function DataTableRoot({
   data,
   columns,
   initialState,
+  controlledState,
   onStateChange,
   onRetry,
+  isLoading: isLoadingProp,
+  isFetching: isFetchingProp,
   syncWithUrl = false,
   urlDebounceMs = 500,
   urlStrategy,
@@ -116,7 +121,8 @@ function DataTableRoot({
   const {
     sm
   } = useMedia();
-  const showCards = layout === "cards" || layout === "auto" && sm === false;
+  const showList = layout === "list";
+  const showCards = !showList && (layout === "cards" || layout === "auto" && sm === false);
   const {
     knobProps,
     disabledState
@@ -146,6 +152,7 @@ function DataTableRoot({
     data,
     columns,
     initialState,
+    controlledState,
     onStateChange,
     syncWithUrl,
     urlDebounceMs,
@@ -177,7 +184,9 @@ function DataTableRoot({
     enableKeyboardNavigation,
     enableRowSelection,
     rowCount,
-    pageCount
+    pageCount,
+    isLoading: isLoadingProp,
+    isFetching: isFetchingProp
   });
   const resolvedBulkActions = bulkActions ?? [];
   const selectAllChecked = enableRowSelection && (selectAllScope === "filtered" ? table.getIsAllRowsSelected() : table.getIsAllPageRowsSelected());
@@ -195,9 +204,15 @@ function DataTableRoot({
   const rowModelRows = table.getRowModel().rows;
   const infinite = computed.infinite;
   const tableRows = infinite ? rowModelRows.slice(0, infinite.visibleRowCount) : rowModelRows;
+  const heldRowsRef = useRef(tableRows);
+  if (tableRows.length > 0) {
+    heldRowsRef.current = tableRows;
+  }
+  const queryInFlight = Boolean(state.isFetching || state.isPlaceholderData || infinite?.isAppending || state.isLoading || infinite?.isInitialLoading);
+  const displayRows = tableRows.length > 0 ? tableRows : queryInFlight && heldRowsRef.current.length > 0 ? heldRowsRef.current : tableRows;
   const footerGroups = table.getFooterGroups();
   const hasFooter = footerGroups.some(group => group.headers.some(header => header.column.columnDef.footer != null));
-  const allRowsLength = tableRows.length + headerGroups.length + (hasFooter ? footerGroups.length : 0);
+  const allRowsLength = displayRows.length + headerGroups.length + (hasFooter ? footerGroups.length : 0);
   const rowCounter = useRef(-1);
   rowCounter.current = -1;
   const getColSizeProps = useCallback(col => {
@@ -252,7 +267,7 @@ function DataTableRoot({
   const isVirtualized = enableVirtualization && virtualizationHeight != null && virtualizationHeight > 0 && isWeb;
   const hasInfiniteTail = Boolean(infinite && !infinite.exhausted && tableRows.length > 0);
   const virtualizer = useVirtualizer({
-    count: tableRows.length + (hasInfiniteTail ? 1 : 0),
+    count: displayRows.length + (hasInfiniteTail ? 1 : 0),
     getScrollElement: () => bodyScrollRef.current,
     estimateSize: () => rowHeightPx,
     overscan: virtualizationOverscan,
@@ -338,10 +353,12 @@ function DataTableRoot({
       if (row.getCanExpand()) row.toggleExpanded();
     } : void 0
   });
+  const [focusedColIndex, setFocusedColIndex] = useState(0);
   const isSSR = typeof window === "undefined";
   const rowPressActive = Boolean(onRowPress) && !disabled;
   const [rowPressAnchor, setRowPressAnchor] = useState(0);
-  const effectiveRowPressAnchor = Math.min(rowPressAnchor, Math.max(tableRows.length - 1, 0));
+  const [rowPressHasFocus, setRowPressHasFocus] = useState(false);
+  const effectiveRowPressAnchor = Math.min(rowPressAnchor, Math.max(displayRows.length - 1, 0));
   const deriveRowIdentity = useCallback(row => {
     const fromAccessor = rowLabel?.(row.original);
     if (fromAccessor) return fromAccessor;
@@ -399,13 +416,18 @@ function DataTableRoot({
           outlineOffset: -2
         }),
         "data-row-press": "true",
+        "data-row-keyboard-focus": rowIndex === effectiveRowPressAnchor && rowPressHasFocus ? "true" : "false",
         onFocus: e => {
-          if (e.target === e.currentTarget) setRowPressAnchor(rowIndex);
+          if (e.target === e.currentTarget) {
+            setRowPressAnchor(rowIndex);
+            setRowPressHasFocus(true);
+          }
         },
         onBlur: e => {
           const next = e.relatedTarget;
           if (!(next instanceof Element) || !next.closest('[data-row-press="true"]')) {
             setRowPressAnchor(0);
+            setRowPressHasFocus(false);
           }
         },
         onKeyDown: e => {
@@ -433,7 +455,7 @@ function DataTableRoot({
         }
       } : {})
     };
-  }, [rowPressActive, deriveRowLabel, activateRowPress, effectiveRowPressAnchor, isSSR]);
+  }, [rowPressActive, deriveRowLabel, activateRowPress, effectiveRowPressAnchor, isSSR, rowPressHasFocus]);
   const handleCellChange = useCallback(async (rowIndex, columnId, newValue) => {
     if (readOnly || disabled) return;
     const previousValue = data[rowIndex]?.[columnId];
@@ -518,6 +540,19 @@ function DataTableRoot({
   }, [handleCellChange, readOnly, disabled, knobProps.sizeToken, isCompact]);
   const extraColumnsBefore = (enableRowSelection ? 1 : 0) + (showRowNumbers ? 1 : 0) + (enableRowExpansion ? 1 : 0);
   const extraColumnsAfter = showDeleteRow && !readOnly ? 1 : 0;
+  const excelCellNav = enableKeyboardNavigation && !rowPressActive && !disabled;
+  const gridColCount = Math.max(table.getVisibleLeafColumns().length + extraColumnsBefore + extraColumnsAfter, 1);
+  const handleGridKeyDown = useCallback(event => {
+    if (!enableKeyboardNavigation || disabled) return;
+    if (excelCellNav) {
+      if (event.key === "ArrowRight") {
+        setFocusedColIndex(i => Math.min(i + 1, gridColCount - 1));
+      } else if (event.key === "ArrowLeft") {
+        setFocusedColIndex(i => Math.max(i - 1, 0));
+      }
+    }
+    keyboardNav.handleKeyDown(event);
+  }, [disabled, enableKeyboardNavigation, excelCellNav, gridColCount, keyboardNav]);
   const getStickyStyle = useCallback(columnId => {
     if (!enableColumnPinning || !pinning) return void 0;
     const colPinning = table.getState().columnPinning || {
@@ -571,9 +606,16 @@ function DataTableRoot({
     const cellRenderProps = cellElement ? {
       render: cellElement
     } : {};
+    let cellSlot = 0;
+    const cellNavProps = () => {
+      const slot = cellSlot++;
+      if (!excelCellNav || !keyboardNav.isNavigating) return {};
+      return tableCellKeyboardProps(rowIndex === keyboardNav.focusedRowIndex && slot === focusedColIndex);
+    };
     return /* @__PURE__ */jsxs(Fragment, {
       children: [enableRowSelection && /* @__PURE__ */jsx(Table.Cell, {
         ...cellRenderProps,
+        ...cellNavProps(),
         cellWidth: SELECTION_COL_WIDTH,
         cellHeight,
         cellLocation: "first",
@@ -595,6 +637,7 @@ function DataTableRoot({
         })
       }), showRowNumbers && /* @__PURE__ */jsx(Table.Cell, {
         ...cellRenderProps,
+        ...cellNavProps(),
         cellWidth: 50,
         cellHeight,
         cellLocation: enableRowSelection ? "middle" : "first",
@@ -605,6 +648,7 @@ function DataTableRoot({
         })
       }), enableRowExpansion && /* @__PURE__ */jsx(Table.Cell, {
         ...cellRenderProps,
+        ...cellNavProps(),
         cellWidth: 32 + row.depth * 20,
         cellHeight,
         cellLocation: enableRowSelection || showRowNumbers ? "middle" : "first",
@@ -684,6 +728,7 @@ function DataTableRoot({
         });
         return /* @__PURE__ */jsx(Table.Cell, {
           ...cellRenderProps,
+          ...cellNavProps(),
           ...cellFlexProps,
           ...getColSizeProps(cell.column),
           cellHeight,
@@ -710,6 +755,7 @@ function DataTableRoot({
         }, cell.id);
       }), showDeleteRow && !readOnly && /* @__PURE__ */jsx(Table.Cell, {
         ...cellRenderProps,
+        ...cellNavProps(),
         cellWidth: 60,
         cellHeight,
         cellLocation: "last",
@@ -728,7 +774,7 @@ function DataTableRoot({
         })
       })]
     });
-  }, [enableRowSelection, showRowNumbers, enableRowExpansion, showDeleteRow, readOnly, disabled, cellHeight, knobProps.sizeToken, cellFlexProps, getColSizeProps, getStickyStyle, renderCellContent, handleDeleteRow, data.length, minRows, isCompact, t, deriveSelectRowLabel, ExpandCaretIcon, expandedCaretRotation, clipBodyCells]);
+  }, [enableRowSelection, showRowNumbers, enableRowExpansion, showDeleteRow, readOnly, disabled, cellHeight, knobProps.sizeToken, cellFlexProps, getColSizeProps, getStickyStyle, renderCellContent, handleDeleteRow, data.length, minRows, isCompact, t, deriveSelectRowLabel, ExpandCaretIcon, expandedCaretRotation, clipBodyCells, excelCellNav, keyboardNav.isNavigating, keyboardNav.focusedRowIndex, focusedColIndex]);
   const [filterEditTarget, setFilterEditTarget] = useState(null);
   const filterUi = useMemo(() => ({
     editTarget: filterEditTarget,
@@ -754,7 +800,8 @@ function DataTableRoot({
         views: state.views,
         activeViewId: state.activeViewId,
         size: knobProps.sizeToken,
-        compact: isCompact
+        compact: isCompact,
+        isFetching: Boolean(state.isFetching)
       });
     }
     return /* @__PURE__ */jsx(DataTableToolbar, {
@@ -770,7 +817,8 @@ function DataTableRoot({
       enableGlobalSearch,
       enableFiltering,
       size: knobProps.sizeToken,
-      compact: isCompact
+      compact: isCompact,
+      isFetching: Boolean(state.isFetching)
     });
   };
   const renderPaginationComponent = () => {
@@ -811,12 +859,13 @@ function DataTableRoot({
         el.removeEventListener("scroll", update);
         ro?.disconnect();
       };
-    }, [tableRows.length, showCards]);
+    }, [displayRows.length, showCards]);
     useDragScroll(scrollContainerRef, hScroll && !isSSR);
     const rangeTotal = state.pagination.totalCount ?? 0;
     const rangeStart = rangeTotal === 0 ? 0 : state.pagination.pageIndex * state.pagination.pageSize + 1;
     const rangeEnd = Math.min((state.pagination.pageIndex + 1) * state.pagination.pageSize, rangeTotal);
     const resolvedAriaLabel = ariaLabel || t("Data table");
+    const isRefetching = queryInFlight;
     if (state.error) {
       return /* @__PURE__ */jsx(AsyncBoundary, {
         error: state.error,
@@ -827,7 +876,7 @@ function DataTableRoot({
         "aria-label": resolvedAriaLabel
       });
     }
-    if ((state.isLoading || infinite?.isInitialLoading) && tableRows.length === 0) {
+    if ((state.isLoading || infinite?.isInitialLoading) && displayRows.length === 0 && !state.isFetching && !state.isPlaceholderData) {
       return /* @__PURE__ */jsx(AsyncBoundary, {
         loading: true,
         layout: "table",
@@ -854,6 +903,7 @@ function DataTableRoot({
           "aria-describedby": ariaDescribedBy,
           "aria-live": "polite",
           "aria-atomic": "false",
+          "aria-busy": isRefetching || void 0,
           "aria-disabled": disabled || void 0,
           ...(disabled ? {
             ...disabledState.assemblyKnobProps,
@@ -882,7 +932,19 @@ function DataTableRoot({
               showSelectionCount: true,
               placement: "top"
             })
-          }) : null, children, showCards ? /* @__PURE__ */jsxs(Fragment, {
+          }) : null, children, showList ? /* @__PURE__ */jsx(DataTableDocumentList, {
+            tableRows: displayRows,
+            enableRowSelection,
+            disabled,
+            hasActiveFilters: computed.hasActiveFilters,
+            renderCellContent,
+            compact: isCompact,
+            selectRowLabel: deriveSelectRowLabel,
+            queryInFlight,
+            ...(rowPressActive ? {
+              getRowPressProps
+            } : {})
+          }) : showCards ? /* @__PURE__ */jsxs(Fragment, {
             children: [/* @__PURE__ */jsx(DataTableCardControls, {
               table,
               enableSorting,
@@ -891,7 +953,7 @@ function DataTableRoot({
               compact: isCompact,
               disabled
             }), /* @__PURE__ */jsx(DataTableMobileCards, {
-              tableRows,
+              tableRows: displayRows,
               enableRowSelection,
               showRowNumbers,
               showDeleteRow,
@@ -907,6 +969,7 @@ function DataTableRoot({
               onToggleSelectAll: toggleSelectAll,
               compact: isCompact,
               selectRowLabel: deriveSelectRowLabel,
+              queryInFlight,
               ...(rowPressActive ? {
                 getRowPressProps
               } : {})
@@ -936,7 +999,10 @@ function DataTableRoot({
               label: resolvedAriaLabel
             }),
             tabIndex: enableKeyboardNavigation && !isSSR ? 0 : void 0,
-            onKeyDown: enableKeyboardNavigation && !isSSR ? keyboardNav.handleKeyDown : void 0,
+            ...{
+              "data-table-grid": "true"
+            },
+            onKeyDown: enableKeyboardNavigation && !isSSR ? handleGridKeyDown : void 0,
             onPress: enableKeyboardNavigation && !isSSR ? keyboardNav.handleContainerClick : void 0,
             onBlur: enableKeyboardNavigation && !isSSR ? keyboardNav.handleContainerBlur : void 0,
             children: /* @__PURE__ */jsxs(Table, {
@@ -1180,9 +1246,9 @@ function DataTableRoot({
                 ref: node => {
                   tableBodyRef.current = node ?? null;
                 },
-                children: [tableRows.length === 0 ? /* @__PURE__ */jsx(Table.Row, {
+                children: [displayRows.length === 0 ? /* @__PURE__ */jsx(Table.Row, {
                   children: /* @__PURE__ */jsx(Table.Cell, {
-                    children: /* @__PURE__ */jsx(EmptyState, {
+                    children: isRefetching ? null : /* @__PURE__ */jsx(EmptyState, {
                       compact: true,
                       "aria-live": "polite",
                       title: computed.hasActiveFilters ? t("No results found") : t("No data available")
@@ -1208,7 +1274,7 @@ function DataTableRoot({
                       totalSize,
                       bodyScrollRef,
                       virtualizationHeight,
-                      tableRows,
+                      tableRows: displayRows,
                       headerGroups,
                       showRowNumbers,
                       enableRowExpansion,
@@ -1228,9 +1294,9 @@ function DataTableRoot({
                     })
                   })
                 }) : /* @__PURE__ */jsxs(Fragment, {
-                  children: [tableRows.map((row, index) => {
+                  children: [displayRows.map((row, index) => {
                     rowCounter.current++;
-                    const isLastRow = index === tableRows.length - 1;
+                    const isLastRow = index === displayRows.length - 1;
                     if (enableGrouping && row.getIsGrouped?.()) {
                       const colSpan = table.getVisibleLeafColumns().length + extraColumnsBefore + extraColumnsAfter;
                       const indent = (row.depth ?? 0) * 16;
@@ -1277,13 +1343,15 @@ function DataTableRoot({
                       }, row.id);
                     }
                     const mainRow = /* @__PURE__ */createElement(Table.Row, {
-                      backgroundColor: enableKeyboardNavigation && keyboardNav.isNavigating && index === keyboardNav.focusedRowIndex ? "$color4" : tableZebraOn && index % 2 === 1 ? "$color2" : "$color1",
+                      ...tableRowStateProps({
+                        selected: Boolean(enableRowSelection && row.getIsSelected?.()),
+                        keyboardFocused: false,
+                        zebraOn: tableZebraOn,
+                        index
+                      }),
                       ...{
                         animation: "quick"
                       },
-                      hoverStyle: {
-                        backgroundColor: "$color3"
-                      },
                       flexShrink: 0,
                       rowLocation: rowCounter.current === 0 ? "first" : rowCounter.current === allRowsLength - 1 ? "last" : "middle",
                       key: `${row.id}-${index}`,
@@ -1471,23 +1539,6 @@ function DataTableRoot({
                 total: rangeTotal
               }))
             })]
-          }), state.isLoading && /* @__PURE__ */jsx(View, {
-            position: "absolute",
-            top: 0,
-            left: 0,
-            right: 0,
-            bottom: 0,
-            alignItems: "center",
-            justifyContent: "center",
-            zIndex: zIndex.loading,
-            "aria-busy": true,
-            "aria-live": "assertive",
-            "aria-label": t("Loading table data"),
-            role: "status",
-            children: /* @__PURE__ */jsx(Spinner, {
-              size: "large",
-              color: "$color10"
-            })
           })]
         })
       })