@multiplatform.one/table 7.28.1 → 7.29.0

package/dist/cjs/components/DataTable/CellContent.cjs

@@ -0,0 +1,77 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var CellContent_exports = {};
+__export(CellContent_exports, {
+  CellContent: () => CellContent
+});
+module.exports = __toCommonJS(CellContent_exports);
+var import_components = require("@multiplatform.one/components");
+var import_table_primitives = require("@multiplatform.one/table-primitives");
+var import_react_table = require("@tanstack/react-table");
+var import_jsx_runtime = require("react/jsx-runtime");
+function isPlainRenderer(cellDef) {
+  return typeof cellDef === "function" && !cellDef.prototype?.isReactComponent;
+}
+function CellValue({
+  value,
+  fontSize
+}) {
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+    children: (0, import_table_primitives.wrapBareTextChildren)(value ?? null, (label, key) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Text, {
+      fontSize,
+      children: label
+    }, key))
+  });
+}
+const rendererCells = /* @__PURE__ */new WeakMap();
+function rendererCell(render) {
+  let Cell = rendererCells.get(render);
+  if (!Cell) {
+    Cell = ({
+      ctx,
+      fontSize
+    }) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(CellValue, {
+      value: render(ctx),
+      fontSize
+    });
+    rendererCells.set(render, Cell);
+  }
+  return Cell;
+}
+function CellContent({
+  cellDef,
+  ctx,
+  fontSize
+}) {
+  if (!isPlainRenderer(cellDef)) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(CellValue, {
+      value: (0, import_react_table.flexRender)(cellDef, ctx),
+      fontSize
+    });
+  }
+  const Cell = rendererCell(cellDef);
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Cell, {
+    ctx,
+    fontSize
+  });
+}

package/dist/cjs/components/DataTable/CellContent.native.js

@@ -0,0 +1,88 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var CellContent_exports = {};
+__export(CellContent_exports, {
+  CellContent: () => CellContent
+});
+module.exports = __toCommonJS(CellContent_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@multiplatform.one/components");
+var import_table_primitives = require("@multiplatform.one/table-primitives");
+var import_react_table = require("@tanstack/react-table");
+function isPlainRenderer(cellDef) {
+  var _cellDef_prototype;
+  return typeof cellDef === "function" && !((_cellDef_prototype = cellDef.prototype) === null || _cellDef_prototype === void 0 ? void 0 : _cellDef_prototype.isReactComponent);
+}
+function CellValue(param) {
+  var {
+    value,
+    fontSize
+  } = param;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
+    children: (0, import_table_primitives.wrapBareTextChildren)(value !== null && value !== void 0 ? value : null, function (label, key) {
+      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Text, {
+        fontSize,
+        children: label
+      }, key);
+    })
+  });
+}
+var rendererCells = /* @__PURE__ */new WeakMap();
+function rendererCell(render) {
+  var Cell = rendererCells.get(render);
+  if (!Cell) {
+    Cell = function Cell2(param) {
+      var {
+        ctx,
+        fontSize
+      } = param;
+      return /* @__PURE__ */(0, import_jsx_runtime.jsx)(CellValue, {
+        value: render(ctx),
+        fontSize
+      });
+    };
+    rendererCells.set(render, Cell);
+  }
+  return Cell;
+}
+function CellContent(param) {
+  var {
+    cellDef,
+    ctx,
+    fontSize
+  } = param;
+  if (!isPlainRenderer(cellDef)) {
+    return /* @__PURE__ */(0, import_jsx_runtime.jsx)(CellValue, {
+      value: (0, import_react_table.flexRender)(cellDef, ctx),
+      fontSize
+    });
+  }
+  var Cell = rendererCell(cellDef);
+  return /* @__PURE__ */(0, import_jsx_runtime.jsx)(Cell, {
+    ctx,
+    fontSize
+  });
+}
+//# sourceMappingURL=CellContent.native.js.map

