📄 tanstack/table/v8/docs/api/features/row-pinning

File: row-pinning.md | Updated: 11/15/2025

Source: https://tanstack.com/table/v8/docs/api/features/row-pinning



TanStack

Table v8v8

Search...

+ K

Auto

Log In

TanStack StartRC

Docs Examples GitHub Contributors

TanStack Router

Docs Examples GitHub Contributors

TanStack Query

Docs Examples GitHub Contributors

TanStack Table

Docs Examples Github Contributors

TanStack Formnew

Docs Examples Github Contributors

TanStack DBbeta

Docs Github Contributors

TanStack Virtual

Docs Examples Github Contributors

TanStack Paceralpha

Docs Examples Github Contributors

TanStack Storealpha

Docs Examples Github Contributors

TanStack Devtoolsalpha

Docs Github Contributors

More Libraries

Maintainers Partners Support Learn StatsBETA Discord Merch Blog GitHub Ethos Brand Guide

Documentation

Framework

React logo

React

Version

v8

Search...

+ K

Menu

Getting Started

Core Guides

Feature Guides

Core APIs

Feature APIs

Enterprise

Examples

Framework

React logo

React

Version

v8

Menu

Getting Started

Core Guides

Feature Guides

Core APIs

Feature APIs

Enterprise

Examples

On this page

Row Pinning APIs

Copy Markdown

Can-Pin
-------

The ability for a row to be pinned is determined by the following:

  • options.enableRowPinning resolves to true
  • options.enablePinning is not set to false

State
-----

Pinning state is stored on the table using the following shape:

tsx

export type RowPinningPosition = false | 'top' | 'bottom'

export type RowPinningState = {
  top?: string[]
  bottom?: string[]
}

export type RowPinningRowState = {
  rowPinning: RowPinningState
}


export type RowPinningPosition = false | 'top' | 'bottom'

export type RowPinningState = {
  top?: string[]
  bottom?: string[]
}

export type RowPinningRowState = {
  rowPinning: RowPinningState
}

Table Options
-------------
### enableRowPinning

tsx

enableRowPinning?: boolean | ((row: Row<TData>) => boolean)


enableRowPinning?: boolean | ((row: Row<TData>) => boolean)

Enables/disables row pinning for all rows in the table.

### keepPinnedRows

tsx

keepPinnedRows?: boolean


keepPinnedRows?: boolean

When false, pinned rows will not be visible if they are filtered or paginated out of the table. When true, pinned rows will always be visible regardless of filtering or pagination. Defaults to true.

### onRowPinningChange

tsx

onRowPinningChange?: OnChangeFn<RowPinningState>


onRowPinningChange?: OnChangeFn<RowPinningState>

If provided, this function will be called with an updaterFn when state.rowPinning changes. This overrides the default internal state management, so you will also need to supply state.rowPinning from your own managed state.

Table API
---------
### setRowPinning

tsx

setRowPinning: (updater: Updater<RowPinningState>) => void


setRowPinning: (updater: Updater<RowPinningState>) => void

Sets or updates the state.rowPinning state.

### resetRowPinning

tsx

resetRowPinning: (defaultState?: boolean) => void


resetRowPinning: (defaultState?: boolean) => void

Resets the rowPinning state to initialState.rowPinning, or true can be passed to force a default blank state reset to {}.

### getIsSomeRowsPinned

tsx

getIsSomeRowsPinned: (position?: RowPinningPosition) => boolean


getIsSomeRowsPinned: (position?: RowPinningPosition) => boolean

Returns whether or not any rows are pinned. Optionally specify to only check for pinned rows in either the top or bottom position.

### getTopRows

tsx

getTopRows: () => Row<TData>[]


getTopRows: () => Row<TData>[]

Returns all top pinned rows.

### getBottomRows

tsx

getBottomRows: () => Row<TData>[]


getBottomRows: () => Row<TData>[]

Returns all bottom pinned rows.

### getCenterRows

tsx

getCenterRows: () => Row<TData>[]


getCenterRows: () => Row<TData>[]

Returns all rows that are not pinned to the top or bottom.

Row API
-------
### pin

tsx

pin: (position: RowPinningPosition) => void


pin: (position: RowPinningPosition) => void

Pins a row to the 'top' or 'bottom', or unpins the row to the center if false is passed.

### getCanPin

tsx

getCanPin: () => boolean


getCanPin: () => boolean

Returns whether or not the row can be pinned.

### getIsPinned

tsx

getIsPinned: () => RowPinningPosition


getIsPinned: () => RowPinningPosition

Returns the pinned position of the row. ('top', 'bottom' or false)

### getPinnedIndex

tsx

getPinnedIndex: () => number


getPinnedIndex: () => number

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

Edit on GitHub

Pagination

Row Selection

Partners Become a Partner

Code RabbitCode Rabbit CloudflareCloudflare AG GridAG Grid NetlifyNetlify NeonNeon WorkOSWorkOS ClerkClerk ConvexConvex ElectricElectric SentrySentry PrismaPrisma StrapiStrapi UnkeyUnkey

scarf analytics