feat: refactor table store into feature atoms (#6234)

* feat: refactor table store into feature atoms

* get rid of stupid proxies because optional chaining isn't bad

* fix some legacy table stuff and update migrating guide

* subscribe with atoms refactor

* fixed vue table types

* fix more subscribe types

* simplify atom and store construction more

Author: KevinVandy

.gitignore

@@ -61,4 +61,5 @@ vite.config.ts.timestamp-*
 .cursor/*
 
 Agents.md
-.agents/*
+.agents/*
+terminalOutput

docs/config.json

@@ -811,7 +811,7 @@
             { "to": "framework/lit/examples/basic-table-controller", "label": "Basic (TableController)" },
             { "to": "framework/lit/examples/basic-app-table", "label": "Basic (useAppTable)" },
             { "to": "framework/lit/examples/basic-external-state", "label": "Basic (External State)" },
-            { "to": "framework/lit/examples/basic-external-store", "label": "Basic (External Store)" },
+            { "to": "framework/lit/examples/basic-external-atoms", "label": "Basic (External Atoms)" },
             { "to": "framework/lit/examples/column-groups", "label": "Header Groups" }
           ]
         },
@@ -822,7 +822,7 @@
             { "to": "framework/react/examples/basic-use-app-table", "label": "Basic (useAppTable)" },
             { "to": "framework/react/examples/basic-use-legacy-table", "label": "Basic (useLegacyTable)" },
             { "to": "framework/react/examples/basic-external-state", "label": "Basic (External State)" },
-            { "to": "framework/react/examples/basic-external-store", "label": "Basic (External Store)" },
+            { "to": "framework/react/examples/basic-external-atoms", "label": "Basic (External Atoms)" },
             { "to": "framework/react/examples/basic-shadcn", "label": "Shadcn Basic" },
             { "to": "framework/react/examples/column-groups", "label": "Header Groups" }
           ]
@@ -833,7 +833,7 @@
             { "to": "framework/solid/examples/basic-use-table", "label": "Basic (createTable)" },
             { "to": "framework/solid/examples/basic-app-table", "label": "Basic (createAppTable)" },
             { "to": "framework/solid/examples/basic-external-state", "label": "Basic (External State)" },
-            { "to": "framework/solid/examples/basic-external-store", "label": "Basic (External Store)" },
+            { "to": "framework/solid/examples/basic-external-atoms", "label": "Basic (External Atoms)" },
             { "to": "framework/solid/examples/column-groups", "label": "Header Groups" }
           ]
         },
@@ -844,15 +844,18 @@
             { "to": "framework/svelte/examples/basic-app-table", "label": "Basic (createAppTable)" },
             { "to": "framework/svelte/examples/basic-snippets", "label": "Basic (Snippets)" },
             { "to": "framework/svelte/examples/basic-external-state", "label": "Basic (External State)" },
-            { "to": "framework/svelte/examples/basic-external-store", "label": "Basic (External Store)" },
+            { "to": "framework/svelte/examples/basic-external-atoms", "label": "Basic (External Atoms)" },
             { "to": "framework/svelte/examples/column-groups", "label": "Header Groups" }
           ]
         },
         {
           "label": "vue",
           "children": [
-            { "to": "framework/vue/examples/basic", "label": "Basic" },
-            { "to": "framework/vue/examples/basic-use-app-table", "label": "Basic (useAppTable)" }
+            { "to": "framework/vue/examples/basic-use-table", "label": "Basic (useTable)" },
+            { "to": "framework/vue/examples/basic-use-app-table", "label": "Basic (useAppTable)" },
+            { "to": "framework/vue/examples/basic-external-state", "label": "Basic (External State)" },
+            { "to": "framework/vue/examples/basic-external-atoms", "label": "Basic (External Atoms)" },
+            { "to": "framework/vue/examples/column-groups", "label": "Header Groups" }
           ]
         },
         {
@@ -861,7 +864,7 @@
             { "to": "framework/preact/examples/basic", "label": "Basic (useTable)" },
             { "to": "framework/preact/examples/basic-use-app-table", "label": "Basic (useAppTable)" },
             { "to": "framework/preact/examples/basic-external-state", "label": "Basic (External State)" },
-            { "to": "framework/preact/examples/basic-external-store", "label": "Basic (External Store)" },
+            { "to": "framework/preact/examples/basic-external-atoms", "label": "Basic (External Atoms)" },
             { "to": "framework/preact/examples/column-groups", "label": "Header Groups" }
           ]
         },
@@ -986,13 +989,23 @@
         {
           "label": "vue",
           "children": [
+            { "to": "framework/vue/examples/filters", "label": "Column Filters" },
+            { "to": "framework/vue/examples/filters-faceted", "label": "Column Filters (Faceted)" },
+            { "to": "framework/vue/examples/filters-fuzzy", "label": "Fuzzy Search Filters" },
             { "to": "framework/vue/examples/column-ordering", "label": "Column Ordering" },
             { "to": "framework/vue/examples/column-pinning", "label": "Column Pinning" },
+            { "to": "framework/vue/examples/column-pinning-split", "label": "Column Pinning (Split)" },
+            { "to": "framework/vue/examples/column-pinning-sticky", "label": "Sticky Column Pinning" },
+            { "to": "framework/vue/examples/column-sizing", "label": "Column Sizing" },
+            { "to": "framework/vue/examples/column-resizing", "label": "Column Resizing" },
+            { "to": "framework/vue/examples/column-resizing-performant", "label": "Performant Column Resizing" },
+            { "to": "framework/vue/examples/column-visibility", "label": "Column Visibility" },
+            { "to": "framework/vue/examples/expanding", "label": "Expanding" },
+            { "to": "framework/vue/examples/grouping", "label": "Grouping" },
             { "to": "framework/vue/examples/pagination", "label": "Pagination" },
-            { "to": "framework/vue/examples/pagination-controlled", "label": "Pagination Controlled" },
+            { "to": "framework/vue/examples/row-pinning", "label": "Row Pinning" },
             { "to": "framework/vue/examples/row-selection", "label": "Row Selection" },
-            { "to": "framework/vue/examples/sorting", "label": "Sorting" },
-            { "to": "framework/vue/examples/filters", "label": "Column Filters" }
+            { "to": "framework/vue/examples/sorting", "label": "Sorting" }
           ]
         },
         {
@@ -1098,7 +1111,11 @@
           "children": [
             { "to": "framework/vue/examples/composable-tables", "label": "Composable Tables" },
             { "to": "framework/vue/examples/sub-components", "label": "Sub Components" },
-            { "to": "framework/vue/examples/virtualized-rows", "label": "With TanStack Virtual (Rows)" }
+            { "to": "framework/vue/examples/virtualized-columns", "label": "With TanStack Virtual - Columns" },
+            { "to": "framework/vue/examples/virtualized-rows", "label": "With TanStack Virtual - Rows" },
+            { "to": "framework/vue/examples/virtualized-infinite-scrolling", "label": "With TanStack Virtual - Infinite Scrolling" },
+            { "to": "framework/vue/examples/with-tanstack-form", "label": "With TanStack Form" },
+            { "to": "framework/vue/examples/with-tanstack-query", "label": "With TanStack Query" }
           ]
         },
         {

docs/framework/angular/reference/functions/injectTable.md

@@ -9,7 +9,7 @@ title: injectTable
 function injectTable<TFeatures, TData, TSelected>(options, selector): AngularTable<TFeatures, TData, TSelected>;
 ```
 
-Defined in: [injectTable.ts:104](https://github.com/TanStack/table/blob/main/packages/angular-table/src/injectTable.ts#L104)
+Defined in: [injectTable.ts:124](https://github.com/TanStack/table/blob/main/packages/angular-table/src/injectTable.ts#L124)
 
 Creates and returns an Angular-reactive table instance.
 

docs/framework/angular/reference/index.md

@@ -16,6 +16,7 @@ title: "@tanstack/angular-table"
 
 ## Interfaces
 
+- [AngularTableComputed](interfaces/AngularTableComputed.md)
 - [FlexRenderComponent](interfaces/FlexRenderComponent.md)
 - [TanStackTableCellContext](interfaces/TanStackTableCellContext.md)
 - [TanStackTableHeaderContext](interfaces/TanStackTableHeaderContext.md)

docs/framework/angular/reference/interfaces/AngularTableComputed.md

@@ -0,0 +1,132 @@
+---
+id: AngularTableComputed
+title: AngularTableComputed
+---
+
+# Interface: AngularTableComputed()\<TFeatures\>
+
+Defined in: [injectTable.ts:31](https://github.com/TanStack/table/blob/main/packages/angular-table/src/injectTable.ts#L31)
+
+Store mode: pass `selector` (required) to project from full table state.
+Atom mode: pass `atom`; omit `selector` for the whole atom (identity), or pass
+`selector` to project. Split overloads match React `Subscribe` inference.
+
+## Type Parameters
+
+### TFeatures
+
+`TFeatures` *extends* `TableFeatures`
+
+## Call Signature
+
+```ts
+AngularTableComputed<TAtomValue>(props): Signal<Readonly<TAtomValue>>;
+```
+
+Defined in: [injectTable.ts:32](https://github.com/TanStack/table/blob/main/packages/angular-table/src/injectTable.ts#L32)
+
+Store mode: pass `selector` (required) to project from full table state.
+Atom mode: pass `atom`; omit `selector` for the whole atom (identity), or pass
+`selector` to project. Split overloads match React `Subscribe` inference.
+
+### Type Parameters
+
+#### TAtomValue
+
+`TAtomValue`
+
+### Parameters
+
+#### props
+
+##### atom
+
+`Atom`\<`TAtomValue`\> \| `ReadonlyAtom`\<`TAtomValue`\>
+
+##### equal?
+
+`ValueEqualityFn`\<`TAtomValue`\>
+
+##### selector?
+
+`undefined`
+
+### Returns
+
+`Signal`\<`Readonly`\<`TAtomValue`\>\>
+
+## Call Signature
+
+```ts
+AngularTableComputed<TAtomValue, TSubSelected>(props): Signal<Readonly<TSubSelected>>;
+```
+
+Defined in: [injectTable.ts:37](https://github.com/TanStack/table/blob/main/packages/angular-table/src/injectTable.ts#L37)
+
+Store mode: pass `selector` (required) to project from full table state.
+Atom mode: pass `atom`; omit `selector` for the whole atom (identity), or pass
+`selector` to project. Split overloads match React `Subscribe` inference.
+
+### Type Parameters
+
+#### TAtomValue
+
+`TAtomValue`
+
+#### TSubSelected
+
+`TSubSelected`
+
+### Parameters
+
+#### props
+
+##### atom
+
+`Atom`\<`TAtomValue`\> \| `ReadonlyAtom`\<`TAtomValue`\>
+
+##### equal?
+
+`ValueEqualityFn`\<`TSubSelected`\>
+
+##### selector
+
+(`state`) => `TSubSelected`
+
+### Returns
+
+`Signal`\<`Readonly`\<`TSubSelected`\>\>
+
+## Call Signature
+
+```ts
+AngularTableComputed<TSubSelected>(props): Signal<Readonly<TSubSelected>>;
+```
+
+Defined in: [injectTable.ts:42](https://github.com/TanStack/table/blob/main/packages/angular-table/src/injectTable.ts#L42)
+
+Store mode: pass `selector` (required) to project from full table state.
+Atom mode: pass `atom`; omit `selector` for the whole atom (identity), or pass
+`selector` to project. Split overloads match React `Subscribe` inference.
+
+### Type Parameters
+
+#### TSubSelected
+
+`TSubSelected`
+
+### Parameters
+
+#### props
+
+##### equal?
+
+`ValueEqualityFn`\<`TSubSelected`\>
+
+##### selector
+
+(`state`) => `TSubSelected`
+
+### Returns
+
+`Signal`\<`Readonly`\<`TSubSelected`\>\>

docs/framework/angular/reference/type-aliases/AngularTable.md

@@ -9,41 +9,17 @@ title: AngularTable
 type AngularTable<TFeatures, TData, TSelected> = Table<TFeatures, TData> & object;
 ```
 
-Defined in: [injectTable.ts:25](https://github.com/TanStack/table/blob/main/packages/angular-table/src/injectTable.ts#L25)
+Defined in: [injectTable.ts:48](https://github.com/TanStack/table/blob/main/packages/angular-table/src/injectTable.ts#L48)
 
 ## Type Declaration
 
-### computed()
+### computed
 
 ```ts
-computed: <TSubSelected>(props) => Signal<Readonly<TSubSelected>>;
+computed: AngularTableComputed<TFeatures>;
 ```
 
-Creates a computed that subscribe to changes in the table store with a custom selector.
-Default equality function is "shallow".
-
-#### Type Parameters
-
-##### TSubSelected
-
-`TSubSelected` = \{
-\}
-
-#### Parameters
-
-##### props
-
-###### equal?
-
-`ValueEqualityFn`\<`TSubSelected`\>
-
-###### selector
-
-(`state`) => `TSubSelected`
-
-#### Returns
-
-`Signal`\<`Readonly`\<`TSubSelected`\>\>
+Alias: **`Subscribe`** — same function reference as `computed` (naming parity with other adapters).
 
 ### state
 
@@ -53,6 +29,12 @@ readonly state: Signal<Readonly<TSelected>>;
 
 The selected state from the table store, based on the selector provided.
 
+### Subscribe
+
+```ts
+Subscribe: AngularTableComputed<TFeatures>;
+```
+
 ### value
 
 ```ts