package/dist/cjs/components/DataTable/CellContent.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","CellContent_exports","__export","CellContent","module","exports","import_jsx_runtime","require","import_components","import_table_primitives","import_react_table","isPlainRenderer","cellDef","_cellDef_prototype","prototype","isReactComponent","CellValue","param","fontSize","jsx","Fragment","children","wrapBareTextChildren","label","key","Text","rendererCells","WeakMap","rendererCell","render","Cell","get","Cell2","ctx"],"sources":["../../../../src/components/DataTable/CellContent.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,mBAAA;AAAAC,QAAA,CAAAD,mBAAA;EAAAE,WAAA,EAAAA,CAAA,KAAAA;AAAA;AAAAC,MAAA,CAAAC,OAAA,GAAAT,YAAqB,CAAAK,mBAAA;AACrB,IAAAK,kBAAA,GAAAC,OAAqC;AACrC,IAAAC,iBAAA,GAAAD,OAA2B;AAgBvB,IAAAE,uBAAA,GAAAF,OAAA;AATJ,IAAAG,kBAAS,GAAgBH,OAAA,wBAAuC;AAC9D,SACEI,eAAOA,CAAAC,OAAY;EAGvB,IAAAC,kBAAA;EAEA,OAAS,OAAAD,OAAY,KAAO,UAAS,IAAmD,GAAAC,kBAAA,GAAAD,OAAA,CAAAE,SAAA,cAAAD,kBAAA,uBAAAA,kBAAA,CAAAE,gBAAA;AACtF;AASF,SAAAC,UAAAC,KAAA;EAEA,IAAM;IAAAjB,KAAA;IAAAkB;EAAgB,IAAAD,KAAA;EAOtB,OAAS,eAAa,IAAAX,kBAAoD,CAAAa,GAAA,EAAAb,kBAAA,CAAAc,QAAA;IACxEC,QAAI,EAAO,IAAAZ,uBAAwB,CAAAa,oBAAA,EAAAtB,KAAA,aAAAA,KAAA,cAAAA,KAAA,mBAAAuB,KAAA,EAAAC,GAAA;MAC/B,OAAO,mBAAAlB,kBAAA,CAAAa,GAAA,EAAAX,iBAAA,CAAAiB,IAAA;QACTP,QAAU;QAGVG,QAAA,EAAcE;MAChB,GAAAC,GAAA;IACA;EACF;AAcO;AAAqB,IAC1BE,aAAA,sBAAAC,OAAA;AAAA,SACAC,aAAAC,MAAA;EACA,IAAAC,IAAA,GAAAJ,aAAA,CAAAK,GAAA,CAAAF,MAAA;EACF,IAIG,CAAAC,IAAA;IACDA,IAAK,YAAAE,KAAgBA,CAAAf,KAAO,EAAG;MAC7B;QAAOgB,GAAA;QAAAf;MAAA,IAAAD,KAAA;MACT,0BAAAX,kBAAA,CAAAa,GAAA,EAAAH,SAAA;QACMhB,KAAA,EAAO6B,MAAA,CAAAI,GAAA;QACbf;MACF","ignoreList":[]}

package/dist/cjs/components/DataTable/DataTableInfiniteTail.cjs

@@ -0,0 +1,90 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var DataTableInfiniteTail_exports = {};
+__export(DataTableInfiniteTail_exports, {
+  DataTableInfiniteTail: () => DataTableInfiniteTail
+});
+module.exports = __toCommonJS(DataTableInfiniteTail_exports);
+var import_components = require("@multiplatform.one/components");
+var import_react_i18next = require("react-i18next");
+var import_tamagui = require("tamagui");
+var import_withInterp = require("../../utils/withInterp.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+function DataTableInfiniteTail({
+  infinite,
+  visibleCount,
+  showAppendSkeleton,
+  rowHeightPx,
+  fontSize,
+  gapProps,
+  sentinel
+}) {
+  const {
+    t
+  } = (0, import_react_i18next.useTranslation)();
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.View, {
+    flexDirection: "column",
+    width: "100%",
+    children: [sentinel, showAppendSkeleton && infinite.isAppending ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+      flexDirection: "column",
+      width: "100%",
+      ...gapProps,
+      paddingVertical: "$2",
+      "aria-hidden": true,
+      ...{
+        "data-testid": "infinite-append-skeleton"
+      },
+      children: Array.from({
+        length: 3
+      }).map((_, i) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+        width: "100%",
+        height: rowHeightPx - 8
+      }, i))
+    }) : null, /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+      role: "status",
+      "aria-live": "polite",
+      textAlign: "center",
+      paddingVertical: "$2",
+      fontSize,
+      color: "$color10",
+      ...{
+        "data-testid": "infinite-status"
+      },
+      children: infinite.isAppending ? t("Loading more rows\u2026") : infinite.exhausted ? typeof infinite.totalCount === "number" && infinite.totalCount > 0 ? (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("All {{count}} rows loaded", {
+        count: infinite.totalCount
+      }), {
+        count: infinite.totalCount
+      })) : t("End of results") : typeof infinite.totalCount === "number" ? (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("Showing {{visible}} of {{total}} rows", {
+        visible: visibleCount,
+        total: infinite.totalCount
+      }), {
+        visible: visibleCount,
+        total: infinite.totalCount
+      })) : (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("Showing {{visible}} rows", {
+        visible: visibleCount
+      }), {
+        visible: visibleCount
+      }))
+    })]
+  });
+}

