Table

A set of components for displaying tabular data.

$bunx shadcn@latest add @nx-ui/table

Installs withutils

Header, body and a caption describing the dataset. Cells stay on a single line and the container scrolls horizontally when the columns overflow.

Waste movements logged this week across the Northern network.
Reference	Carrier	Waste stream	Tonnage
MOV-4821	Pennine Haulage	Mixed dry recyclate	12.4 t
MOV-4822	Clyde Waste Logistics	Contaminated soil	28.0 t
MOV-4823	Severn Reclamation	Green garden waste	6.75 t
MOV-4824	Anglia Skip Hire	Hazardous sludge	3.10 t

A dedicated column rendering Badge variants keeps consignment states scannable at a glance.

Reference	Carrier	Waste stream	Status
MOV-4821	Pennine Haulage	Mixed dry recyclate	Settled
MOV-4822	Clyde Waste Logistics	Contaminated soil	In transit
MOV-4823	Severn Reclamation	Green garden waste	Settled
MOV-4824	Anglia Skip Hire	Hazardous sludge	Rejected

TableFooter is styled for summary rows — here it totals the invoiced amount for the settlement run.

Invoice	Organisation	Method	Amount
INV-2041	Riverside Composting Co-op	BACS	£1,850.00
INV-2042	Northgate Materials Recovery	Direct debit	£4,120.00
INV-2043	Fenland Soil Remediation	BACS	£960.00
INV-2044	Harbour Reuse Collective	Card	£2,275.00
Total settled			£9,205.00

A checkbox column with a header select-all toggle. Selected rows carry data-[state=selected], which tints the row from the component's own styles.

Reference	Carrier	Status	Tonnage
MOV-4821	Pennine Haulage	Settled	12.4 t
MOV-4822	Clyde Waste Logistics	In transit	28.0 t
MOV-4823	Severn Reclamation	Settled	6.75 t
MOV-4824	Anglia Skip Hire	Rejected	3.10 t

API reference

Exported parts and their props, extracted from the component source.