@multiplatform.one/table 6.1.0 → 6.4.0

package/src/utils/filterFields.ts

@@ -0,0 +1,273 @@
+/**
+ * Filter-field model — the Frappe-agnostic backbone for filtering on fields
+ * that are NOT visible columns (owner ask: "filter on columns that are not
+ * visible").
+ *
+ * A table declares `filterableFields` (id, label, type, options) separately
+ * from its visible columns. The toolbar filter surface merges the two lists
+ * (visible columns first, then "More fields"), and `applyFiltersToData`
+ * applies the advanced-filter model client-side against ANY row key — column
+ * or not. Server-side tables (manualFiltering) skip the client pass and map
+ * the same TableFilter[] to their own query params (frappe-ui does this).
+ *
+ * One implementation per concept (LC-16): the operator vocabulary here is the
+ * SAME set the ColumnHeaderFilter funnel uses — the funnel imports these maps
+ * rather than keeping its own copy.
+ */
+
+import { t } from "../shared/t";
+import type {
+  DataTableColumn,
+  DataTableColumnType,
+  DataTableField,
+  FilterOperator,
+  FilterValue,
+  FilterableField,
+  ResolvedFilterField,
+  TableFilter,
+} from "../types";
+import { applyFilterToValue } from "./filterUtils";
+
+export type { FilterableField, ResolvedFilterField };
+
+// ── Field descriptors ─────────────────────────────────────────
+
+/** Maps a column's cell field type to its filter editor type. */
+export function mapFieldToFilterType(field?: DataTableField): DataTableColumnType {
+  switch (field) {
+    case "stepper":
+    case "slider":
+    case "progress":
+    case "rating":
+    case "duration":
+      return "number";
+    case "datepicker":
+    case "datetimepicker":
+    case "timepicker":
+    case "daterangepicker":
+    case "multidatepicker":
+      return "date";
+    case "checkbox":
+    case "switch":
+      return "boolean";
+    case "select":
+    case "combobox":
+    case "radiogroup":
+    case "togglegroup":
+      return "select";
+    default:
+      return "text";
+  }
+}
+
+/** Row-data key for a column (accessorKey wins, id falls back). */
+export function columnFieldId(column: DataTableColumn): string | undefined {
+  const key = (column as { accessorKey?: unknown }).accessorKey;
+  if (typeof key === "string" && key) return key;
+  return typeof column.id === "string" && column.id ? column.id : undefined;
+}
+
+/** Human label for a column (string header wins, id falls back). */
+function columnFieldLabel(column: DataTableColumn, id: string): string {
+  return typeof column.header === "string" && column.header ? column.header : id;
+}
+
+/**
+ * Merge column-derived fields with extra `filterableFields`.
+ * Columns come first (they match what the user sees); extras that share an
+ * id override the column-derived descriptor, other extras append after.
+ */
+export function resolveFilterFields(
+  columns: DataTableColumn[],
+  filterableFields?: FilterableField[],
+): ResolvedFilterField[] {
+  const byId = new Map<string, ResolvedFilterField>();
+  for (const column of columns) {
+    const id = columnFieldId(column);
+    if (!id) continue;
+    if (column.filterable === false) continue;
+    byId.set(id, {
+      id,
+      label: columnFieldLabel(column, id),
+      type: mapFieldToFilterType(column.field),
+      options: column.fieldProps?.options,
+    });
+  }
+  for (const field of filterableFields ?? []) {
+    if (!field.id) continue;
+    const existing = byId.get(field.id);
+    byId.set(field.id, {
+      id: field.id,
+      label: field.label || existing?.label || field.id,
+      type: field.type ?? existing?.type ?? "text",
+      options: field.options ?? existing?.options,
+    });
+  }
+  return [...byId.values()];
+}
+
+/** Filter editor type for a field id ("text" when unknown). */
+export function getFilterFieldType(
+  fields: ResolvedFilterField[],
+  fieldId: string,
+): DataTableColumnType {
+  return fields.find((f) => f.id === fieldId)?.type ?? "text";
+}
+
+// ── Client-side application ───────────────────────────────────
+
+/** "select" fields compare as text; the others map 1:1. */
+function comparisonType(type: DataTableColumnType): "text" | "number" | "date" | "boolean" {
+  return type === "select" ? "text" : type;
+}
+
+/**
+ * Apply the advanced-filter model (TableFilter[]) to raw rows. Works for any
+ * row key — visible column, hidden column, or non-column field. AND semantics
+ * across filters (same as the funnel's per-column filters).
+ */
+export function applyFiltersToData<TData extends Record<string, any>>(
+  data: TData[],
+  filters: TableFilter[],
+  fields: ResolvedFilterField[],
+): TData[] {
+  if (!filters.length) return data;
+  const active = filters.filter((f) => f.columnId && f.value?.operator);
+  if (!active.length) return data;
+  return data.filter((row) =>
+    active.every((filter) =>
+      applyFilterToValue(
+        row[filter.columnId],
+        filter.value,
+        comparisonType(getFilterFieldType(fields, filter.columnId)),
+      ),
+    ),
+  );
+}
+
+// ── Operator vocabulary (shared with the column funnel) ───────
+
+const TEXT_OPERATORS: FilterOperator[] = [
+  "contains",
+  "doesNotContain",
+  "is",
+  "isNot",
+  "startsWith",
+  "endsWith",
+  "isEmpty",
+  "isNotEmpty",
+];
+
+const NUMBER_OPERATORS: FilterOperator[] = [
+  "is",
+  "isNot",
+  "isLessThan",
+  "isGreaterThan",
+  "isLessThanOrEqual",
+  "isGreaterThanOrEqual",
+];
+
+const DATE_OPERATORS: FilterOperator[] = [
+  "is",
+  "isNot",
+  "isBefore",
+  "isAfter",
+  "isOnOrBefore",
+  "isOnOrAfter",
+];
+
+const BOOLEAN_OPERATORS: FilterOperator[] = ["is", "isNot"];
+
+const SELECT_OPERATORS: FilterOperator[] = ["is", "isNot", "isAnyOf"];
+
+/** Operators offered for a filter editor type (same set as the funnel). */
+export function operatorsForFilterType(type: DataTableColumnType): FilterOperator[] {
+  switch (type) {
+    case "number":
+      return NUMBER_OPERATORS;
+    case "date":
+      return DATE_OPERATORS;
+    case "boolean":
+      return BOOLEAN_OPERATORS;
+    case "select":
+      return SELECT_OPERATORS;
+    default:
+      return TEXT_OPERATORS;
+  }
+}
+
+/** English operator labels — translate at render time via t(). */
+export const FILTER_OPERATOR_LABELS: Record<string, string> = {
+  contains: "Contains",
+  doesNotContain: "Does not contain",
+  is: "Is",
+  isNot: "Is not",
+  startsWith: "Starts with",
+  endsWith: "Ends with",
+  isEmpty: "Is empty",
+  isNotEmpty: "Is not empty",
+  isLessThan: "Less than",
+  isGreaterThan: "Greater than",
+  isLessThanOrEqual: "Less than or equal",
+  isGreaterThanOrEqual: "Greater than or equal",
+  isBefore: "Before",
+  isAfter: "After",
+  isOnOrBefore: "On or before",
+  isOnOrAfter: "On or after",
+  isAnyOf: "Is any of",
+  isNoneOf: "Is none of",
+  isBetween: "Between",
+  isNotBetween: "Not between",
+};
+
+/** Translated operator label ("Contains", "Before", ...). */
+export function filterOperatorLabel(operator: FilterOperator): string {
+  const label = FILTER_OPERATOR_LABELS[operator];
+  return label ? t(label) : operator;
+}
+
+/** True when the operator carries no value (isEmpty / isNotEmpty). */
+export function operatorNeedsNoValue(operator: FilterOperator): boolean {
+  return operator === "isEmpty" || operator === "isNotEmpty";
+}
+
+/** Initial operator when a field is first picked (text → contains, else is). */
+export function defaultOperatorForFilterType(type: DataTableColumnType): FilterOperator {
+  return type === "text" ? "contains" : "is";
+}
+
+// ── Chip labels ───────────────────────────────────────────────
+
+function displayValue(value: FilterValue, options?: Array<{ label: string; value: any }>): string {
+  if (operatorNeedsNoValue(value.operator)) return "";
+  if (value.values?.length) return value.values.map(String).join(", ");
+  const raw = value.value;
+  if (raw === null || raw === undefined || raw === "") return "";
+  const option = options?.find((o) => String(o.value) === String(raw));
+  return option ? option.label : String(raw);
+}
+
+/**
+ * Chip label — "Field: operator value" (HONEST STATE: the chip is how the
+ * user sees a hidden-column filter acting on the data).
+ */
+export function getFilterChipLabel(
+  fieldLabel: string,
+  value: FilterValue,
+  options?: Array<{ label: string; value: any }>,
+): string {
+  const operator = filterOperatorLabel(value.operator).toLocaleLowerCase();
+  const shown = displayValue(value, options);
+  return shown
+    ? t("{{field}}: {{operator}} {{value}}", { field: fieldLabel, operator, value: shown })
+    : t("{{field}}: {{operator}}", { field: fieldLabel, operator });
+}
+
+/** True when a raw columnFilter value is FilterValue-shaped ({operator, ...}). */
+export function isFilterValueShape(value: unknown): value is FilterValue {
+  return (
+    typeof value === "object" &&
+    value !== null &&
+    typeof (value as FilterValue).operator === "string"
+  );
+}