package/dist/cjs/components/DataTable/DataTableInfiniteTail.native.js

@@ -0,0 +1,99 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var DataTableInfiniteTail_exports = {};
+__export(DataTableInfiniteTail_exports, {
+  DataTableInfiniteTail: () => DataTableInfiniteTail
+});
+module.exports = __toCommonJS(DataTableInfiniteTail_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_components = require("@multiplatform.one/components");
+var import_react_i18next = require("react-i18next");
+var import_tamagui = require("tamagui");
+var import_withInterp = require("../../utils/withInterp.native.js");
+function DataTableInfiniteTail(param) {
+  var {
+    infinite,
+    visibleCount,
+    showAppendSkeleton,
+    rowHeightPx,
+    fontSize,
+    gapProps,
+    sentinel
+  } = param;
+  var {
+    t
+  } = (0, import_react_i18next.useTranslation)();
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.View, {
+    flexDirection: "column",
+    width: "100%",
+    children: [sentinel, showAppendSkeleton && infinite.isAppending ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+      flexDirection: "column",
+      width: "100%",
+      ...gapProps,
+      paddingVertical: "$2",
+      "aria-hidden": true,
+      ...{
+        "data-testid": "infinite-append-skeleton"
+      },
+      children: Array.from({
+        length: 3
+      }).map(function (_, i) {
+        return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
+          width: "100%",
+          height: rowHeightPx - 8
+        }, i);
+      })
+    }) : null, /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
+      role: "status",
+      "aria-live": "polite",
+      textAlign: "center",
+      paddingVertical: "$2",
+      fontSize,
+      color: "$color10",
+      ...{
+        "data-testid": "infinite-status"
+      },
+      children: (
+      /* Numeric labels are bidi-isolated so RTL contexts keep
+      the interpolated runs in order (FSI…PDI). */
+      infinite.isAppending ? t("Loading more rows\u2026") : infinite.exhausted ? typeof infinite.totalCount === "number" && infinite.totalCount > 0 ? (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("All {{count}} rows loaded", {
+        count: infinite.totalCount
+      }), {
+        count: infinite.totalCount
+      })) : t("End of results") : typeof infinite.totalCount === "number" ? (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("Showing {{visible}} of {{total}} rows", {
+        visible: visibleCount,
+        total: infinite.totalCount
+      }), {
+        visible: visibleCount,
+        total: infinite.totalCount
+      })) : (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("Showing {{visible}} rows", {
+        visible: visibleCount
+      }), {
+        visible: visibleCount
+      })))
+    })]
+  });
+}
+//# sourceMappingURL=DataTableInfiniteTail.native.js.map

