DataTable

The feature layer over Table: sort, search, the filter registry, selection, row menus, column visibility, and pagination, each a standalone hook named in features.

Uncontrolled: features self-own their state

Sort (tri-state carets), search, pagination, an auto checkbox column, and a row menu, all from one prop


Validate batch #129	Validate	Fay Ng	Paused	4,813	P5
Enhance batch #114	Enhance	Carmen Diaz	Paused	4,758	P5
Extract batch #128	Extract	Efe Sol	Failed	4,476	P4
Validate batch #113	Validate	Ben Cho	Failed	4,421	P4
ImageGen batch #127	ImageGen	Dev Patel	Queued	4,139	P3

Showing 1-5 of 42

…

Filter registry

Per-column filter kinds → key:value chips with disable-toggle + remove. AND across, OR within.

Module

Rows

Add filter


Extract batch #104	Extract	Efe Sol	Paused	1,388	P5
Enhance batch #106	Enhance	Ada Reyes	Running	2,062	P2
Extract batch #108	Extract	Carmen Diaz	Failed	2,736	P4
Enhance batch #110	Enhance	Efe Sol	Done	3,410	P1
Extract batch #112	Extract	Ada Reyes	Queued	4,084	P3
Enhance batch #114	Enhance	Carmen Diaz	Paused	4,758	P5

Showing 1-6 of 16

Uncheck a chip to grey it out without losing it; the “Add filter” picker offers every registered column. Match kinds render value chips (Module) or a single select (Status); range kinds get an operator + number/date.

FacetBar

The standing-facets toolbar, the union of both product apps: checkbox dropdowns with counts, a single-select facet behind an all-sentinel, helper tooltips, and applied values as removable chips behind the chips knob

Filter

Module · 1

All statuses

Module: Extract

1 filter value applied

FilterableCell, the click-to-filter cell:

Model-driven: selection bulk bar + column visibility

Build the model yourself with useDataTable, then compose a custom toolbar off its live state

Columns:

Tick rows to reveal the bulk bar. The header checkbox selects the visible page and shows an indeterminate state for a partial selection.


Extract batch #104	Extract	Efe Sol	Paused	1,388	P5
Validate batch #109	Validate	Dev Patel	Paused	3,073	P5
Enhance batch #114	Enhance	Carmen Diaz	Paused	4,758	P5
ImageGen batch #119	ImageGen	Ben Cho	Paused	1,443	P5
Extract batch #124	Extract	Ada Reyes	Paused	3,128	P5
Validate batch #129	Validate	Fay Ng	Paused	4,813	P5

Showing 1-6 of 42

…

URL-sync seam (live)

Both tables share the real qsync adapter: sort or page one and the other follows, and a reload restores both from the URL

The URL adapter mounts client-side.

Selection primitives

The cells DataTable composes, exported for custom tables

SelectAllCell: header checkbox, indeterminate-aware

Brake pads

Air filter

SelectionCheckbox: the raw control, indeterminate shown

RowMenu

The kebab menu a row's trailing cell carries

Styling slots

DataTable's own slots, on top of the core Table slots documented on the Table page

wrapperClassName: the outer toolbar+table+footer column
toolbarClassName: the default toolbar
selectCellClassName: the auto checkbox cell
menuTriggerClassName: the row-menu kebab trigger
filterBarClassName: the auto-rendered FilterBar