DataTable

DataTable<T>(props): Element

Defined in: packages/ui/src/components/data-table.tsx:45

Data table with column sorting, row selection, and pluggable cell rendering.

Renders via the UI plugin’s table slots (table, tableHead, tableBody, tableRow, tableCell). Accepts column definitions as strings (auto-labeled) or full ColumnDef objects for custom labels, sorting, and renderers.

Integrates with @cfast/pagination hook results for paginated data and with @cfast/actions for row-level actions.

Type Parameters

T

T = unknown

The row data type.

Parameters

props

DataTableProps<T>

See DataTableProps.

Returns

Element

Example

const pagination = usePagination<Post>();

<DataTable
  data={pagination}
  columns={["title", "author", { key: "createdAt", sortable: false }]}
  selectable
  onRowClick={(row) => navigate(`/posts/${row.id}`)}
/>