@tanstack/table-core 9.0.0-beta.2 → 9.0.0-beta.21

package/skills/setup/SKILL.md

@@ -2,12 +2,14 @@
 name: setup
 description: >
   Install a TanStack Table v9 framework adapter and wire up a first table with
-  `tableFeatures({...})` declaring `features`, an `rowModels` map of factory
-  results (`createSortedRowModel(sortFns)`, `createFilteredRowModel(filterFns)`,
-  `createPaginatedRowModel()`, …), a `createColumnHelper<typeof features, TData>()`
-  column set, and the framework `useTable` / `injectTable` / `createTable` /
-  `constructTable` entry point. Covers the registry model, why `features` must
-  be module-scoped, when to reach for `stockFeatures`, and `coreFeatures`.
+  `tableFeatures({...})` declaring `features` (which now also carries row model
+  factories like `sortedRowModel: createSortedRowModel()`, `filteredRowModel:
+  createFilteredRowModel()`, `paginatedRowModel: createPaginatedRowModel()`, and
+  fn registries like `sortFns`/`filterFns`), a
+  `createColumnHelper<typeof features, TData>()` column set, and the framework
+  `useTable` / `injectTable` / `createTable` / `constructTable` entry point.
+  Covers the registry model, why `features` must be module-scoped, when to reach
+  for `stockFeatures`, and `coreFeatures`.
 type: core
 library: tanstack-table
 library_version: '9.0.0-alpha.48'
@@ -27,7 +29,7 @@ This skill builds on `tanstack-table/state-management` and `tanstack-table/colum
 
 ## Setup
 
-TanStack Table v9 separates a framework-agnostic core (`@tanstack/table-core`) from per-framework adapters. Every table — vanilla or framework — must declare two new v9-required options at construction time: `features` (the registry of feature plugins) and `rowModels` (the map of pipeline factories).
+TanStack Table v9 separates a framework-agnostic core (`@tanstack/table-core`) from per-framework adapters. Every table — vanilla or framework — must declare the `features` option at construction time: the registry of feature plugins, row model factories, and fn registries.
 
 ```ts
 // Framework-agnostic, using @tanstack/table-core directly.
@@ -44,7 +46,12 @@ type Person = { firstName: string; lastName: string; age: number }
 
 // 1. Declare features at MODULE scope (stable reference). This is required —
 //    a fresh `features` object on every call destroys feature registration.
-const features = tableFeatures({ rowSortingFeature })
+const features = tableFeatures({
+  rowSortingFeature,
+  // Row model factories and fn registries live on the features object.
+  sortedRowModel: createSortedRowModel(),
+  sortFns,
+})
 
 // 2. Build a column helper bound to BOTH TFeatures and TData.
 const columnHelper = createColumnHelper<typeof features, Person>()
