Table
A powerful and flexible table component for displaying tabular data with sorting, filtering, and pagination capabilities.
Company | Contact | Country |
---|---|---|
Company Alfreds Futterkiste | Contact Maria Anders | Country Germany |
Company Centro comercial Moctezuma | Contact Francisco Chang | Country Mexico |
Company Alfreds Futterkiste | Contact Maria Anders | Country Germany |
Company Centro comercial Moctezuma | Contact Francisco Chang | Country Mexico |
Prop | Type | Default value | |
---|---|---|---|
Prop data | Type Array<T> | Array<TableRowType> | Default value [] | Array of data objects to display in the table |
Prop columns | Type Array<Column<T>> | Array<TableHeaderType> | Default value [] | Array of column definitions for the table |
Prop pageSize | Type number | Default value 10 | Number of rows per page |
Prop onPageChange | Type page: number => void | Default value undefined | Callback when page changes |
Prop onSort | Type column: string, direction: 'asc' | 'desc' => void | Default value undefined | Callback when column is sorted |
Prop onFilter | Type column: string, value: string => void | Default value undefined | Callback when filter is applied |
Prop loading | Type boolean | Default value false | Whether the table is in loading state |
Prop selectedRows | Type Set<number> | Default value new Set() | Set of selected row indices |
Prop onRowSelect | Type rowIndex: number => void | Default value undefined | Callback when row is selected |