Table

Rows and columns on a rounded surface: sortable headers, density, stripes, sticky header, and cards on phones.

import { Table, TableHeader, TableBody, TableRow, TableHead, TableCell, TableCaption, TableFooter } from "pleate/table";

Sortable, stacks on phones

density

Row height.

"comfortable" | "compact"default "comfortable"

striped

Tint every other row.

booleandefault false

hoverable

Highlight the row under the pointer.

booleandefault true

stickyHeader

Keep the header visible while the body scrolls.

booleandefault false

Skeleton rows in place of the body while data loads.

booleandefault false

columns

Cells per skeleton row, to match your columns.

numberdefault 4

skeletonRows

How many skeleton rows.

numberdefault 4

empty

Empty state shown instead of the body rows.

{ icon?, title, description?, actions? }

stackOnMobile

Rows become cards below md; set TableCell label.

boolean

TableHead sort / onSort / align

Sortable column.

"asc" | "desc" | false / () => void / "start" | "center" | "end"