@tanstack/angular-table 9.0.0-beta.38 → 9.0.0-beta.42

package/skills/angular/angular-rendering-directives/references/di-tokens.md

@@ -1,171 +0,0 @@
-# DI Tokens & Context Injection — Full Reference
-
-`FlexRender` automatically provides DI tokens for the render context to any
-component rendered through `*flexRender` / `*flexRenderCell` / etc. The renderer
-inspects the props object — if it has `table`, `header`, or `cell`, it
-provides the matching token in the child injector.
-
-| Helper                                      | Returns                           | Available inside                                                                                       |
-| ------------------------------------------- | --------------------------------- | ------------------------------------------------------------------------------------------------------ |
-| `injectFlexRenderContext<T>()`              | `T` (full props proxy)            | a component rendered via `*flexRender` / `*flexRenderCell` / `*flexRenderHeader` / `*flexRenderFooter` |
-| `injectTableContext<TData>()`               | `Signal<Table<TFeatures, TData>>` | anything under `[tanStackTable]` or rendered via `*flexRender` whose context has `table`               |
-| `injectTableHeaderContext<TValue, TData>()` | `Signal<Header<...>>`             | anything under `[tanStackTableHeader]` or rendered via `*flexRenderHeader`                             |
-| `injectTableCellContext<TValue, TData>()`   | `Signal<Cell<...>>`               | anything under `[tanStackTableCell]` or rendered via `*flexRenderCell`                                 |
-
-The full props passed via `*flexRender`'s `props:` (or auto-derived by the
-shorthand directives) is wrapped in a `Proxy` so property access always reads
-the _latest_ value across re-renders.
-
----
-
-## Pattern A — inject inside the rendered component itself
-
-If your component **is** the cell, header, or footer (rendered through
-`*flexRender*`), you don't need any extra directive — the token is auto-provided.
-
-```ts
-@Component({
-  template: `
-    <span>{{ context.getValue() }}</span>
-    <button (click)="context.row.toggleSelected()">Toggle</button>
-  `,
-})
-export class InteractiveCell {
-  readonly context = injectFlexRenderContext<CellContext<any, any, any>>()
-}
-```
-
-Or, for just the cell signal:
-
-```ts
-@Component({ template: `{{ cell().getValue() }}` })
-export class TextCell {
-  readonly cell = injectTableCellContext<string>()
-}
-```
-
----
-
-## Pattern B — context for _descendants outside the FlexRender tree_
-
-When you have a component that lives next to the `*flexRenderCell` block, or
-when you want any nested element to inject the table/header/cell, use the
-context **host directives**:
-
-```ts
-import {
-  FlexRender,
-  TanStackTable,
-  TanStackTableHeader,
-  TanStackTableCell,
-} from '@tanstack/angular-table'
-
-@Component({
-  imports: [FlexRender, TanStackTable, TanStackTableHeader, TanStackTableCell],
-  templateUrl: './app.html',
-})
-export class App {}
-```
-
-```html
-<table [tanStackTable]="table">
-  @for (headerGroup of table.getHeaderGroups(); track headerGroup.id) {
-  <tr>
-    @for (header of headerGroup.headers; track header.id) {
-    <th [tanStackTableHeader]="header">
-      <ng-container *flexRenderHeader="header; let value">
-        {{ value }}
-      </ng-container>
-      <!-- Any component here can call injectTableHeaderContext() -->
-    </th>
-    }
-  </tr>
-  } @for (row of table.getRowModel().rows; track row.id) {
-  <tr>
-    @for (cell of row.getVisibleCells(); track cell.id) {
-    <td [tanStackTableCell]="cell">
-      <ng-container *flexRenderCell="cell; let value">{{ value }}</ng-container>
-      <app-cell-actions />
-      <!-- ↑ cell-actions calls injectTableCellContext() — no input drilling -->
-    </td>
-    }
-  </tr>
-  }
-</table>
-```
-
-```ts
-@Component({
-  selector: 'app-cell-actions',
-  template: `<button (click)="cell().row.toggleSelected()">Toggle</button>`,
-})
-export class CellActionsComponent {
-  readonly cell = injectTableCellContext()
-}
-```
-
-Each directive uses Angular's `providers` array to register a per-host factory,
-so contexts are correctly scoped — multiple `[tanStackTableCell]` directives on
-sibling cells provide independent values.
-
----
-
-## `*flexRender` directly (custom props)
-
-Reach for the long form `*flexRender` when:
-
-- You're rendering something that isn't `columnDef.cell` / `header` / `footer`
-  (e.g. a registered `headerComponents` member, see `createTableHook`).
-- You want to override the props passed to the render function.
-
-```html
-<ng-container
-  *flexRender="
-    cell.column.columnDef.cell;
-    props: cell.getContext();
-    let rendered
-  "
->
-  {{ rendered }}
-</ng-container>
-```
-
-Custom props (e.g. extending the default context):
-
-```html
-<ng-container
-  *flexRender="
-    cell.column.columnDef.cell;
-    props: {
-      ...cell.getContext(),
-      extra: someValue(),
-    };
-    let rendered
-  "
->
-  {{ rendered }}
-</ng-container>
-```
-
-Inside the rendered component, `injectFlexRenderContext()` returns this full
-props object.
-
-You can also pass `flexRenderInjector:` to override the injector used for
-`createComponent`.
-
----
-
-## Render-function injection context
-
-Because column-def `cell` / `header` / `footer` functions run inside
-`runInInjectionContext`, this **works** at the top of those functions:
-
-```ts
-cell: ({ getValue }) => {
-  const router = inject(Router) // ✅ legal
-  return router.url.endsWith('/admin') ? `[admin] ${getValue()}` : getValue()
-}
-```
-
-Be deliberate: this runs every time the cell renders. For per-app values that
-don't change, prefer `inject(...)` at the component level and close over.