package/dist/cjs/components/DataTable/DataTableInfiniteTail.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","DataTableInfiniteTail_exports","__export","DataTableInfiniteTail","module","exports","import_jsx_runtime","require","import_components","import_react_i18next","import_tamagui","import_withInterp","param","infinite","visibleCount","showAppendSkeleton","rowHeightPx","fontSize","gapProps","sentinel","t","useTranslation","jsxs","View","flexDirection","width","children","isAppending","jsx","paddingVertical","Array","from","length","map","_","i","Skeleton","height","Text","role","textAlign","color","exhausted","totalCount","bidiIsolate","withInterp","count","visible","total"],"sources":["../../../../src/components/DataTable/DataTableInfiniteTail.tsx"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,6BAAA;AAAAC,QAAA,CAAAD,6BAAA;EAAAE,qBAAA,EAAAA,CAAA,KAAAA;AAAA;AAOAC,MAAA,CAAAC,OAAA,GAAAT,YAAyB,CAAAK,6BAAA;AAEzB,IAAAK,kBAAA,GAAAC,OAA+B;AAC/B,IAAAC,iBAA2B,GAAAD,OAAA;AAE3B,IAAAE,oBAAwC,GAAAF,OAAA;AA0BpC,IAAAG,cAAA,GAAAH,OAAA;AAXG,IAAAI,iBAAS,GAAAJ,OAAsB;AAAA,SACpCJ,sBAAAS,KAAA;EACA;IAAAC,QAAA;IAAAC,YAAA;IAAAC,kBAAA;IAAAC,WAAA;IAAAC,QAAA;IAAAC,QAAA;IAAAC;EAAA,IAAAP,KAAA;EACA;IAAAQ;EAAA,QAAAX,oBAAA,CAAAY,cAAA;EACA,0BAAAf,kBAAA,CAAAgB,IAAA,EAAAZ,cAAA,CAAAa,IAAA;IACAC,aAAA;IACAC,KAAA;IACAC,QAAA,GAC6BP,QAAA,EAC7BJ,kBAAc,IAAAF,QAAA,CAAAc,WAAA,kBAAe,IAAArB,kBAAA,CAAAsB,GAAA,EAAAlB,cAAA,CAAAa,IAAA;MAC7BC,aACE;MACGC,KAAA;MACA,GAAAP,QAAA;MACEW,eAAA;MAAA;MACC;QACA,aAAM;MACL;MACDH,QAAA,EAAAI,KAAA,CAAAC,IAAgB;QAChBC,MAAA;MACC,GAAIC,GAAE,WAAAC,CAAA,EAAAC,CAAe;QAErB,sBAAa,IAAA7B,kBAAqB,CAAAsB,GACjC,EAAApB,iBAAA,CAAA4B,QAAA;UACDX,KAAA;UAEDY,MAAA,EAAArB,WAAA;QACJ,GAAAmB,CAAA;MAAC;IAAA,0BACM,IAAA7B,kBAAA,CAAAsB,GAAA,EAAAlB,cAAA,CAAA4B,IAAA;MACLC,IAAA,UAAU;MACV,WAAU;MACVC,SAAA,UAAgB;MAChBX,eAAA;MACAZ,QAAM;MACLwB,KAAM;MAIN;QAIO,aACE;MAA2E;MACzDf,QACjB;MACH;AAGA;MACEb,QACI,CAAAc,WAAA,GAAAP,CAAA,0BAAyC,IAAAP,QAAA,CAAA6B,SAAA,UAAA7B,QAAA,CAAA8B,UAAA,iBAAA9B,QAAA,CAAA8B,UAAA,WAAAhC,iBAAA,CAAAiC,WAAA,MAAAjC,iBAAA,CAAAkC,UAAA,EAAAzB,CAAA;QAAA0B,KACzC,EAAAjC,QAAS,CAAA8B;MAAA,IACT;QACFG,KAAC,EAAAjC,QAAA,CAAA8B;MAAA,EACD,IAAEvB,CAAA,iBAAS,IAAc,OAAOP,QAAS,CAAA8B,UAAW,oBAAAhC,iBAAA,CAAAiC,WAAA,MAAAjC,iBAAA,CAAAkC,UAAA,EAAAzB,CAAA;QACtD2B,OAAA,EAAAjC,YAAA;QACFkC,KACA,EAAAnC,QAAA,CAAA8B;MAAA,IACE;QACEI,OAAA,EAASjC,YAAA;QACVkC,KAAA,EAAAnC,QAAA,CAAA8B;MACH,UAAAhC,iBAAA,CAAAiC,WAAA,MAAAjC,iBAAA,CAAAkC,UAAA,EAAAzB,CAAA;QAAA2B,OAAA,EAAAjC;MACV;QACFiC,OAAA,EAAAjC;MAEJ","ignoreList":[]}

package/dist/cjs/components/DataTable/DataTableRoot.cjs

@@ -61,6 +61,8 @@ var import_DataTableStateContext = require("./DataTableStateContext.cjs");
 var import_DataTableCardControls = require("./DataTableCardControls.cjs");
 var import_DataTableMobileCards = require("./DataTableMobileCards.cjs");
 var import_DataTableDocumentList = require("./DataTableDocumentList.cjs");
+var import_DataTableInfiniteTail = require("./DataTableInfiniteTail.cjs");
+var import_CellContent = require("./CellContent.cjs");
 var import_DataTableVirtualized = require("./DataTableVirtualized.cjs");
 var import_dataTableChrome = require("./dataTableChrome.cjs");
 var import_rowStateChrome = require("./rowStateChrome.cjs");
