You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/framework/angular/guide/migrating.md
+48-4Lines changed: 48 additions & 4 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,14 +2,18 @@
2
2
title: Migrating to TanStack Table v9 (Angular)
3
3
---
4
4
5
+
> [!NOTE]
6
+
> `v9.0.0-beta.10` introduces a breaking change in how row models are defined in order to bring increased type-safety features. Row model factories and function registries now live as slots on the `features` object instead of a separate `rowModels` option, and the factories no longer take arguments. If you migrated on an earlier beta, see the [Row Model Factories](#row-model-factories) section below for the new shape.
7
+
5
8
## What's New in TanStack Table v9
6
9
7
10
TanStack Table v9 is a major release that introduces significant architectural improvements while maintaining the core table logic you're familiar with. Here are the key changes:
8
11
9
-
### 1. Tree-shaking
12
+
### 1. Tree Shaking and Extensibility
10
13
11
14
-**Features are tree-shakeable**: Features are now treated as plugins: import only what you use. If your table only needs sorting, you won't ship filtering, pagination, or other feature code. Bundlers can eliminate unused code, so for smaller tables you can expect a meaningfully smaller bundle compared to v8. This also lets TanStack Table add features over time without bloating everyone's bundles.
12
-
-**Row models and their functions are refactored**: Row model factories (`createFilteredRowModel`, `createSortedRowModel`, etc.) now accept their processing functions (`filterFns`, `sortFns`, `aggregationFns`) as parameters. This enables tree-shaking of the functions themselves: if you use a custom filter, you don't pay for built-in filters you never use.
15
+
-**Row models and their functions are refactored**: Row model factories (`createFilteredRowModel`, `createSortedRowModel`, etc.) are now slots on the `features` object, and their processing functions (`filterFns`, `sortFns`, `aggregationFns`) are registered as their own feature slots. This enables tree-shaking of the functions themselves: if you only register a custom filter, you don't pay for built-in filters you never use.
16
+
-**Custom feature plugins with full type safety**: The same plugin architecture that powers the built-in features is open to your own code. Write a custom feature with its own state, options, and APIs, register it in `tableFeatures()` alongside the built-ins, and the table's types pick it all up automatically. See the [Custom Features Guide](./custom-features.md).
13
17
14
18
### 2. State Management
15
19
@@ -21,6 +25,12 @@ TanStack Table v9 is a major release that introduces significant architectural i
21
25
-**`tableOptions`**: New utilities let you compose and share table configurations. Define `features` (including row model factories) and default options once, then reuse them across tables or pass them through `createTableHook`.
22
26
-**`createTableHook`** (optional, advanced): Create reusable, strongly typed Angular table factories with pre-bound features, row models, default options, and component registries.
23
27
28
+
### 4. Improved Type Safety (No More Declaration Merging)
29
+
30
+
-**Function registries replace `declare module` augmentation**: Custom filter, sort, and aggregation functions are registered by name in the `filterFns` / `sortFns` / `aggregationFns` slots on `tableFeatures()`. The registered keys become the valid, type-safe string values for `filterFn`, `sortFn`, `globalFilterFn`, and `aggregationFn` in your column definitions, with full inference. No more augmenting the `FilterFns` / `SortFns` / `AggregationFns` interfaces globally.
31
+
-**Per-table meta slots**: The type-only `tableMeta`, `columnMeta`, and `filterMeta` slots declare meta types for a single table instead of merging into a global interface. The `filterMeta` slot types both the `addMeta` callback in filter functions and the values read back from `row.columnFiltersMeta`.
32
+
-**Feature-gated APIs and validated prerequisites**: APIs like `table.setSorting` only exist on the table type when their feature is registered, and `tableFeatures()` validates slot prerequisites at the type level. Registering `sortFns` without `rowSortingFeature`, or `globalFilteringFeature` without `columnFilteringFeature`, is a typed error instead of a silent runtime no-op.
33
+
24
34
### The Good News: Most Upgrades Are Opt-in
25
35
26
36
While v9 is a significant upgrade, **you don't have to adopt everything at once**:
@@ -213,7 +223,7 @@ class TableCmp {
213
223
```ts
214
224
// v8
215
225
import {
216
-
injectTable,
226
+
createAngularTable,
217
227
getCoreRowModel,
218
228
getFilteredRowModel,
219
229
getSortedRowModel,
@@ -552,7 +562,7 @@ const featureOptions = tableOptions({ features })
// Another partial (inherits features from spread)
558
568
const paginationDefaults =tableOptions({
@@ -733,6 +743,39 @@ const features = tableFeatures({
733
743
734
744
See the new [Table and Column Meta Guide](../../../guide/table-and-column-meta) for full details on both approaches.
735
745
746
+
### `FilterFns`/`SortFns`/`AggregationFns`/`FilterMeta` Augmentation Replaced by Registry Slots
747
+
748
+
In v8, making a custom function usable as a string reference (like `filterFn: 'fuzzy'`) required `declare module` augmentation of the `FilterFns` interface, and typing filter meta required augmenting `FilterMeta`. In v9, registering the function in the matching registry slot does both jobs with no global augmentation:
749
+
750
+
```ts
751
+
// v8
752
+
declaremodule'@tanstack/angular-table' {
753
+
interfaceFilterFns {
754
+
fuzzy:FilterFn<unknown>
755
+
}
756
+
interfaceFilterMeta {
757
+
itemRank:RankingInfo
758
+
}
759
+
}
760
+
761
+
// v9 - register in the slot; the key becomes a valid string value
762
+
interfaceFuzzyFilterMeta {
763
+
itemRank?:RankingInfo
764
+
}
765
+
766
+
const features =tableFeatures({
767
+
columnFilteringFeature,
768
+
filteredRowModel: createFilteredRowModel(),
769
+
filterFns: { ...filterFns, fuzzy: fuzzyFilter },
770
+
filterMeta: metaHelper<FuzzyFilterMeta>(),
771
+
})
772
+
773
+
// 'fuzzy' now typechecks in column defs for tables using these features
The same pattern applies to `sortFns` (for `sortFn` string values) and `aggregationFns` (for `aggregationFn` string values). See the [Fuzzy Filtering Guide](./fuzzy-filtering.md) for a complete example.
778
+
736
779
### `RowData` Type Restriction
737
780
738
781
The `RowData` type is now more restrictive:
@@ -754,6 +797,7 @@ This change improves type safety. If you were passing unusual data types, ensure
754
797
- [ ] Update your table setup to v9 and define `features` using `tableFeatures()` (or use `stockFeatures`)
755
798
- [ ] Migrate `get*RowModel()` options: move row model factories into `tableFeatures` as named slots
756
799
- [ ] Move `filterFns`, `sortFns`, and `aggregationFns` into `tableFeatures` as named slots (no longer passed as factory arguments)
800
+
- [ ] Replace `declaremodule` augmentation of `FilterFns`/`SortFns`/`AggregationFns` with registry-slot registration, and `FilterMeta` augmentation with the `filterMeta` slot
757
801
- [ ] Update TypeScript types to include `TFeatures` generic
758
802
- [ ] Update state access: `table.getState().slice` → `table.atoms.<slice>.get()` where possible; use `table.store.get()` for full-state/debug reads
Copy file name to clipboardExpand all lines: docs/framework/lit/guide/migrating.md
+45-1Lines changed: 45 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,17 +2,21 @@
2
2
title: Migrating to TanStack Table v9 (Lit)
3
3
---
4
4
5
+
> [!NOTE]
6
+
> `v9.0.0-beta.10` introduces a breaking change in how row models are defined in order to bring increased type-safety features. Row model factories and function registries now live as slots on the `features` object instead of a separate `rowModels` option, and the factories no longer take arguments. If you migrated on an earlier beta, see the [Row Model and Function Registry Migration](#row-model-and-function-registry-migration) section below for the new shape.
7
+
5
8
## What's New in TanStack Table v9
6
9
7
10
TanStack Table v9 is a major release with explicit feature registration, row model registration, and a new atom-backed state model. The Lit adapter wraps those APIs in a `ReactiveController`.
8
11
9
12
> The Lit adapter may change during the v9 beta cycle. This guide documents the current local v9 API and avoids speculating about future beta changes.
10
13
11
-
### 1. Tree-shaking
14
+
### 1. Tree Shaking and Extensibility
12
15
13
16
-**Features are tree-shakeable**: register only the table features you use.
14
17
-**Row models are slots on features**: row model factories and function registries are slots on the `tableFeatures({...})` call instead of a separate `rowModels` option.
15
18
-**Function registries are feature slots**: `sortFns`, `filterFns`, and `aggregationFns` are registered on `tableFeatures` alongside the row model factories.
19
+
-**Custom feature plugins with full type safety**: The same plugin architecture that powers the built-in features is open to your own code. Write a custom feature with its own state, options, and APIs, register it in `tableFeatures()` alongside the built-ins, and the table's types pick it all up automatically. See the [Custom Features Guide](./custom-features.md).
16
20
17
21
### 2. State Management
18
22
@@ -26,6 +30,12 @@ TanStack Table v9 is a major release with explicit feature registration, row mod
-**`createTableHook()`**: define shared Lit table factories with pre-bound features, row models, defaults, and render helpers.
28
32
33
+
### 4. Improved Type Safety (No More Declaration Merging)
34
+
35
+
-**Function registries replace `declare module` augmentation**: Custom filter, sort, and aggregation functions are registered by name in the `filterFns` / `sortFns` / `aggregationFns` slots on `tableFeatures()`. The registered keys become the valid, type-safe string values for `filterFn`, `sortFn`, `globalFilterFn`, and `aggregationFn` in your column definitions, with full inference. No more augmenting the `FilterFns` / `SortFns` / `AggregationFns` interfaces globally.
36
+
-**Per-table meta slots**: The type-only `tableMeta`, `columnMeta`, and `filterMeta` slots declare meta types for a single table instead of merging into a global interface. The `filterMeta` slot types both the `addMeta` callback in filter functions and the values read back from `row.columnFiltersMeta`.
37
+
-**Feature-gated APIs and validated prerequisites**: APIs like `table.setSorting` only exist on the table type when their feature is registered, and `tableFeatures()` validates slot prerequisites at the type level. Registering `sortFns` without `rowSortingFeature`, or `globalFilteringFeature` without `columnFilteringFeature`, is a typed error instead of a silent runtime no-op.
38
+
29
39
### The Good News: Most Table Logic Is Still Familiar
30
40
31
41
- Column definitions keep the same basic `accessorKey`, `accessorFn`, `header`, `cell`, and `footer` shapes.
@@ -600,6 +610,39 @@ const features = tableFeatures({
600
610
601
611
See the new [Table and Column Meta Guide](../../../guide/table-and-column-meta) for full details on both approaches.
602
612
613
+
### `FilterFns`/`SortFns`/`AggregationFns`/`FilterMeta` Augmentation Replaced by Registry Slots
614
+
615
+
In v8, making a custom function usable as a string reference (like `filterFn: 'fuzzy'`) required `declare module` augmentation of the `FilterFns` interface, and typing filter meta required augmenting `FilterMeta`. In v9, registering the function in the matching registry slot does both jobs with no global augmentation:
616
+
617
+
```ts
618
+
// v8
619
+
declaremodule'@tanstack/lit-table' {
620
+
interfaceFilterFns {
621
+
fuzzy:FilterFn<unknown>
622
+
}
623
+
interfaceFilterMeta {
624
+
itemRank:RankingInfo
625
+
}
626
+
}
627
+
628
+
// v9 - register in the slot; the key becomes a valid string value
629
+
interfaceFuzzyFilterMeta {
630
+
itemRank?:RankingInfo
631
+
}
632
+
633
+
const features =tableFeatures({
634
+
columnFilteringFeature,
635
+
filteredRowModel: createFilteredRowModel(),
636
+
filterFns: { ...filterFns, fuzzy: fuzzyFilter },
637
+
filterMeta: metaHelper<FuzzyFilterMeta>(),
638
+
})
639
+
640
+
// 'fuzzy' now typechecks in column defs for tables using these features
The same pattern applies to `sortFns` (for `sortFn` string values) and `aggregationFns` (for `aggregationFn` string values). See the [Fuzzy Filtering Guide](./fuzzy-filtering.md) for a complete example.
645
+
603
646
### `RowData` Type Restriction
604
647
605
648
Prefer explicit object row types:
@@ -622,6 +665,7 @@ type Person = {
622
665
- [ ] Move row model factories and function registries into `tableFeatures({...})` slots (remove the separate `rowModels` option).
623
666
- [ ] Remove `getCoreRowModel`; the core row model is automatic.
624
667
- [ ] Register `sortFns`, `filterFns`, and `aggregationFns` as slots on `tableFeatures({...})` (not as factory arguments).
668
+
- [ ] Replace `declaremodule` augmentation of `FilterFns`/`SortFns`/`AggregationFns` with registry-slot registration, and `FilterMeta` augmentation with the `filterMeta` slot.
625
669
- [ ] Rename `sortingFn` to `sortFn`.
626
670
- [ ] Add `typeoffeatures` to column helpers and types.
627
671
- [ ] Replace `table.getState()` reads with `table.state`, `table.store.state`, or `table.atoms.<slice>.get()`.
Copy file name to clipboardExpand all lines: docs/framework/preact/guide/migrating.md
+45-2Lines changed: 45 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -2,15 +2,19 @@
2
2
title: Migrating to TanStack Table v9 (Preact)
3
3
---
4
4
5
+
> [!NOTE]
6
+
> `v9.0.0-beta.10` introduces a breaking change in how row models are defined in order to bring increased type-safety features. Row model factories and function registries now live as slots on the `features` object instead of a separate `rowModels` option, and the factories no longer take arguments. If you migrated on an earlier beta, see the [Row Model Factories](#row-model-factories) section below for the new shape.
7
+
5
8
## What's New in TanStack Table v9
6
9
7
10
TanStack Table v9 is a major release with a smaller, more explicit table setup. The core table logic is familiar, but the table instance now declares exactly which features, row models, and state subscriptions it needs.
8
11
9
-
### 1. Tree-shaking
12
+
### 1. Tree Shaking and Extensibility
10
13
11
14
-**Features are tree-shakeable**: features are registered explicitly. If a table only needs sorting and pagination, it does not need to ship filtering, grouping, or row selection code.
12
15
-**Row models are registered explicitly**: row model factories now live as slots on `tableFeatures({...})` instead of root `get*RowModel` options or a `rowModels` object.
13
16
-**Function registries moved to features slots**: `sortFns`, `filterFns`, and `aggregationFns` are registered as slots on `tableFeatures` alongside the row model factories. This lets unused built-in functions tree-shake.
17
+
-**Custom feature plugins with full type safety**: The same plugin architecture that powers the built-in features is open to your own code. Write a custom feature with its own state, options, and APIs, register it in `tableFeatures()` alongside the built-ins, and the table's types pick it all up automatically. See the [Custom Features Guide](./custom-features.md).
14
18
15
19
### 2. State Management
16
20
@@ -24,6 +28,12 @@ TanStack Table v9 is a major release with a smaller, more explicit table setup.
24
28
-**`tableOptions()`**: build type-safe partial table option objects that can be shared and composed.
25
29
-**`createTableHook()`**: create app-level Preact table factories with shared features, row models, defaults, and component conventions.
26
30
31
+
### 4. Improved Type Safety (No More Declaration Merging)
32
+
33
+
-**Function registries replace `declare module` augmentation**: Custom filter, sort, and aggregation functions are registered by name in the `filterFns` / `sortFns` / `aggregationFns` slots on `tableFeatures()`. The registered keys become the valid, type-safe string values for `filterFn`, `sortFn`, `globalFilterFn`, and `aggregationFn` in your column definitions, with full inference. No more augmenting the `FilterFns` / `SortFns` / `AggregationFns` interfaces globally.
34
+
-**Per-table meta slots**: The type-only `tableMeta`, `columnMeta`, and `filterMeta` slots declare meta types for a single table instead of merging into a global interface. The `filterMeta` slot types both the `addMeta` callback in filter functions and the values read back from `row.columnFiltersMeta`.
35
+
-**Feature-gated APIs and validated prerequisites**: APIs like `table.setSorting` only exist on the table type when their feature is registered, and `tableFeatures()` validates slot prerequisites at the type level. Registering `sortFns` without `rowSortingFeature`, or `globalFilteringFeature` without `columnFilteringFeature`, is a typed error instead of a silent runtime no-op.
36
+
27
37
### The Good News: Most Upgrades Are Opt-in
28
38
29
39
- You can start with `stockFeatures` while migrating, then replace it with explicit feature registration.
@@ -588,6 +598,39 @@ const features = tableFeatures({
588
598
589
599
See the new [Table and Column Meta Guide](../../../guide/table-and-column-meta) for full details on both approaches.
590
600
601
+
### `FilterFns`/`SortFns`/`AggregationFns`/`FilterMeta` Augmentation Replaced by Registry Slots
602
+
603
+
In v8, making a custom function usable as a string reference (like `filterFn: 'fuzzy'`) required `declare module` augmentation of the `FilterFns` interface, and typing filter meta required augmenting `FilterMeta`. In v9, registering the function in the matching registry slot does both jobs with no global augmentation:
604
+
605
+
```tsx
606
+
// v8 / before: React adapter through preact/compat
607
+
declaremodule'@tanstack/react-table' {
608
+
interfaceFilterFns {
609
+
fuzzy:FilterFn<unknown>
610
+
}
611
+
interfaceFilterMeta {
612
+
itemRank:RankingInfo
613
+
}
614
+
}
615
+
616
+
// v9 - register in the slot; the key becomes a valid string value
617
+
interfaceFuzzyFilterMeta {
618
+
itemRank?:RankingInfo
619
+
}
620
+
621
+
const features =tableFeatures({
622
+
columnFilteringFeature,
623
+
filteredRowModel: createFilteredRowModel(),
624
+
filterFns: { ...filterFns, fuzzy: fuzzyFilter },
625
+
filterMeta: metaHelper<FuzzyFilterMeta>(),
626
+
})
627
+
628
+
// 'fuzzy' now typechecks in column defs for tables using these features
The same pattern applies to `sortFns` (for `sortFn` string values) and `aggregationFns` (for `aggregationFn` string values). See the [Fuzzy Filtering Guide](./fuzzy-filtering.md) for a complete example.
633
+
591
634
### `RowData` Type Restriction
592
635
593
636
`RowData` is now constrained to record-like objects or arrays. Prefer object row types such as:
@@ -607,7 +650,7 @@ type Person = {
607
650
- [ ] Replace `@tanstack/react-table` imports used through `preact/compat` with `@tanstack/preact-table`.
608
651
- [ ] Replace `useReactTable` with `useTable`.
609
652
- [ ] Define `features` using `tableFeatures()` (or use `stockFeatures`).
0 commit comments