package/skills/angular/angular-rendering-directives/references/flex-render-component-options.md

@@ -1,64 +0,0 @@
-# `flexRenderComponent` — Full Options Reference
-
-When you need custom inputs not derived from the render context, output
-callbacks, a custom injector, or Angular v20+ `bindings` / `directives`,
-**wrap the component**:
-
-```ts
-import { flexRenderComponent, type ColumnDef } from '@tanstack/angular-table'
-import { EditableCell } from './editable-cell'
-
-const columns: Array<ColumnDef<typeof features, Person>> = [
-  {
-    accessorKey: 'firstName',
-    cell: ({ getValue, row, column, table }) =>
-      flexRenderComponent(EditableCell, {
-        inputs: {
-          value: getValue(),
-        },
-        outputs: {
-          change: (value) => {
-            table.options.meta?.updateData(row.index, column.id, value)
-          },
-        },
-      }),
-  },
-]
-```
-
-## How inputs/outputs are wired
-
-- **`inputs`** → applied via `ComponentRef.setInput(key, value)` (works with
-  both `input()` signals and legacy `@Input()`). Diffed per change-detection
-  cycle with `KeyValueDiffers` — unchanged values are _not_ re-set, so object
-  inputs are reference-checked. Keep input objects referentially stable when
-  you can.
-- **`outputs`** → resolved at component-instance level. The wrapper reads the
-  property by name, checks it is an `OutputEmitterRef`, and subscribes. The
-  subscription is cleaned up when the component is destroyed.
-- **`injector`** → use when the rendered component needs to inject from a
-  specific scope (e.g. a feature module / sub-injector).
-- **`bindings`** (Angular v20+) → forwarded directly to
-  `ViewContainerRef.createComponent` at creation time. Use this with
-  `inputBinding`, `outputBinding`, `twoWayBinding` for native programmatic
-  rendering semantics.
-- **`directives`** (Angular v20+) → host directives forwarded the same way.
-
-```ts
-import { inputBinding, outputBinding, twoWayBinding, signal } from '@angular/core'
-
-readonly name = signal('Ada')
-
-cell: () =>
-  flexRenderComponent(EditableNameCell, {
-    bindings: [
-      inputBinding('value', this.name),
-      twoWayBinding('value', this.name),
-      outputBinding('valueChange', (v) => console.log('changed', v)),
-    ],
-  })
-```
-
-> **Do not mix `bindings` with `inputs`/`outputs`** on the same component.
-> `bindings` apply at creation time and participate in the initial CD cycle;
-> `inputs`/`outputs` apply after. Mixing them risks double-initialization.

package/skills/angular/client-to-server/SKILL.md

