DataSource Props

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.

aggregationReducers

Record<string, DataSourceAggregationReducer>

Specifies the functions to use for aggregating data. The object is a map where the keys are ids for aggregations and values are object of the shape described below.

data

DATA_TYPE[]|Promise<DATA_TYPE[]|() => DATA_TYPE[]|Promise<DATA_TYPE[]>

Specifies the data the component is bound to. Can be one of the following:

defaultFilterValue

{field?, id?, filter: {type, operator, value}[]

Uncontrolled prop used for filtering. Can be used for both client-side and server-side filtering.

defaultRowSelection

string|number|null|object

Describes the selected row(s) in the DataSource

defaultSortInfo

DataSourceSingleSortInfo<T>|DataSourceSingleSortInfo<T>[]|null

Information for sorting the data. This is an uncontrolled prop.

filterDelay

Default: 200
number

The delay in milliseconds before the filter is applied. This is useful when you want to wait for the user to finish typing before applying the filter.

filterFunction

({ data, dataArray, index, primaryKey }) => boolean

A function to be used for client-side filtering.

filterMode

'local'|'remote'

Explicitly configures where filtering will take place

filterTypes

Record<string,{operators,emptyValues, defaultOperator}>

Specifies the available types of filters for the columns.

filterTypes.components.FilterEditor

A custom React component to be used as an editor for the current filter type

filterValue

{field?, id?, filter: {type, operator, value}[]

Controlled prop used for filtering. Can be used for both client-side and server-side filtering.

lazyLoad

Default: false
boolean|{batchSize:number}

Whether the datasource will load data lazily - useful for server-side grouping and pivoting. If set to true or to an object (with batchSize property), the data prop must be a function that returns a promise.

groupBy

An array of objects with field properties, that control how rows are being grouped.

groupBy.column

Partial<InfiniteTableColumn<T>>

An object that configures how the column for the current group should look like

livePagination

boolean

Whether the component should use live pagination.

onDataMutations

({ mutations, dataArray, primaryKeyField }) => void

Callback prop to be called when the data changes via the DataSource API.

livePaginationCursor

string|number|((params) =>string|number)

A cursor value for live pagination. A good value for this is the id of the last item in the data array. It can also be defined as a function

onDataParamsChange

(dataParams: DataSourceDataParams<DATA_TYPE:>)=>void

A function to be called when data-related state changes.

onFilterValueChange

({field?, id?, filter: {type, operator, value}[]) => void

Callback prop called when the filterValue changes.

onLivePaginationCursorChange

(cursor)=> void

A function to be called when the livePaginationCursor changes.

onReady

(dataSourceApi: DataSourceApi<DATA_TYPE>) => void

The callback that is called when the DataSource is ready. The dataSourceApi is passed as the first argument.

onRowSelectionChange

(rowSelection, selectionMode='single-row'|'multi-row') => void

A function to be called when the rowSelection changes.

onSortInfoChange

(sortInfo | null) => void

Called when sorting changes on the DataSource.

refetchKey

string|number|object

A value that can be used to trigger a re-fetch of the data.

rowSelection

string|number|null|object

Describes the selected row(s) in the DataSource

selectionMode

'single-row'|'multi-row'|false

Specifies the type of selection that should be enabled.

sortFunction

(sortInfo:DataSourceSingleSortInfo<T>[], arr: T[]) => T[]

Custom sorting function to replace the multisort function used by default.

sortInfo

DataSourceSingleSortInfo<T>|DataSourceSingleSortInfo<T>[]|null

Information for sorting the data. This is a controlled prop.

sortMode

'local'|'remote'

Specifies where the sorting should be done.

sortTypes

Record<string, ((a,b) => number)>

Describes the available sorting functions used for local sorting. The object you provide will be merged into the default sort types.

useGroupKeysForMultiRowSelection

Default: false
boolean

Specifies whether rowSelection contains group keys or only row ids/primary keys.