row-selection

What problem does it solve?

This Skill helps you manage row selection state in TanStack Table v9 so selected rows remain consistent across filtering, grouping, and server-side pagination.

Core Features & Use Cases

• Selection state modeling: Track selection via rowSelection with stable row IDs using rowSelection: Record<rowId, boolean | undefined>.
• Selection APIs for different row scopes: Use getSelectedRowModel, getFilteredSelectedRowModel, and getGroupedSelectedRowModel to derive the right selected set for your UI.
• Row and header interactions: Implement per-row selection (getIsSelected, getIsSomeSelected for indeterminate, getCanSelect, getCanMultiSelect, getToggleSelectedHandler) and header “select all” behavior (getIsAllRowsSelected, getIsSomeRowsSelected, getToggleAllRowsSelectedHandler, plus page-aware variants).
• Selection modes and hierarchies: Configure enableRowSelection (boolean or predicate), switch between multi-select and radio-style single-select (enableMultiRowSelection: false), and control sub-row propagation (enableSubRowSelection).
• Correctness under manualPagination: Emphasize that getRowId is essentially mandatory, and selection counts/actions should read from state.rowSelection to avoid page-scoped row models.

Quick Start

Tell your AI agent to “set up TanStack Table row selection with stable getRowId, a header select-all checkbox, per-row checkbox cells, and server-pagination-safe bulk actions reading from state.rowSelection.”