Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
3 changes: 2 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -61,4 +61,5 @@ vite.config.ts.timestamp-*
.cursor/*

Agents.md
.agents/*
.agents/*
terminalOutput
39 changes: 28 additions & 11 deletions docs/config.json
Original file line number Diff line number Diff line change
Expand Up @@ -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" }
]
},
Expand All @@ -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" }
]
Expand All @@ -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" }
]
},
Expand All @@ -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" }
]
},
{
Expand All @@ -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" }
]
},
Expand Down Expand Up @@ -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" }
]
},
{
Expand Down Expand Up @@ -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" }
]
},
{
Expand Down
2 changes: 1 addition & 1 deletion docs/framework/angular/reference/functions/injectTable.md
Original file line number Diff line number Diff line change
Expand Up @@ -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.

Expand Down
1 change: 1 addition & 0 deletions docs/framework/angular/reference/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -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)
Expand Down
132 changes: 132 additions & 0 deletions docs/framework/angular/reference/interfaces/AngularTableComputed.md
Original file line number Diff line number Diff line change
@@ -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`\>\>
38 changes: 10 additions & 28 deletions docs/framework/angular/reference/type-aliases/AngularTable.md
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand All @@ -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
Expand Down
Loading
Loading