Column

TIP

This page refers to the table's column objects that are generated within the table instance. Refer to this link for the column definitions API.

The Column types are organized by feature. All feature types are ultimately joined in the single Column type definition.

Name & Description	Option(s)	Default
columnDef The original column def used to create the column.	ColumnDef
columns The child column (if the column is a group column). Will be an empty array if the column is not a group column.	Column[]
depth The depth of the column (if grouped) relative to the root column def array.	number
getFlatColumns Returns the flattened array of this column and all child/grand-child columns for this column.	() => Column< TData, TValue, ColumnMeta >[]
getLeafColumns Returns an array of all leaf-node columns for this column. If a column has no children, it is considered the only leaf-node column.	() => Column< TData, TValue, ColumnMeta >[]
id The resolved unique identifier for the column resolved in this priority: - A manual `id` property from the column def - The accessor key from the column def - The header string from the column def	string
accessorFn The resolved accessor function to use when extracting the value for the column from each row. Will only be defined if the column def has a valid accessor key or function defined.	( originalRow: TData, index: number, ) => TValue
parent The parent column for this column. Will be undefined if this is a root column.	Column

Name & Description	Option(s)	Default
getAutoFilterFn Returns an automatically calculated filter function for the column based off of the columns first known value.	() => signature
getCanFilter Returns whether the column can be column filtered.	() => boolean
getCanGlobalFilter Returns whether the column can be globally filtered. Set to `false` to disable a column from being scanned during global filtering.	() => boolean
getFacetedMinMaxValues A function that computes and returns a min/max tuple derived from getFacetedRowModel. Useful for displaying faceted result values. > ⚠️ Requires that you pass a valid getFacetedMinMaxValues function to `options.getFacetedMinMaxValues`. A default implementation is provided via the exported getFacetedMinMaxValues function.	() => [ number, number, ]
getFacetedRowModel Returns the row model with all other column filters applied, excluding its own filter. Useful for displaying faceted result counts.️ Requires that you pass a valid getFacetedRowModel function to `options.facetedRowModel`. A default implementation is provided via the exported getFacetedRowModel function.	() => RowModel<TData>
getFacetedUniqueValues A function that computes and returns a `Map` of unique values and their occurrences derived from `column.getFacetedRowModel`. Useful for displaying faceted result values. Requires that you pass a valid getFacetedUniqueValues function to `options.getFacetedUniqueValues`. A default implementation is provided via the exported getFacetedUniqueValues function.	() => Map< any, number >
getFilterFn Returns the filter function (either user-defined or automatic, depending on configuration) for the columnId specified.	() => signature
getFilterIndex Returns the index of the column filter in the table's `state.columnFilters` array. Returns `-1` if not found.	() => number
getFilterValue Returns the current filter value for the column.	() => unknown
getIsFiltered Returns whether the column is currently filtered.	() => boolean
setFilterValue A function that sets the current filter value for the column. You can pass it a value or an updater function for immutability-safe operations on existing values.	( updater: any, ) => void

A function that computes and returns a min/max tuple derived from getFacetedRowModel. Useful for displaying faceted result values. > ⚠️ Requires that you pass a valid getFacetedMinMaxValues function to options.getFacetedMinMaxValues. A default implementation is provided via the exported getFacetedMinMaxValues function.

getFacetedRowModel

Type

() => RowModel<TData>

Description

Returns the row model with all other column filters applied, excluding its own filter. Useful for displaying faceted result counts.️ Requires that you pass a valid getFacetedRowModel function to options.facetedRowModel. A default implementation is provided via the exported getFacetedRowModel function.

getFacetedUniqueValues

Type

() => Map<
  any,
  number
>

Description

A function that computes and returns a Map of unique values and their occurrences derived from column.getFacetedRowModel. Useful for displaying faceted result values. Requires that you pass a valid getFacetedUniqueValues function to options.getFacetedUniqueValues. A default implementation is provided via the exported getFacetedUniqueValues function.

getFilterFn

Type

() => signature

Description

Returns the filter function (either user-defined or automatic, depending on configuration) for the columnId specified.

getFilterIndex

Type

() => number

Description

