Table

A table presents an array of data as paginated tabular content, with the ability to sort by columns. Longer values are truncated, but show the full value when toggled.

Example

Table1–6 of 6


Banana	2.34	15	$35.10
Fennel	5.67	10	$56.70
Apple	1.23	10	$12.30
Carrot	3.45	20	$69.00
Eggplant	7.89	5	$39.45
Dragonfruit	12.34	5	$61.70

{
  type: "table",
  label: "Table",
  value: [
    ["Banana", 2.34, 15, "$35.10"],
    ["Fennel", 5.67, 10, "$56.70"],
    ["Apple", 1.23, 10, "$12.30"],
    ["Carrot", 3.45, 20, "$69.00"],
    ["Eggplant", 7.89, 5, "$39.45"],
    ["Dragonfruit", 12.34, 5, "$61.70"],
  ],
  columns: ["Name", "Price", "Qty", "Total"],
}

Options

Output

Use these options when using the field with make.

`label? string \|‌ false`	A label describing the purpose of the field. Setting the label to `false` removes the element, which can be useful when nested as the only child within a `group`.
`detail? string`	Additional information about the field, disclosed in a tooltip.
`value? Object[]`	The data to render in the table. The data may be an array of arrays, or an array of objects.
`columns? string[]`	For array-based data, the labels to use in each column of the header. For object-based data, the keys to include as columns.
`itemsPerPage? number`	The number of items to show in the table.
`currentPage? number`	The first page to show, based on the number of items shown per page.

Table

Example

Options

Output

URL