basalt-ui 1.41.0 → 2.0.0

package/dist/{data → table}/data-table.js

@@ -12,15 +12,9 @@ import {
   Text,
   TextInput
 } from "@mantine/core";
-import {
-  flexRender,
-  getCoreRowModel,
-  getFilteredRowModel,
-  getPaginationRowModel,
-  getSortedRowModel,
-  useReactTable
-} from "@tanstack/react-table";
+import { constructFilterFn, FlexRender, useTable } from "@tanstack/react-table";
 import { Fragment, useLayoutEffect, useMemo, useRef, useState } from "react";
+import { useDebouncedCallback } from "@mantine/hooks";
 import { cx } from "../common/props.js";
 import { BASALT_PREFIX } from "../common/errors.js";
 import { HIT_COARSE } from "../common/hit-floor.js";
@@ -42,6 +36,7 @@ import {
   useRowDisclosure
 } from "./data-table-state.js";
 import { dataQueryBranch } from "./query-branch.js";
+import { basaltTableFeatures } from "./table-features.js";
 import classes from "./data-table.module.css";
 const ALIGNMENTS = /* @__PURE__ */ new Set(["left", "center", "right"]);
 function resolveAlign(column) {
@@ -111,6 +106,15 @@ function resolveFacetColumn(table, facet) {
   }
   return void 0;
 }
