Table
The Table component renders Payload's responsive table structure and styles. Columns define their heading and provide one rendered cell for each row.
Import
Basic usage
Keep each column's renderedCells array in the same order as data. Columns with active: false are omitted from the table.
Rendering cells
renderedCells accepts React nodes, so simple custom tables can format values directly. Payload also exports DefaultCell for rendering values from Payload field configurations. DefaultCell expects the Config and Translation providers available inside the Admin Panel.
Common props
These are the props most commonly used with this component. See its exported types in @payloadcms/ui for the complete list.
Prop | Type | Default | Description |
|---|---|---|---|
| | — | Rows rendered by the table. |
| | — | Defines headings, fields, and rendered cell content. |
| | | Selects the table's spacing and border treatment. |
| | — | Renders content immediately before the table. |
* An asterisk denotes that a prop is required.
Was this page helpful?