Composition recipe

Data Table

Use Table for static markup. For interactive application tables, install the source-owned TanStack Table v9 starters from the Tables Explorer.

Static table or TanStack starter?

Keep this composition for simple markup, or open the Tables Explorer for installable sorting, filtering, pagination, server, virtual, and advanced starters.

Building blocks

table checkbox dropdown-menu pagination

Starting point

<Table>
  <TableHeader>
    <TableRow>
      <TableHead>Name</TableHead>
      <TableHead>Status</TableHead>
    </TableRow>
  </TableHeader>
  <TableBody>{rows.map((row) => (
    <TableRow key={row.id}>
      <TableCell>{row.name}</TableCell>
      <TableCell>{row.status}</TableCell>
    </TableRow>
  ))}</TableBody>
</Table>