For the complete documentation index, see llms.txt. Markdown variants are available by appending .md to any URL or sending an Accept: text/markdown header. An agent skill is available at /.well-known/agent-skills/site-skill.md.
1
Sponsor

Table

PreviousNext

Presentational table parts with selected rows and fluid hover.

Preview

Select a book to highlight its row.
TitleAuthorAction
DuneFrank Herbert
The Left Hand of DarknessUrsula K. Le Guin
FoundationIsaac Asimov

Installation

$ pnpm dlx shadcn@latest add https://ui.ketyap.me/r/table.json

Usage

import {
  Table,
  TableHeader,
  TableBody,
  TableRow,
  TableHead,
  TableCell,
  TableCaption,
} from "@/components/ui/table";
 
<Table>
  <TableCaption>Reading list</TableCaption>
  <TableHeader>
    <TableRow>
      <TableHead>Title</TableHead>
    </TableRow>
  </TableHeader>
  <TableBody>
    <TableRow selected>
      <TableCell>Dune</TableCell>
    </TableRow>
  </TableBody>
</Table>;

API Reference

All parts accept their native table element props. Table size: default or compact, otherwise inherited. Row selected adds selection styling; interactive enables fluid hover. Put an accessible Button or link inside an interactive row. Table does not invent row keyboard semantics or manage sorting, filtering or pagination. Horizontal overflow remains scrollable.