Data table

Search, selection, sorting, and pagination together. Rows carry raw values keyed by column, and a column's render prop turns them into cells, like the status Badges here, while sorting and search keep reading the raw value underneath.

The toolbar slot takes consumer owned controls, like this status Dropdown. Filter the rows you pass in and the readout, pagination, and empty state follow.

Every part is opt in. With no search, selection, or page size, the component is just a table with sortable headers. Clicks cycle ascending, descending, then back to the given order.

A search with no matches renders the bordered empty state instead of a bare table, and the result count reads zero. Override it through the emptyState prop.