columns
RequiredDescription
The array of column defs to use for the table.
Type
Column<Y, any>[]Table
Table is a table component equipped with column sorting, row selection, and click event features.
Props
TableProps
cellProps
Description
Props for table cell component.
Type
CellProps<Y>checkboxProps
Description
Props for table checkbox element.
Type
CheckboxProps<string>colorScheme
Description
The visual color appearance of the component.
Type
"blackAlpha" | "whiteAlpha" | "amber" | "blue" | "info" | "link" | "primary" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "success" | "indigo" | "lime" | "neutral" | "orange" | "warning" | "pink" | "purple" | "red" | "danger" | "rose" | "sky" | "teal" | "violet" | "secondary" | "yellow"Default
"gray"defaultColumn
Description
Default column options to use for all column defs supplied to the table.
Type
Partial<Column<Y, any>>defaultSelectedRowIds
Description
The initial ids of the selected row.
Type
string[]defaultSort
Description
The initial sort of the table.
Type
Sort<Y>disabledRowIds
Description
The ids that disabled in selection.
Type
string[]footerGroupProps
Description
Props for table footer group component.
Type
HeaderGroupProps<Y>footerProps
Description
Props for table footer component.
Type
HeaderProps<Y>headerGroupProps
Description
Props for table header group component.
Type
HeaderGroupProps<Y>headerProps
Description
Props for table header component.
Type
HeaderProps<Y>highlightOnHover
Description
If true, highlight the row when the table row is hovered.
Type
booleanDefault
falsehighlightOnSelected
Description
If true, highlight the row when the table row is selected.
Type
booleanDefault
falseisFocusable
Description
If true, the table cell will be focusable.
Type
booleanDefault
truelayout
Description
The CSS table-layout property.
Type
"auto" | "fixed" | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | [TableLayout | { [x: string]: TableLayout | undefined; ... 5 more ...; xl?: TableLayout | undefined; }, TableLayout | { ...; }] | { ...; } | [...] | { ...; } | ((theme: StyledTheme) => UIValue<...>)onChangeSelect
Description
The callback invoked when row is selected.
Type
(rowSelection: string[]) => voidonChangeSort
Description
The callback invoked when table sort is changed.
Type
(sort: Sort<Y>) => voidonClickRow
Description
The callback invoked when a row is clicked.
Type
(row: Row<Y>) => voidonDoubleClickRow
Description
The callback invoked when a row is double clicked.
Type
(row: Row<Y>) => voidrowHeader
Description
The role used for the row header. This is used for accessibility to announce the selected row.
Type
keyof YrowId
Description
The id used to store the value when selected.
Type
keyof YrowProps
Description
Props for table row component.
Type
RowProps<Y>rowsClickSelect
Description
If true, allows selection by clicking on a row.
Type
booleanDefault
falseselectColumnProps
Description
Props for table select column component.
Type
false | SelectColumn<Y, any>selectedRowIds
Description
The ids of the selected row.
Type
string[]size
Description
The size of the Table.
Type
"sm" | "md" | "lg" | "xl"Default
"md"sort
Description
The sort of the table.
Type
Sort<Y>sortIconProps
Description
Props for table sort icon element.
Type
IconPropstbodyProps
Description
Props for table tbody element.
Type
TableBodyPropstfootProps
Description
Props for table tfoot element.
Type
TableFootPropstheadProps
Description
Props for table thead element.
Type
TableHeadPropsvariant
Description
The variant of the Table.
Type
"simple" | "striped" | "unstyled"Default
"simple"withBorder
Description
If true, display the outer border of the table.
Type
booleanDefault
falsewithColumnBorders
Description
If true, display line on the columns of the table.
Type
booleanDefault
falsewithFooter
Description
If true, display the table footer.
Type
booleanDefault
falsewithFooterSelect
Description
If true, display the checkbox in table footer.
Type
booleanDefault
falseEdit this page on GitHub