+const facetAutoRemove = (value) => value === null || value === void 0 || value === "" || Array.isArray(value) && value.length === 0;
+const facetExact = constructFilterFn({
+  filter: (dataValue, filterValue) => filterValue === null || filterValue === void 0 || filterValue === "" ? true : String(dataValue) === filterValue,
+  autoRemove: facetAutoRemove
+});
+const facetAnyOf = constructFilterFn({
+  filter: (dataValue, filterValue) => !Array.isArray(filterValue) || filterValue.length === 0 ? true : filterValue.includes(String(dataValue)),
+  autoRemove: facetAutoRemove
+});
 const SELECT_COLUMN_ID = "__basalt_select__";
 function selectionColumn() {
   return {
@@ -175,6 +179,7 @@ const DEFAULT_PAGE_SIZE_OPTIONS = [10, 25, 50, 100];
 const TABLE_HEADER_LEAD_STYLE = { flex: "1 1 auto", minWidth: 0 };
 const TABLE_TOOLBAR_STYLE = { flex: "0 1 auto", minWidth: 0 };
 const SEARCH_WIDTH = 220;
+const SEARCH_DEBOUNCE_MS = 250;
 const TABLE_SEARCH_STYLE = {
   flex: `0 1 ${SEARCH_WIDTH}px`,
   minWidth: "12ch",
@@ -182,12 +187,12 @@ const TABLE_SEARCH_STYLE = {
 };
 const PAGE_SIZE_WIDTH = 116;
 function getOrderedHeaderGroups(table) {
-  const left = table.getLeftHeaderGroups();
+  const start = table.getStartHeaderGroups();
   const center = table.getCenterHeaderGroups();
-  const right = table.getRightHeaderGroups();
+  const end = table.getEndHeaderGroups();
   return center.map((group, index) => ({
     ...group,
-    headers: [...left[index]?.headers ?? [], ...group.headers, ...right[index]?.headers ?? []]
+    headers: [...start[index]?.headers ?? [], ...group.headers, ...end[index]?.headers ?? []]
   }));
 }
 function getPinnedCellStyle(table, column) {
@@ -202,18 +207,18 @@ function getPinnedCellStyle(table, column) {
     maxWidth: size,
     backgroundColor: VX.surface.panel
   };
-  if (pinned === "left") {
-    const isEdge2 = column.getPinnedIndex() === table.getLeftLeafColumns().length - 1;
+  if (pinned === "start") {
+    const isEdge2 = column.getPinnedIndex() === table.getStartLeafColumns().length - 1;
     return {
       ...shared,
-      left: column.getStart("left"),
+      insetInlineStart: column.getStart("start"),
       boxShadow: isEdge2 ? `4px 0 6px -4px ${alpha(VX.ink, 0.18)}` : void 0
     };
   }
   const isEdge = column.getPinnedIndex() === 0;
   return {
     ...shared,
-    right: column.getAfter("right"),
+    insetInlineEnd: column.getAfter("end"),
     boxShadow: isEdge ? `-4px 0 6px -4px ${alpha(VX.ink, 0.18)}` : void 0
   };
 }
@@ -232,14 +237,15 @@ function foldOrder(columns) {
 }
 const FOLD_ID_ATTR = "data-basalt-fold-id";
 function planColumnFold(input) {
-  const { room, toggleWidth, overhead, order, widths } = input;
+  const { room, toggleWidth, overhead, fixedCount = 0, order, widths } = input;
   const known = order.filter((id) => widths.has(id));
+  const roundingSlack = (known.length + fixedCount + 1) / 2;
   let unfolded = overhead + known.reduce((sum, id) => sum + (widths.get(id) ?? 0), 0);
   const folded = /* @__PURE__ */ new Set();
   for (const id of known) {
     if (folded.size >= known.length - 1) break;
     const withToggle = unfolded + (folded.size > 0 ? toggleWidth : 0);
-    if (withToggle <= room) break;
+    if (withToggle <= room + roundingSlack) break;
     folded.add(id);
     unfolded -= widths.get(id) ?? 0;
   }
@@ -250,14 +256,12 @@ function useColumnFold(input) {
   const wrapperRef = useRef(null);
   const [folded, setFolded] = useState(EMPTY_FOLD_SET);
   const orderRef = useRef(order);
-  orderRef.current = order;
   const fixedIdsRef = useRef(fixedIds);
-  fixedIdsRef.current = fixedIds;
   useLayoutEffect(() => {
-    if (!active || order.length === 0) {
-      setFolded((current) => current.size === 0 ? current : EMPTY_FOLD_SET);
-    }
-  }, [active, order.length]);
+    orderRef.current = order;
+    fixedIdsRef.current = fixedIds;
+  });
+  if ((!active || order.length === 0) && folded.size > 0) setFolded(EMPTY_FOLD_SET);
   useMeasuredWidths({
     resolveRoot: () => wrapperRef.current,
     signature: `${order.join("|")}::${fixedIds.join("|")}`,
@@ -282,6 +286,7 @@ function useColumnFold(input) {
         // reads as one more `--vx-hit` control rather than a narrower afterthought.
         toggleWidth: HIT_COARSE,
         overhead,
+        fixedCount: fixedIdsRef.current.length,
         order: orderRef.current,
         widths
       });
@@ -303,7 +308,7 @@ function RowDisclosure({
   const cells = row.getAllCells().filter((cell) => folded.has(cell.column.id));
   return /* @__PURE__ */ jsx("div", { className: classes.foldDisclosure, children: cells.map((cell) => /* @__PURE__ */ jsxs("div", { className: classes.foldDisclosureRow, children: [
     /* @__PURE__ */ jsx(Text, { className: classes.foldDisclosureLabel, children: columnLabel(cell.column) }),
-    /* @__PURE__ */ jsx("div", { className: classes.foldDisclosureValue, children: flexRender(cell.column.columnDef.cell, cell.getContext()) })
+    /* @__PURE__ */ jsx("div", { className: classes.foldDisclosureValue, children: /* @__PURE__ */ jsx(FlexRender, { cell }) })
   ] }, cell.id)) });
 }
 function FoldToggle({
@@ -424,6 +429,11 @@ function BasaltDataTable(props) {
   } = props;
   const tableState = useDataTableState(props, pageSizeOptions[0] ?? 10);
   const { globalFilter, columnPinning, onGlobalFilterChange: handleGlobalFilterChange } = tableState;
+  const [searchDraft, setSearchDraft] = useState(globalFilter);
+  const commitSearch = useDebouncedCallback(handleGlobalFilterChange, {
+    delay: SEARCH_DEBOUNCE_MS,
+    flushOnUnmount: true
+  });
   useValidateProps(
     "BasaltDataTable",
     () => [
@@ -447,8 +457,7 @@ function BasaltDataTable(props) {
       const id = columnDefId(column);
       const facet = id === void 0 ? void 0 : facetById.get(id);
       if (!facet) return column;
-      const filterFn = facet.multiple ? (row, columnId, filterValue) => !Array.isArray(filterValue) || filterValue.length === 0 ? true : filterValue.includes(String(row.getValue(columnId))) : (row, columnId, filterValue) => filterValue === null || filterValue === void 0 || filterValue === "" ? true : String(row.getValue(columnId)) === filterValue;
-      filterFn.autoRemove = (value) => value === null || value === void 0 || value === "" || Array.isArray(value) && value.length === 0;
+      const filterFn = facet.multiple ? facetAnyOf : facetExact;
       return { ...column, filterFn };
     });
   }, [columns, facets]);
@@ -476,7 +485,7 @@ function BasaltDataTable(props) {
   const scrolls = maxHeight !== void 0 || minWidth !== void 0;
   const foldEligible = minWidth === void 0;
   const { columnFoldOrder, columnFoldFixedIds } = useMemo(() => {
-    const pinnedIds = /* @__PURE__ */ new Set([...columnPinning.left ?? [], ...columnPinning.right ?? []]);
+    const pinnedIds = /* @__PURE__ */ new Set([...columnPinning.start, ...columnPinning.end]);
     const excluded = new Set(
       columns.flatMap((column) => {
         const id = columnDefId(column);
@@ -489,19 +498,22 @@ function BasaltDataTable(props) {
       columnFoldFixedIds: [...excluded]
     };
   }, [columns, columnPinning]);
-  const projection = useCardProjection(renderCard !== void 0);
-  const columnFold = useColumnFold({
-    active: foldEligible && !projection.cards,
+  const { cards: showCards, rootRef: projectionRootRef } = useCardProjection(
+    renderCard !== void 0
+  );
+  const { folded: foldedColumns, wrapperRef: foldWrapperRef } = useColumnFold({
+    active: foldEligible && !showCards,
     order: columnFoldOrder,
     fixedIds: columnFoldFixedIds
   });
   const columnVisibility = useMemo(
-    () => Object.fromEntries([...columnFold.folded].map((id) => [id, false])),
-    [columnFold.folded]
+    () => Object.fromEntries([...foldedColumns].map((id) => [id, false])),
+    [foldedColumns]
   );
-  const hasFolded = columnFold.folded.size > 0;
+  const hasFolded = foldedColumns.size > 0;
   const foldRows = useRowDisclosure({ data, getRowId });
-  const table = useReactTable({
+  const table = useTable({
+    features: basaltTableFeatures,
     data,
     columns: tableColumns,
     state: {
@@ -523,19 +535,16 @@ function BasaltDataTable(props) {
       onRowSelectionChange: tableState.onRowSelectionChange
     },
     ...getRowId !== void 0 && { getRowId },
-    getCoreRowModel: getCoreRowModel(),
-    getSortedRowModel: getSortedRowModel(),
-    getFilteredRowModel: getFilteredRowModel(),
-    // Both row models stay installed and are BYPASSED by these flags, which is TanStack's own
-    // seam — so a degraded table renders `data` in the order and completeness the server sent it.
-    // Forced only by a BREACH, never by `enableSorting={false}` on its own: that pair still applies
-    // an `initialSorting` today (it disables the header control, not the row model) and a table
-    // that is not misreporting has no business losing it.
+    // Every row model is registered on the feature set (v9 has no per-render switch) and BYPASSED by
+    // these flags, which is TanStack's own seam — so a degraded table renders `data` in the order
+    // and completeness the server sent it. Sorting/filtering are forced only by a BREACH, never by
+    // `enableSorting={false}` on its own: that pair still applies an `initialSorting` today (it
+    // disables the header control, not the row model) and a table that is not misreporting has no
+    // business losing it. Pagination is bypassed whenever it is not enabled, or is server-driven.
     manualSorting: manualSorting || breaches.includes("sorting"),
     manualFiltering: manualFiltering || breaches.includes("filtering"),
+    manualPagination: !enablePagination || manualPagination,
     ...enablePagination && {
-      getPaginationRowModel: getPaginationRowModel(),
-      manualPagination,
       ...manualPagination && rowCount !== void 0 && { rowCount },
       ...manualPagination && pageCount !== void 0 && { pageCount }
     },
@@ -548,7 +557,7 @@ function BasaltDataTable(props) {
   const branch = query === void 0 ? void 0 : dataQueryBranch("BasaltDataTable", query);
   const showSkeleton = branch === void 0 ? isLoading : branch === "pending";
   const queryError = branch === "error" && query !== void 0 ? query : void 0;
-  const columnCount = columns.length + (enableRowSelection ? 1 : 0) + (hasFolded ? 1 : 0) - columnFold.folded.size;
+  const columnCount = columns.length + (enableRowSelection ? 1 : 0) + (hasFolded ? 1 : 0) - foldedColumns.size;
   const selectedModelRows = enableRowSelection ? table.getSelectedRowModel().rows : void 0;
   const selectedRows = useMemo(
     () => selectedModelRows?.map((row) => row.original) ?? [],
@@ -561,7 +570,9 @@ function BasaltDataTable(props) {
   const headerGroups = enablePinning ? getOrderedHeaderGroups(table) : table.getHeaderGroups();
   const rows = table.getRowModel().rows;
   const pageStickyHeader = !scrolls && stickyHeader === true;
-  const containment = useMeasuredContainment(pageStickyHeader && !projection.cards);
+  const { wrapperRef: containmentRef, contained } = useMeasuredContainment(
+    pageStickyHeader && !showCards
+  );
   const resolvedStickyHeaderOffset = scrolls ? void 0 : stickyHeaderOffset;
   const errorNode = queryError !== void 0 && /* @__PURE__ */ jsx(
     ErrorState,
@@ -617,7 +628,7 @@ function BasaltDataTable(props) {
                   ...pinnedStyle
                 },
                 children: [
-                  header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext()),
+                  header.isPlaceholder ? null : /* @__PURE__ */ jsx(FlexRender, { header }),
                   canSort && /* @__PURE__ */ jsx(SortIndicator, { direction: sorted })
                 ]
               },
@@ -627,9 +638,9 @@ function BasaltDataTable(props) {
         ] }, headerGroup.id)) }),
         /* @__PURE__ */ jsx(Table.Tbody, { children: queryError !== void 0 ? /* @__PURE__ */ jsx(Table.Tr, { children: /* @__PURE__ */ jsx(Table.Td, { colSpan: columnCount, children: errorNode }) }) : showSkeleton ? Array.from({ length: skeletonRows }, (_, rowIndex) => /* @__PURE__ */ jsx(Table.Tr, { children: Array.from({ length: columnCount }, (__, colIndex) => /* @__PURE__ */ jsx(Table.Td, { children: /* @__PURE__ */ jsx(Skeleton, { height: 16, radius: "sm" }) }, `skeleton-${rowIndex}-${colIndex}`)) }, `skeleton-${rowIndex}`)) : rows.length === 0 ? /* @__PURE__ */ jsx(Table.Tr, { children: /* @__PURE__ */ jsx(Table.Td, { colSpan: columnCount, children: emptyNode }) }) : rows.map((row) => {
           const cells = enablePinning ? [
-            ...row.getLeftVisibleCells(),
+            ...row.getStartVisibleCells(),
             ...row.getCenterVisibleCells(),
-            ...row.getRightVisibleCells()
+            ...row.getEndVisibleCells()
           ] : row.getVisibleCells();
           const rowExpanded = hasFolded && foldRows.expanded.has(row.id);
           return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -666,7 +677,7 @@ function BasaltDataTable(props) {
                           ...align !== void 0 && { textAlign: align },
                           ...pinnedStyle
                         },
-                        children: flexRender(cell.column.columnDef.cell, cell.getContext())
+                        children: /* @__PURE__ */ jsx(FlexRender, { cell })
                       },
                       cell.id
                     );
@@ -674,14 +685,14 @@ function BasaltDataTable(props) {
                 ]
               }
             ),
-            rowExpanded && /* @__PURE__ */ jsx(Table.Tr, { id: `${row.id}-fold`, className: classes.foldDisclosureRowTr, children: /* @__PURE__ */ jsx(Table.Td, { colSpan: columnCount, className: classes.foldDisclosureCell, children: /* @__PURE__ */ jsx(RowDisclosure, { row, folded: columnFold.folded }) }) })
+            rowExpanded && /* @__PURE__ */ jsx(Table.Tr, { id: `${row.id}-fold`, className: classes.foldDisclosureRowTr, children: /* @__PURE__ */ jsx(Table.Td, { colSpan: columnCount, className: classes.foldDisclosureCell, children: /* @__PURE__ */ jsx(RowDisclosure, { row, folded: foldedColumns }) }) })
           ] }, row.id);
         }) })
       ]
     }
   );
   const renderCardList = () => /* @__PURE__ */ jsx(Stack, { gap: "xs", className: cx(classNames?.table), children: queryError !== void 0 ? errorNode : showSkeleton ? Array.from({ length: skeletonRows }, (_, index) => /* @__PURE__ */ jsx(Skeleton, { height: 48, radius: "md" }, `skeleton-${index}`)) : rows.length === 0 ? emptyNode : rows.map((row) => /* @__PURE__ */ jsx(Box, { ...activationProps(onRowActivate, row.original), children: renderCard?.(row.original) }, row.id)) });
-  const paginationState = table.getState().pagination;
+  const paginationState = table.state.pagination;
   const pageSizeRows = [.../* @__PURE__ */ new Set([...pageSizeOptions, paginationState.pageSize])].sort((a, b) => a - b).map((size) => ({ value: String(size), label: `${size} / page` }));
   const total = table.getRowCount();
   const rangeStart = total === 0 ? 0 : paginationState.pageIndex * paginationState.pageSize + 1;
@@ -689,7 +700,7 @@ function BasaltDataTable(props) {
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      ref: projection.rootRef,
+      ref: projectionRootRef,
       className: cx(classNames?.root, className),
       ...style !== void 0 && { style },
       children: [
@@ -720,8 +731,11 @@ function BasaltDataTable(props) {
                     style: TABLE_SEARCH_STYLE,
                     placeholder: globalFilterPlaceholder,
                     leftSection: searchIcon,
-                    value: globalFilter,
-                    onChange: (event) => handleGlobalFilterChange(event.currentTarget.value)
+                    value: searchDraft,
+                    onChange: (event) => {
+                      setSearchDraft(event.currentTarget.value);
+                      commitSearch(event.currentTarget.value);
+                    }
                   }
                 ),
                 showFacets && /* @__PURE__ */ jsx(FilterSet, { children: facets?.map((facet) => {
@@ -749,7 +763,7 @@ function BasaltDataTable(props) {
           ) })
         ] }),
         bulkBarActions !== void 0 && /* @__PURE__ */ jsx(BulkActionBar, { count: selectedRows.length, actions: bulkBarActions }),
-        projection.cards ? maxHeight === void 0 ? renderCardList() : /* @__PURE__ */ jsx(ScrollArea.Autosize, { mah: maxHeight, type: "hover", scrollbars: "y", children: renderCardList() }) : !foldEligible ? (
+        showCards ? maxHeight === void 0 ? renderCardList() : /* @__PURE__ */ jsx(ScrollArea.Autosize, { mah: maxHeight, type: "hover", scrollbars: "y", children: renderCardList() }) : !foldEligible ? (
           // An explicit `minWidth` is the one genuinely DECLARED horizontal floor — the column fold
           // never engages here (see `foldEligible`, above), so this shape keeps its exact
           // pre-existing DOM: no extra measuring wrapper for a table nothing folds.
@@ -759,17 +773,17 @@ function BasaltDataTable(props) {
           // `maxHeight`-only included: a vertical cap is orthogonal to column width, so a
           // `stickyHeader` + `maxHeight` table (the pairing this package's own docs recommend) still
           // folds instead of silently regressing to horizontal scroll. A plain block box, so it
-          // constrains nothing on its own; `columnFold.wrapperRef` only reads it.
-          /* @__PURE__ */ jsx("div", { ref: columnFold.wrapperRef, className: classes.foldWrapper, children: pageStickyHeader ? (
+          // constrains nothing on its own; `foldWrapperRef` only reads it.
+          /* @__PURE__ */ jsx("div", { ref: foldWrapperRef, className: classes.foldWrapper, children: pageStickyHeader ? (
             // Pinning takes this wrapper too — a pinned column's offsets are `position: sticky` on
             // the cells and need no overflow box of their own, so the `overflow-x: auto` Box that
             // used to sit here was the exact inert-sticky defect this shape exists to avoid.
             /* @__PURE__ */ jsx(
               "div",
               {
-                ref: containment.wrapperRef,
+                ref: containmentRef,
                 className: classes.containment,
-                "data-contained": containment.contained ? "true" : "false",
+                "data-contained": contained ? "true" : "false",
                 children: tableNode
               }
             )

package/dist/table/index.d.ts

@@ -0,0 +1,18 @@
+/**
+ * ./table — BasaltDataTable: a sortable data table over @tanstack/react-table v9, rendered with
+ * Mantine primitives. Opt-in chrome: a search/facet toolbar, a pagination bar (client-side or
+ * server-driven) and sticky column pinning. `createColumnHelper` is basalt's own, bound to the
+ * table's feature set — no TanStack hook, feature or row-model symbol leaves this subpath.
+ *
+ * Optional peer: @tanstack/react-table 9.2.8 (exact).
+ *
+ * @example
+ * import { BasaltDataTable, createColumnHelper } from 'basalt-ui/table'
+ * type Row = { name: string; score: number }
+ * const col = createColumnHelper<Row>()
+ * const columns = [col.accessor('name', { header: 'Name' }), col.accessor('score', { header: 'Score' })]
+ * <BasaltDataTable data={rows} columns={columns} enableGlobalFilter enablePagination />
+ */
+export { BasaltDataTable } from './data-table.js';
+export { createColumnHelper } from './table-features.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/table/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/table/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA"}

package/dist/{data/table.js → table/index.js}

@@ -1,5 +1,5 @@
 import { BasaltDataTable } from "./data-table.js";
-import { createColumnHelper } from "@tanstack/react-table";
+import { createColumnHelper } from "./table-features.js";
 export {
   BasaltDataTable,
   createColumnHelper

package/dist/table/query-branch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"query-branch.d.ts","sourceRoot":"","sources":["../../src/table/query-branch.ts"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAEhE;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAA;AAE3D;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAC7B,SAAS,EAAE,MAAM,EACjB,KAAK,EAAE,cAAc,CAAC,OAAO,CAAC,GAC7B,eAAe,CAOjB"}

package/dist/table/table-features.d.ts

@@ -0,0 +1,69 @@
+import type { ColumnDef, ColumnHelper, RowData } from '@tanstack/react-table';
+/** Horizontal alignment of a column's header AND its cells. */
+export type DataTableAlign = 'left' | 'center' | 'right';
+/**
+ * What a column def's `meta` may carry. Registered per table through `columnMeta: metaHelper<…>()`
+ * rather than a global `declare module '@tanstack/react-table'`, so `meta: { aling: 'right' }` is a
+ * compile error (excess-property check on the literal) and nothing leaks into a consumer's own
+ * TanStack types. A wrong align VALUE that reaches runtime still throws at render.
+ */
+export type BasaltColumnMeta = {
+    align?: DataTableAlign;
+    /**
+     * Opt OUT of the automatic mono-numeral cell style. The table applies it whenever the cell's
+     * raw value is a number — which is right for a plain figure and wrong for a numeric accessor
+     * whose `cell` renders its own chrome (a coloured `Text`, a `Badge`, a sparkline), because the
+     * `<td>`'s mono font then overrides what the cell asked for.
+     */
+    numeral?: boolean;
+    /**
+     * Fold priority for the measured column fold (`docs/CONTROLS-SPEC.md` §2): once the
+     * table no longer fits its wrapper, the HIGHEST-numbered priority column folds first, moving
+     * into a per-row disclosure instead of forcing the table into horizontal scroll. Unset columns
+     * fall back to their declared position, so a bare `<BasaltDataTable data columns />` folds its
+     * LAST column first — nothing regresses with no `meta.priority` set anywhere. See `foldOrder`.
+     */
+    priority?: number;
+};
+/**
+ * Every row model is registered (v9 has no per-render `getXRowModel` switch); the table bypasses the
+ * ones a prop turns off through TanStack's `manual*` flags. `sortFns` is load-bearing: v9 falls back
+ * to `basic` for an unregistered sort function with only a dev warning, which sorts `Project 10`
+ * before `Project 2`. `columnSizingFeature` is too — `column.getStart`/`getAfter` live there, and
+ * sticky pinning reads them.
+ */
+export declare const basaltTableFeatures: {
+    rowSortingFeature: import("@tanstack/react-table").TableFeature;
+    columnFilteringFeature: import("@tanstack/react-table").TableFeature;
+    globalFilteringFeature: import("@tanstack/react-table").TableFeature;
+    rowPaginationFeature: import("@tanstack/react-table").TableFeature;
+    rowSelectionFeature: import("@tanstack/react-table").TableFeature;
+    columnSizingFeature: import("@tanstack/react-table").TableFeature;
+    columnPinningFeature: import("@tanstack/react-table").TableFeature;
+    columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
+    sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+    filteredRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+    paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+    sortFns: {
+        alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
+        text: import("@tanstack/react-table").CreatedSortFn<any, any>;
+        datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
+        basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
+    };
+    filterFns: {
+        includesString: import("@tanstack/react-table").CreatedFilterFn<any, any>;
+    };
+    columnMeta: BasaltColumnMeta;
+};
+export type BasaltTableFeatures = typeof basaltTableFeatures;
+/**
+ * A column def of `BasaltDataTable`'s feature set; the cell value varies per column, hence the `any`.
+ * Build columns with `createColumnHelper` below — hand-typing this is not the supported path.
+ */
+export type BasaltColumnDef<T extends RowData> = ColumnDef<BasaltTableFeatures, T, any>;
+/**
+ * Typed accessor builder for `BasaltDataTable` columns: `col.accessor('field', …)` columns sort by
+ * value. One generic, the row type — the feature set is basalt's.
+ */
+export declare function createColumnHelper<T extends RowData>(): ColumnHelper<BasaltTableFeatures, T>;
+//# sourceMappingURL=table-features.d.ts.map

package/dist/table/table-features.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-features.d.ts","sourceRoot":"","sources":["../../src/table/table-features.ts"],"names":[],"mappings":"AA2BA,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAE7E,+DAA+D;AAC/D,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;AAExD;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,CAAC,EAAE,cAAc,CAAA;IACtB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AAED;;;;;;GAMG;AACH,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;CAoB9B,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG,OAAO,mBAAmB,CAAA;AAE5D;;;GAGG;AAEH,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,OAAO,IAAI,SAAS,CAAC,mBAAmB,EAAE,CAAC,EAAE,GAAG,CAAC,CAAA;AAEvF;;;GAGG;AACH,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,OAAO,KAAK,YAAY,CAAC,mBAAmB,EAAE,CAAC,CAAC,CAE5F"}

package/dist/table/table-features.js

@@ -0,0 +1,49 @@
+import {
+  columnFilteringFeature,
+  columnPinningFeature,
+  columnSizingFeature,
+  columnVisibilityFeature,
+  createColumnHelper as tanstackColumnHelper,
+  createFilteredRowModel,
+  createPaginatedRowModel,
+  createSortedRowModel,
+  filterFn_includesString,
+  globalFilteringFeature,
+  metaHelper,
+  rowPaginationFeature,
+  rowSelectionFeature,
+  rowSortingFeature,
+  sortFn_alphanumeric,
+  sortFn_basic,
+  sortFn_datetime,
+  sortFn_text,
+  tableFeatures
+} from "@tanstack/react-table";
+const basaltTableFeatures = tableFeatures({
+  rowSortingFeature,
+  columnFilteringFeature,
+  globalFilteringFeature,
+  rowPaginationFeature,
+  rowSelectionFeature,
+  columnSizingFeature,
+  columnPinningFeature,
+  columnVisibilityFeature,
+  sortedRowModel: createSortedRowModel(),
+  filteredRowModel: createFilteredRowModel(),
+  paginatedRowModel: createPaginatedRowModel(),
+  sortFns: {
+    alphanumeric: sortFn_alphanumeric,
+    text: sortFn_text,
+    datetime: sortFn_datetime,
+    basic: sortFn_basic
+  },
+  filterFns: { includesString: filterFn_includesString },
+  columnMeta: metaHelper()
+});
+function createColumnHelper() {
+  return tanstackColumnHelper();
+}
+export {
+  basaltTableFeatures,
+  createColumnHelper
+};

package/dist/telemetry.d.ts

@@ -0,0 +1,77 @@
+import type { ThreadStatus } from './agent/thread.js';
+/** Epoch ms (`performance.timeOrigin + performance.now()`). */
+type At = {
+    start: number;
+};
+/** `start` plus a duration in ms. */
+type Span = At & {
+    duration: number;
+};
+/** The error family, or an `AgentError` kind (W8) — closed. */
+type ErrorKind = 'route' | 'query' | 'mutation' | 'render' | 'window' | 'unhandledrejection' | 'http' | 'stream' | 'server' | 'aborted';
+type Failure = {
+    'exception.type': string;
+    'basalt.error.kind': ErrorKind;
+};
+type Ok<T, A> = Span & {
+    type: T;
+    failed: false;
+    attributes: A;
+};
+type Err<T, A, S = At> = S & {
+    type: T;
+    failed: true;
+    attributes: A & Failure;
+};
+type RouteAttrs = {
+    'basalt.route.id': string;
+    'basalt.route.from': string;
+    /** Pathname, never search. */
+    'url.path': string;
+};
+type ChatAttrs = {
+    'basalt.chat.thread_id': string;
+    'basalt.chat.ttft_ms': number;
+    'basalt.chat.parts': number;
+    'basalt.chat.status': ThreadStatus;
+};
+/**
+ * Closed union: switch on `type`/`failed` and end with `default: return event satisfies never`.
+ *
+ * @example
+ * export function telemetry(e: BasaltEvent): void {
+ *   const span = tracer.startSpan(e.type, { startTime: e.start, attributes: { ...e.attributes } })
+ *   if (e.failed) span.setStatus({ code: SpanStatusCode.ERROR })
+ *   span.end('duration' in e ? e.start + e.duration : e.start)
+ * }
+ */
+export type BasaltEvent = Ok<'route.navigate', RouteAttrs> | Err<'route.error', {
+    'basalt.route.id': string;
+}> | Err<'query.error', {
+    'basalt.query.hash': string;
+    'basalt.query.failure_count': number;
+}> | Err<'mutation.error', {
+    'basalt.mutation.key': string;
+}> | Err<'render.error', {
+    'basalt.error.boundary': 'root';
+}> | Err<'window.error', {
+    'basalt.error.source': 'error' | 'unhandledrejection';
+}> | Ok<'chat.turn', ChatAttrs> | Err<'chat.turn', ChatAttrs, Span>;
+export type Telemetry = (event: BasaltEvent) => void;
+export declare const now: () => number;
+/** `error.name`, `'Error'` for a non-`Error` throw. */
+export declare const errorName: (error: unknown) => string;
+/**
+ * Wrap a sink so it is called synchronously and a throwing sink never breaks a render. No sink, no
+ * events.
+ */
+export declare function createEmitter(sink: Telemetry | undefined): Telemetry;
+/**
+ * The provider's wrapped emitter, for hooks that emit their own events (`useAgentThreadRuns`'
+ * `chat.turn`). `undefined` outside a `BasaltProvider`, where such a hook emits nothing.
+ */
+export declare const TelemetryContext: import("react").Context<Telemetry | undefined>;
+export declare function bindRouterTelemetry(router: object, emit: Telemetry): () => void;
+export declare function routerTelemetry(router: object): Telemetry;
+export {};
+//# sourceMappingURL=telemetry.d.ts.map

package/dist/telemetry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"telemetry.d.ts","sourceRoot":"","sources":["../src/telemetry.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAElD,+DAA+D;AAC/D,KAAK,EAAE,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,CAAA;AAC3B,qCAAqC;AACrC,KAAK,IAAI,GAAG,EAAE,GAAG;IAAE,QAAQ,EAAE,MAAM,CAAA;CAAE,CAAA;AAErC,+DAA+D;AAC/D,KAAK,SAAS,GACV,OAAO,GACP,OAAO,GACP,UAAU,GACV,QAAQ,GACR,QAAQ,GACR,oBAAoB,GACpB,MAAM,GACN,QAAQ,GACR,QAAQ,GACR,SAAS,CAAA;AAEb,KAAK,OAAO,GAAG;IAAE,gBAAgB,EAAE,MAAM,CAAC;IAAC,mBAAmB,EAAE,SAAS,CAAA;CAAE,CAAA;AAC3E,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,IAAI,GAAG;IAAE,IAAI,EAAE,CAAC,CAAC;IAAC,MAAM,EAAE,KAAK,CAAC;IAAC,UAAU,EAAE,CAAC,CAAA;CAAE,CAAA;AAChE,KAAK,GAAG,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG;IAAE,IAAI,EAAE,CAAC,CAAC;IAAC,MAAM,EAAE,IAAI,CAAC;IAAC,UAAU,EAAE,CAAC,GAAG,OAAO,CAAA;CAAE,CAAA;AAE/E,KAAK,UAAU,GAAG;IAChB,iBAAiB,EAAE,MAAM,CAAA;IACzB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,8BAA8B;IAC9B,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,KAAK,SAAS,GAAG;IACf,uBAAuB,EAAE,MAAM,CAAA;IAC/B,qBAAqB,EAAE,MAAM,CAAA;IAC7B,mBAAmB,EAAE,MAAM,CAAA;IAC3B,oBAAoB,EAAE,YAAY,CAAA;CACnC,CAAA;AAED;;;;;;;;;GASG;AACH,MAAM,MAAM,WAAW,GACnB,EAAE,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAChC,GAAG,CAAC,aAAa,EAAE;IAAE,iBAAiB,EAAE,MAAM,CAAA;CAAE,CAAC,GACjD,GAAG,CAAC,aAAa,EAAE;IAAE,mBAAmB,EAAE,MAAM,CAAC;IAAC,4BAA4B,EAAE,MAAM,CAAA;CAAE,CAAC,GACzF,GAAG,CAAC,gBAAgB,EAAE;IAAE,qBAAqB,EAAE,MAAM,CAAA;CAAE,CAAC,GACxD,GAAG,CAAC,cAAc,EAAE;IAAE,uBAAuB,EAAE,MAAM,CAAA;CAAE,CAAC,GACxD,GAAG,CAAC,cAAc,EAAE;IAAE,qBAAqB,EAAE,OAAO,GAAG,oBAAoB,CAAA;CAAE,CAAC,GAC9E,EAAE,CAAC,WAAW,EAAE,SAAS,CAAC,GAC1B,GAAG,CAAC,WAAW,EAAE,SAAS,EAAE,IAAI,CAAC,CAAA;AAErC,MAAM,MAAM,SAAS,GAAG,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAA;AAEpD,eAAO,MAAM,GAAG,QAAO,MAAoD,CAAA;AAE3E,uDAAuD;AACvD,eAAO,MAAM,SAAS,GAAI,OAAO,OAAO,KAAG,MAAyD,CAAA;AAEpG;;;GAGG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,CASpE;AAID;;;GAGG;AACH,eAAO,MAAM,gBAAgB,gDAAkD,CAAA;AAK/E,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,SAAS,GAAG,MAAM,IAAI,CAK/E;AAED,wBAAgB,eAAe,CAAC,MAAM,EAAE,MAAM,GAAG,SAAS,CAEzD"}

package/dist/telemetry.js

@@ -0,0 +1,33 @@
+import { createContext } from "react";
+const now = () => performance.timeOrigin + performance.now();
+const errorName = (error) => error instanceof Error ? error.name : "Error";
+function createEmitter(sink) {
+  if (sink === void 0) return noop;
+  return (event) => {
+    try {
+      sink(event);
+    } catch {
+    }
+  };
+}
+function noop() {
+}
+const TelemetryContext = createContext(void 0);
+const routerSinks = /* @__PURE__ */ new WeakMap();
+function bindRouterTelemetry(router, emit) {
+  routerSinks.set(router, emit);
+  return () => {
+    if (routerSinks.get(router) === emit) routerSinks.delete(router);
+  };
+}
+function routerTelemetry(router) {
+  return routerSinks.get(router) ?? noop;
+}
+export {
+  TelemetryContext,
+  bindRouterTelemetry,
+  createEmitter,
+  errorName,
+  now,
+  routerTelemetry
+};