@@ -565,7 +567,11 @@ function DataTableRoot({
         ...{
           "data-cell-align": customAlign
         },
-        children: (0, import_react_table.flexRender)(columnDef.cell, cell.getContext())
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_CellContent.CellContent, {
+          cellDef: columnDef.cell,
+          ctx: cell.getContext(),
+          fontSize: knobProps.label.fontSize
+        })
       });
     }
     const columnField = getColumnField(columnDef);
@@ -594,7 +600,7 @@ function DataTableRoot({
       linkedValue,
       onLinkedChange
     });
-  }, [handleCellChange, readOnly, disabled, knobProps.sizeToken, isCompact]);
+  }, [handleCellChange, readOnly, disabled, knobProps.sizeToken, knobProps.label.fontSize, isCompact]);
   const extraColumnsBefore = (enableRowSelection ? 1 : 0) + (showRowNumbers ? 1 : 0) + (enableRowExpansion ? 1 : 0);
   const extraColumnsAfter = showDeleteRow && !readOnly ? 1 : 0;
   const excelCellNav = enableKeyboardNavigation && !rowPressActive && !disabled;
@@ -1590,10 +1596,14 @@ function DataTableRoot({
                 }, footerGroup.id))
               })]
             })
-          })), infinite ? /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.View, {
-            flexDirection: "column",
-            width: "100%",
-            children: [!isVirtualized && !infinite.exhausted && import_tamagui.isWeb ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+          })), infinite ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_DataTableInfiniteTail.DataTableInfiniteTail, {
+            infinite,
+            visibleCount: tableRows.length,
+            showAppendSkeleton: !isVirtualized,
+            rowHeightPx,
+            fontSize: knobProps.sizeToken,
+            gapProps: knobProps.gap,
+            sentinel: !isVirtualized && !infinite.exhausted && import_tamagui.isWeb ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
               ref: sentinelRef,
               height: 1,
               width: "100%",
@@ -1601,47 +1611,7 @@ function DataTableRoot({
               ...{
                 "data-testid": "infinite-sentinel"
               }
-            }) : null, !isVirtualized && infinite.isAppending ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
-              flexDirection: "column",
-              width: "100%",
-              ...knobProps.gap,
-              paddingVertical: "$2",
-              "aria-hidden": true,
-              ...{
-                "data-testid": "infinite-append-skeleton"
-              },
-              children: Array.from({
-                length: 3
-              }).map((_, i) => /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
-                width: "100%",
-                height: rowHeightPx - 8
-              }, i))
-            }) : null, /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
-              role: "status",
-              "aria-live": "polite",
-              textAlign: "center",
-              paddingVertical: "$2",
-              fontSize: knobProps.sizeToken,
-              color: "$color10",
-              ...{
-                "data-testid": "infinite-status"
-              },
-              children: infinite.isAppending ? t("Loading more rows\u2026") : infinite.exhausted ? typeof infinite.totalCount === "number" && infinite.totalCount > 0 ? (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("All {{count}} rows loaded", {
-                count: infinite.totalCount
-              }), {
-                count: infinite.totalCount
-              })) : t("End of results") : typeof infinite.totalCount === "number" ? (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("Showing {{visible}} of {{total}} rows", {
-                visible: tableRows.length,
-                total: infinite.totalCount
-              }), {
-                visible: tableRows.length,
-                total: infinite.totalCount
-              })) : (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("Showing {{visible}} rows", {
-                visible: tableRows.length
-              }), {
-                visible: tableRows.length
-              }))
-            })]
+            }) : null
           }) : null, enableRowSelection && bulkBarPlacement === "bottom" ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
             width: "100%",
             ...(disabled ? disabledState.chromeKnobProps : {}),

package/dist/cjs/components/DataTable/DataTableRoot.native.js

@@ -65,6 +65,8 @@ var import_DataTableStateContext = require("./DataTableStateContext.native.js");
 var import_DataTableCardControls = require("./DataTableCardControls.native.js");
 var import_DataTableMobileCards = require("./DataTableMobileCards.native.js");
 var import_DataTableDocumentList = require("./DataTableDocumentList.native.js");
+var import_DataTableInfiniteTail = require("./DataTableInfiniteTail.native.js");
+var import_CellContent = require("./CellContent.native.js");
 var import_DataTableVirtualized = require("./DataTableVirtualized.native.js");
 var import_dataTableChrome = require("./dataTableChrome.native.js");
 var import_rowStateChrome = require("./rowStateChrome.native.js");