Returns the index of the column filter in the table's state.columnFilters array. Returns -1 if not found.

getFilterValue

Type

() => unknown

Description

Returns the current filter value for the column.

getIsFiltered

Type

() => boolean

Description

Returns whether the column is currently filtered.

setFilterValue

Type

(
  updater: any,
) => void

Description

A function that sets the current filter value for the column. You can pass it a value or an updater function for immutability-safe operations on existing values.

SortingColumn

Name & Description	Option(s)	Default
clearSorting Removes this column from the table's sorting state	() => void
getAutoSortDir Returns a sort direction automatically inferred based on the columns values.	() => \| 'asc' \| 'desc'
getAutoSortingFn Returns a sorting function automatically inferred based on the columns values.	() => any
getCanMultiSort Returns whether this column can be multi-sorted.	() => boolean
getCanSort Returns whether this column can be sorted.	() => boolean
getFirstSortDir Returns the first direction that should be used when sorting this column.	() => \| 'asc' \| 'desc'
getIsSorted Returns the current sort direction of this column.	() => \| false \| 'asc' \| 'desc'
getNextSortingOrder Returns the next sorting order.	() => \| false \| 'asc' \| 'desc'
getSortIndex Returns the index position of this column's sorting within the sorting state	() => number
getSortingFn Returns the resolved sorting function to be used for this column	() => any
getToggleSortingHandler Returns a function that can be used to toggle this column's sorting state. This is useful for attaching a click handler to the column header.	() => ( event: unknown, ) => void
toggleSorting Toggles this columns sorting state. If `desc` is provided, it will force the sort direction to that value. If `isMulti` is provided, it will additivity multi-sort the column (or toggle it if it is already sorted).	( desc?: boolean, isMulti?: boolean, ) => void

clearSorting

Type

() => void

Description

Removes this column from the table's sorting state

getAutoSortDir

Type

() =>
| 'asc'
| 'desc'

Description

Returns a sort direction automatically inferred based on the columns values.

getAutoSortingFn

Type

() => any

Description

Returns a sorting function automatically inferred based on the columns values.

getCanMultiSort

Type

() => boolean

Description

Returns whether this column can be multi-sorted.

getCanSort

Type

() => boolean

Description

Returns whether this column can be sorted.

getFirstSortDir

Type

() =>
| 'asc'
| 'desc'

Description

Returns the first direction that should be used when sorting this column.

getIsSorted

Type

() =>
| false
| 'asc'
| 'desc'

Description

Returns the current sort direction of this column.

getNextSortingOrder

Type

() =>
| false
| 'asc'
| 'desc'

Description

Returns the next sorting order.

getSortIndex

Type

() => number

Description

Returns the index position of this column's sorting within the sorting state

getSortingFn

Type

() => any

Description

Returns the resolved sorting function to be used for this column

getToggleSortingHandler

Type

() => (
  event: unknown,
) => void

Description

Returns a function that can be used to toggle this column's sorting state. This is useful for attaching a click handler to the column header.

toggleSorting

Type

(
  desc?: boolean,
  isMulti?: boolean,
) => void

Description

Toggles this columns sorting state. If desc is provided, it will force the sort direction to that value. If isMulti is provided, it will additivity multi-sort the column (or toggle it if it is already sorted).

GroupingColumn

AggregationFn

The AggregationFn interface is used on several of the GroupingColumn properties.

export type AggregationFn<TData extends RowData> = (
  columnId: string,
  leafRows: Row<TData>[],
  childRows: Row<TData>[],
) => any

Name & Description	Option(s)	Default
getAggregationFn Returns the aggregation function for the column.	() => AggregationFn<TData>
getAutoAggregationFn Returns the automatically inferred aggregation function for the column.	() => AggregationFn<TData>
getCanGroup Returns whether the column can be grouped.	() => boolean
getGroupedIndex Returns the index of the column in the grouping state.	() => number
getIsGrouped Returns whether the column is currently grouped.	() => boolean
getToggleGroupingHandler Returns a function that toggles the grouping state of the column. This is useful for passing to the `onClick` prop of a button.	() => () => void
toggleGrouping Toggles the grouping state of the column.	() => void

getAggregationFn

Type

() => AggregationFn<TData>