@@ -62,10 +69,6 @@ const data: Person[] = [
 
 const table = constructTable({
   features,
-  rowModels: {
-    // Pair every feature with its matching row-model factory.
-    sortedRowModel: createSortedRowModel(sortFns),
-  },
   columns,
   data,
 })
@@ -92,7 +95,6 @@ Framework adapters wrap this with reactivity:
 const features = tableFeatures({}) // core features only
 const table = constructTable({
   features,
-  rowModels: {}, // core row model auto-included
   columns,
   data,
 })
@@ -118,15 +120,15 @@ const features = tableFeatures({
   rowSortingFeature,
   rowPaginationFeature,
   columnFilteringFeature,
+  sortedRowModel: createSortedRowModel(),
+  filteredRowModel: createFilteredRowModel(),
+  paginatedRowModel: createPaginatedRowModel(),
+  sortFns,
+  filterFns,
 })
 
 const table = constructTable({
   features,
-  rowModels: {
-    sortedRowModel: createSortedRowModel(sortFns),
-    filteredRowModel: createFilteredRowModel(filterFns),
-    paginatedRowModel: createPaginatedRowModel(),
-  },
   columns,
   data,
 })
@@ -144,10 +146,8 @@ const features = tableFeatures({})
 
 const table = constructTable({
   features,
-  rowModels: {},
   columns,
   data,
-  _rowModelFns: {},
   // Use the vanilla binding when no framework adapter exists
   _processingMode: 'core',
 })
@@ -178,24 +178,22 @@ Wrong:
 ```ts
 // rowSortingFeature missing — table.setSorting / state.sorting unavailable
 const features = tableFeatures({}) // empty
-const table = useTable({ features, rowModels: {}, columns, data })
+const table = useTable({ features, columns, data })
 table.setSorting([{ id: 'age', desc: true }]) // ❌ does not exist on this table type
 ```
 
 Correct:
 
 ```ts
-// Register every feature you intend to use; pair with its row model when applicable
-const features = tableFeatures({ rowSortingFeature, rowPaginationFeature })
-const table = useTable({
-  features,
-  rowModels: {
-    sortedRowModel: createSortedRowModel(sortFns),
-    paginatedRowModel: createPaginatedRowModel(),
-  },
-  columns,
-  data,
+// Register every feature you intend to use; include its row model factory and fns
+const features = tableFeatures({
+  rowSortingFeature,
+  rowPaginationFeature,
+  sortedRowModel: createSortedRowModel(),
+  paginatedRowModel: createPaginatedRowModel(),
+  sortFns,
 })
+const table = useTable({ features, columns, data })
 ```
 
 In v9, `features` is a tree-shakeable registry — TypeScript hides APIs for unregistered features and the runtime atom is never created. Agents who see `table.setColumnFilters` "missing" often incorrectly conclude the API was removed.
@@ -231,16 +229,15 @@ import {
   sortFns,
 } from '@tanstack/react-table'
 
-const features = tableFeatures({ rowSortingFeature })
-const table = useTable({
-  features,
-  rowModels: { sortedRowModel: createSortedRowModel(sortFns) },
-  columns,
-  data,
+const features = tableFeatures({
+  rowSortingFeature,
+  sortedRowModel: createSortedRowModel(),
+  sortFns,
 })
+const table = useTable({ features, columns, data })
 ```
 
-v7→v8 and v8→v9 both reshaped the API substantially. Agents trained on older data confidently emit v7/v8 shapes; v9 enforces `features` + `rowModels`.
+v7→v8 and v8→v9 both reshaped the API substantially. Agents trained on older data confidently emit v7/v8 shapes; v9 requires `features` with row model factories registered on it.
 
 Source: maintainer interview (Phase 4, 2026-05-17)
 
@@ -252,7 +249,7 @@ Wrong:
 function MyTable() {
   // ❌ new object every render — destroys stable feature registration
   const features = tableFeatures({ rowSortingFeature })
-  const table = useTable({ features, rowModels: {}, columns, data })
+  const table = useTable({ features, columns, data })
 }
 ```
 
@@ -263,7 +260,7 @@ Correct:
 const features = tableFeatures({ rowSortingFeature })
 
 function MyTable() {
-  const table = useTable({ features, rowModels: {}, columns, data })
+  const table = useTable({ features, columns, data })
 }
 ```
 
@@ -277,31 +274,26 @@ Wrong:
 
 ```ts
 // rowSortingFeature missing — sortedRowModel is orphaned and never runs
-const features = tableFeatures({ rowPaginationFeature })
-const table = useTable({
-  features,
-  rowModels: {
-    sortedRowModel: createSortedRowModel(sortFns), // no-op
-    paginatedRowModel: createPaginatedRowModel(),
-  },
-  columns,
-  data,
+const features = tableFeatures({
+  rowPaginationFeature,
+  sortedRowModel: createSortedRowModel(), // no-op without rowSortingFeature
+  paginatedRowModel: createPaginatedRowModel(),
+  sortFns,
 })
+const table = useTable({ features, columns, data })
 ```
 
 Correct:
 
 ```ts
-const features = tableFeatures({ rowSortingFeature, rowPaginationFeature })
-const table = useTable({
-  features,
-  rowModels: {
-    sortedRowModel: createSortedRowModel(sortFns),
-    paginatedRowModel: createPaginatedRowModel(),
-  },
-  columns,
-  data,
+const features = tableFeatures({
+  rowSortingFeature,
+  rowPaginationFeature,
+  sortedRowModel: createSortedRowModel(),
+  paginatedRowModel: createPaginatedRowModel(),
+  sortFns,
 })
+const table = useTable({ features, columns, data })
 ```
 
 Row-model factories only run if their matching feature is in `features`. Runtime silently degrades.
@@ -322,12 +314,12 @@ const sortedData = useMemo(() => [...data].sort((a, b) => /* …custom… */), [
 Correct:
 
 ```ts
-const table = useTable({
-  features: tableFeatures({ rowSortingFeature }),
-  rowModels: { sortedRowModel: createSortedRowModel(sortFns) },
-  columns,
-  data,
+const features = tableFeatures({
+  rowSortingFeature,
+  sortedRowModel: createSortedRowModel(),
+  sortFns,
 })
+const table = useTable({ features, columns, data })
 // then: table.setSorting(...), column.toggleSorting(), header.getToggleSortingHandler()
 ```
 
@@ -368,7 +360,6 @@ Wrong:
 // ❌ Fresh [] each render — infinite loop when items is undefined
 const table = useTable({
   features,
-  rowModels: {},
   columns,
   data: items ?? [],
 })
@@ -382,7 +373,6 @@ const EMPTY: Person[] = []
 
 const table = useTable({
   features,
-  rowModels: {},
   columns,
   data: items ?? EMPTY,
 })

package/skills/sorting/SKILL.md

@@ -2,7 +2,7 @@
 name: sorting
 description: >
   Sort rows in TanStack Table v9 with the `sortedRowModel` stage. Covers
-  `rowSortingFeature` + `createSortedRowModel(sortFns)`, the built-in `sortFns`
+  `rowSortingFeature` + `createSortedRowModel()` (registered on `features`), the built-in `sortFns`
   registry (renamed from v8 `sortingFns`), `state.sorting` (SortingState =
   Array<{ id, desc }>), `onSortingChange`, `columnDef.sortFn`
   (string | function | 'auto'), `sortDescFirst`, `sortUndefined`
@@ -47,7 +47,11 @@ type Person = {
   status: 'single' | 'complicated' | 'relationship'
 }
 
-const features = tableFeatures({ rowSortingFeature })
+const features = tableFeatures({
+  rowSortingFeature,
+  sortedRowModel: createSortedRowModel(),
+  sortFns,
+})
 const columnHelper = createColumnHelper<typeof features, Person>()
 
 const columns = columnHelper.columns([
@@ -61,9 +65,6 @@ const columns = columnHelper.columns([
 
 const table = constructTable({
   features,
-  rowModels: {
-    sortedRowModel: createSortedRowModel(sortFns),
-  },
   columns,
   data,
   initialState: { sorting: [] satisfies SortingState },
@@ -143,7 +144,7 @@ const { data } = useQuery({
 
 const table = useTable({
   features: tableFeatures({ rowSortingFeature }),
-  rowModels: {}, // omit sortedRowModel — server sorts
+  // omit sortedRowModel from features — server sorts
   columns,
   data,
   manualSorting: true,
@@ -175,20 +176,19 @@ columnHelper.accessor('firstName', {
   sortFn: 'alphanumeric',
 })
 
-const table = useTable({
-  features: tableFeatures({ rowSortingFeature }),
-  rowModels: {
-    sortedRowModel: createSortedRowModel({
-      ...sortFns,
-      myCustom: (a, b, id) => a.original[id] - b.original[id],
-    }),
+const features = tableFeatures({
+  rowSortingFeature,
+  sortedRowModel: createSortedRowModel(),
+  sortFns: {
+    ...sortFns,
+    myCustom: (a, b, id) => a.original[id] - b.original[id],
   },
-  columns,
-  data,
 })
+
+const table = useTable({ features, columns, data })
 ```
 
-v9 renamed `columnDef.sortingFn → sortFn`, `tableOptions.sortingFns → sortFns`, exported registry `sortingFns → sortFns`. The new column option defaults to `'auto'` and falls back to `sortFn_basic` when lookup misses — wrong names sort wrong, silently.
+v9 renamed `columnDef.sortingFn → sortFn`, the fn registry slot `sortingFns → sortFns` (now registered on `features`), exported registry `sortingFns → sortFns`. The new column option defaults to `'auto'` and falls back to `sortFn_basic` when lookup misses — wrong names sort wrong, silently.
 
 Source: packages/table-core/src/features/row-sorting/rowSortingFeature.utils.ts
 
@@ -326,12 +326,12 @@ const sortedData = useMemo(
 Correct:
 
 ```ts
-const table = useTable({
-  features: tableFeatures({ rowSortingFeature }),
-  rowModels: { sortedRowModel: createSortedRowModel(sortFns) },
-  columns,
-  data,
+const features = tableFeatures({
+  rowSortingFeature,
+  sortedRowModel: createSortedRowModel(),
+  sortFns,
 })
+const table = useTable({ features, columns, data })
 // table.setSorting(...), column.toggleSorting(), header.getToggleSortingHandler()
 ```
 

package/skills/state-management/SKILL.md

@@ -36,14 +36,16 @@ import {
   sortFns,
 } from '@tanstack/table-core'
 
-const features = tableFeatures({ rowSortingFeature, rowPaginationFeature })
+const features = tableFeatures({
+  rowSortingFeature,
+  rowPaginationFeature,
+  sortedRowModel: createSortedRowModel(),
+  paginatedRowModel: createPaginatedRowModel(),
+  sortFns,
+})
 
 const table = constructTable({
   features,
-  rowModels: {
-    sortedRowModel: createSortedRowModel(sortFns),
-    paginatedRowModel: createPaginatedRowModel(),
-  },
   columns,
   data,
   // 1. initialState — set starting values; read once at construction
@@ -79,7 +81,6 @@ The four ownership patterns per slice:
 ```ts
 const table = constructTable({
   features,
-  rowModels: { sortedRowModel: createSortedRowModel(sortFns) },
   columns,
   data,
   initialState: { sorting: [{ id: 'age', desc: false }] },
@@ -95,7 +96,6 @@ const [sorting, setSorting] = React.useState<SortingState>([])
 
 const table = useTable({
   features,
-  rowModels: { sortedRowModel: createSortedRowModel(sortFns) },
   columns,
   data,
   state: { sorting },
@@ -119,7 +119,6 @@ function MyTable() {
 
   const table = useTable({
     features,
-    rowModels: { paginatedRowModel: createPaginatedRowModel() },
     columns,
     data,
     atoms: { pagination: paginationAtom },
@@ -146,7 +145,7 @@ const dataQuery = useQuery({
 
 const table = useTable({
   features: tableFeatures({ rowPaginationFeature }),
-  rowModels: {}, // can drop paginatedRowModel — server paginates
+  // no paginatedRowModel registered — server paginates
   columns,
   data: dataQuery.data?.rows ?? EMPTY,
   rowCount: dataQuery.data?.rowCount, // server tells the table the total
@@ -170,7 +169,9 @@ const paginationAtom = useCreateAtom<PaginationState>({ pageIndex: 0, pageSize:
 const [pagination, setPagination] = React.useState(...)
 
 const table = useTable({
-  features, rowModels: {...}, columns, data,
+  features,
+  columns,
+  data,
   state: { pagination },                  // ignored
   onPaginationChange: setPagination,
   atoms: { pagination: paginationAtom },  // wins
@@ -181,10 +182,15 @@ Correct:
 
 ```tsx
 // pick one ownership path per slice — here, external atoms
-const paginationAtom = useCreateAtom<PaginationState>({ pageIndex: 0, pageSize: 10 })
+const paginationAtom = useCreateAtom<PaginationState>({
+  pageIndex: 0,
+  pageSize: 10,
+})
 
 const table = useTable({
-  features, rowModels: {...}, columns, data,
+  features,
+  columns,
+  data,
   atoms: { pagination: paginationAtom },
 })
 ```
@@ -201,7 +207,6 @@ Wrong:
 const [sorting, setSorting] = React.useState<SortingState>([])
 const table = useTable({
   features,
-  rowModels: { sortedRowModel: createSortedRowModel(sortFns) },
   columns,
   data,
   state: { sorting }, // no onSortingChange
@@ -214,7 +219,6 @@ Correct:
 const [sorting, setSorting] = React.useState<SortingState>([])
 const table = useTable({
   features,
-  rowModels: { sortedRowModel: createSortedRowModel(sortFns) },
   columns,
   data,
   state: { sorting },
@@ -235,7 +239,6 @@ Wrong:
 function MyTable({ defaultSort }: { defaultSort: SortingState }) {
   const table = useTable({
     features,
-    rowModels: { sortedRowModel: createSortedRowModel(sortFns) },
     columns,
     data,
     initialState: { sorting: defaultSort }, // later changes never sync
@@ -250,7 +253,6 @@ function MyTable({ defaultSort }: { defaultSort: SortingState }) {
   const [sorting, setSorting] = React.useState(defaultSort)
   const table = useTable({
     features,
-    rowModels: { sortedRowModel: createSortedRowModel(sortFns) },
     columns,
     data,
     state: { sorting },
@@ -268,8 +270,16 @@ Source: docs/framework/vanilla/guide/table-state.md; docs/framework/react/guide/
 Wrong:
 
 ```ts
-const paginationAtom = useCreateAtom<PaginationState>({ pageIndex: 0, pageSize: 10 })
-const table = useTable({ features, rowModels: {...}, columns, data, atoms: { pagination: paginationAtom } })
+const paginationAtom = useCreateAtom<PaginationState>({
+  pageIndex: 0,
+  pageSize: 10,
+})
+const table = useTable({
+  features,
+  columns,
+  data,
+  atoms: { pagination: paginationAtom },
+})
 
 table.baseAtoms.pagination.set((old) => ({ ...old, pageIndex: 0 }))
 // baseAtom updated, but table.atoms.pagination still reads from paginationAtom
@@ -298,9 +308,9 @@ const dataQuery = useQuery({
   queryKey: ['data', pagination],
   queryFn: fetchPage,
 })
+// features has paginatedRowModel registered
 const table = useTable({
   features,
-  rowModels: { paginatedRowModel: createPaginatedRowModel() },
   columns,
   data: dataQuery.data?.rows ?? [],
   rowCount: dataQuery.data?.rowCount,
@@ -312,9 +322,9 @@ const table = useTable({
 Correct:
 
 ```tsx
+// Use features WITHOUT paginatedRowModel for fully server-side pagination
 const table = useTable({
-  features,
-  rowModels: {}, // drop paginatedRowModel if fully server-side
+  features: tableFeatures({ rowPaginationFeature }),
   columns,
   data: dataQuery.data?.rows ?? [],
   rowCount: dataQuery.data?.rowCount,
@@ -335,7 +345,9 @@ Wrong:
 // external atom keeps its current value; only baseAtoms reset
 const sortingAtom = useCreateAtom<SortingState>([])
 const table = useTable({
-  features, rowModels: {...}, columns, data,
+  features,
+  columns,
+  data,
   atoms: { sorting: sortingAtom },
 })
 table.reset() // sortingAtom is NOT cleared
@@ -369,8 +381,11 @@ Correct:
 
 ```ts
 const table = useTable({
-  features: tableFeatures({ rowSortingFeature }),
-  rowModels: { sortedRowModel: createSortedRowModel(sortFns) },
+  features: tableFeatures({
+    rowSortingFeature,
+    sortedRowModel: createSortedRowModel(),
+    sortFns,
+  }),
   columns,
   data,
 })
@@ -383,6 +398,6 @@ Source: maintainer interview (Phase 4, 2026-05-17)
 
 ## See also
 
-- `tanstack-table/setup` — how `features` and `rowModels` are wired
+- `tanstack-table/setup` — how `features` (with row model factory and fn slots) is wired
 - `tanstack-table/pagination`, `tanstack-table/sorting`, `tanstack-table/filtering` — feature-specific `manual*` and reset semantics
 - `tanstack-table/migrate-v8-to-v9` — `table.getState()` → `table.store.state` / `table.atoms.<slice>.get()`

package/src/core/cells/coreCellsFeature.ts

@@ -4,46 +4,24 @@ import {
   cell_getValue,
   cell_renderValue,
 } from './coreCellsFeature.utils'
-import type { RowData } from '../../types/type-utils'
-import type { TableFeature, TableFeatures } from '../../types/TableFeatures'
-// import type { Cell_Cell, TableOptions_Cell } from './coreCellsFeature.types'
-
-export interface CoreCellsFeatureConstructors<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
-> {
-  // Cell: Cell_Cell<TableFeatures, RowData>
-  // TableOptions: TableOptions_Cell
-}
+import type { TableFeature } from '../../types/TableFeatures'
 
 /**
- * Creates the stock core cells feature.
- *
- * The returned feature registers its state defaults, option defaults, and instance APIs so it can be included in a `tableFeatures({ ... })` call.
+ * Core feature that adds cell value, render, and context APIs.
  */
-export function constructCoreCellsFeature<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
->(): TableFeature<CoreCellsFeatureConstructors<TFeatures, TData>> {
-  return {
-    assignCellPrototype: (prototype, table) => {
-      assignPrototypeAPIs('coreCellsFeature', prototype, table, {
-        cell_getValue: {
-          fn: (cell) => cell_getValue(cell),
-        },
-        cell_renderValue: {
-          fn: (cell) => cell_renderValue(cell),
-        },
-        cell_getContext: {
-          fn: (cell) => cell_getContext(cell),
-          memoDeps: (cell) => [cell],
-        },
-      })
-    },
-  }
+export const coreCellsFeature: TableFeature = {
+  assignCellPrototype: (prototype, table) => {
+    assignPrototypeAPIs('coreCellsFeature', prototype, table, {
+      cell_getValue: {
+        fn: (cell) => cell_getValue(cell),
+      },
+      cell_renderValue: {
+        fn: (cell) => cell_renderValue(cell),
+      },
+      cell_getContext: {
+        fn: (cell) => cell_getContext(cell),
+        memoDeps: (cell) => [cell],
+      },
+    })
+  },
 }
-
-/**
- * The Core Cells feature provides the core cell functionality.
- */
-export const coreCellsFeature = constructCoreCellsFeature()

package/src/core/cells/coreCellsFeature.types.ts

@@ -6,8 +6,8 @@ import type { Cell } from '../../types/Cell'
 import type { Column } from '../../types/Column'
 
 export interface CellContext<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
   TValue extends CellData = CellData,
 > {
   cell: Cell<TFeatures, TData, TValue>
@@ -19,8 +19,8 @@ export interface CellContext<
 }
 
 export interface Cell_CoreProperties<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
   TValue extends CellData = CellData,
 > {
   /**
@@ -42,8 +42,8 @@ export interface Cell_CoreProperties<
 }
 
 export interface Cell_Cell<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
   TValue extends CellData = CellData,
 > extends Cell_CoreProperties<TFeatures, TData, TValue> {
   /**

package/src/core/columns/constructColumn.ts

@@ -115,5 +115,11 @@ export function constructColumn<
   column.id = `${String(id)}`
   column.parent = parent
 
+  // Initialize instance-specific data for features that need it
+  const features = Object.values(table._features)
+  for (let i = 0; i < features.length; i++) {
+    features[i]!.initColumnInstanceData?.(column)
+  }
+
   return column as Column<TFeatures, TData, TValue>
 }