basalt-ui 2.6.1 → 2.7.0

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

@@ -51,6 +51,19 @@ export type DataTableColumnPinning<T = unknown> = {
     start?: DataTableColumnId<T>[];
     end?: DataTableColumnId<T>[];
 };
+/** One per-row action: `BarActionItem`'s vocabulary with the row handed to the handler. */
+export type DataTableRowAction<T = unknown> = {
+    key: string;
+    label: string;
+    /** A lone action with an icon renders as that icon button; anything else folds into the menu. */
+    icon?: ReactNode;
+    onClick: (row: T) => void;
+    danger?: boolean;
+    /** A disabled action renders inert and never fires. */
+    disabled?: (row: T) => boolean;
+    /** A loading action shows the busy state (icon button) or sits inert (menu) and never fires. */
+    loading?: (row: T) => boolean;
+};
 /**
  * The four boxes `BasaltDataTable` paints: `root` is the outer fragment's replacement wrapper,
  * `toolbar` is the search/facets/actions row, `table` is whichever body renders — the Mantine
@@ -316,6 +329,26 @@ export type BasaltDataTableProps<T extends RowData> = BasaltProps & SlotStylesPr
      * ]}
      */
     bulkActions?: (rows: T[]) => BarAction[];
+    /**
+     * Per-row actions as typed data. The table renders them itself in a trailing, pinned,
+     * header-less column: an icon button for one action that carries an `icon`, an overflow menu
+     * for anything else. Clicking either never fires `onRowActivate`. Never put a `Menu` or
+     * `ActionIcon` in a `display` / `cell` renderer (`basalt/control-outside-home`).
+     *
+     * Pass a STABLE reference — a module constant or a `useMemo` — because the column is rebuilt
+     * whenever the array identity changes. A `renderCard` projection owns its own card, so the
+     * column renders in the table body only.
+     *
+     * @example
+     * const ROW_ACTIONS: DataTableRowAction<Row>[] = [
+     *   { key: 'edit', label: 'Edit', icon: <IconEdit />, onClick: (row) => edit(row) },
+     *   { key: 'delete', label: 'Delete', danger: true, onClick: (row) => remove(row) },
+     * ]
+     * <BasaltDataTable rowActions={ROW_ACTIONS} rowLabel={(row) => row.name} … />
+     */
+    rowActions?: DataTableRowAction<T>[];
+    /** Names a row for assistive tech in its action controls; default `Row N actions`. */
+    rowLabel?: (row: T) => string;
     /**
      * Enables the bottom pagination bar ("Showing X–Y of N", rows-per-page `Select`, Mantine
      * `Pagination`) wired to TanStack's `pagination` state. Client-side by default — see

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

@@ -1 +1 @@
-{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../src/table/data-table.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../src/table/data-table.tsx"],"names":[],"mappings":"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"}

package/dist/table/data-table.js

@@ -1,5 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import {
+  ActionIcon,
   Box,
   Checkbox,
   Group,
@@ -21,10 +22,11 @@ import { HIT_COARSE } from "../common/hit-floor.js";
 import { useMeasuredWidths } from "../common/use-measured-widths.js";
 import { assertRequiredProps, useValidateProps } from "../common/validate.js";
 import { FilterSet } from "../controls/index.js";
-import { ActionGroup, BarActionSlot } from "../controls/actions.js";
+import { ActionGroup, BarActionSlot, OverflowMenu } from "../controls/actions.js";
 import { EnumFilter } from "../controls/enum-filter.js";
 import { MultiSelectFilter } from "../controls/multi-select-filter.js";
 import { CtlSlot } from "../theme/index.js";
+import { IconSlot } from "../theme/icon-slot.js";
 import { alpha, VX } from "../tokens/index.js";
 import { WidgetHeader } from "../dashboard/index.js";
 import { ErrorState } from "../dashboard/query-state.js";
@@ -148,6 +150,74 @@ function selectionColumn() {
     )
   };
 }
+const ACTIONS_COLUMN_ID = "__basalt_actions__";
+const ACTIONS_COLUMN_SIZE = 56;
+function stopsRowActivation(cell) {
+  if (cell.column.id === ACTIONS_COLUMN_ID) return true;
+  return cell.column.id === SELECT_COLUMN_ID && cell.row.getCanSelect();
+}
+function RowActionCell({
+  actions,
+  row,
+  rowIndex,
+  rowLabel
+}) {
+  const named = rowLabel?.(row);
+  const [only] = actions;
+  if (actions.length === 1 && only?.icon !== void 0) {
+    const inert = only.disabled?.(row) === true || only.loading?.(row) === true;
+    return /* @__PURE__ */ jsx(
+      ActionIcon,
+      {
+        variant: "subtle",
+        size: "ctl",
+        "aria-label": named === void 0 ? only.label : `${only.label}: ${named}`,
+        disabled: only.disabled?.(row) === true,
+        loading: only.loading?.(row) === true,
+        ...only.danger === true && { color: "red" },
+        onClick: () => {
+          if (!inert) only.onClick(row);
+        },
+        children: /* @__PURE__ */ jsx(IconSlot, { children: only.icon })
+      }
+    );
+  }
+  const items = actions.map((action) => ({
+    key: action.key,
+    label: action.label,
+    ...action.icon !== void 0 && { icon: action.icon },
+    ...action.danger === true && { danger: true },
+    // The menu has no busy state of its own, so loading reads as inert there.
+    disabled: action.disabled?.(row) === true || action.loading?.(row) === true,
+    onClick: () => action.onClick(row)
+  }));
+  return /* @__PURE__ */ jsx(
+    OverflowMenu,
+    {
+      actions: items,
+      trigger: "kebab",
+      label: named === void 0 ? `Row ${rowIndex + 1} actions` : `Actions for ${named}`
+    }
+  );
+}
+function rowActionsColumn(actions, rowLabel) {
+  return {
+    id: ACTIONS_COLUMN_ID,
+    size: ACTIONS_COLUMN_SIZE,
+    enableSorting: false,
+    enableHiding: false,
+    header: () => /* @__PURE__ */ jsx("span", { className: classes.srOnly, children: "Actions" }),
+    cell: ({ row }) => /* @__PURE__ */ jsx(
+      RowActionCell,
+      {
+        actions,
+        row: row.original,
+        rowIndex: row.index,
+        rowLabel
+      }
+    )
+  };
+}
 function BulkActionBar({ count, actions }) {
   return /* @__PURE__ */ jsxs(Group, { className: classes.bulkBar, gap: "xs", align: "center", wrap: "wrap", mb: "xs", children: [
     /* @__PURE__ */ jsxs(Text, { className: classes.bulkCount, children: [
@@ -409,6 +479,8 @@ function BasaltDataTable(props) {
     enableRowSelection = false,
     getRowId,
     bulkActions,
+    rowActions,
+    rowLabel,
     enablePagination = false,
     pageSizeOptions = DEFAULT_PAGE_SIZE_OPTIONS,
     manualPagination = false,
@@ -461,9 +533,14 @@ function BasaltDataTable(props) {
       return { ...column, filterFn };
     });
   }, [columns, facets]);
+  const hasRowActions = rowActions !== void 0 && rowActions.length > 0;
   const tableColumns = useMemo(
-    () => enableRowSelection ? [selectionColumn(), ...facetColumns] : facetColumns,
-    [facetColumns, enableRowSelection]
+    () => [
+      ...enableRowSelection ? [selectionColumn()] : [],
+      ...facetColumns,
+      ...hasRowActions ? [rowActionsColumn(rowActions, rowLabel)] : []
+    ],
+    [facetColumns, enableRowSelection, hasRowActions, rowActions, rowLabel]
   );
   const hasFacets = Boolean(facets && facets.length > 0);
   const breaches = manualPaginationBreaches({
@@ -512,6 +589,11 @@ function BasaltDataTable(props) {
   );
   const hasFolded = foldedColumns.size > 0;
   const foldRows = useRowDisclosure({ data, getRowId });
+  const pinningActive = enablePinning || hasRowActions;
+  const tablePinning = useMemo(
+    () => hasRowActions ? { ...columnPinning, end: [...columnPinning.end, ACTIONS_COLUMN_ID] } : columnPinning,
+    [columnPinning, hasRowActions]
+  );
   const table = useTable({
     features: basaltTableFeatures,
     data,
@@ -520,7 +602,7 @@ function BasaltDataTable(props) {
       sorting: tableState.sorting,
       globalFilter,
       columnFilters: tableState.columnFilters,
-      columnPinning,
+      columnPinning: tablePinning,
       columnVisibility,
       ...enablePagination && { pagination: tableState.pagination },
       ...enableRowSelection && { rowSelection: tableState.rowSelection }
@@ -549,7 +631,7 @@ function BasaltDataTable(props) {
       ...manualPagination && pageCount !== void 0 && { pageCount }
     },
     enableSorting: sortingEnabled,
-    enableColumnPinning: enablePinning
+    enableColumnPinning: pinningActive
   });
   const showSearch = enableGlobalFilter && filteringEnabled;
   const showFacets = hasFacets && filteringEnabled;
@@ -557,7 +639,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) - foldedColumns.size;
+  const columnCount = columns.length + (enableRowSelection ? 1 : 0) + (hasRowActions ? 1 : 0) + (hasFolded ? 1 : 0) - foldedColumns.size;
   const selectedModelRows = enableRowSelection ? table.getSelectedRowModel().rows : void 0;
   const selectedRows = useMemo(
     () => selectedModelRows?.map((row) => row.original) ?? [],
@@ -567,7 +649,7 @@ function BasaltDataTable(props) {
     () => bulkActions === void 0 || selectedRows.length === 0 ? void 0 : bulkActions(selectedRows),
     [bulkActions, selectedRows]
   );
-  const headerGroups = enablePinning ? getOrderedHeaderGroups(table) : table.getHeaderGroups();
+  const headerGroups = pinningActive ? getOrderedHeaderGroups(table) : table.getHeaderGroups();
   const rows = table.getRowModel().rows;
   const pageStickyHeader = !scrolls && stickyHeader === true;
   const { wrapperRef: containmentRef, contained } = useMeasuredContainment(
@@ -610,14 +692,15 @@ function BasaltDataTable(props) {
             const canSort = sortingEnabled && header.column.getCanSort();
             const sorted = header.column.getIsSorted();
             const toggleSorting = header.column.getToggleSortingHandler();
-            const pinnedStyle = enablePinning ? getPinnedCellStyle(table, header.column) : void 0;
+            const pinnedStyle = pinningActive ? getPinnedCellStyle(table, header.column) : void 0;
             const align = resolveAlign(header.column);
             const isSelectColumn = header.column.id === SELECT_COLUMN_ID;
+            const isFoldCandidate = !isSelectColumn && header.column.id !== ACTIONS_COLUMN_ID;
             return /* @__PURE__ */ jsxs(
               Table.Th,
               {
                 ...isSelectColumn && { className: classes.selectCell },
-                ...!isSelectColumn && { [FOLD_ID_ATTR]: header.column.id },
+                ...isFoldCandidate && { [FOLD_ID_ATTR]: header.column.id },
                 onClick: canSort ? toggleSorting : void 0,
                 onKeyDown: canSort ? (event) => {
                   if (event.key !== "Enter" && event.key !== " ") return;
@@ -641,7 +724,7 @@ 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 ? [
+          const cells = pinningActive ? [
             ...row.getStartVisibleCells(),
             ...row.getCenterVisibleCells(),
             ...row.getEndVisibleCells()
@@ -663,18 +746,18 @@ function BasaltDataTable(props) {
                     }
                   ) }),
                   cells.map((cell) => {
-                    const pinnedStyle = enablePinning ? getPinnedCellStyle(table, cell.column) : void 0;
+                    const pinnedStyle = pinningActive ? getPinnedCellStyle(table, cell.column) : void 0;
                     const align = resolveAlign(cell.column);
                     return /* @__PURE__ */ jsx(
                       Table.Td,
                       {
                         ...cell.column.id === SELECT_COLUMN_ID && {
-                          className: classes.selectCell,
-                          // The label's ::after fills the cell, so a tap on it bubbles to the row —
-                          // stop it only where a tick is possible; a disabled row's tap is a row tap.
-                          ...cell.row.getCanSelect() && {
-                            onClick: (event) => event.stopPropagation()
-                          }
+                          className: classes.selectCell
+                        },
+                        ...stopsRowActivation(cell) && {
+                          // The label's ::after fills the select cell, so a tap on it bubbles to the
+                          // row; the actions menu portals out but React bubbles through the portal.
+                          onClick: (event) => event.stopPropagation()
                         },
                         style: {
                           ...typeof cell.getValue() === "number" && cell.column.columnDef.meta?.numeral !== false ? NUMERIC_CELL_STYLE : void 0,

package/llms.txt

@@ -1,4 +1,4 @@
-# basalt-ui v2.6.1
+# basalt-ui v2.7.0
 # Opinionated framework for Mantine-based React apps — theme, app shell, TanStack Charts, toolchain presets
 #
 # Entry points: use the exact import specifier below; do not guess.
@@ -13,7 +13,7 @@
 # A subpath's `Install:` line is its required peers; `OptionalPeers:` are import()-only, install on use.
 
 Package: basalt-ui
-Version: 2.6.1
+Version: 2.7.0
 
 ## basalt-ui
 Import: import { ... } from 'basalt-ui'
@@ -54,16 +54,206 @@ Description: CartesianChart (the TanStack Charts rung), the Lines and Bars kinds
 Layer: headless
 Rule: basalt-charts
 Signature: BandStrip(props: BandStripProps<T, X>): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  ariaLabel: string
+  data: readonly T[]
+  x: (d: T) => X
+  xTicks?: number | readonly X[]
+  formatX?: ((x: X) => string)
+  legend?: false | ChartLegendConfig
+  height?: number | ResponsiveChartHeight
+  state?: ChartState
+  cursorGroup?: string
+  cursorResolution?: CursorResolution
+  tooltip?: false | ChartTooltipConfig<T, X>
+  states: readonly BandStripSeries<T>[]
+  getBand: (d: T) => BandSpan
+  fold?: BandFold<T>
 Signature: Bars(props: BarsProps<T, X>): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  ariaLabel: string
+  data: readonly T[]
+  x: (d: T) => X
+  y?: AxisConfig<T>
+  y2?: AxisConfig<T>
+  xTicks?: number | readonly X[]
+  formatX?: ((x: X) => string)
+  zones?: readonly ZoneSpec[]
+  xZones?: readonly XZoneSpec<X>[]
+  refLines?: readonly RefLine[]
+  legend?: false | ChartLegendConfig
+  height?: number | ResponsiveChartHeight
+  state?: ChartState
+  cursorGroup?: string
+  cursorResolution?: CursorResolution
+  tooltip?: false | ChartTooltipConfig<T, X>
+  bars: readonly BarsBar<T>[]
+  lines?: readonly BarsLine<T>[]
+  layout?: "stacked" | "grouped" | "normalized"
+  barOpacity?: ((d: T, key: string) => number)
 Signature: CartesianChart(props: CartesianChartProps<T, X>): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  ariaLabel: string
+  data: readonly T[]
+  x: (d: T) => X
+  series: readonly ChartSeries<T>[]
+  marks: (plot: PlotContext<T, X>) => ChartMarks
+  y?: AxisConfig<T>
+  y2?: AxisConfig<T>
+  xTicks?: number | readonly X[]
+  formatX?: ((x: X) => string)
+  zones?: readonly ZoneSpec[]
+  xZones?: readonly XZoneSpec<X>[]
+  refLines?: readonly RefLine[]
+  legend?: false | ChartLegendConfig
+  height?: number | ResponsiveChartHeight
+  state?: ChartState
+  cursorGroup?: string
+  cursorResolution?: CursorResolution
+  tooltip?: false | ChartTooltipConfig<T, X>
 Signature: ChartCard(props: ChartCardProps): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  classNames?: Partial<Record<ChartCardSlot, string>>
+  title?: string
+  icon?: ReactNode
+  subtitle?: string
+  info?: string
+  value?: string
+  delta?: number
+  deltaPeriod?: string
+  deltaPolarity?: DeltaPolarity
+  count?: number
+  actions?: ReactNode
+  state?: ChartState
+  placeholderHeight?: number | ResponsiveChartHeight
+  stateAction?: ReactNode
+  children?: ReactNode
 Signature: Donut(props: DonutProps<K>): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  ariaLabel: string
+  data: readonly DonutDatum<K>[]
+  colorForKey: (key: K) => string
+  formatValue: (v: number) => string
+  seriesLabel?: ((key: K) => string)
+  centerLabel?: string
+  centerSubLabel?: string
+  height?: number | ResponsiveChartHeight
+  state?: ChartState
 Signature: DualPanel(props: DualPanelProps<T, X>): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  ariaLabel: string
+  data: readonly T[]
+  x: (d: T) => X
+  formatX?: ((x: X) => string)
+  legend?: false | ChartLegendConfig
+  height?: number | ResponsiveChartHeight
+  state?: ChartState
+  cursorGroup?: string
+  cursorResolution?: CursorResolution
+  tooltip?: false | ChartTooltipConfig<T, X>
+  series: readonly DualPanelLine<T>[]
+  top?: { domain?: readonly [number, number] | "auto" | undefined; …
+  fillBetween?: { from: string; to: string; fill: string; aboveFill?: strin…
+  bar: DualPanelBar<T>
+  topFraction?: number
 Signature: Heatmap(props: HeatmapProps<T>): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  ariaLabel: string
+  data: readonly T[]
+  getRow: (d: T) => string
+  getCol: (d: T) => string
+  getValue: (d: T) => number | null
+  rows?: readonly string[]
+  cols?: readonly string[]
+  color?: string
+  domain?: readonly [number, number]
+  formatValue?: ((v: number) => string)
+  formatRow?: ((row: string) => string)
+  formatCol?: ((col: string) => string)
+  legend?: false | { label?: string | undefined; }
+  tooltip?: false | { rows?: ((d: T) => readonly ChartTooltipRow[]) | u…
+  height?: number | ResponsiveChartHeight
+  matchHeight?: boolean
+  state?: ChartState
 Signature: Lines(props: LinesProps<T, X>): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  ariaLabel: string
+  data: readonly T[]
+  x: (d: T) => X
+  series: readonly ChartSeries<T>[]
+  y?: AxisConfig<T>
+  y2?: AxisConfig<T>
+  xTicks?: number | readonly X[]
+  formatX?: ((x: X) => string)
+  zones?: readonly ZoneSpec[]
+  xZones?: readonly XZoneSpec<X>[]
+  refLines?: readonly RefLine[]
+  legend?: false | ChartLegendConfig
+  height?: number | ResponsiveChartHeight
+  state?: ChartState
+  cursorGroup?: string
+  cursorResolution?: CursorResolution
+  tooltip?: false | ChartTooltipConfig<T, X>
+  thresholds?: [X] extends [string] ? never : readonly Threshold[]
 Signature: MirroredBars(props: MirroredBarsProps<T, X>): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  ariaLabel: string
+  data: readonly T[]
+  x: (d: T) => X
+  formatX?: ((x: X) => string)
+  legend?: false | ChartLegendConfig
+  height?: number | ResponsiveChartHeight
+  state?: ChartState
+  cursorGroup?: string
+  tooltip?: false | ChartTooltipConfig<T, X>
+  series: readonly MirroredBarsSeries<T>[]
+  up: MirroredBarPane
+  down: MirroredBarPane
+  upFraction?: number
+  getAbsentFraction?: ((d: T) => number)
+  getBarOpacity?: ((d: T) => number)
+  fold?: { minBandPx?: number | undefined; merge: (group: T[]) => T;…
+  cursorResolution?: CursorResolution
 Signature: Sparkline(props: SparklineProps): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  ariaLabel: string
+  data: readonly number[]
+  height: number
+  width?: number
+  mark?: "line" | "bar"
+  color?: string
+  emphasizeLast?: boolean
+  emphasisColor?: string
+  state?: ChartState
 Signature: StackedArea(props: StackedAreaProps<T, X>): ReactElement<unknown, string | JSXElementConstructor<any>>
+  className?: string
+  style?: CSSProperties
+  ariaLabel: string
+  data: readonly T[]
+  x: (d: T) => X
+  xTicks?: number | readonly X[]
+  formatX?: ((x: X) => string)
+  zones?: readonly ZoneSpec[]
+  xZones?: readonly XZoneSpec<X>[]
+  refLines?: readonly RefLine[]
+  legend?: false | ChartLegendConfig
+  height?: number | ResponsiveChartHeight
+  state?: ChartState
+  cursorGroup?: string
+  cursorResolution?: CursorResolution
+  tooltip?: false | ChartTooltipConfig<T, X>
+  series: readonly StackedAreaBand<T>[]
+  y?: Omit<AxisConfig<T>, "scale">
 Signature: chartCursor(group: string): ChartCursorController<ChartValue, ChartValue>
 Signature: chartCurve(name: CurveName): ChartCurve
 Install: bun add @tanstack/charts@1.1.0 d3-scale@4.0.2
@@ -113,8 +303,10 @@ Description: Mantine form layer: useBasaltForm + inputProps/fieldKey (two calls
 Layer: mantine-coupled
 Rule: basalt-batteries
 Signature: fieldKey(form: UseFormReturnType<Values>, path: Path): string
-Signature: inputProps(form: UseFormReturnType<Values>, path: Path): GetInputPropsReturnType
+Signature: inputProps(form: UseFormReturnType<Values>, path: Path): InputProps
 Signature: useBasaltForm(opts: UseBasaltFormOptions<Values>): UseFormReturnType<Values>
+  mode?: "controlled" | "uncontrolled"
+  schema?: StandardSchemaV1<unknown, Values>
 Install: bun add @mantine/form@^9.7.0
 
 ## basalt-ui/commands
@@ -139,6 +331,47 @@ Description: BasaltDataTable and createColumnHelper: a data table over TanStack
 Layer: mantine-coupled
 Rule: basalt-batteries
 Signature: BasaltDataTable(props: BasaltDataTableProps<T>): JSX.Element
+  className?: string
+  style?: CSSProperties
+  classNames?: Partial<Record<BasaltDataTableSlot, string>>
+  title?: string
+  icon?: ReactNode
+  subtitle?: string
+  data: T[]
+  columns: BasaltColumnDef<T>[]
+  enableSorting?: boolean
+  manualSorting?: boolean
+  striped?: boolean | "odd" | "even"
+  highlightOnHover?: boolean
+  emptyState?: ReactNode
+  isLoading?: boolean
+  query?: QueryStateLike<unknown>
+  skeletonRows?: number
+  initialSorting?: SortingState
+  onSortingChange?: (sorting: SortingState) => void
+  enableGlobalFilter?: boolean
+  globalFilterPlaceholder?: string
+  searchIcon?: ReactNode
+  initialGlobalFilter?: string
+  onGlobalFilterChange?: (value: string) => void
+  facets?: DataTableFacet<T>[]
+  onColumnFiltersChange?: (filters: ColumnFiltersState) => void
+  manualFiltering?: boolean
+  actions?: SlotActions
+  onRowActivate?: (row: T) => void
+  renderCard?: (row: T) => ReactNode
+  enableRowSelection?: boolean
+  rowSelection?: RowSelectionState
+  onRowSelectionChange?: (selection: RowSelectionState) => void
+  getRowId?: (row: T, index: number) => string
+  bulkActions?: (rows: T[]) => BarAction[]
+  rowActions?: DataTableRowAction<T>[]
+  rowLabel?: (row: T) => string
+  enablePagination?: boolean
+  pageSizeOptions?: number[]
+  initialPagination?: PaginationState
+  onPaginationChange?: (pagination: PaginationState) => void
+  … +13 more
 Signature: createColumnHelper(): ColumnHelper<{ rowSortingFeature: TableFeature; columnFilteringFeatur…
 Install: bun add @tanstack/react-table@9.2.8
 
@@ -176,7 +409,7 @@ OptionalPeers: shiki@^4.5.0, @shikijs/langs@^4.5.0, @shikijs/themes@^4.5.0, beau
 
 ## basalt-ui/controls
 Import: import { ... } from 'basalt-ui/controls'
-Description: The control tier (docs/CONTROLS-SPEC.md §3): FilterSet (nowrap row + measured +N fold + the mobile Filters (n) sheet), RangeFilter/CompareFilter/SelectFilter/MultiSelectFilter/NumberFilter/SearchFilter/ToggleFilter (each bound to a FieldHandle — no value/onChange/size, law C2/C5; NumberFilter is the field.number lane, a radio list over `options` or a stepper without), ViewTabs, the action/sync family (ActionGroup, OverflowMenu, SyncButton, BarAction/GlobalAction), and the form layout FormSection/FormRow/FormGroup/FormActions (moved here from ./forms in 1.36.0 — FormRow is law C1’s form row and needs no @mantine/form). THREE surfaces, picked by the home and never by a prop (useFilterSurface): pill in a PageBar row, sheet in the mobile Filters (n) drawer, panel in a PageAside body — where every control renders an inspector/facet ROW instead of a chip (docs/ASIDE-SPEC.md §3). PanelRow is that row primitive (label above, hint, mono readout, an `end` control on the label line) and SliderControl is the one bound control with no pill form at all; the counts/max props on MultiSelectFilter render the Foundry facet list there. Every control owns its own desktop/mobile swap in CSS (C9) and renders size="ctl" internally. Resolves and renders with NO @mantine/dates installed — the custom date picker is injected through RangeFilter.customPicker from ./controls-dates.
+Description: The control tier (docs/CONTROLS-SPEC.md §3). Exports: `FilterSet` (nowrap row + measured +N fold + the mobile Filters (n) sheet), `RangeFilter`/`SelectFilter`/`MultiSelectFilter`/`NumberFilter`/`SearchFilter`/`ToggleFilter` (each bound to a FieldHandle — no value/onChange/size, law C2/C5; `NumberFilter` is the field.number lane, a radio list over `options` or a stepper without), `ViewTabs`, `SyncButton` with the `BarAction`/`GlobalAction` types, and the form layout `FormRow`/`FormGroup` (moved here from ./forms in 1.36.0 — `FormRow` is law C1’s form row and needs no @mantine/form). THREE surfaces, picked by the home and never by a prop: pill in a PageBar row, sheet in the mobile Filters (n) drawer, panel in a PageAside body — where every control renders an inspector/facet ROW instead of a chip (docs/ASIDE-SPEC.md §3); the counts/max props on `MultiSelectFilter` render the Foundry facet list there. Every control owns its own desktop/mobile swap in CSS (C9) and renders size="ctl" internally. Resolves and renders with NO @mantine/dates installed — the custom date picker is injected through RangeFilter.customPicker from ./controls-dates.
 Layer: mantine-coupled
 Rule: basalt-controls
 Signature: FilterSet(props: FilterSetProps): ReactNode

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "basalt-ui",
-  "version": "2.6.1",
+  "version": "2.7.0",
   "description": "Opinionated framework for Mantine-based React apps — theme, app shell, TanStack Charts, toolchain presets",
   "keywords": [
     "charts",

package/src/controls/form-layout.tsx

@@ -137,9 +137,10 @@ export type FormRowProps = BasaltProps &
     hint?: string
     /**
      * The field's error, rendered under the control. Falsy renders nothing. For a Mantine input
-     * wired through `inputProps(form, path)`, Mantine's own `Input.Wrapper` already renders
-     * `form.errors[path]` — passing it here too would render it twice. Reserve this prop for
-     * children that render no error of their own: a raw input, a custom control.
+     * wired through `inputProps(form, path)`, Mantine's own `Input.Wrapper` already renders the
+     * field error — passing it here too would render it twice. Reserve this prop for children that
+     * render no error of their own (a raw input, a custom control) and read it typed:
+     * `error={inputProps(form, path).error}`.
      */
     error?: ReactNode
     /** Marks the field required: an accent `*` for sighted readers, `(required)` for assistive tech. */
@@ -172,7 +173,7 @@ export type FormRowProps = BasaltProps &
  *
  * @example
  * // A raw control renders no error of its own — pass it explicitly.
- * <FormRow label="Email" required error={form.errors['email']}>
+ * <FormRow label="Email" required error={inputProps(form, 'email').error}>
  *   <input value={form.values.email} onChange={(e) => form.setFieldValue('email', e.target.value)} />
  * </FormRow>
  */
@@ -239,8 +240,16 @@ export type FormGroupProps = BasaltProps & {
  *
  * @example
  * <FormGroup label="Notify me about" direction="row">
- *   <Checkbox key={fieldKey(form, 'onDeploy')} {...inputProps(form, 'onDeploy')} label="Deploys" />
- *   <Checkbox key={fieldKey(form, 'onError')} {...inputProps(form, 'onError')} label="Errors" />
+ *   <Checkbox
+ *     key={fieldKey(form, 'onDeploy')}
+ *     {...inputProps(form, 'onDeploy', { type: 'checkbox' })}
+ *     label="Deploys"
+ *   />
+ *   <Switch
+ *     key={fieldKey(form, 'onError')}
+ *     {...inputProps(form, 'onError', { type: 'checkbox' })}
+ *     label="Errors"
+ *   />
  * </FormGroup>
  */
 export function FormGroup(props: FormGroupProps) {