@@ -1,468 +0,0 @@
----
-name: angular/client-to-server
-description: >
-  Convert an Angular Table v9 from client-side to server-side processing. Flip
-  `manualPagination` / `manualSorting` / `manualFiltering` / `manualGrouping` / `manualExpanding`
-  for the slices the server now owns; drop the corresponding row-model factory slots from the
-  `features` object for the factories the server replaces; supply `rowCount` (server total) so
-  pagination computes correctly; hoist `pagination` / `sorting` / `columnFilters` / `globalFilter`
-  to Angular signals with `state` + `on[State]Change`; fetch via `rxResource` / `httpResource` /
-  `@tanstack/angular-query`; preserve previous data on refetch with `linkedSignal` (or
-  `placeholderData: keepPreviousData` for Query); set `getRowId` for stable selection across
-  refetches.
-type: lifecycle
-library: tanstack-table
-framework: angular
-library_version: '9.0.0-alpha.48'
-requires:
-  - angular/table-state
-  - angular/getting-started
-  - filtering
-  - sorting
-  - pagination
-sources:
-  - TanStack/table:docs/framework/angular/guide/table-state.md
-  - TanStack/table:docs/framework/angular/guide/migrating.md
-  - TanStack/table:examples/angular/remote-data/
-  - TanStack/table:packages/angular-table/src/injectTable.ts
----
-
-# Client → Server Conversion (Angular Table v9)
-
-> Goal: take a working client-side Angular Table v9 and migrate it to server-driven
-> processing for one or more of pagination / sorting / filtering / grouping /
-> expanding — without rewriting your row markup, columns, or feature surface.
->
-> The canonical Angular example is `examples/angular/remote-data/`, using
-> `rxResource` + `linkedSignal`. The same pattern composes with
-> `@tanstack/angular-query` (see `compose-with-tanstack-query`).
-
----
-
-## 1. The 5-step recipe
-
-For each slice the server now owns:
-
-1. **Flip `manualX: true`** in table options. This tells the table "don't
-   process this on the client — trust the data you receive."
-2. **Drop the matching client-side row-model factory slot** from `features`
-   (or keep it if you still want the feature's _state_ but no client
-   recomputation — see §3).
-3. **Hoist the slice to an Angular signal**, control it via `state.x` +
-   `on[State]Change`. Server requests must depend on the signal.
-4. **Pass `rowCount`** (the server's total) so `getPageCount()`,
-   `getCanNextPage()`, etc. compute correctly under `manualPagination`.
-5. **Set `getRowId`** so row selection (and refetch identity) survives across
-   server refetches.
-
-Plus: keep previous data visible during refetches (avoid a "0-rows flash") with
-`linkedSignal`, `placeholderData: keepPreviousData` (Query), or
-`previousValue:` (`httpResource`).
-
----
-
-## 2. The `manualX` matrix
-
-| Slice          | Option                   | Client row-model needed? | Notes                                                          |
-| -------------- | ------------------------ | ------------------------ | -------------------------------------------------------------- |
-| Pagination     | `manualPagination: true` | drop `paginatedRowModel` | also pass `rowCount: <serverTotal>`                            |
-| Sorting        | `manualSorting: true`    | drop `sortedRowModel`    | feature still controls `sorting` state                         |
-| Column filters | `manualFiltering: true`  | drop `filteredRowModel`  | also affects global filter when sharing the filtered row model |
-| Global filter  | `manualFiltering: true`  | drop `filteredRowModel`  | global filter shares the filtered row model                    |
-| Grouping       | `manualGrouping: true`   | drop `groupedRowModel`   | rare — most servers don't return grouped trees                 |
-| Expanding      | `manualExpanding: true`  | drop `expandedRowModel`  | server returns sub-rows pre-expanded                           |
-
-Selection, visibility, ordering, pinning, sizing, resizing, row-pinning are
-all UI-only state — they don't have manual modes. They keep working unchanged.
-
----
-
-## 3. Canonical example — pagination + sorting + global filter
-
-The `examples/angular/remote-data/` pattern, condensed:
-
-```ts
-import {
-  ChangeDetectionStrategy,
-  Component,
-  inject,
-  linkedSignal,
-  signal,
-} from '@angular/core'
-import { rxResource } from '@angular/core/rxjs-interop'
-import { HttpClient, HttpParams } from '@angular/common/http'
-import { map } from 'rxjs'
-import {
-  FlexRender,
-  injectTable,
-  tableFeatures,
-  rowPaginationFeature,
-  rowSortingFeature,
-  columnFilteringFeature,
-  globalFilteringFeature,
-  createColumnHelper,
-  type ColumnDef,
-  type PaginationState,
-  type SortingState,
-} from '@tanstack/angular-table'
-
-const features = tableFeatures({
-  rowPaginationFeature,
-  rowSortingFeature,
-  columnFilteringFeature,
-  globalFilteringFeature,
-})
-
-const columnHelper = createColumnHelper<typeof features, Todo>()
-
-type TodoResponse = { items: Array<Todo>; totalCount: number }
-
-@Component({
-  selector: 'app-root',
-  imports: [FlexRender],
-  templateUrl: './app.html',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class App {
-  private readonly http = inject(HttpClient)
-
-  // 1. Hoist controlled slices to signals
-  readonly pagination = signal<PaginationState>({ pageIndex: 0, pageSize: 10 })
-  readonly sorting = signal<SortingState>([{ id: 'id', desc: false }])
-  readonly globalFilter = signal<string | null>(null)
-
-  // 2. Fetch — server query depends on those signals
-  private readonly data = rxResource({
-    params: () => ({
-      page: this.pagination(),
-      sorting: this.sorting(),
-      globalFilter: this.globalFilter(),
-    }),
-    stream: ({ params: { page, sorting, globalFilter } }) => {
-      let params = new HttpParams({
-        fromObject: {
-          _page: page.pageIndex + 1,
-          _limit: page.pageSize,
-        },
-      })
-      if (globalFilter) params = params.set('title_like', globalFilter)
-      if (sorting.length) {
-        params = params
-          .set('_sort', sorting.map((s) => s.id).join(','))
-          .set(
-            '_order',
-            sorting.map((s) => (s.desc ? 'desc' : 'asc')).join(','),
-          )
-      }
-      return this.http
-        .get<Array<Todo>>('https://jsonplaceholder.typicode.com/todos', {
-          params,
-          observe: 'response',
-        })
-        .pipe(
-          map(
-            (res) =>
-              ({
-                items: res.body ?? [],
-                totalCount: Number(res.headers.get('X-Total-Count')),
-              }) satisfies TodoResponse,
-          ),
-        )
-    },
-  })
-
-  // 3. Keep previous page visible during refetch — no "0 rows" flash
-  readonly dataWithLatest = linkedSignal<
-    {
-      value: TodoResponse | undefined
-      status: 'idle' | 'loading' | 'resolved' | 'error'
-    },
-    TodoResponse
-  >({
-    source: () => ({
-      value: this.data.value(),
-      status: this.data.status(),
-    }),
-    computation: (source, previous) => {
-      if (previous && source.status === 'loading') return previous.value
-      return source.value ?? { items: [], totalCount: 0 }
-    },
-  })
-
-  readonly columns: Array<ColumnDef<typeof features, Todo>> = [
-    columnHelper.accessor('id', { header: 'Id', cell: (i) => i.getValue() }),
-    columnHelper.accessor('title', {
-      header: 'Title',
-      cell: (i) => i.getValue(),
-    }),
-    columnHelper.accessor('completed', {
-      header: 'Completed',
-      cell: (i) => (i.getValue() ? '✅' : '❌'),
-    }),
-  ]
-
-  // 4. Wire the table — manualX flags, features without row-model factories, supply rowCount
-  readonly table = injectTable(() => {
-    const data = this.dataWithLatest()
-    return {
-      features, // ← features has no paginatedRowModel/sortedRowModel/filteredRowModel slots
-      columns: this.columns,
-      data: data.items,
-      getRowId: (row) => String(row.id),
-
-      // Controlled slices
-      state: {
-        pagination: this.pagination(),
-        sorting: this.sorting(),
-        globalFilter: this.globalFilter(),
-      },
-
-      // Manual modes
-      manualPagination: true,
-      manualSorting: true,
-      manualFiltering: true,
-
-      // Server's truth about total row count
-      rowCount: data.totalCount,
-
-      onPaginationChange: (u) =>
-        typeof u === 'function'
-          ? this.pagination.update(u)
-          : this.pagination.set(u),
-
-      onSortingChange: (u) =>
-        typeof u === 'function' ? this.sorting.update(u) : this.sorting.set(u),
-
-      // When filter changes, also reset page index
-      onGlobalFilterChange: (u) => {
-        typeof u === 'function'
-          ? this.globalFilter.update(u)
-          : this.globalFilter.set(u)
-        this.pagination.update((p) => ({ ...p, pageIndex: 0 }))
-      },
-    }
-  })
-}
-```
-
-### What changed from the client-side version
-
-- `features` has no `paginatedRowModel`, `sortedRowModel`, or `filteredRowModel`
-  slots — the server is the source of truth for those.
-- `manualPagination` / `manualSorting` / `manualFiltering: true`.
-- `rowCount: data.totalCount` — required for correct `getPageCount()` and the
-  next/prev buttons.
-- `state` + per-slice `on[State]Change` for everything the server reads.
-- `getRowId` set so row selection survives refetch reorderings.
-- `linkedSignal` keeps the previous response visible during loading — without
-  it, paginating yields a one-frame "no rows" flash because `data.value()` is
-  `undefined` mid-fetch.
-- Resetting `pageIndex` on global-filter change is a UX rule, not framework
-  behavior — make it explicit.
-
----
-
-## 4. Wiring with `@tanstack/angular-query-experimental`
-
-For Query users, the equivalent of `linkedSignal` is
-`placeholderData: keepPreviousData`. See `compose-with-tanstack-query` for the
-full pattern. The table-side wiring (manual flags, dropped row models,
-controlled signals, `rowCount`, `getRowId`) is identical.
-
----
-
-## 5. `rowCount` and friends
-
-Under `manualPagination: true`, the table no longer knows the total. You must
-tell it:
-
-```ts
-rowCount: data.totalCount // total rows server reports
-// pageCount: 42                // can be passed instead, if your API gives pages not rows
-```
-
-If you omit both, `getPageCount()` returns `-1` and the "next page" button
-never disables. If your API reports `pageCount` directly (rare), prefer
-`pageCount` — otherwise compute it from `rowCount`.
-
----
-
-## 6. Always set `getRowId` when server-driven
-
-Without `getRowId`, row IDs default to row index. That works on the client
-because order is stable per render. On the server, a refetch may return rows in
-a different order — `RowSelectionState`, keyed by row ID, then targets the
-wrong rows.
-
-```ts
-getRowId: (row) => row.id
-```
-
-Required for:
-
-- `rowSelectionFeature` correctness across refetches
-- pinned-row identity
-- stable `track row.id` performance in `@for`
-
----
-
-## 7. Debouncing rapid input — global filter typing
-
-Naively, every keystroke triggers a server fetch. Two options:
-
-- **Manual signal indirection** — keep a `globalFilterInput` signal that the
-  UI writes to, then update `globalFilter` after a delay via `effect(...) +
-setTimeout` or RxJS `debounceTime`.
-- **Compose with `@tanstack/angular-pacer`** — see
-  `compose-with-tanstack-pacer` (not in this batch but on the roadmap).
-
-Resetting `pageIndex` to 0 when filter or sort changes is a UX standard:
-
-```ts
-onGlobalFilterChange: (u) => {
-  typeof u === 'function' ? this.globalFilter.update(u) : this.globalFilter.set(u)
-  this.pagination.update((p) => ({ ...p, pageIndex: 0 }))
-},
-```
-
----
-
-## 8. Mixed mode — some slices server, others client
-
-Common pattern: pagination + sorting on the server, but row selection +
-column visibility stay client-only. **Nothing special required** — only the
-slices you mark `manualX` are server-driven. Selection / visibility / ordering
-work unchanged.
-
-You can also keep client-side filtering on a column while paginating on the
-server, but be wary: if rows are paginated server-side, you only have the
-current page to filter against. Usually it's cleaner to flip all data-shape
-slices to the server consistently.
-
----
-
-## 9. Resetting state on slice changes
-
-These behaviors are intentional and you'll often want to _override_ them when
-server-driven:
-
-| Default                                                                       | When server-driven                                                                                                         |
-| ----------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------- |
-| `autoResetPageIndex: true` resets `pageIndex` to 0 when data identity changes | OK as-is — every fetch is a new array reference, so the page index resets unless you also pass `autoResetPageIndex: false` |
-| Filter change does **not** auto-reset page                                    | UX-standard to reset manually (see §7)                                                                                     |
-| Sort change does **not** auto-reset page                                      | Reset manually if your UX expects "new sort → page 1"                                                                      |
-
-If your fetch always returns a fresh array, **set `autoResetPageIndex: false`** —
-otherwise paginating to page 3 will reset back to page 0 the moment the new
-data lands. The remote-data example demonstrates the alternative pattern for
-edits (toggle the flag around the update).
-
----
-
-## Failure modes
-
-### 1. (CRITICAL) Flipping `manualPagination: true` but keeping `paginatedRowModel` on `features`
-
-The client row-model factory will re-paginate the (already-paginated) data,
-chopping the visible rows down to the first `pageSize` of the page slice.
-**Remove the `paginatedRowModel` slot from `features`** when going manual — or
-accept double-pagination.
-
-### 2. (CRITICAL) Forgetting `rowCount` under `manualPagination`
-
-`getPageCount()` returns `-1`, `getCanNextPage()` is `true` forever,
-"page N of -1" appears in the UI. Always pass either `rowCount: serverTotal`
-or `pageCount: serverPageCount`.
-
-### 3. (CRITICAL) Missing `getRowId` with selection + server refetches
-
-The row-selection state is keyed by row ID. With index-as-ID, refetches that
-return rows in any new order (sort flip, page change) reselect the wrong
-rows. Always set `getRowId: row => row.id` (or whatever your primary key is).
-
-### 4. (HIGH) "0 rows" flash between pages
-
-If your fetch resolves to `undefined` during loading, `data.items` becomes `[]`
-mid-fetch — the table renders empty for a frame. Use `linkedSignal` (or
-`@tanstack/query`'s `placeholderData: keepPreviousData`, or
-`httpResource`'s previous-value semantics) to keep the previous page visible.
-
-### 5. (HIGH) Forgetting to handle both value AND updater-fn shapes in `on[State]Change`
-
-```ts
-// ❌ Crashes when the table passes an updater function
-onPaginationChange: (value) => this.pagination.set(value)
-
-// ✅
-onPaginationChange: (u) =>
-  typeof u === 'function' ? this.pagination.update(u) : this.pagination.set(u)
-```
-
-### 6. (HIGH) `autoResetPageIndex` resetting your server pagination
-
-By default, when data identity changes, the table resets to page 0. Under
-server-driven pagination, _every_ fetch is a new array, so the table resets
-the page index back to 0 every time. Set `autoResetPageIndex: false` and
-manage page resets explicitly (e.g. reset on filter/sort change, but not on
-the fetch itself).
-
-### 7. (HIGH) Filtering on the client when only one page is loaded
-
-```ts
-manualPagination: true,
-// columnFilteringFeature still registered, filteredRowModel slot still on features
-```
-
-The filtered row model now filters only the _current page_ — useless. If the
-server paginates, the server must also filter; flip `manualFiltering: true`
-and remove the `filteredRowModel` slot from `features`.
-
-### 8. (HIGH) Forgetting to depend on the controlled signals in your fetch
-
-If your `rxResource` / Query's `queryKey` doesn't read `pagination()`,
-`sorting()`, `globalFilter()`, refetches won't happen. Both the table and the
-fetcher must observe the same signals.
-
-### 9. (MEDIUM) Reimplementing pagination state with raw `pageIndex` /
-
-`pageSize` signals separate from the table
-
-```ts
-// ❌ Two sources of truth
-readonly pageIndex = signal(0)
-readonly pageSize = signal(10)
-// table doesn't know about either
-
-// ✅
-readonly pagination = signal<PaginationState>({ pageIndex: 0, pageSize: 10 })
-state: { pagination: this.pagination() }
-onPaginationChange: ...
-```
-
-Same lesson: use `setSorting`, not a manual sort signal that the table can't
-see.
-
-### 10. (MEDIUM) Not resetting `pageIndex` on filter/sort change
-
-A common bug: user is on page 5, types in the filter, gets "no results" — but
-the new filtered result set only has 2 pages. They have to manually click back
-to page 1. Always reset `pageIndex` to 0 in `onGlobalFilterChange` /
-`onColumnFiltersChange`.
-
-### 11. (MEDIUM) Thinking that omitting all row-model slots means "no row models work"
-
-Core row model is always automatic. `table.getRowModel().rows` returns the
-data array as `Row<...>` objects no matter what — a `features` object with no
-factory slots just means no client-side processing on top.
-
----
-
-## See also
-
-- `tanstack-table/angular/table-state` — state ownership, `state` vs `atoms`
-- `tanstack-table/angular/compose-with-tanstack-query` — server fetch with Query
-- `tanstack-table/angular/compose-with-tanstack-store` — external atom ownership
-- `tanstack-table/core/filtering` — manualFiltering semantics
-- `tanstack-table/core/sorting` — manualSorting semantics
-- `tanstack-table/core/pagination` — manualPagination + `rowCount` / `pageCount`
-- Example: `examples/angular/remote-data/`