Table

Tabular data with real semantics: captions, scoped headers, sticky headers, striped rows. The wrapper scrolls on small screens.

Example

Recent invoices
Customer	Amount	Status
Ada Lovelace	$1,200	Paid
Grace Hopper	$850	Pending
Alan Turing	$2,300	Overdue

<Table caption="Recent invoices" striped stickyHeader>
  <TableHead>
    <TableRow>
      <TableCell header scope="col">Customer</TableCell>
    </TableRow>
  </TableHead>
  <TableBody>...</TableBody>
</Table>

Props

Prop	Type	Default	Description
`caption`	`string`	-	Table summary for AT.
`striped / hover`	`boolean`	`false`	Row treatments.
`stickyHeader`	`boolean`	`false`	Pinned header row.
`size`	`sm \| md`	`md`	Cell density.
`header / scope / align` (Cell)	`-`	-	Renders `th`, sets scope and alignment.

Accessibility

Column headers carry scope="col"; row headers scope="row".
Captions describe the table; horizontal scroll on mobile never clips content.