@@ -638,7 +640,11 @@ function DataTableRoot(param) {
         ...{
           "data-cell-align": customAlign
         },
-        children: (0, import_react_table.flexRender)(columnDef.cell, cell.getContext())
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_CellContent.CellContent, {
+          cellDef: columnDef.cell,
+          ctx: cell.getContext(),
+          fontSize: knobProps.label.fontSize
+        })
       });
     }
     var columnField = getColumnField(columnDef);
@@ -669,7 +675,7 @@ function DataTableRoot(param) {
       linkedValue,
       onLinkedChange
     });
-  }, [handleCellChange, readOnly, disabled, knobProps.sizeToken, isCompact]);
+  }, [handleCellChange, readOnly, disabled, knobProps.sizeToken, knobProps.label.fontSize, isCompact]);
   var extraColumnsBefore = (enableRowSelection ? 1 : 0) + (showRowNumbers ? 1 : 0) + (enableRowExpansion ? 1 : 0);
   var extraColumnsAfter = showDeleteRow && !readOnly ? 1 : 0;
   var excelCellNav = enableKeyboardNavigation && !rowPressActive && !disabled;
@@ -1786,14 +1792,14 @@ function DataTableRoot(param) {
                 })
               })]
             })
-          })),
-          /* Infinite mode tail: sentinel (non-virtualized trigger), append
-          skeleton (bounded by the actual load — no infinite spinner),
-          and an honest, announced end-of-data state (DG-ST-01/04). */
-          infinite ? /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.View, {
-            flexDirection: "column",
-            width: "100%",
-            children: [!isVirtualized && !infinite.exhausted && import_tamagui.isWeb ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
+          })), infinite ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_DataTableInfiniteTail.DataTableInfiniteTail, {
+            infinite,
+            visibleCount: tableRows.length,
+            showAppendSkeleton: !isVirtualized,
+            rowHeightPx,
+            fontSize: knobProps.sizeToken,
+            gapProps: knobProps.gap,
+            sentinel: !isVirtualized && !infinite.exhausted && import_tamagui.isWeb ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
               // @ts-ignore web ref for IntersectionObserver
               ref: sentinelRef,
               height: 1,
@@ -1802,52 +1808,7 @@ function DataTableRoot(param) {
               ...{
                 "data-testid": "infinite-sentinel"
               }
-            }) : null, !isVirtualized && infinite.isAppending ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
-              flexDirection: "column",
-              width: "100%",
-              ...knobProps.gap,
-              paddingVertical: "$2",
-              "aria-hidden": true,
-              ...{
-                "data-testid": "infinite-append-skeleton"
-              },
-              children: Array.from({
-                length: 3
-              }).map(function (_, i) {
-                return /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_components.Skeleton, {
-                  width: "100%",
-                  height: rowHeightPx - 8
-                }, i);
-              })
-            }) : null, /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.Text, {
-              role: "status",
-              "aria-live": "polite",
-              textAlign: "center",
-              paddingVertical: "$2",
-              fontSize: knobProps.sizeToken,
-              color: "$color10",
-              ...{
-                "data-testid": "infinite-status"
-              },
-              children: (
-              /* Numeric labels are bidi-isolated so RTL contexts keep
-              the interpolated runs in order (FSI…PDI). */
-              infinite.isAppending ? t("Loading more rows\u2026") : infinite.exhausted ? typeof infinite.totalCount === "number" && infinite.totalCount > 0 ? (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("All {{count}} rows loaded", {
-                count: infinite.totalCount
-              }), {
-                count: infinite.totalCount
-              })) : t("End of results") : typeof infinite.totalCount === "number" ? (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("Showing {{visible}} of {{total}} rows", {
-                visible: tableRows.length,
-                total: infinite.totalCount
-              }), {
-                visible: tableRows.length,
-                total: infinite.totalCount
-              })) : (0, import_withInterp.bidiIsolate)((0, import_withInterp.withInterp)(t("Showing {{visible}} rows", {
-                visible: tableRows.length
-              }), {
-                visible: tableRows.length
-              })))
-            })]
+            }) : null
           }) : null, enableRowSelection && bulkBarPlacement === "bottom" ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.View, {
             width: "100%",
             ...(disabled ? disabledState.chromeKnobProps : {}),