@tanstack/table-core 9.0.0-beta.1 → 9.0.0-beta.11

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/coreColumnsFeature.ts

@@ -10,91 +10,64 @@ import {
   table_getColumn,
   table_getDefaultColumnDef,
 } from './coreColumnsFeature.utils'
-import type { RowData } from '../../types/type-utils'
-import type { TableFeature, TableFeatures } from '../../types/TableFeatures'
-// import type {
-//   Column_Column,
-//   TableOptions_Columns,
-//   Table_Columns,
-// } from './coreColumnsFeature.types'
-
-export interface CoreColumnsFeatureConstructors<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
-> {
-  // Column: Column_Column<TFeatures, TData>
-  // Table: Table_Columns<TFeatures, TData>
-  // TableOptions: TableOptions_Columns<TFeatures, TData>
-}
+import type { TableFeature } from '../../types/TableFeatures'
 
 /**
- * Creates the stock core columns 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 builds the column tree and exposes table/column column APIs.
  */
-export function constructCoreColumnsFeature<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
->(): TableFeature<CoreColumnsFeatureConstructors<TFeatures, TData>> {
-  return {
-    assignColumnPrototype: (prototype, table) => {
-      assignPrototypeAPIs('coreColumnsFeature', prototype, table, {
-        column_getFlatColumns: {
-          fn: (column) => column_getFlatColumns(column),
-          memoDeps: (column) => [column.table.options.columns],
-        },
-        column_getLeafColumns: {
-          fn: (column) => column_getLeafColumns(column),
-          memoDeps: (column) => [
-            column.table.atoms.columnOrder?.get(),
-            column.table.atoms.grouping?.get(),
-            column.table.options.columns,
-            column.table.options.groupedColumnMode,
-          ],
-        },
-      })
-    },
+export const coreColumnsFeature: TableFeature = {
+  assignColumnPrototype: (prototype, table) => {
+    assignPrototypeAPIs('coreColumnsFeature', prototype, table, {
+      column_getFlatColumns: {
+        fn: (column) => column_getFlatColumns(column),
+        memoDeps: (column) => [column.table.options.columns],
+      },
+      column_getLeafColumns: {
+        fn: (column) => column_getLeafColumns(column),
+        memoDeps: (column) => [
+          column.table.atoms.columnOrder?.get(),
+          column.table.atoms.grouping?.get(),
+          column.table.options.columns,
+          column.table.options.groupedColumnMode,
+        ],
+      },
+    })
+  },
 
-    constructTableAPIs: (table) => {
-      assignTableAPIs('coreColumnsFeature', table, {
-        table_getDefaultColumnDef: {
-          fn: () => table_getDefaultColumnDef(table),
-          memoDeps: () => [table.options.defaultColumn],
-        },
-        table_getAllColumns: {
-          fn: () => table_getAllColumns(table),
-          memoDeps: () => [table.options.columns],
-        },
-        table_getAllFlatColumns: {
-          fn: () => table_getAllFlatColumns(table),
-          memoDeps: () => [table.options.columns],
-        },
-        table_getAllFlatColumnsById: {
-          fn: () => table_getAllFlatColumnsById(table),
-          memoDeps: () => [table.options.columns],
-        },
-        table_getAllLeafColumns: {
-          fn: () => table_getAllLeafColumns(table),
-          memoDeps: () => [
-            table.atoms.columnOrder?.get(),
-            table.atoms.grouping?.get(),
-            table.options.columns,
-            table.options.groupedColumnMode,
-          ],
-        },
-        table_getAllLeafColumnsById: {
-          fn: () => table_getAllLeafColumnsById(table),
-          memoDeps: () => [table.getAllLeafColumns()],
-        },
-        table_getColumn: {
-          fn: (columnId) => table_getColumn(table, columnId),
-        },
-      })
-    },
-  }
+  constructTableAPIs: (table) => {
+    assignTableAPIs('coreColumnsFeature', table, {
+      table_getDefaultColumnDef: {
+        fn: () => table_getDefaultColumnDef(table),
+        memoDeps: () => [table.options.defaultColumn],
+      },
+      table_getAllColumns: {
+        fn: () => table_getAllColumns(table),
+        memoDeps: () => [table.options.columns],
+      },
+      table_getAllFlatColumns: {
+        fn: () => table_getAllFlatColumns(table),
+        memoDeps: () => [table.options.columns],
+      },
+      table_getAllFlatColumnsById: {
+        fn: () => table_getAllFlatColumnsById(table),
+        memoDeps: () => [table.options.columns],
+      },
+      table_getAllLeafColumns: {
+        fn: () => table_getAllLeafColumns(table),
+        memoDeps: () => [
+          table.atoms.columnOrder?.get(),
+          table.atoms.grouping?.get(),
+          table.options.columns,
+          table.options.groupedColumnMode,
+        ],
+      },
+      table_getAllLeafColumnsById: {
+        fn: () => table_getAllLeafColumnsById(table),
+        memoDeps: () => [table.getAllLeafColumns()],
+      },
+      table_getColumn: {
+        fn: (columnId) => table_getColumn(table, columnId),
+      },
+    })
+  },
 }
-
-/**
- * The Core Columns feature provides the core column functionality.
- */
-export const coreColumnsFeature = constructCoreColumnsFeature()

package/src/core/columns/coreColumnsFeature.types.ts

@@ -5,8 +5,8 @@ import type { AccessorFn, ColumnDef } from '../../types/ColumnDef'
 import type { Column } from '../../types/Column'
 
 export interface Column_CoreProperties<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
   TValue extends CellData = CellData,
 > {
   /**
@@ -43,8 +43,8 @@ export interface Column_CoreProperties<
 }
 
 export interface Column_Column<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
   TValue extends CellData = CellData,
 > extends Column_CoreProperties<TFeatures, TData, TValue> {
   /**
@@ -59,8 +59,8 @@ export interface Column_Column<
 }
 
 export interface TableOptions_Columns<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
   TValue extends CellData = CellData,
 > {
   /**
@@ -74,8 +74,8 @@ export interface TableOptions_Columns<
 }
 
 export interface Table_Columns<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
 > {
   /**
    * Returns a map of all flat columns by their ID.

package/src/core/coreFeatures.ts

@@ -7,7 +7,7 @@ import { coreTablesFeature } from './table/coreTablesFeature'
 import type { TableReactivityBindings } from '../reactivity'
 
 export interface CoreFeatures {
-  coreReativityFeature?: TableReactivityBindings
+  coreReactivityFeature?: TableReactivityBindings
   coreCellsFeature: typeof coreCellsFeature
   coreColumnsFeature: typeof coreColumnsFeature
   coreHeadersFeature: typeof coreHeadersFeature

package/src/core/headers/buildHeaderGroups.ts

@@ -60,7 +60,7 @@ export function buildHeaderGroups<
       depth,
       id: [headerFamily, `${depth}`].filter(Boolean).join('_'),
       headers: [],
-    } as any
+    }
 
     // The parent columns we're going to scan next
     const pendingParentHeaders: Array<Header<TFeatures, TData, TValue>> = []

package/src/core/headers/coreHeadersFeature.ts

@@ -7,72 +7,50 @@ import {
   table_getHeaderGroups,
   table_getLeafHeaders,
 } from './coreHeadersFeature.utils'
-import type { RowData } from '../../types/type-utils'
-import type { TableFeature, TableFeatures } from '../../types/TableFeatures'
-// import type { Header_Header, Table_Headers } from './coreHeadersFeature.types'
-
-export interface CoreHeadersFeatureConstructors<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
-> {
-  // Header: Header_Header<TFeatures, TData>
-  // Table: Table_Headers<TFeatures, TData>
-}
+import type { TableFeature } from '../../types/TableFeatures'
 
 /**
- * Creates the stock core headers 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 builds header groups and exposes header context APIs.
  */
-export function constructCoreHeadersFeature<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
->(): TableFeature<CoreHeadersFeatureConstructors<TFeatures, TData>> {
-  return {
-    assignHeaderPrototype: (prototype, table) => {
-      assignPrototypeAPIs('coreHeadersFeature', prototype, table, {
-        header_getLeafHeaders: {
-          fn: (header) => header_getLeafHeaders(header),
-          memoDeps: (header) => [header.column.table.options.columns],
-        },
-        header_getContext: {
-          fn: (header) => header_getContext(header),
-          memoDeps: (header) => [header.column.table.options.columns],
-        },
-      })
-    },
+export const coreHeadersFeature: TableFeature = {
+  assignHeaderPrototype: (prototype, table) => {
+    assignPrototypeAPIs('coreHeadersFeature', prototype, table, {
+      header_getLeafHeaders: {
+        fn: (header) => header_getLeafHeaders(header),
+        memoDeps: (header) => [header.column.table.options.columns],
+      },
+      header_getContext: {
+        fn: (header) => header_getContext(header),
+        memoDeps: (header) => [header.column.table.options.columns],
+      },
+    })
+  },
 
-    constructTableAPIs: (table) => {
-      assignTableAPIs('coreHeadersFeature', table, {
-        table_getHeaderGroups: {
-          fn: () => table_getHeaderGroups(table),
-          memoDeps: () => [
-            table.options.columns,
-            table.atoms.columnOrder?.get(),
-            table.atoms.grouping?.get(),
-            table.atoms.columnPinning?.get(),
-            table.atoms.columnVisibility?.get(),
-            table.options.groupedColumnMode,
-          ],
-        },
-        table_getFooterGroups: {
-          fn: () => table_getFooterGroups(table),
-          memoDeps: () => [table.getHeaderGroups()],
-        },
-        table_getFlatHeaders: {
-          fn: () => table_getFlatHeaders(table),
-          memoDeps: () => [table.getHeaderGroups()],
-        },
-        table_getLeafHeaders: {
-          fn: () => table_getLeafHeaders(table),
-          memoDeps: () => [table.getHeaderGroups()],
-        },
-      })
-    },
-  }
+  constructTableAPIs: (table) => {
+    assignTableAPIs('coreHeadersFeature', table, {
+      table_getHeaderGroups: {
+        fn: () => table_getHeaderGroups(table),
+        memoDeps: () => [
+          table.options.columns,
+          table.atoms.columnOrder?.get(),
+          table.atoms.grouping?.get(),
+          table.atoms.columnPinning?.get(),
+          table.atoms.columnVisibility?.get(),
+          table.options.groupedColumnMode,
+        ],
+      },
+      table_getFooterGroups: {
+        fn: () => table_getFooterGroups(table),
+        memoDeps: () => [table.getHeaderGroups()],
+      },
+      table_getFlatHeaders: {
+        fn: () => table_getFlatHeaders(table),
+        memoDeps: () => [table.getHeaderGroups()],
+      },
+      table_getLeafHeaders: {
+        fn: () => table_getLeafHeaders(table),
+        memoDeps: () => [table.getHeaderGroups()],
+      },
+    })
+  },
 }
-
-/**
- * The Core Headers feature provides the core header functionality.
- */
-export const coreHeadersFeature = constructCoreHeadersFeature()

package/src/core/headers/coreHeadersFeature.types.ts

@@ -6,8 +6,8 @@ import type { HeaderGroup } from '../../types/HeaderGroup'
 import type { Column } from '../../types/Column'
 
 export interface Table_Headers<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
 > {
   /**
    * Builds the visible header groups for the current column tree, visibility,
@@ -30,8 +30,8 @@ export interface Table_Headers<
 }
 
 export interface HeaderContext<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
   TValue extends CellData = CellData,
 > {
   /**
@@ -49,8 +49,8 @@ export interface HeaderContext<
 }
 
 export interface Header_CoreProperties<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
   TValue extends CellData = CellData,
 > {
   /**
@@ -100,8 +100,8 @@ export interface Header_CoreProperties<
 }
 
 export interface Header_Header<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
   TValue extends CellData = CellData,
 > extends Header_CoreProperties<TFeatures, TData, TValue> {
   /**
@@ -115,8 +115,8 @@ export interface Header_Header<
 }
 
 export interface HeaderGroup_Header<
-  TFeatures extends TableFeatures,
-  TData extends RowData,
+  in out TFeatures extends TableFeatures,
+  in out TData extends RowData,
   TValue extends CellData = CellData,
 > {
   depth: number

package/src/core/headers/coreHeadersFeature.utils.ts

@@ -86,7 +86,7 @@ export function table_getHeaderGroups<
     table,
     'getVisibleLeafColumns',
     table_getVisibleLeafColumns,
-  ) as Array<Column<TFeatures, TData, unknown>>
+  )
 
   // Fast path: no columns are pinned — skip per-side lookups, partition, and spread.
   if (!left.length && !right.length) {