Description

Returns the aggregation function for the column.

getAutoAggregationFn

Type

() => AggregationFn<TData>

Description

Returns the automatically inferred aggregation function for the column.

getCanGroup

Type

() => boolean

Description

Returns whether the column can be grouped.

getGroupedIndex

Type

() => number

Description

Returns the index of the column in the grouping state.

getIsGrouped

Type

() => boolean

Description

Returns whether the column is currently grouped.

getToggleGroupingHandler

Type

() => () => void

Description

Returns a function that toggles the grouping state of the column. This is useful for passing to the onClick prop of a button.

toggleGrouping

Type

() => void

Description

Toggles the grouping state of the column.

VisibilityColumn

Name & Description	Option(s)	Default
getCanHide Returns whether the column can be hidden.	() => boolean
getIsVisible Returns whether the column is visible.	() => boolean
getToggleVisibilityHandler Returns a function that can be used to toggle the column visibility. This function can be used to bind to an event handler to an element.	() => ( event: unknown, ) => void
toggleVisibility Toggles the visibility of the column.	( value?: boolean, ) => void

getCanHide

Type

() => boolean

Description

Returns whether the column can be hidden.

getIsVisible

Type

() => boolean

Description

Returns whether the column is visible.

getToggleVisibilityHandler

Type

() => (
  event: unknown,
) => void

Description

Returns a function that can be used to toggle the column visibility. This function can be used to bind to an event handler to an element.

toggleVisibility

Type

(
  value?: boolean,
) => void

Description

Toggles the visibility of the column.

ColumnPinningColumn

Name & Description	Option(s)	Default
getCanPin Returns whether the column can be pinned.	() => boolean
getIsPinned Returns the pinned position of the column. (`'left'`, `'right'` or `false`)	() => \| false \| 'left' \| 'right'
getIsPinnedLeft Returns whether the column is pinned to the left.	() => boolean
getIsPinnedRight Returns whether the column is pinned to the right.	() => boolean
getPinnedIndex Returns the numeric pinned index of the column within a pinned column group.	() => number
pin Pins a column to the `'left'` or `'right'`, or unpins the column to the center if `false` is passed.	( position: \| false \| 'left' \| 'right', ) => void

getCanPin

Type

() => boolean

Description

Returns whether the column can be pinned.

getIsPinned

Type

() =>
| false
| 'left'
| 'right'

Description

Returns the pinned position of the column. ('left', 'right' or false)

getIsPinnedLeft

Type

() => boolean

Description

Returns whether the column is pinned to the left.

getIsPinnedRight

Type

() => boolean

Description

Returns whether the column is pinned to the right.

getPinnedIndex

Type

() => number

Description

Returns the numeric pinned index of the column within a pinned column group.

Type

(
  position:
    | false
    | 'left'
    | 'right',
) => void

Description

Pins a column to the 'left' or 'right', or unpins the column to the center if false is passed.

ColumnSizingColumn

Name & Description	Option(s)	Default
getCanResize Returns `true` if the column can be resized.	() => boolean
getIsResizing Returns `true` if the column is currently being resized.	() => boolean
getSize Returns the current size of the column.	() => number
getStart Returns the offset measurement along the row-axis (usually the x-axis for standard tables) for the header. This is effectively a sum of the offset measurements of all preceding headers.	( position?: \| false \| 'left' \| 'right', ) => number
resetSize Resets the column to its initial size.	() => void

getCanResize

Type

() => boolean

Description

Returns true if the column can be resized.

getIsResizing

Type

() => boolean

Description

Returns true if the column is currently being resized.

getSize

Type

() => number

Description

Returns the current size of the column.

getStart

Type

(
  position?:
    | false
    | 'left'
    | 'right',
) => number

Description

Returns the offset measurement along the row-axis (usually the x-axis for standard tables) for the header. This is effectively a sum of the offset measurements of all preceding headers.

resetSize

Type

() => void

Description

Resets the column to its initial size.

Cell

Column Definitions

Column

API

CoreColumn

FiltersColumn

SortingColumn

GroupingColumn

AggregationFn

VisibilityColumn

ColumnPinningColumn

ColumnSizingColumn