Infinite Table Reference
In the API Reference below we’ll use DATA_TYPE
to refer to the TypeScript type that represents the data the component is bound to.
autoSizeColumnsKey
Controls auto-sizing of columns.
columnDefaultWidth
Specifies the a default width for all columns.
columnMaxWidth
Specifies the maximum width for all columns.
columnMinWidth
Specifies the minimum width for all columns.
columnOrder
Defines the order in which columns are displayed in the component
columns
Describes the columns available in the component.
columns.components
Specifies custom React components to use for column cells or header
columns.components.ColumnCell
Specifies a custom React component to use for column cells
columns.components.HeaderCell
Specifies a custom React component to use for column headers
columns.cssEllipsis
Specifies if the column should show ellipsis for content that is too long and does not fit the column width.
columns.defaultFlex
Specifies a default flex for the column
columns.defaultHiddenWhenGroupedBy
Controls default column visibility when groupBy
is used.
columns.defaultWidth
Specifies a default width for the column
columns.field
Binds the column to the specified data field. It should be a keyof DATA_TYPE
.
columns.header
Specifies the column header. Can be a static value or a function that returns a React node.
columns.headerCssEllipsis
Specifies if the column should show ellipsis in the column header if the header is too long and does not fit the column width.
columns.maxWidth
Configures the maximum width for the column.
columns.minWidth
Configures the minimum width for the column.
columns.render
Customizes the rendering of the column.
columns.renderValue
Customizes the rendering of the column content.
columns.rowspan
Specifies the rowspan for cells on the current column.
columns.style
Controls styling for the column. Can be a style object or a function returning a style object.
columns.type
Specifies the column type - a column type is a set of properties that describes the column. Column types allow to easily apply the same properties to multiple columns.
columns.valueGetter
Customizes the value that will be rendered
columnSizing
Defines the sizing of columns in the grid.
columnSizing.flex
Specifies the flex value for the column.
columnSizing.minWidth
Specifies the minimum width for a column. Especially useful for flexible columns.
columnSizing.maxWidth
Specifies the maximum width for a column. Especially useful for flexible columns.
columnSizing.width
Specifies the fixed width for the column.
columnTypes
Specifies an object that maps column type ids to column types. Column types are used to apply the same configuration/properties to multiple columns.
defaultColumnOrder
Defines the order in which columns are displayed in the component.
domProps
DOM properties to be applied to the component root element.
focusedClassName
CSS class name to be applied to the component root element when it has focus.
focusedWithinClassName
CSS class name to be applied to the component root element when there is focus within (inside) the component.
focusedStyle
Specifies the style
to be applied to the component root element when it has focus.
focusedWithinStyle
Specifies the style
to be applied to the component root element when there is focus within (inside) the component.
groupColumn
Allows you to define a custom configuration for one or multiple group columns.
groupRenderStrategy
Determines how grouping is rendered - whether a single or multiple columns are generated. In case of inline, no group column is generated but the column corresponding to the group field is used.
hideEmptyGroupColumns
Allows you to hide group columns which don’t render any information (this happens when all previous groups are collapsed).
loadingText
The text inside the load mask - displayed when loading=true
.
onBlurWithin
Function that is called when a focused element is blurred within the component.
onColumnOrderChange
Called as a result of user changing the column order
onColumnSizingChange
onFocusWithin
Function that is called when the table receives focus within the component.
onScrollToBottom
Triggered when the user has scrolled to the bottom of the component
pivotGrandTotalColumnPosition
Controls the position and visibility of pivot grand-total columns
pivotTotalColumnPosition
Controls the position and visibility of pivot total columns
rowHeight
Specifies the height for rows. If a string is passed, it should be the name of a CSS variable, eg --row-height
rowClassName
Specifies the className to be applied to all rows or conditionally to certain rows.
rowStyle
Specifies the style object to be applied to all rows or conditionally to certain rows.
viewportReservedWidth
Specifies the width of the space to be kept as blank - useful when there are flex columns. This number can even be negative.
scrollTopKey
Determines scrolling the table to the top.
virtualizeColumns
Configures whether columns are virtualized or not