hs-uix 2.0.0 → 2.1.0

package/{packages → src}/datatable/README.md

@@ -6,7 +6,7 @@
 
 A drop-in table component for HubSpot UI Extensions. Define your columns, pass your data, and you get search, filtering, sorting, pagination, inline editing, row grouping, and auto-sized columns out of the box.
 
-![Full-Featured DataTable](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/datatable/assets/fully-featured-table.png)
+![Full-Featured DataTable](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/datatable/assets/fully-featured-table.png)
 
 ## Why DataTable?
 
@@ -111,7 +111,7 @@ hubspot.extend(() => (
 
 ### Filters, sorting, and footer totals
 
-![Active Filters](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/datatable/assets/fully-featured-table-active-filters.png)
+![Active Filters](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/datatable/assets/fully-featured-table-active-filters.png)
 
 When more than 2 filters are defined, the first 2 appear inline and the rest are tucked behind a **Filters** button with a funnel icon. Active filters display as removable chips with a "Clear all" option by default. Hiding the badges via `showFilterBadges={false}` also hides the "Clear all" button by default — set `showClearFiltersButton={true}` to keep the reset without chips. Footer totals are declared directly on the column — a static string or a function that receives the filtered data.
 
@@ -236,7 +236,7 @@ const FILTERS = [
 
 ### Row selection with bulk actions
 
-![Row Selection with Action Bar and Per-Row Actions](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/datatable/assets/action-bar-per-row-actions.png)
+![Row Selection with Action Bar and Per-Row Actions](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/datatable/assets/action-bar-per-row-actions.png)
 
 Add checkboxes with a select-all header (selects current page). When rows are selected, a compact action bar appears above the table showing the selected count, a "Select all" button, "Deselect all", and any custom action buttons you define.
 
@@ -314,7 +314,7 @@ Server-side selection example:
 
 ### Row actions and full-row "Edit/Done" flow
 
-![Full-Row Editing](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/datatable/assets/full-row-editing.png)
+![Full-Row Editing](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/datatable/assets/full-row-editing.png)
 
 Use `rowActions` to append an actions column on the right. You can pass a static action list or a row-aware function.
 
@@ -385,7 +385,7 @@ const columns = [
 
 ### Scrollable wide tables
 
-![Scrollable Wide Table](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/datatable/assets/scrollable-wide-table.png)
+![Scrollable Wide Table](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/datatable/assets/scrollable-wide-table.png)
 
 When you have many columns, set `scrollable={true}` to allow horizontal overflow instead of squishing columns. Columns without explicit widths fall back to `"min"` width, keeping each column compact and letting the table scroll.
 
@@ -402,8 +402,8 @@ When you have many columns, set `scrollable={true}` to allow horizontal overflow
 
 ### Inline editing — discrete mode
 
-![Discrete Editing - Select](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/datatable/assets/inline-editing-discreet.png)
-![Discrete Editing - Text](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/datatable/assets/inline-editing-discreet2.png)
+![Discrete Editing - Select](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/datatable/assets/inline-editing-discreet.png)
+![Discrete Editing - Text](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/datatable/assets/inline-editing-discreet2.png)
 
 In discrete mode (the default), editable cells appear as dark links. Click to open the input. The cell reverts to display when you click away, keeping the last committed value. Select/date/toggle-type inputs commit and close instantly on change. Text-like inputs commit via HubSpot `onChange` (typically blur/submit), and can stream live input through `onRowEditInput`.
 
@@ -473,7 +473,7 @@ function EditableTable() {
 
 ### Inline editing — inline mode
 
-![Inline Edit Mode](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/datatable/assets/inline-editing-regular.png)
+![Inline Edit Mode](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/datatable/assets/inline-editing-regular.png)
 
 In inline mode, all editable cells always show their input controls. This mode is also used for full-row editing when `editingRowId` is set. Set `editMode="inline"` to enable always-visible inputs.
 
@@ -511,7 +511,7 @@ Use `editProps` to pass additional props to the edit component (e.g., `{ currenc
 
 ### Row grouping with aggregations
 
-![Row Grouping](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/datatable/assets/row-grouping.png)
+![Row Grouping](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/datatable/assets/row-grouping.png)
 
 Groups are collapsible. Click a group header to expand or collapse it. You can define aggregation functions per column, and groups start expanded by default.
 
@@ -654,7 +654,7 @@ When `title` is set, DataTable renders a simple demibold title row above the too
 
 ### useAssociations
 
-![useAssociations + DataTable](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/datatable/assets/useAssociations.png)
+![useAssociations + DataTable](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/datatable/assets/useAssociations.png)
 
 Connect live CRM data to a DataTable in two lines. The `useAssociations` hook from `@hubspot/ui-extensions/crm` fetches associated records from the current CRM record — pass the results straight into DataTable.
 

package/{packages → src}/datatable/index.d.ts

@@ -30,9 +30,16 @@ export interface DataTableOption<T = unknown> {
 export interface DataTableFilterConfig<Row = Record<string, unknown>> {
   name: string;
   type?: DataTableFilterType;
+  label?: string;
   placeholder?: string;
   options?: DataTableOption[];
   chipLabel?: string;
+  includeAll?: boolean;
+  allValue?: unknown;
+  emptyValue?: unknown;
+  allLabel?: string;
+  fromLabel?: string;
+  toLabel?: string;
   filterFn?: (row: Row, value: unknown) => boolean;
 }
 
@@ -195,6 +202,8 @@ export interface DataTableProps<Row = Record<string, unknown>, Id = string | num
   loading?: boolean;
   error?: string | boolean;
   totalCount?: number;
+  /** Client-mode total when rows are lazy-loaded in batches. */
+  clientTotalCount?: number;
   page?: number;
   searchValue?: string;
   filterValues?: Record<string, unknown>;
@@ -232,6 +241,8 @@ export interface DataTableProps<Row = Record<string, unknown>, Id = string | num
   showSearch?: boolean; // Show/hide the search input (default true)
   showSelectionBar?: boolean; // Show/hide the selection action bar when rows are selected (default true)
   filterInlineLimit?: number; // Max filters shown inline before overflow into "Filters" button (default 2)
+  toolbarLeftFlex?: number; // Left toolbar column flex weight (default 3)
+  toolbarRightFlex?: number; // Right toolbar column flex weight (default 1)
 
   labels?: DataTableLabels; // Override hardcoded UI strings for i18n
 

package/{packages → src}/feed/README.md

@@ -89,6 +89,8 @@ Feed works out of the box with these item keys:
 | `type` | Activity type label, rendered in a `StatusTag` by default |
 | `typeLabel` | Optional display label when `type` is a machine value |
 | `typeVariant` | `StatusTag` variant: `default`, `info`, `success`, `warning`, `danger` |
+| `status` / `statusLabel` / `outcome` / `severity` | Optional secondary status text rendered in its own `StatusTag` (e.g. a call outcome or task severity). `statusLabel` wins when set, then `status`, `outcome`, `severity` |
+| `statusVariant` / `outcomeVariant` / `severityVariant` | `StatusTag` variant for that status text (`default`, `info`, `success`, `warning`, `danger`); defaults to `default` |
 | `iconName` / `icon` | Activity/entity icon. Use verified HubSpot icon names (`email`, `calling`, `appointment`, `comment`, `description`, etc.) |
 | `title` / `subject` | Main item heading |
 | `href` | Optional link wrapping the title |
@@ -209,7 +211,7 @@ Use `serverSide` when the parent/API owns filtering, sorting, searching, and pag
 ```
 
 - `container`: `"tile"` (default), `"none"`, or `"card"` (`card` is a Tile-backed alias)
-- `itemContainer`: `"none"` (default), `"tile"`, or `"card"` (`card` is a Tile-backed alias)
+- `itemContainer`: `"tile"` (default), `"none"`, or `"card"` (`card` is a Tile-backed alias)
 - `showDividers`: dividers between items when `itemContainer="none"`
 
 ## Render escape hatches

package/{packages → src}/feed/index.d.ts

@@ -104,7 +104,10 @@ export interface FeedFilterConfig<Row = FeedItem> {
   options?: FeedOption[];
   defaultValue?: unknown;
   includeAll?: boolean;
+  allValue?: unknown;
+  emptyValue?: unknown;
   allLabel?: string;
+  chipLabel?: string;
   fromLabel?: string;
   toLabel?: string;
   filterFn?: (item: Row, value: unknown) => boolean;
@@ -121,6 +124,8 @@ export interface FeedSortOption<Row = FeedItem> {
 export interface FeedLabels {
   search?: string;
   sort?: string;
+  sortButton?: string;
+  filtersButton?: string;
   all?: string;
   clearAll?: string;
   dateFrom?: string;
@@ -158,11 +163,13 @@ export interface FeedToolbarRenderContext {
   search: string;
   filters: Record<string, unknown>;
   sort: string | null;
+  activeChips?: Array<{ key: string; label: ReactNode }>;
   totalCount: number;
   visibleCount: number;
   onTabChange: (value: string | number | boolean | null) => void;
   onSearchChange: (value: string) => void;
   onFilterChange: (name: string, value: unknown) => void;
+  onFilterRemove: (key: string) => void;
   onSortChange: (value: string | null) => void;
 }
 
@@ -241,7 +248,18 @@ export interface FeedProps<Row = FeedItem> {
   onParamsChange?: (params: FeedParams) => void;
   serverSide?: boolean;
   showToolbar?: boolean;
+  /**
+   * When the toolbar has no left-side controls (search / filters), float its
+   * right-side controls (sort + item count) onto the first date-group header
+   * row instead of a standalone row above it. "auto" (default) applies this
+   * only when grouping is active; `true` forces it, `false` disables it.
+   */
+  alignToolbarWithGroups?: boolean | "auto";
   filterInlineLimit?: number;
+  toolbarLeftFlex?: number;
+  toolbarRightFlex?: number;
+  showFilterBadges?: boolean;
+  showClearFiltersButton?: boolean;
   showItemCount?: boolean;
   itemCountText?: (shown: number, total: number) => string;
   recordLabel?: FeedRecordLabel;

package/{packages → src}/form/README.md

@@ -2,7 +2,7 @@
 
 Declarative, config-driven FormBuilder for HubSpot UI Extensions. Define fields as data, get a complete form with validation, layout, multi-step wizards, and full HubSpot component integration.
 
-![Basic Form](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/form/assets/basic-form.png)
+![Basic Form](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/form/assets/basic-form.png)
 
 ```bash
 npm install hs-uix
@@ -119,7 +119,7 @@ With `columnWidth={200}`, a 400px card shows 2 columns; a 600px page shows 3. Us
 
 ### Explicit Layout
 
-![Explicit Layout](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/form/assets/explicit-layout-weighted.png)
+![Explicit Layout](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/form/assets/explicit-layout-weighted.png)
 
 Define exact row structure with the `layout` prop. Each inner array is a row.
 
@@ -351,7 +351,7 @@ const fields = [
 
 ## Dependent Properties
 
-![Dependent & Cascading](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/form/assets/dependent-cascading.gif)
+![Dependent & Cascading](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/form/assets/dependent-cascading.gif)
 
 Dependent fields are grouped in a HubSpot Tile container below their parent. Use `dependsOnConfig` to define the relationship and `visible` to control when the dependent field appears:
 
@@ -440,7 +440,7 @@ Each step can have per-step validation:
 
 ## Display Options
 
-![Display Options](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/form/assets/display-options.png)
+![Display Options](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/form/assets/display-options.png)
 
 ### Boolean Fields
 
@@ -597,7 +597,7 @@ For any HubSpot component prop not exposed as a first-class field config, use `f
 
 ## Sections (Accordion Grouping)
 
-![Sections & Groups](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/form/assets/section-and-groups.png)
+![Sections & Groups](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/form/assets/section-and-groups.png)
 
 Group fields into collapsible accordion sections:
 
@@ -745,7 +745,7 @@ Display fields can also interact with the form via `setFieldValue` and `setField
 
 ## Read-Only Mode
 
-![Read-Only, Auto-Save & Dirty](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/form/assets/readonly-autosave-dirty.png)
+![Read-Only, Auto-Save & Dirty](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/form/assets/readonly-autosave-dirty.png)
 
 Lock the entire form with an optional warning message:
 
@@ -774,7 +774,7 @@ To keep specific fields editable while the rest of the form is locked, set `alwa
 
 ## Async Validation
 
-![Async Validation & Side Effects](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/form/assets/async-validation-side-effects.png)
+![Async Validation & Side Effects](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/form/assets/async-validation-side-effects.png)
 
 `validate` and entries in `validators` can return a Promise. The field shows a loading indicator while validation runs:
 
@@ -930,7 +930,7 @@ Change handlers on field definitions that can update other fields:
 
 ## Repeater Fields
 
-![Repeater Fields](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/form/assets/repeater-fields.png)
+![Repeater Fields](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/form/assets/repeater-fields.png)
 
 Add/remove rows for dynamic lists:
 
@@ -943,7 +943,21 @@ Add/remove rows for dynamic lists:
   min: 1, max: 5 }
 ```
 
-Repeater sub-fields now validate on blur/onChange like top-level fields. Optional row reordering is available via `repeaterProps.reorderable` (with customizable move controls).
+Repeater sub-fields now validate on blur/onChange like top-level fields. Pass `repeaterProps` on the repeater field to customize the add/remove/reorder controls:
+
+| `repeaterProps` key | Type | Default | Description |
+|---|---|---|---|
+| `addLabel` | `string` | repeater add label | Text for the add-row control |
+| `removeLabel` | `string` | repeater remove label | Text for the per-row remove control |
+| `renderAdd` | `({ onClick, count }) => ReactNode` | — | Replace the default add control |
+| `renderRemove` | `({ index, onClick }) => ReactNode` | — | Replace the default per-row remove control |
+| `reorderable` | `boolean` | `false` | Enable up/down row reordering controls |
+| `moveUpLabel` | `string` | `"Up"` | Label for the move-up control |
+| `moveDownLabel` | `string` | `"Down"` | Label for the move-down control |
+| `renderMoveUp` | `({ index, disabled, onClick }) => ReactNode` | — | Replace the move-up control. `disabled` is `true` on the first row |
+| `renderMoveDown` | `({ index, disabled, onClick }) => ReactNode` | — | Replace the move-down control. `disabled` is `true` on the last row |
+
+When `reorderable` is set, both move controls always render so rows stay column-aligned — the first row's "up" and the last row's "down" come through disabled (and the `disabled` flag is passed to `renderMoveUp` / `renderMoveDown`).
 
 ## Field Groups (Structured)
 
@@ -975,7 +989,7 @@ Each item's sub-fields get their own top-level form values (e.g. `hours_monday_s
 
 ## Custom Field Types
 
-![Custom Field Types](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/form/assets/custom-field-types.png)
+![Custom Field Types](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/form/assets/custom-field-types.png)
 
 Register custom renderers with full FormBuilder integration:
 

package/{packages → src}/kanban/README.md

@@ -6,7 +6,7 @@
 
 A stage-based board view for HubSpot UI Extensions. Share DataTable's config vocabulary (`cardFields` ≈ `columns`, filters, sort, selection) so you can offer users a table-or-board toggle without rewriting the data layer. Drag-and-drop isn't available inside HubSpot UI Extensions, so stage changes happen through an inline `Select` (or menu) on each card.
 
-![Kanban — HubSpot Deals preset with metrics](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/kanban/assets/hubspot-deals-preset-with-metrics.png)
+![Kanban — HubSpot Deals preset with metrics](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/kanban/assets/hubspot-deals-preset-with-metrics.png)
 
 ## Why Kanban?
 
@@ -106,7 +106,7 @@ hubspot.extend(() => (
 
 ### HubSpot Deals preset with metrics
 
-![Kanban — HubSpot Deals preset with metrics](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/kanban/assets/hubspot-deals-preset-with-metrics.png)
+![Kanban — HubSpot Deals preset with metrics](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/kanban/assets/hubspot-deals-preset-with-metrics.png)
 
 Drop-in preset shaped like HubSpot's native deals pipeline: stage-variant headers, per-stage amount totals in the column footer, and a headline metrics panel above the board. Hide the summary row with `showMetrics={false}` for dashboards that already surface totals elsewhere.
 
@@ -136,7 +136,7 @@ const metrics = useMemo(() => {
 />
 ```
 
-![Kanban — HubSpot Deals preset without metrics](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/kanban/assets/hubspot-deals-preset-no-metrics.png)
+![Kanban — HubSpot Deals preset without metrics](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/kanban/assets/hubspot-deals-preset-no-metrics.png)
 
 The metrics panel is toggled via a **Metrics** button that appears in the toolbar whenever `metrics` is provided. Pass an array for the shorthand `<StatisticsItem>` rendering, or a raw `ReactNode` when you need a chart / multi-row layout:
 
@@ -163,7 +163,7 @@ Keep metrics to 4–6 items (HubSpot's own `<Statistics>` guidance caps at 4 sid
 
 ### Compact lead board
 
-![Kanban — Compact lead board preset](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/kanban/assets/compact-lead-board-preset.png)
+![Kanban — Compact lead board preset](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/kanban/assets/compact-lead-board-preset.png)
 
 `cardDensity="compact"` with trimmed `cardFields` for high-volume boards (leads, tickets, tasks) where you want to fit 8–12 cards per column on a typical viewport without horizontal scrolling.
 
@@ -213,7 +213,7 @@ Every knob stays overridable per board — density only shifts the defaults.
 
 ### Per-stage "Load more" and stage controls
 
-![Kanban — Select + load more preset](https://raw.githubusercontent.com/05bmckay/hs-uix/main/packages/kanban/assets/select-load-more-preset.png)
+![Kanban — Select + load more preset](https://raw.githubusercontent.com/05bmckay/hs-uix/main/src/kanban/assets/select-load-more-preset.png)
 
 Per-column pagination via an `onLoadMore` handler and `stageMeta[stage].hasMore`, plus inline `Select` stage controls on each card (`stageControl="select"`). Switch to `"menu"` for action-menu style transitions, or `"none"` for read-only boards.
 
@@ -477,7 +477,7 @@ const SORT_OPTIONS = [
 />
 ```
 
-When every sort option has `field` + `direction`, the toolbar renders the richer "field picker + Asc/Desc toggle" UI. Mixed or missing → simple flat option list.
+The toolbar renders sort options as a compact transparent `Select`, matching the Feed toolbar style. Optional `field` / `direction` metadata can still be useful when deriving board sorts from shared table config, but the visible option text comes from each option's `label`.
 
 ---
 
@@ -550,11 +550,11 @@ If your data comes from an API or you have too many records to load up-front, dr
 | `showSearch` | boolean | `true` (when `searchFields` set) | Show/hide the search input |
 | `searchFields` | string[] | `[]` | Fields to search across. Search UI only renders when non-empty. |
 | `searchPlaceholder` | string | `"Search..."` | Placeholder for the search input |
-| `searchDebounce` | number | `0` | Milliseconds to debounce `onSearchChange` callback |
+| `searchDebounce` | number | `250` | Milliseconds to debounce `onSearchChange` callback. Pass `0` for synchronous search |
 | `fuzzySearch` | boolean | `false` | Enable fuzzy matching via Fuse.js |
 | `fuzzyOptions` | object | — | Custom Fuse.js options (threshold, distance, keys) |
 | `filters` | `KanbanFilterConfig[]` | `[]` | Filter configurations (see below) |
-| `filterInlineLimit` | number | `2` | Max filters shown inline before overflow into a "Filters" button |
+| `filterInlineLimit` | number | `4` | Max filters shown inline before overflow into a "Filters" button |
 | `showFilterBadges` | boolean | `true` | Show active filter chips |
 | `showClearFiltersButton` | boolean | `showFilterBadges` | Show "Clear all" reset button. Defaults to the value of `showFilterBadges`, so hiding the chips hides the reset button too unless set explicitly |
 | `sortOptions` | `KanbanSortOption[]` | — | Sort options (single board-wide sort) |
@@ -562,7 +562,7 @@ If your data comes from an API or you have too many records to load up-front, dr
 | `sort` | string | — | Controlled sort option `value` |
 | `onSortChange` | `(value) => void` | — | Sort callback (controlled) |
 | `columnFooter` | `(rows, stage) => ReactNode` | — | Per-stage footer (aggregate row). Overridden by `stage.footer` when set. |
-| `columnWidth` | number | `280` | Min per-column width in px (AutoGrid `columnWidth`). Clamped to 280px. |
+| `columnWidth` | number | `350` | Min per-column width in px (AutoGrid `columnWidth`). Clamped to a 350px minimum. |
 | `collapsedStages` | string[] | — | Controlled list of collapsed stage values |
 | `onCollapsedStagesChange` | `(stages) => void` | — | Controlled-collapse callback |
 | `metrics` | `KanbanMetricItem[] \| ReactNode` | — | Headline metrics panel. Array → `<StatisticsItem>` shorthand; ReactNode → full custom render. |
@@ -627,9 +627,9 @@ If your data comes from an API or you have too many records to load up-front, dr
 |---|---|---|
 | `value` | string | Unique sort identifier |
 | `label` | string | Display label in the sort dropdown |
-| `field` | string | *(Optional)* Field key for the richer "field + direction" picker UI |
-| `direction` | `"asc" \| "desc"` | *(Optional)* Direction for the field-picker UI |
-| `fieldLabel` | string | *(Optional)* Label shown in the grouped field selector |
+| `field` | string | *(Optional)* Field metadata for consumers deriving shared table/board sort configs |
+| `direction` | `"asc" \| "desc"` | *(Optional)* Direction metadata for shared sort configs |
+| `fieldLabel` | string | *(Optional)* Display label for `field` metadata |
 | `comparator` | `(a, b) => number` | Sort comparator applied within each stage |
 
 ### Stage Meta
@@ -698,7 +698,7 @@ These come from HubSpot UI Extensions itself, not Kanban:
 | No swimlanes | Secondary grouping (e.g. by owner within stage) isn't supported. On the roadmap. |
 | No export | No built-in CSV/Excel export. Pair with a serverless function. |
 
-See [`packages/kanban/SPEC.md`](./SPEC.md) for the full design doc, decision log, and roadmap.
+See [`src/kanban/SPEC.md`](./SPEC.md) for the full design doc, decision log, and roadmap.
 
 ---
 

package/{packages → src}/kanban/index.d.ts

@@ -18,10 +18,17 @@ export interface KanbanOption<T = string> {
 export interface KanbanFilterConfig<Row = Record<string, unknown>> {
   name: string;
   type?: KanbanFilterType;
+  label?: string;
   placeholder?: string;
   /** Prefix used in the active-filter chip. Defaults to `placeholder` or `name`. */
   chipLabel?: string;
   options?: KanbanOption[];
+  includeAll?: boolean;
+  allValue?: unknown;
+  emptyValue?: unknown;
+  allLabel?: string;
+  fromLabel?: string;
+  toLabel?: string;
   filterFn?: (row: Row, value: unknown) => boolean;
 }
 
@@ -104,11 +111,11 @@ export interface KanbanStageMeta {
 export interface KanbanSortOption<Row = Record<string, unknown>> {
   value: string;
   label: string;
-  /** Optional grouping metadata for the richer "field + direction" sort picker UI. */
+  /** Optional field metadata for consumers that derive shared table/board sort configs. */
   field?: string;
-  /** Optional direction used with `field` to render Asc/Desc toggle controls. */
+  /** Optional direction metadata for consumers that derive shared table/board sort configs. */
   direction?: "asc" | "desc";
-  /** Optional label shown for the grouped field selector. */
+  /** Optional display label for `field` metadata. */
   fieldLabel?: string;
   comparator: (a: Row, b: Row) => number;
 }
@@ -303,20 +310,24 @@ export interface KanbanProps<Row = Record<string, unknown>, Id = string | number
   /** Search is only active, and the search input only renders, when this list is non-empty. */
   searchFields?: string[];
   searchPlaceholder?: string;
-  /** ms to debounce onSearchChange callback. 0 = no debounce. */
+  /** ms to debounce onSearchChange callback. Default 250; 0 = no debounce. */
   searchDebounce?: number;
   /** Enable fuzzy matching via Fuse.js */
   fuzzySearch?: boolean;
   /** Custom Fuse.js options (threshold, distance, keys, etc.) */
   fuzzyOptions?: Record<string, unknown>;
   filters?: KanbanFilterConfig<Row>[];
-  /** Number of filters shown inline before the "Filters" overflow button. Default 2. */
+  /** Number of filters shown inline before the "Filters" overflow button. Default 4. */
   filterInlineLimit?: number;
+  /** Left toolbar column flex weight. Default 3. */
+  toolbarLeftFlex?: number;
+  /** Right toolbar column flex weight. Default 1. */
+  toolbarRightFlex?: number;
   /** Show active filter chips with individual clear affordances. Default true. */
   showFilterBadges?: boolean;
   /** Show the "Clear all" reset button when filters are active. Defaults to `showFilterBadges` when omitted, so hiding the chips hides the clear-all button too. */
   showClearFiltersButton?: boolean;
-  /** Supports simple options or grouped field/direction options for the richer sort picker UI. */
+  /** Board-wide sort options shown in the toolbar Select. */
   sortOptions?: KanbanSortOption<Row>[];
   defaultSort?: string;
   sort?: string;
@@ -327,7 +338,7 @@ export interface KanbanProps<Row = Record<string, unknown>, Id = string | number
   /**
    * Pixel width for each column, passed to AutoGrid's columnWidth. Columns
    * share available horizontal space equally with this value as the minimum.
-   * Clamped to 280px minimum regardless of the value passed. Default 280px.
+   * Clamped to 350px minimum regardless of the value passed. Default 350px.
    */
   columnWidth?: number;
   collapsedStages?: string[];