Table

Default

The minimal set.
Component	Variants	Sizes
button	secondary, outline, ghost, destructive, link	sm, lg, icon
badge	secondary, outline, destructive
alert	destructive

{ui table,
	columns: ['Component', 'Variants', 'Sizes'],
	rows: [
		['button', 'secondary, outline, ghost, destructive, link', 'sm, lg, icon'],
		['badge', 'secondary, outline, destructive', ''],
		['alert', 'destructive', ''],
	],
	caption: 'The minimal set.',
/}

columns is the header and rows a list of rows, each a list of cells in the same order. Cells are escaped text. A table that needs markup in a cell is not this component yet.

The table scrolls sideways inside its wrapper when it is wider than the space, so it never stretches the page.

Without a caption

Name	Role
Ada	admin
Grace	editor

{ui table,
	columns: ['Name', 'Role'],
	rows: [
		['Ada', 'admin'],
		['Grace', 'editor'],
	],
/}

To build the rows from pages, map them in the controller and pass the result: Arr::map($page->children(), fn($child) => [(string) $child->title, $child->url()]).

Param	Default	Description
columns	[]	the header cells, in order
rows	[]	a list of rows, each a list of cells
caption	null	a muted line under the table
class	''	added to table
attrs	[]	any other attributes, e.g. ['id' => 'results']

Params