package/src/utils/filterUtils.ts

@@ -1,3 +1,4 @@
+import { t } from "../shared/t";
 import type { FilterValue, TableFilter } from "../types";
 
 // Filter ID Generation
@@ -225,56 +226,65 @@ export function inferColumnType(value: any): "text" | "number" | "date" | "boole
 export function getFilterDescription(filter: TableFilter): string {
   const { operator, value, values } = filter.value;
   const columnLabel = filter.label || filter.columnId;
+  const opts = { column: columnLabel, value } as Record<string, unknown>;
 
   switch (operator) {
     case "contains":
-      return `${columnLabel} contains "${value}"`;
+      return t('{{column}} contains "{{value}}"', opts);
     case "doesNotContain":
-      return `${columnLabel} does not contain "${value}"`;
+      return t('{{column}} does not contain "{{value}}"', opts);
     case "is":
-      return `${columnLabel} is "${value}"`;
+      return t('{{column}} is "{{value}}"', opts);
     case "isNot":
-      return `${columnLabel} is not "${value}"`;
+      return t('{{column}} is not "{{value}}"', opts);
     case "startsWith":
-      return `${columnLabel} starts with "${value}"`;
+      return t('{{column}} starts with "{{value}}"', opts);
     case "endsWith":
-      return `${columnLabel} ends with "${value}"`;
+      return t('{{column}} ends with "{{value}}"', opts);
     case "isEmpty":
-      return `${columnLabel} is empty`;
+      return t("{{column}} is empty", opts);
     case "isNotEmpty":
-      return `${columnLabel} is not empty`;
+      return t("{{column}} is not empty", opts);
     case "isLessThan":
-      return `${columnLabel} < ${value}`;
+      return t("{{column}} < {{value}}", opts);
     case "isGreaterThan":
-      return `${columnLabel} > ${value}`;
+      return t("{{column}} > {{value}}", opts);
     case "isLessThanOrEqual":
-      return `${columnLabel} ≤ ${value}`;
+      return t("{{column}} ≤ {{value}}", opts);
     case "isGreaterThanOrEqual":
-      return `${columnLabel} ≥ ${value}`;
+      return t("{{column}} ≥ {{value}}", opts);
     case "isBetween":
       return values
-        ? `${columnLabel} between ${values[0]} and ${values[1]}`
-        : `${columnLabel} is between`;
+        ? t("{{column}} between {{min}} and {{max}}", {
+            column: columnLabel,
+            min: values[0],
+            max: values[1],
+          })
+        : t("{{column}} is between", opts);
     case "isNotBetween":
       return values
-        ? `${columnLabel} not between ${values[0]} and ${values[1]}`
-        : `${columnLabel} is not between`;
+        ? t("{{column}} not between {{min}} and {{max}}", {
+            column: columnLabel,
+            min: values[0],
+            max: values[1],
+          })
+        : t("{{column}} is not between", opts);
     case "isBefore":
-      return `${columnLabel} is before ${value}`;
+      return t("{{column}} is before {{value}}", opts);
     case "isAfter":
-      return `${columnLabel} is after ${value}`;
+      return t("{{column}} is after {{value}}", opts);
     case "isOnOrBefore":
-      return `${columnLabel} is on or before ${value}`;
+      return t("{{column}} is on or before {{value}}", opts);
     case "isOnOrAfter":
-      return `${columnLabel} is on or after ${value}`;
+      return t("{{column}} is on or after {{value}}", opts);
     case "isAnyOf":
       return values
-        ? `${columnLabel} is any of: ${values.join(", ")}`
-        : `${columnLabel} is "${value}"`;
+        ? t("{{column}} is any of: {{list}}", { column: columnLabel, list: values.join(", ") })
+        : t('{{column}} is "{{value}}"', opts);
     case "isNoneOf":
       return values
-        ? `${columnLabel} is none of: ${values.join(", ")}`
-        : `${columnLabel} is not "${value}"`;
+        ? t("{{column}} is none of: {{list}}", { column: columnLabel, list: values.join(", ") })
+        : t('{{column}} is not "{{value}}"', opts);
     default:
       return `${columnLabel} ${operator} ${value}`;
   }

package/src/utils/filterUtilsContracts.spec.ts

@@ -0,0 +1,190 @@
+/**
+ * filterUtils contracts not covered by filterUtils.spec.ts: filter
+ * validation rules, AND/OR column-scoped combination, column type inference,
+ * the human-readable chip descriptions, and the filter-preset persistence
+ * round-trip (deep-copy on create, Date revival on deserialize).
+ */
+
+import { describe, expect, it, vi } from "vitest";
+import type { TableFilter } from "../types";
+import {
+  combineFilters,
+  createFilterPreset,
+  deserializeFilterPresets,
+  getFilterDescription,
+  inferColumnType,
+  serializeFilterPresets,
+  validateFilter,
+} from "./filterUtils";
+
+function makeFilter(overrides: Partial<TableFilter> = {}): TableFilter {
+  return {
+    id: "f1",
+    columnId: "name",
+    value: { operator: "contains", value: "ada" },
+    ...overrides,
+  } as TableFilter;
+}
+
+describe("validateFilter", () => {
+  it("accepts a complete filter", () => {
+    expect(validateFilter(makeFilter())).toEqual({ isValid: true, errors: [] });
+  });
+
+  it("requires a column id and an operator", () => {
+    const result = validateFilter({ value: { operator: undefined } } as any);
+    expect(result.isValid).toBe(false);
+    expect(result.errors).toContain("Column ID is required");
+    expect(result.errors).toContain("Filter operator is required");
+  });
+
+  it("requires two values for between operators", () => {
+    const result = validateFilter(
+      makeFilter({ value: { operator: "isBetween", values: [1] } as any }),
+    );
+    expect(result.isValid).toBe(false);
+    expect(result.errors).toContain("Between operators require at least 2 values");
+    const ok = validateFilter(
+      makeFilter({ value: { operator: "isNotBetween", values: [1, 10] } as any }),
+    );
+    expect(ok.isValid).toBe(true);
+  });
+
+  it("requires values or a value for option operators", () => {
+    const bad = validateFilter(makeFilter({ value: { operator: "isAnyOf" } as any }));
+    expect(bad.isValid).toBe(false);
+    expect(bad.errors).toContain("Option operators require values array or single value");
+    const ok = validateFilter(
+      makeFilter({ value: { operator: "isNoneOf", values: ["x"] } as any }),
+    );
+    expect(ok.isValid).toBe(true);
+  });
+});
+
+describe("combineFilters", () => {
+  const containsA = makeFilter({ id: "a", value: { operator: "contains", value: "a" } as any });
+  const containsB = makeFilter({ id: "b", value: { operator: "contains", value: "b" } as any });
+
+  it("passes everything with no filters", () => {
+    expect(combineFilters([])("anything", "name")).toBe(true);
+  });
+
+  it("only applies filters scoped to the queried column", () => {
+    const otherColumn = makeFilter({ columnId: "age" });
+    expect(combineFilters([otherColumn])("zzz", "name")).toBe(true);
+  });
+
+  it("ANDs multiple filters on the same column by default", () => {
+    const predicate = combineFilters([containsA, containsB]);
+    expect(predicate("ab", "name")).toBe(true);
+    expect(predicate("a-only", "name")).toBe(false);
+  });
+
+  it("ORs filters when requested", () => {
+    const predicate = combineFilters([containsA, containsB], "OR");
+    expect(predicate("a-only", "name")).toBe(true);
+    expect(predicate("b-only", "name")).toBe(true);
+    expect(predicate("neither", "name")).toBe(false);
+  });
+});
+
+describe("inferColumnType", () => {
+  it("classifies primitives", () => {
+    expect(inferColumnType(true)).toBe("boolean");
+    expect(inferColumnType(42)).toBe("number");
+    expect(inferColumnType(new Date())).toBe("date");
+    expect(inferColumnType("plain words")).toBe("text");
+  });
+});
+
+describe("getFilterDescription", () => {
+  it("describes text operators with the column label", () => {
+    expect(
+      getFilterDescription(
+        makeFilter({ label: "Name", value: { operator: "contains", value: "ada" } as any }),
+      ),
+    ).toBe('Name contains "ada"');
+    expect(getFilterDescription(makeFilter({ value: { operator: "isEmpty" } as any }))).toBe(
+      "name is empty",
+    );
+  });
+
+  it("falls back to the column id when no label is set", () => {
+    expect(getFilterDescription(makeFilter({ value: { operator: "is", value: "x" } as any }))).toBe(
+      'name is "x"',
+    );
+  });
+
+  it("describes comparison operators with symbols", () => {
+    expect(
+      getFilterDescription(makeFilter({ value: { operator: "isLessThan", value: 5 } as any })),
+    ).toBe("name < 5");
+    expect(
+      getFilterDescription(
+        makeFilter({ value: { operator: "isGreaterThanOrEqual", value: 5 } as any }),
+      ),
+    ).toBe("name ≥ 5");
+  });
+
+  it("describes between and option operators from their values arrays", () => {
+    expect(
+      getFilterDescription(
+        makeFilter({ value: { operator: "isBetween", values: [1, 10] } as any }),
+      ),
+    ).toBe("name between 1 and 10");
+    expect(
+      getFilterDescription(
+        makeFilter({ value: { operator: "isAnyOf", values: ["a", "b"] } as any }),
+      ),
+    ).toBe("name is any of: a, b");
+    expect(
+      getFilterDescription(makeFilter({ value: { operator: "isNoneOf", values: ["a"] } as any })),
+    ).toBe("name is none of: a");
+  });
+
+  it("describes date operators", () => {
+    expect(
+      getFilterDescription(
+        makeFilter({ value: { operator: "isAfter", value: "2024-01-01" } as any }),
+      ),
+    ).toBe("name is after 2024-01-01");
+  });
+
+  it("falls back to a raw description for unknown operators", () => {
+    expect(
+      getFilterDescription(makeFilter({ value: { operator: "someFuture", value: "x" } as any })),
+    ).toBe("name someFuture x");
+  });
+});
+
+describe("filter presets round-trip", () => {
+  it("createFilterPreset deep-copies the filters snapshot", () => {
+    const filters = [makeFilter()];
+    const preset = createFilterPreset("My view", filters, "saved");
+    (filters[0].value as any).value = "mutated";
+    expect((preset.filters[0].value as any).value).toBe("ada");
+    expect(preset.name).toBe("My view");
+    expect(preset.description).toBe("saved");
+    expect(preset.createdAt).toBeInstanceOf(Date);
+  });
+
+  it("serializes and revives presets including Date fields", () => {
+    const preset = createFilterPreset("Roundtrip", [makeFilter()]);
+    const revived = deserializeFilterPresets(serializeFilterPresets([preset]));
+    expect(revived).toHaveLength(1);
+    expect(revived[0].name).toBe("Roundtrip");
+    expect(revived[0].filters).toEqual(preset.filters);
+    expect(revived[0].createdAt).toBeInstanceOf(Date);
+    expect(revived[0].createdAt.getTime()).toBe(preset.createdAt.getTime());
+  });
+
+  it("returns an empty list for corrupted or non-array preset payloads", () => {
+    const warn = vi.spyOn(console, "warn").mockImplementation(() => {});
+    try {
+      expect(deserializeFilterPresets("{oops")).toEqual([]);
+      expect(deserializeFilterPresets('{"not":"array"}')).toEqual([]);
+    } finally {
+      warn.mockRestore();
+    }
+  });
+});

package/src/utils/paginationDefaults.spec.ts

@@ -0,0 +1,43 @@
+import { renderHook } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import { useTablePagination } from "../hooks/useTablePagination";
+import { useDataTable } from "../hooks/useDataTable";
+import { deserializeTableState } from "./urlStateUtils";
+import { DEFAULT_PAGE_SIZE, DEFAULT_PAGE_SIZE_OPTIONS } from "./paginationDefaults";
+
+describe("pagination defaults (DG-TBL-04)", () => {
+  it("exports pageSize 25 and options 10/25/50/100", () => {
+    expect(DEFAULT_PAGE_SIZE).toBe(25);
+    expect([...DEFAULT_PAGE_SIZE_OPTIONS]).toEqual([10, 25, 50, 100]);
+  });
+
+  it("useTablePagination defaults pageSize to 25", () => {
+    const { result } = renderHook(() => useTablePagination());
+    expect(result.current.pagination.pageSize).toBe(25);
+    expect(result.current.pagination.pageIndex).toBe(0);
+  });
+
+  it("useDataTable defaults pageSize to 25 when initialState omits pagination", () => {
+    const { result } = renderHook(() =>
+      useDataTable({
+        data: [{ id: 1, name: "a" }],
+        columns: [{ id: "name", accessorKey: "name", header: "Name" }],
+      }),
+    );
+    expect(result.current.state.pagination.pageSize).toBe(25);
+  });
+
+  it("URL deserialize falls back to default pageSize 25 when pageSize is omitted", () => {
+    const result = deserializeTableState({ page: "1" });
+    expect(result.pagination).toEqual({ pageIndex: 0, pageSize: DEFAULT_PAGE_SIZE });
+  });
+
+  it("URL serialize/deserialize round-trips pageSize (persist via syncWithUrl pattern)", () => {
+    const serialized = {
+      page: "2",
+      pageSize: "50",
+    };
+    const state = deserializeTableState(serialized);
+    expect(state.pagination).toEqual({ pageIndex: 1, pageSize: 50 });
+  });
+});

package/src/utils/paginationDefaults.ts

@@ -0,0 +1,21 @@
+/**
+ * DG-TBL-04 — pagination smart defaults.
+ *
+ * Default pageSize 25 with options 10/25/50/100.
+ * Persistence rides the existing URL-state / saved-view patterns
+ * (`syncWithUrl`, `useTableViews`) — no separate storage invented here.
+ */
+
+/** Default rows per page (DG-TBL-04). */
+export const DEFAULT_PAGE_SIZE = 25;
+
+/** Default page-size selector options (DG-TBL-04). */
+export const DEFAULT_PAGE_SIZE_OPTIONS = [10, 25, 50, 100] as const;
+
+/**
+ * Infinite mode: how many rows before the tail the next-page append triggers.
+ * Prefetch already has page N+1 in cache, so this lead only hides append work.
+ */
+export const INFINITE_TRIGGER_ROWS = 5;
+
+export type DefaultPageSizeOption = (typeof DEFAULT_PAGE_SIZE_OPTIONS)[number];

package/src/utils/urlStateUtils.spec.ts

@@ -64,9 +64,9 @@ describe("deserializeTableState", () => {
     expect(result.pagination).toEqual({ pageIndex: 2, pageSize: 25 });
   });
 
-  it("defaults page size to 10 when not provided", () => {
+  it("defaults page size to 25 when not provided (DG-TBL-04)", () => {
     const result = deserializeTableState({ page: "1" });
-    expect(result.pagination).toEqual({ pageIndex: 0, pageSize: 10 });
+    expect(result.pagination).toEqual({ pageIndex: 0, pageSize: 25 });
   });
 
   it("deserializes sorting", () => {

package/src/utils/urlStateUtils.ts

@@ -1,4 +1,5 @@
 import type { DataTableState, TableFilter, TableSorting } from "../types";
+import { DEFAULT_PAGE_SIZE } from "./paginationDefaults";
 
 // URL State Serialization
 
@@ -48,7 +49,7 @@ export function deserializeTableState(urlState: Record<string, string>): Partial
   // Pagination
   if (urlState.page) {
     const pageIndex = Number.parseInt(urlState.page, 10) - 1; // Convert to 0-based
-    const pageSize = urlState.pageSize ? Number.parseInt(urlState.pageSize, 10) : 10;
+    const pageSize = urlState.pageSize ? Number.parseInt(urlState.pageSize, 10) : DEFAULT_PAGE_SIZE;
 
     if (!Number.isNaN(pageIndex) && !Number.isNaN(pageSize)) {
       state.pagination = { pageIndex, pageSize };

package/src/utils/viewData.ts

@@ -0,0 +1,27 @@
+/**
+ * Rows as the user currently sees them: the sorted (post-filter) row model,
+ * flattened to leaf rows so group-header rows never leak downstream.
+ * Pagination is intentionally NOT applied — "current view" means everything
+ * matching the active filters in the visible order, not just the visible
+ * page. Shared by DataTableExport (file contents) and DataTableGrouping
+ * (group building) so both stay in lockstep with what the table shows
+ * (LC-16 one implementation).
+ */
+export function getViewLeafRows<T>(table: any): T[] {
+  try {
+    const leaves: T[] = [];
+    const walk = (rows: any[]) => {
+      for (const row of rows) {
+        if (row.getIsGrouped?.()) {
+          walk(row.subRows ?? []);
+        } else {
+          leaves.push(row.original as T);
+        }
+      }
+    };
+    walk(table.getSortedRowModel().rows);
+    return leaves;
+  } catch {
+    return [];
+  }
+}