diff --git a/.gitattributes b/.gitattributes
index dfe0770424..5a0d5e480b 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -1,2 +1,2 @@
# Auto detect text files and perform LF normalization
-* text=auto
+* text=auto eol=lf
diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml
index 6a5ed2d4a4..963fe444ec 100644
--- a/.github/ISSUE_TEMPLATE/config.yml
+++ b/.github/ISSUE_TEMPLATE/config.yml
@@ -1,8 +1,11 @@
blank_issues_enabled: false
contact_links:
- - name: Feature Requests & Questions
+ - name: 🤔 Feature Requests & Questions
url: https://github.com/TanStack/table/discussions
about: Please ask and answer questions here.
- - name: Community Chat
+ - name: 💬 Community Chat
url: https://discord.gg/mQd7egN
about: A dedicated discord server hosted by TanStack
+ - name: 🦋 TanStack Bluesky
+ url: https://bsky.app/profile/tanstack.com
+ about: Stay up to date with new releases of our libraries
diff --git a/.github/pull_request_template b/.github/pull_request_template
new file mode 100644
index 0000000000..2c10bc7d7d
--- /dev/null
+++ b/.github/pull_request_template
@@ -0,0 +1,8 @@
+## 🎯 Changes
+
+
+
+## ✅ Checklist
+
+- [ ] I have followed the steps in the [Contributing guide](https://github.com/TanStack/table/blob/main/CONTRIBUTING.md).
+- [ ] I have tested this code locally with `pnpm test:pr`.
diff --git a/.github/workflows/autofix.yml b/.github/workflows/autofix.yml
index 53051c6d5f..fc5d40b75a 100644
--- a/.github/workflows/autofix.yml
+++ b/.github/workflows/autofix.yml
@@ -18,11 +18,14 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Checkout
- uses: actions/checkout@v4
+ uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
+ with:
+ fetch-depth: 0
+ persist-credentials: false
- name: Setup Tools
- uses: tanstack/config/.github/setup@main
+ uses: tanstack/config/.github/setup@e4b48f16568324f76f467aa4c2aac2f05db632c3 # main
- name: Fix formatting
- run: pnpm prettier:write
+ run: pnpm format
- name: Apply fixes
uses: autofix-ci/action@dd55f44df8f7cdb7a6bf74c78677eb8acd40cd0a
with:
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
deleted file mode 100644
index b8ea2bf5d1..0000000000
--- a/.github/workflows/ci.yml
+++ /dev/null
@@ -1,51 +0,0 @@
-name: ci
-
-on:
- workflow_dispatch:
- inputs:
- tag:
- description: override release tag
- required: false
- push:
- branches: [main, alpha, beta, rc]
-
-concurrency:
- group: ${{ github.workflow }}-${{ github.event.number || github.ref }}
- cancel-in-progress: true
-
-env:
- NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
-
-permissions:
- contents: write
- id-token: write
-
-jobs:
- test-and-publish:
- name: Test & Publish
- if: github.repository == 'TanStack/table'
- runs-on: ubuntu-latest
- steps:
- - name: Checkout
- uses: actions/checkout@v4
- with:
- fetch-depth: 0
- - name: Start Nx Agents
- run: npx nx-cloud start-ci-run --distribute-on=".nx/workflows/dynamic-changesets.yaml"
- - name: Setup Tools
- uses: tanstack/config/.github/setup@main
- - name: Run Tests
- run: pnpm run test:ci --parallel=3
- - name: Stop Nx Agents
- if: ${{ always() }}
- run: npx nx-cloud stop-all-agents
- - name: Publish
- run: |
- git config --global user.name 'Tanner Linsley'
- git config --global user.email 'tannerlinsley@users.noreply.github.com'
- npm config set '//registry.npmjs.org/:_authToken' "${NPM_TOKEN}"
- pnpm run cipublish
- env:
- GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
- NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
- TAG: ${{ inputs.tag }}
diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml
index 7af298149a..ad60720c84 100644
--- a/.github/workflows/pr.yml
+++ b/.github/workflows/pr.yml
@@ -1,4 +1,4 @@
-name: pr
+name: PR
on:
pull_request:
@@ -23,15 +23,16 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Checkout
- uses: actions/checkout@v4
+ uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
with:
fetch-depth: 0
+ persist-credentials: false
- name: Start Nx Agents
run: npx nx-cloud start-ci-run --distribute-on=".nx/workflows/dynamic-changesets.yaml"
- name: Setup Tools
- uses: tanstack/config/.github/setup@main
+ uses: tanstack/config/.github/setup@e4b48f16568324f76f467aa4c2aac2f05db632c3 # main
- name: Get base and head commits for `nx affected`
- uses: nrwl/nx-set-shas@v4
+ uses: nrwl/nx-set-shas@3e9ad7370203c1e93d109be57f3b72eb0eb511b1 # v4.4.0
with:
main-branch-name: main
- name: Run Checks
@@ -44,11 +45,12 @@ jobs:
runs-on: ubuntu-latest
steps:
- name: Checkout
- uses: actions/checkout@v4
+ uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
with:
fetch-depth: 0
+ persist-credentials: false
- name: Setup Tools
- uses: tanstack/config/.github/setup@main
+ uses: tanstack/config/.github/setup@e4b48f16568324f76f467aa4c2aac2f05db632c3 # main
- name: Build Packages
run: pnpm run build:all
- name: Publish Previews
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
new file mode 100644
index 0000000000..b091598d83
--- /dev/null
+++ b/.github/workflows/release.yml
@@ -0,0 +1,50 @@
+name: Release
+
+on:
+ workflow_dispatch:
+ inputs:
+ tag:
+ description: override release tag
+ required: false
+ push:
+ branches: [main, alpha, beta, rc]
+
+concurrency:
+ group: ${{ github.workflow }}-${{ github.event.number || github.ref }}
+ cancel-in-progress: true
+
+env:
+ NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
+
+permissions:
+ contents: write
+ id-token: write
+
+jobs:
+ release:
+ name: Release
+ if: github.repository_owner == 'TanStack'
+ runs-on: ubuntu-latest
+ steps:
+ - name: Checkout
+ uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
+ with:
+ fetch-depth: 0
+ persist-credentials: false
+ - name: Start Nx Agents
+ run: npx nx-cloud start-ci-run --distribute-on=".nx/workflows/dynamic-changesets.yaml"
+ - name: Setup Tools
+ uses: tanstack/config/.github/setup@e4b48f16568324f76f467aa4c2aac2f05db632c3 # main
+ - name: Run Tests
+ run: pnpm run test:ci --parallel=3
+ - name: Stop Nx Agents
+ if: ${{ always() }}
+ run: npx nx-cloud stop-all-agents
+ - name: Publish
+ run: |
+ git config --global user.name 'Tanner Linsley'
+ git config --global user.email 'tannerlinsley@users.noreply.github.com'
+ pnpm run cipublish
+ env:
+ GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+ TAG: ${{ inputs.tag }}
diff --git a/.github/workflows/zizmor.yml b/.github/workflows/zizmor.yml
new file mode 100644
index 0000000000..ba8e8cfa12
--- /dev/null
+++ b/.github/workflows/zizmor.yml
@@ -0,0 +1,25 @@
+name: GitHub Actions Security Analysis
+
+on:
+ push:
+ branches: [alpha]
+ pull_request:
+ branches: ['**']
+
+permissions: {}
+
+jobs:
+ zizmor:
+ name: Run zizmor
+ runs-on: ubuntu-latest
+ steps:
+ - name: Checkout
+ uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+ with:
+ persist-credentials: false
+
+ - name: Run zizmor
+ uses: zizmorcore/zizmor-action@b1d7e1fb5de872772f31590499237e7cce841e8e # v0.5.3
+ with:
+ advanced-security: false
+ annotations: true
diff --git a/.gitignore b/.gitignore
index 78f36fcdd4..df459c9799 100644
--- a/.gitignore
+++ b/.gitignore
@@ -7,7 +7,6 @@ package-lock.json
yarn.lock
# builds
-types
build
dist
lib
@@ -49,9 +48,18 @@ yarn.lock
*.tsbuildinfo
*.tsbuildinfo
+.svelte-kit
.nx/cache
.nx/workspace-data
vite.config.js.timestamp-*
vite.config.ts.timestamp-*
.angular
+
+.nx/polygraph
+.claude/*
+.cursor/*
+
+Agents.md
+.agents/*
+terminalOutput
diff --git a/.npmrc b/.npmrc
index 84aee8d998..268c392d3c 100644
--- a/.npmrc
+++ b/.npmrc
@@ -1,3 +1 @@
-link-workspace-packages=true
-prefer-workspace-packages=true
provenance=true
diff --git a/.nvmrc b/.nvmrc
index b8e593f521..b404027604 100644
--- a/.nvmrc
+++ b/.nvmrc
@@ -1 +1 @@
-20.15.1
+24.8.0
diff --git a/.prettierignore b/.prettierignore
index aa12baab9e..63dd7224e6 100644
--- a/.prettierignore
+++ b/.prettierignore
@@ -1,3 +1,4 @@
+**/.nx/
**/.nx/cache
**/.svelte-kit
**/build
@@ -5,6 +6,7 @@
**/dist
**/docs
**/old-examples
+**/examples/**/*.svelte
pnpm-lock.yaml
.angular
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
new file mode 100644
index 0000000000..1d7ac851ea
--- /dev/null
+++ b/.vscode/extensions.json
@@ -0,0 +1,3 @@
+{
+ "recommendations": ["dbaeumer.vscode-eslint", "esbenp.prettier-vscode"]
+}
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 3ec4ceec5b..287de60920 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -33,8 +33,9 @@ Before proceeding with development, ensure you match one of the following criter
- Auto-build and auto-test files as you edit by running `pnpm dev`
- Implement your changes and tests
- To run examples, follow their individual directions. Usually this includes:
- - Installing dependencies with `pnpm install` (from the root directory of the workspace)
- - Starting the dev server with `pnpm start` (from the example directory)
+ - cd into the example directory
+ - Do NOT install dependencies again or do any linking. Nx already handles this for you. Only run install from the project root.
+ - Starting the dev server with `pnpm dev` or `pnpm start` (from the example directory)
- To test in your own projects:
- Build/watch for changes with `pnpm build`/`pnpm dev`
- Document your changes in the appropriate documentation website markdown pages
diff --git a/README.md b/README.md
index 3b5b5284ee..4490fe2758 100644
--- a/README.md
+++ b/README.md
@@ -1,141 +1,117 @@
-
+
+

+
-# [TanStack](https://tanstack.com) Table v8
+
-Headless UI for building **powerful tables & datagrids** for **React, Solid, Vue, Svelte, Qwik and TS/JS**.
-
-
-
-
-
-
-
+
+
+
-
-
-
-
-
-
-
-
-
-
-> [Looking for version 7 of `react-table`? Click here!](https://github.com/tanstack/table/tree/v7)
-
-## Enjoy this library?
-
-Try other [TanStack](https://tanstack.com) libraries:
-
-- [TanStack Query](https://github.com/TanStack/query)

-- [TanStack Table](https://github.com/TanStack/table)

-- [TanStack Router](https://github.com/TanStack/router)

-- [TanStack Virtual](https://github.com/TanStack/virtual)

-- [TanStack Form](https://github.com/TanStack/form)

-- [TanStack Ranger](https://github.com/TanStack/ranger)

-
-## Visit [tanstack.com/table](https://tanstack.com/table) for docs, guides, API and more!
-
-You may know **TanStack Table** by our adapter names, too!
-
-- [Angular Table](https://tanstack.com/table/v8/docs/framework/angular/angular-table)
-- [Lit Table](https://tanstack.com/table/v8/docs/framework/lit/lit-table)
-- [Qwik Table](https://tanstack.com/table/v8/docs/framework/qwik/qwik-table)
-- [**React Table**](https://tanstack.com/table/v8/docs/framework/react/react-table)
-- [Solid Table](https://tanstack.com/table/v8/docs/framework/solid/solid-table)
-- [Svelte Table](https://tanstack.com/table/v8/docs/framework/svelte/svelte-table)
-- [Vue Table](https://tanstack.com/table/v8/docs/framework/vue/vue-table)
-
-## Summary
-
-TanStack Table is a **headless** table library, which means it does not ship with components, markup or styles. This means that you have **full control** over markup and styles (CSS, CSS-in-JS, UI Component Libraries, etc) and this is also what gives it its portable nature. You can even use it in React Native!
-
-If you want a **lightweight table with full control over markup and implementation**, then you should consider using **TanStack Table, a headless table library**.
-
-If you want a **ready-to-use component-based table with more power but more constraints around markup/styles/implementation**, you should consider using [AG Grid](https://ag-grid.com/react-data-grid/?utm_source=reacttable&utm_campaign=githubreacttable), a component-based table library from our OSS partner [AG Grid](https://ag-grid.com).
-
-TanStack Table and AG Grid are respectfully the
-**best table/datagrid libraries around**. Instead
-of competing, we're working together to ensure the highest
-quality table/datagrid options are available for the entire
-JS/TS ecosystem and every use-case.
-
-## Quick Features
-
-- Agnostic core (JS/TS)
-- 1st-class framework bindings for React, Vue, Solid
-- ~15kb or less (with tree-shaking)
-- 100% TypeScript (but not required)
-- Headless (100% customizable, Bring-your-own-UI)
-- Auto out of the box, opt-in controllable state
-- Filters (column and global)
-- Sorting (multi-column, multi-directional)
-- Grouping & Aggregation
-- Pivoting (coming soon!)
-- Row Selection
-- Row Expansion
-- Column Visibility/Ordering/Pinning/Resizing
-- Table Splitting
-- Animatable
-- Virtualizable
-- Server-side/external data model support
-
-# Migrating from React Table v7
-
-## Notable Changes
-
-- Full rewrite to TypeScript with types included in the base package
-- Removal of plugin system to favor more inversion of control
-- Vastly larger and improved API (and new features like pinning)
-- Better controlled state management
-- Better support for server-side operations
-- Complete (but optional) data pipeline control
-- Agnostic core with framework adapters for React, Solid, Svelte, Vue, and potentially more in the future
-- New Dev Tools
-
-## Migration
-
-There are a fair amount of breaking changes (they're worth it, trust us!):
-
-- Turns out that TypeScript makes your code **a lot** better/safer, but also usually requires breaking changes to architecture.
-- Plugin system has been removed so plugins must be rewritten to wrap/compose the new functional API. Contact us if you need help!
-- Column configuration options have changed, but only slightly.
-- Table options are mostly the same, with some larger changes around optional state management/control and data pipeline control
-- The `table` instance while similar in spirit to v7 has been reconfigured to be much faster.
-
-## Installation
-
-Install one of the following packages based on your framework of choice:
-
-```bash
-# Npm
-npm install @tanstack/angular-table
-npm install @tanstack/lit-table
-npm install @tanstack/qwik-table
-npm install @tanstack/react-table
-npm install @tanstack/solid-table
-npm install @tanstack/svelte-table
-npm install @tanstack/vue-table
-npm install @tanstack/table-core #vanilla js that can work with any framework
-```
-
-## How to help?
-
-- Try out the already-migrated examples
-- Try it out in your own projects.
-- Introspect the types! Even without the docs finished, the library ships with 100% typescript to help you explore its capabilities.
-- [Read the contribution guidelines](https://github.com/tanstack/table/tree/main/CONTRIBUTING.md)
-- Write some docs! Start with the [API docs](https://github.com/TanStack/react-table/tree/main/docs/api) and try adding some information about one or more of the features. The types do a decent job of showing what's supported and the capabilities of the library.
-- **Using a plugin?** Try rewriting your plugin (v8 doesn't have a plugin system any more) as a functional wrapper that uses TanStack Table internally. The new API is much more powerful and easier to compose. If you find something you can't figure out, let us know and we'll add it to the API.
-
-### [Become a Sponsor](https://github.com/sponsors/tannerlinsley/)
+

+

+
+
+### [Become a Sponsor!](https://github.com/sponsors/tannerlinsley/)
+
+
+
+# TanStack Table
+
+> [!NOTE]
+> You may know TanStack Table by the adapter names:
+>
+> - [Angular Table](https://tanstack.com/table/alpha/docs/framework/angular/angular-table)
+> - [Lit Table](https://tanstack.com/table/alpha/docs/framework/lit/lit-table)
+> - [React Table](https://tanstack.com/table/alpha/docs/framework/react/react-table)
+> - [Solid Table](https://tanstack.com/table/alpha/docs/framework/solid/solid-table)
+> - [Svelte Table](https://tanstack.com/table/alpha/docs/framework/svelte/svelte-table)
+> - [Vue Table](https://tanstack.com/table/alpha/docs/framework/vue/vue-table)
+
+A headless table library for building powerful datagrids with full control over markup, styles, and behavior.
+
+- Framework‑agnostic core with bindings for React, Vue & Solid
+- 100% customizable — bring your own UI, components, and styles
+- Sorting, filtering, grouping, aggregation & row selection
+- Lightweight, virtualizable & server‑side friendly
+
+### Read the Docs →
+
+## Get Involved
+
+- We welcome issues and pull requests!
+- Participate in [GitHub discussions](https://github.com/TanStack/table/discussions)
+- Chat with the community on [Discord](https://discord.com/invite/WrRKjPJ)
+- See [CONTRIBUTING.md](./CONTRIBUTING.md) for setup instructions
+
+## Partners
+
+
+
+
+

+
+We're looking for TanStack Table Partners to join our mission! Partner with us to push the boundaries of TanStack Table and build amazing things together.
+
+
LET'S CHAT
+
+
+## Explore the TanStack Ecosystem
+
+- TanStack Config – Tooling for JS/TS packages
+- TanStack DB – Reactive sync client store
+- TanStack DevTools – Unified devtools panel
+- TanStack Form – Type‑safe form state
+- TanStack Pacer – Debouncing, throttling, batching
+- TanStack Query – Async state & caching
+- TanStack Ranger – Range & slider primitives
+- TanStack Router – Type‑safe routing, caching & URL state
+- TanStack Start – Full‑stack SSR & streaming
+- TanStack Store – Reactive data store
+- TanStack Virtual – Virtualized rendering
+
+… and more at TanStack.com »
diff --git a/babel.config.cjs b/babel.config.cjs
deleted file mode 100644
index 84a3ee4ebe..0000000000
--- a/babel.config.cjs
+++ /dev/null
@@ -1,35 +0,0 @@
-const { NODE_ENV, BABEL_ENV } = process.env
-const cjs = NODE_ENV === 'test' || BABEL_ENV === 'commonjs'
-const loose = true
-
-module.exports = {
- targets: 'defaults, not ie 11, not ie_mob 11',
- presets: [
- [
- '@babel/preset-env',
- {
- loose,
- modules: false,
- include: [
- '@babel/plugin-proposal-nullish-coalescing-operator',
- '@babel/plugin-proposal-optional-chaining',
- ],
- // exclude: ['@babel/plugin-transform-regenerator'],
- },
- ],
- '@babel/react',
- '@babel/preset-typescript',
- ],
- plugins: [
- cjs && ['@babel/transform-modules-commonjs', { loose }],
- // [
- // '@babel/transform-runtime',
- // {
- // useESModules: !cjs,
- // version: require('./package.json').dependencies[
- // '@babel/runtime'
- // ].replace(/^[^0-9]*/, ''),
- // },
- // ],
- ].filter(Boolean),
-}
diff --git a/docs/api/core/cell.md b/docs/api/core/cell.md
deleted file mode 100644
index 6c1ff4a073..0000000000
--- a/docs/api/core/cell.md
+++ /dev/null
@@ -1,68 +0,0 @@
----
-title: Cell APIs
----
-
-These are **core** options and API properties for all cells. More options and API properties are available for other [table features](../../../guide/features).
-
-## Cell API
-
-All cell objects have the following properties:
-
-### `id`
-
-```tsx
-id: string
-```
-
-The unique ID for the cell across the entire table.
-
-### `getValue`
-
-```tsx
-getValue: () => any
-```
-
-Returns the value for the cell, accessed via the associated column's accessor key or accessor function.
-
-### `renderValue`
-
-```tsx
-renderValue: () => any
-```
-
-Renders the value for a cell the same as `getValue`, but will return the `renderFallbackValue` if no value is found.
-
-### `row`
-
-```tsx
-row: Row
-```
-
-The associated Row object for the cell.
-
-### `column`
-
-```tsx
-column: Column
-```
-
-The associated Column object for the cell.
-
-### `getContext`
-
-```tsx
-getContext: () => {
- table: Table
- column: Column
- row: Row
- cell: Cell
- getValue: () => TTValue
- renderValue: () => TTValue | null
-}
-```
-
-Returns the rendering context (or props) for cell-based components like cells and aggregated cells. Use these props with your framework's `flexRender` utility to render these using the template of your choice:
-
-```tsx
-flexRender(cell.column.columnDef.cell, cell.getContext())
-```
diff --git a/docs/api/core/column-def.md b/docs/api/core/column-def.md
deleted file mode 100644
index 3522e9da62..0000000000
--- a/docs/api/core/column-def.md
+++ /dev/null
@@ -1,107 +0,0 @@
----
-title: ColumnDef APIs
----
-
-Column definitions are plain objects with the following options:
-
-## Options
-
-### `id`
-
-```tsx
-id: string
-```
-
-The unique identifier for the column.
-
-> 🧠 A column ID is optional when:
->
-> - An accessor column is created with an object key accessor
-> - The column header is defined as a string
-
-### `accessorKey`
-
-```tsx
-accessorKey?: string & typeof TData
-```
-
-The key of the row object to use when extracting the value for the column.
-
-### `accessorFn`
-
-```tsx
-accessorFn?: (originalRow: TData, index: number) => any
-```
-
-The accessor function to use when extracting the value for the column from each row.
-
-### `columns`
-
-```tsx
-columns?: ColumnDef[]
-```
-
-The child column defs to include in a group column.
-
-### `header`
-
-```tsx
-header?:
- | string
- | ((props: {
- table: Table
- header: Header
- column: Column
- }) => unknown)
-```
-
-The header to display for the column. If a string is passed, it can be used as a default for the column ID. If a function is passed, it will be passed a props object for the header and should return the rendered header value (the exact type depends on the adapter being used).
-
-### `footer`
-
-```tsx
-footer?:
- | string
- | ((props: {
- table: Table
- header: Header
- column: Column
- }) => unknown)
-```
-
-The footer to display for the column. If a function is passed, it will be passed a props object for the footer and should return the rendered footer value (the exact type depends on the adapter being used).
-
-### `cell`
-
-```tsx
-cell?:
- | string
- | ((props: {
- table: Table
- row: Row
- column: Column
- cell: Cell
- getValue: () => any
- renderValue: () => any
- }) => unknown)
-```
-
-The cell to display each row for the column. If a function is passed, it will be passed a props object for the cell and should return the rendered cell value (the exact type depends on the adapter being used).
-
-### `meta`
-
-```tsx
-meta?: ColumnMeta // This interface is extensible via declaration merging. See below!
-```
-
-The meta data to be associated with the column. We can access it anywhere when the column is available via `column.columnDef.meta`. This type is global to all tables and can be extended like so:
-
-```tsx
-import '@tanstack/react-table' //or vue, svelte, solid, qwik, etc.
-
-declare module '@tanstack/react-table' {
- interface ColumnMeta {
- foo: string
- }
-}
-```
diff --git a/docs/api/core/column.md b/docs/api/core/column.md
deleted file mode 100644
index 626287b836..0000000000
--- a/docs/api/core/column.md
+++ /dev/null
@@ -1,77 +0,0 @@
----
-title: Column APIs
----
-
-These are **core** options and API properties for all columns. More options and API properties are available for other [table features](../../../guide/features).
-
-## Column API
-
-All column objects have the following properties:
-
-### `id`
-
-```tsx
-id: string
-```
-
-The resolved unique identifier for the column resolved in this priority:
-
-- A manual `id` property from the column def
-- The accessor key from the column def
-- The header string from the column def
-
-### `depth`
-
-```tsx
-depth: number
-```
-
-The depth of the column (if grouped) relative to the root column def array.
-
-### `accessorFn`
-
-```tsx
-accessorFn?: AccessorFn
-```
-
-The resolved accessor function to use when extracting the value for the column from each row. Will only be defined if the column def has a valid accessor key or function defined.
-
-### `columnDef`
-
-```tsx
-columnDef: ColumnDef
-```
-
-The original column def used to create the column.
-
-### `columns`
-
-```tsx
-type columns = ColumnDef[]
-```
-
-The child column (if the column is a group column). Will be an empty array if the column is not a group column.
-
-### `parent`
-
-```tsx
-parent?: Column
-```
-
-The parent column for this column. Will be undefined if this is a root column.
-
-### `getFlatColumns`
-
-```tsx
-type getFlatColumns = () => Column[]
-```
-
-Returns the flattened array of this column and all child/grand-child columns for this column.
-
-### `getLeafColumns`
-
-```tsx
-type getLeafColumns = () => Column[]
-```
-
-Returns an array of all leaf-node columns for this column. If a column has no children, it is considered the only leaf-node column.
diff --git a/docs/api/core/header-group.md b/docs/api/core/header-group.md
deleted file mode 100644
index 022e7bdff2..0000000000
--- a/docs/api/core/header-group.md
+++ /dev/null
@@ -1,33 +0,0 @@
----
-title: HeaderGroup APIs
----
-
-These are **core** options and API properties for all header groups. More options and API properties may be available for other [table features](../../../guide/features).
-
-## Header Group API
-
-All header group objects have the following properties:
-
-### `id`
-
-```tsx
-id: string
-```
-
-The unique identifier for the header group.
-
-### `depth`
-
-```tsx
-depth: number
-```
-
-The depth of the header group, zero-indexed based.
-
-### `headers`
-
-```tsx
-type headers = Header[]
-```
-
-An array of [Header](../header) objects that belong to this header group
diff --git a/docs/api/core/header.md b/docs/api/core/header.md
deleted file mode 100644
index 120a9fc29a..0000000000
--- a/docs/api/core/header.md
+++ /dev/null
@@ -1,243 +0,0 @@
----
-title: Header APIs
----
-
-These are **core** options and API properties for all headers. More options and API properties may be available for other [table features](../../../guide/features).
-
-## Header API
-
-All header objects have the following properties:
-
-### `id`
-
-```tsx
-id: string
-```
-
-The unique identifier for the header.
-
-### `index`
-
-```tsx
-index: number
-```
-
-The index for the header within the header group.
-
-### `depth`
-
-```tsx
-depth: number
-```
-
-The depth of the header, zero-indexed based.
-
-### `column`
-
-```tsx
-column: Column
-```
-
-The header's associated [Column](../column) object
-
-### `headerGroup`
-
-```tsx
-headerGroup: HeaderGroup
-```
-
-The header's associated [HeaderGroup](../header-group) object
-
-### `subHeaders`
-
-```tsx
-type subHeaders = Header[]
-```
-
-The header's hierarchical sub/child headers. Will be empty if the header's associated column is a leaf-column.
-
-### `colSpan`
-
-```tsx
-colSpan: number
-```
-
-The col-span for the header.
-
-### `rowSpan`
-
-```tsx
-rowSpan: number
-```
-
-The row-span for the header.
-
-### `getLeafHeaders`
-
-```tsx
-type getLeafHeaders = () => Header[]
-```
-
-Returns the leaf headers hierarchically nested under this header.
-
-### `isPlaceholder`
-
-```tsx
-isPlaceholder: boolean
-```
-
-A boolean denoting if the header is a placeholder header
-
-### `placeholderId`
-
-```tsx
-placeholderId?: string
-```
-
-If the header is a placeholder header, this will be a unique header ID that does not conflict with any other headers across the table
-
-### `getContext`
-
-```tsx
-getContext: () => {
- table: Table
- header: Header
- column: Column
-}
-```
-
-Returns the rendering context (or props) for column-based components like headers, footers and filters. Use these props with your framework's `flexRender` utility to render these using the template of your choice:
-
-```tsx
-flexRender(header.column.columnDef.header, header.getContext())
-```
-
-## Table API
-
-### `getHeaderGroups`
-
-```tsx
-type getHeaderGroups = () => HeaderGroup[]
-```
-
-Returns all header groups for the table.
-
-### `getLeftHeaderGroups`
-
-```tsx
-type getLeftHeaderGroups = () => HeaderGroup[]
-```
-
-If pinning, returns the header groups for the left pinned columns.
-
-### `getCenterHeaderGroups`
-
-```tsx
-type getCenterHeaderGroups = () => HeaderGroup[]
-```
-
-If pinning, returns the header groups for columns that are not pinned.
-
-### `getRightHeaderGroups`
-
-```tsx
-type getRightHeaderGroups = () => HeaderGroup[]
-```
-
-If pinning, returns the header groups for the right pinned columns.
-
-### `getFooterGroups`
-
-```tsx
-type getFooterGroups = () => HeaderGroup[]
-```
-
-Returns all footer groups for the table.
-
-### `getLeftFooterGroups`
-
-```tsx
-type getLeftFooterGroups = () => HeaderGroup[]
-```
-
-If pinning, returns the footer groups for the left pinned columns.
-
-### `getCenterFooterGroups`
-
-```tsx
-type getCenterFooterGroups = () => HeaderGroup[]
-```
-
-If pinning, returns the footer groups for columns that are not pinned.
-
-### `getRightFooterGroups`
-
-```tsx
-type getRightFooterGroups = () => HeaderGroup[]
-```
-
-If pinning, returns the footer groups for the right pinned columns.
-
-### `getFlatHeaders`
-
-```tsx
-type getFlatHeaders = () => Header[]
-```
-
-Returns headers for all columns in the table, including parent headers.
-
-### `getLeftFlatHeaders`
-
-```tsx
-type getLeftFlatHeaders = () => Header[]
-```
-
-If pinning, returns headers for all left pinned columns in the table, including parent headers.
-
-### `getCenterFlatHeaders`
-
-```tsx
-type getCenterFlatHeaders = () => Header[]
-```
-
-If pinning, returns headers for all columns that are not pinned, including parent headers.
-
-### `getRightFlatHeaders`
-
-```tsx
-type getRightFlatHeaders = () => Header[]
-```
-
-If pinning, returns headers for all right pinned columns in the table, including parent headers.
-
-### `getLeafHeaders`
-
-```tsx
-type getLeafHeaders = () => Header[]
-```
-
-Returns headers for all leaf columns in the table, (not including parent headers).
-
-### `getLeftLeafHeaders`
-
-```tsx
-type getLeftLeafHeaders = () => Header[]
-```
-
-If pinning, returns headers for all left pinned leaf columns in the table, (not including parent headers).
-
-### `getCenterLeafHeaders`
-
-```tsx
-type getCenterLeafHeaders = () => Header[]
-```
-
-If pinning, returns headers for all columns that are not pinned, (not including parent headers).
-
-### `getRightLeafHeaders`
-
-```tsx
-type getRightLeafHeaders = () => Header[]
-```
-
-If pinning, returns headers for all right pinned leaf columns in the table, (not including parent headers).
diff --git a/docs/api/core/row.md b/docs/api/core/row.md
deleted file mode 100644
index b010df2811..0000000000
--- a/docs/api/core/row.md
+++ /dev/null
@@ -1,123 +0,0 @@
----
-title: Row APIs
----
-
-These are **core** options and API properties for all rows. More options and API properties are available for other [table features](../../../guide/features).
-
-## Row API
-
-All row objects have the following properties:
-
-### `id`
-
-```tsx
-id: string
-```
-
-The resolved unique identifier for the row resolved via the `options.getRowId` option. Defaults to the row's index (or relative index if it is a subRow)
-
-### `depth`
-
-```tsx
-depth: number
-```
-
-The depth of the row (if nested or grouped) relative to the root row array.
-
-### `index`
-
-```tsx
-index: number
-```
-
-The index of the row within its parent array (or the root data array)
-
-### `original`
-
-```tsx
-original: TData
-```
-
-The original row object provided to the table.
-
-> 🧠 If the row is a grouped row, the original row object will be the first original in the group.
-
-### `parentId`
-
-```tsx
-parentId?: string
-```
-
-If nested, this row's parent row id.
-
-### `getValue`
-
-```tsx
-getValue: (columnId: string) => TValue
-```
-
-Returns the value from the row for a given columnId
-
-### `renderValue`
-
-```tsx
-renderValue: (columnId: string) => TValue
-```
-
-Renders the value from the row for a given columnId, but will return the `renderFallbackValue` if no value is found.
-
-### `getUniqueValues`
-
-```tsx
-getUniqueValues: (columnId: string) => TValue[]
-```
-
-Returns a unique array of values from the row for a given columnId.
-
-### `subRows`
-
-```tsx
-type subRows = Row[]
-```
-
-An array of subRows for the row as returned and created by the `options.getSubRows` option.
-
-### `getParentRow`
-
-```tsx
-type getParentRow = () => Row | undefined
-```
-
-Returns the parent row for the row, if it exists.
-
-### `getParentRows`
-
-```tsx
-type getParentRows = () => Row[]
-```
-
-Returns the parent rows for the row, all the way up to a root row.
-
-### `getLeafRows`
-
-```tsx
-type getLeafRows = () => Row[]
-```
-
-Returns the leaf rows for the row, not including any parent rows.
-
-### `originalSubRows`
-
-```tsx
-originalSubRows?: TData[]
-```
-
-An array of the original subRows as returned by the `options.getSubRows` option.
-
-### `getAllCells`
-
-```tsx
-type getAllCells = () => Cell[]
-```
-
-Returns all of the [Cells](../cell) for the row.
diff --git a/docs/api/core/table.md b/docs/api/core/table.md
deleted file mode 100644
index bd2415bf57..0000000000
--- a/docs/api/core/table.md
+++ /dev/null
@@ -1,385 +0,0 @@
----
-title: Table APIs
----
-
-## `createAngularTable` / `useReactTable` / `createSolidTable` / `useQwikTable` / `useVueTable` / `createSvelteTable`
-
-```tsx
-type useReactTable = (
- options: TableOptions
-) => Table
-```
-
-These functions are used to create a table. Which one you use depends on which framework adapter you are using.
-
-## Options
-
-These are **core** options and API properties for the table. More options and API properties are available for other [table features](../../../guide/features).
-
-### `data`
-
-```tsx
-data: TData[]
-```
-
-The data for the table to display. This array should match the type you provided to `table.setRowType<...>`, but in theory could be an array of anything. It's common for each item in the array to be an object of key/values but this is not required. Columns can access this data via string/index or a functional accessor to return anything they want.
-
-When the `data` option changes reference (compared via `Object.is`), the table will reprocess the data. Any other data processing that relies on the core data model (such as grouping, sorting, filtering, etc) will also be reprocessed.
-
-> 🧠 Make sure your `data` option is only changing when you want the table to reprocess. Providing an inline `[]` or constructing the data array as a new object every time you want to render the table will result in a _lot_ of unnecessary re-processing. This can easily go unnoticed in smaller tables, but you will likely notice it in larger tables.
-
-### `columns`
-
-```tsx
-type columns = ColumnDef[]
-```
-
-The array of column defs to use for the table. See the [Column Defs Guide](../../docs/guide/column-defs) for more information on creating column definitions.
-
-### `defaultColumn`
-
-```tsx
-defaultColumn?: Partial>
-```
-
-Default column options to use for all column defs supplied to the table. This is useful for providing default cell/header/footer renderers, sorting/filtering/grouping options, etc. All column definitions passed to `options.columns` are merged with this default column definition to produce the final column definitions.
-
-### `initialState`
-
-```tsx
-initialState?: Partial<
- VisibilityTableState &
- ColumnOrderTableState &
- ColumnPinningTableState &
- FiltersTableState &
- SortingTableState &
- ExpandedTableState &
- GroupingTableState &
- ColumnSizingTableState &
- PaginationTableState &
- RowSelectionTableState
->
-```
-
-Use this option to optionally pass initial state to the table. This state will be used when resetting various table states either automatically by the table (eg. `options.autoResetPageIndex`) or via functions like `table.resetRowSelection()`. Most reset function allow you optionally pass a flag to reset to a blank/default state instead of the initial state.
-
-> 🧠 Table state will not be reset when this object changes, which also means that the initial state object does not need to be stable.
-
-### `autoResetAll`
-
-```tsx
-autoResetAll?: boolean
-```
-
-Set this option to override any of the `autoReset...` feature options.
-
-### `meta`
-
-```tsx
-meta?: TableMeta // This interface is extensible via declaration merging. See below!
-```
-
-You can pass any object to `options.meta` and access it anywhere the `table` is available via `table.options.meta` This type is global to all tables and can be extended like so:
-
-```tsx
-declare module '@tanstack/table-core' {
- interface TableMeta {
- foo: string
- }
-}
-```
-
-> 🧠 Think of this option as an arbitrary "context" for your table. This is a great way to pass arbitrary data or functions to your table without having to pass it to every thing the table touches. A good example is passing a locale object to your table to use for formatting dates, numbers, etc or even a function that can be used to update editable data like in the [editable-data example](../../../framework/react/examples/editable-data).
-
-### `state`
-
-```tsx
-state?: Partial<
- VisibilityTableState &
- ColumnOrderTableState &
- ColumnPinningTableState &
- FiltersTableState &
- SortingTableState &
- ExpandedTableState &
- GroupingTableState &
- ColumnSizingTableState &
- PaginationTableState &
- RowSelectionTableState
->
-```
-
-The `state` option can be used to optionally _control_ part or all of the table state. The state you pass here will merge with and overwrite the internal automatically-managed state to produce the final state for the table. You can also listen to state changes via the `onStateChange` option.
-
-### `onStateChange`
-
-```tsx
-onStateChange: (updater: Updater) => void
-```
-
-The `onStateChange` option can be used to optionally listen to state changes within the table. If you provide this options, you will be responsible for controlling and updating the table state yourself. You can provide the state back to the table with the `state` option.
-
-### `debugAll`
-
-> ⚠️ Debugging is only available in development mode.
-
-```tsx
-debugAll?: boolean
-```
-
-Set this option to true to output all debugging information to the console.
-
-### `debugTable`
-
-> ⚠️ Debugging is only available in development mode.
-
-```tsx
-debugTable?: boolean
-```
-
-Set this option to true to output table debugging information to the console.
-
-### `debugHeaders`
-
-> ⚠️ Debugging is only available in development mode.
-
-```tsx
-debugHeaders?: boolean
-```
-
-Set this option to true to output header debugging information to the console.
-
-### `debugColumns`
-
-> ⚠️ Debugging is only available in development mode.
-
-```tsx
-debugColumns?: boolean
-```
-
-Set this option to true to output column debugging information to the console.
-
-### `debugRows`
-
-> ⚠️ Debugging is only available in development mode.
-
-```tsx
-debugRows?: boolean
-```
-
-Set this option to true to output row debugging information to the console.
-
-### `_features`
-
-```tsx
-_features?: TableFeature[]
-```
-
-An array of extra features that you can add to the table instance.
-
-### `render`
-
-> ⚠️ This option is only necessary if you are implementing a table adapter.
-
-```tsx
-type render = (template: Renderable, props: TProps) => any
-```
-
-The `render` option provides a renderer implementation for the table. This implementation is used to turn a table's various column header and cell templates into a result that is supported by the user's framework.
-
-### `mergeOptions`
-
-> ⚠️ This option is only necessary if you are implementing a table adapter.
-
-```tsx
-type mergeOptions = (defaultOptions: T, options: Partial) => T
-```
-
-This option is used to optionally implement the merging of table options. Some framework like solid-js use proxies to track reactivity and usage, so merging reactive objects needs to be handled carefully. This option inverts control of this process to the adapter.
-
-### `getCoreRowModel`
-
-```tsx
-getCoreRowModel: (table: Table) => () => RowModel
-```
-
-This required option is a factory for a function that computes and returns the core row model for the table. It is called **once** per table and should return a **new function** which will calculate and return the row model for the table.
-
-A default implementation is provided via any table adapter's `{ getCoreRowModel }` export.
-
-### `getSubRows`
-
-```tsx
-getSubRows?: (
- originalRow: TData,
- index: number
-) => undefined | TData[]
-```
-
-This optional function is used to access the sub rows for any given row. If you are using nested rows, you will need to use this function to return the sub rows object (or undefined) from the row.
-
-### `getRowId`
-
-```tsx
-getRowId?: (
- originalRow: TData,
- index: number,
- parent?: Row
-) => string
-```
-
-This optional function is used to derive a unique ID for any given row. If not provided the rows index is used (nested rows join together with `.` using their grandparents' index eg. `index.index.index`). If you need to identify individual rows that are originating from any server-side operations, it's suggested you use this function to return an ID that makes sense regardless of network IO/ambiguity eg. a userId, taskId, database ID field, etc.
-
-## Table API
-
-These properties and methods are available on the table object:
-
-### `initialState`
-
-```tsx
-initialState: VisibilityTableState &
- ColumnOrderTableState &
- ColumnPinningTableState &
- FiltersTableState &
- SortingTableState &
- ExpandedTableState &
- GroupingTableState &
- ColumnSizingTableState &
- PaginationTableState &
- RowSelectionTableState
-```
-
-This is the resolved initial state of the table.
-
-### `reset`
-
-```tsx
-reset: () => void
-```
-
-Call this function to reset the table state to the initial state.
-
-### `getState`
-
-```tsx
-getState: () => TableState
-```
-
-Call this function to get the table's current state. It's recommended to use this function and its state, especially when managing the table state manually. It is the exact same state used internally by the table for every feature and function it provides.
-
-> 🧠 The state returned by this function is the shallow-merged result of the automatically-managed internal table-state and any manually-managed state passed via `options.state`.
-
-### `setState`
-
-```tsx
-setState: (updater: Updater) => void
-```
-
-Call this function to update the table state. It's recommended you pass an updater function in the form of `(prevState) => newState` to update the state, but a direct object can also be passed.
-
-> 🧠 If `options.onStateChange` is provided, it will be triggered by this function with the new state.
-
-### `options`
-
-```tsx
-options: TableOptions
-```
-
-A read-only reference to the table's current options.
-
-> ⚠️ This property is generally used internally or by adapters. It can be updated by passing new options to your table. This is different per adapter. For adapters themselves, table options must be updated via the `setOptions` function.
-
-### `setOptions`
-
-```tsx
-setOptions: (newOptions: Updater>) => void
-```
-
-> ⚠️ This function is generally used by adapters to update the table options. It can be used to update the table options directly, but it is generally not recommended to bypass your adapters strategy for updating table options.
-
-### `getCoreRowModel`
-
-```tsx
-getCoreRowModel: () => {
- rows: Row[],
- flatRows: Row[],
- rowsById: Record>,
-}
-```
-
-Returns the core row model before any processing has been applied.
-
-### `getRowModel`
-
-```tsx
-getRowModel: () => {
- rows: Row[],
- flatRows: Row[],
- rowsById: Record>,
-}
-```
-
-Returns the final model after all processing from other used features has been applied.
-
-### `getAllColumns`
-
-```tsx
-type getAllColumns = () => Column[]
-```
-
-Returns all columns in the table in their normalized and nested hierarchy, mirrored from the column defs passed to the table.
-
-### `getAllFlatColumns`
-
-```tsx
-type getAllFlatColumns = () => Column[]
-```
-
-Returns all columns in the table flattened to a single level. This includes parent column objects throughout the hierarchy.
-
-### `getAllLeafColumns`
-
-```tsx
-type getAllLeafColumns = () => Column[]
-```
-
-Returns all leaf-node columns in the table flattened to a single level. This does not include parent columns.
-
-### `getColumn`
-
-```tsx
-type getColumn = (id: string) => Column | undefined
-```
-
-Returns a single column by its ID.
-
-### `getHeaderGroups`
-
-```tsx
-type getHeaderGroups = () => HeaderGroup[]
-```
-
-Returns the header groups for the table.
-
-### `getFooterGroups`
-
-```tsx
-type getFooterGroups = () => HeaderGroup[]
-```
-
-Returns the footer groups for the table.
-
-### `getFlatHeaders`
-
-```tsx
-type getFlatHeaders = () => Header[]
-```
-
-Returns a flattened array of Header objects for the table, including parent headers.
-
-### `getLeafHeaders`
-
-```tsx
-type getLeafHeaders = () => Header[]
-```
-
-Returns a flattened array of leaf-node Header objects for the table.
diff --git a/docs/api/features/column-faceting.md b/docs/api/features/column-faceting.md
deleted file mode 100644
index 2a951da447..0000000000
--- a/docs/api/features/column-faceting.md
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Column Faceting APIs
-id: column-faceting
----
-
-## Column API
-
-### `getFacetedRowModel`
-
-```tsx
-type getFacetedRowModel = () => RowModel
-```
-
-> ⚠️ Requires that you pass a valid `getFacetedRowModel` function to `options.facetedRowModel`. A default implementation is provided via the exported `getFacetedRowModel` function.
-
-Returns the row model with all other column filters applied, excluding its own filter. Useful for displaying faceted result counts.
-
-### `getFacetedUniqueValues`
-
-```tsx
-getFacetedUniqueValues: () => Map
-```
-
-> ⚠️ Requires that you pass a valid `getFacetedUniqueValues` function to `options.getFacetedUniqueValues`. A default implementation is provided via the exported `getFacetedUniqueValues` function.
-
-A function that **computes and returns** a `Map` of unique values and their occurrences derived from `column.getFacetedRowModel`. Useful for displaying faceted result values.
-
-### `getFacetedMinMaxValues`
-
-```tsx
-getFacetedMinMaxValues: () => Map
-```
-
-> ⚠️ Requires that you pass a valid `getFacetedMinMaxValues` function to `options.getFacetedMinMaxValues`. A default implementation is provided via the exported `getFacetedMinMaxValues` function.
-
-A function that **computes and returns** a min/max tuple derived from `column.getFacetedRowModel`. Useful for displaying faceted result values.
-
-## Table Options
-
-### `getColumnFacetedRowModel`
-
-```tsx
-getColumnFacetedRowModel: (columnId: string) => RowModel
-```
-
-Returns the faceted row model for a given columnId.
diff --git a/docs/api/features/column-filtering.md b/docs/api/features/column-filtering.md
deleted file mode 100644
index b32d4f314c..0000000000
--- a/docs/api/features/column-filtering.md
+++ /dev/null
@@ -1,396 +0,0 @@
----
-title: Column Filtering APIs
-id: column-filtering
----
-
-## Can-Filter
-
-The ability for a column to be **column** filtered is determined by the following:
-
-- The column was defined with a valid `accessorKey`/`accessorFn`.
-- `column.enableColumnFilter` is not set to `false`
-- `options.enableColumnFilters` is not set to `false`
-- `options.enableFilters` is not set to `false`
-
-## State
-
-Filter state is stored on the table using the following shape:
-
-```tsx
-export interface ColumnFiltersTableState {
- columnFilters: ColumnFiltersState
-}
-
-export type ColumnFiltersState = ColumnFilter[]
-
-export interface ColumnFilter {
- id: string
- value: unknown
-}
-```
-
-## Filter Functions
-
-The following filter functions are built-in to the table core:
-
-- `includesString`
- - Case-insensitive string inclusion
-- `includesStringSensitive`
- - Case-sensitive string inclusion
-- `equalsString`
- - Case-insensitive string equality
-- `equalsStringSensitive`
- - Case-sensitive string equality
-- `arrIncludes`
- - Item inclusion within an array
-- `arrIncludesAll`
- - All items included in an array
-- `arrIncludesSome`
- - Some items included in an array
-- `equals`
- - Object/referential equality `Object.is`/`===`
-- `weakEquals`
- - Weak object/referential equality `==`
-- `inNumberRange`
- - Number range inclusion
-
-Every filter function receives:
-
-- The row to filter
-- The columnId to use to retrieve the row's value
-- The filter value
-
-and should return `true` if the row should be included in the filtered rows, and `false` if it should be removed.
-
-This is the type signature for every filter function:
-
-```tsx
-export type FilterFn = {
- (
- row: Row,
- columnId: string,
- filterValue: any,
- addMeta: (meta: any) => void
- ): boolean
- resolveFilterValue?: TransformFilterValueFn
- autoRemove?: ColumnFilterAutoRemoveTestFn
- addMeta?: (meta?: any) => void
-}
-
-export type TransformFilterValueFn = (
- value: any,
- column?: Column
-) => unknown
-
-export type ColumnFilterAutoRemoveTestFn = (
- value: any,
- column?: Column
-) => boolean
-
-export type CustomFilterFns = Record<
- string,
- FilterFn
->
-```
-
-### `filterFn.resolveFilterValue`
-
-This optional "hanging" method on any given `filterFn` allows the filter function to transform/sanitize/format the filter value before it is passed to the filter function.
-
-### `filterFn.autoRemove`
-
-This optional "hanging" method on any given `filterFn` is passed a filter value and expected to return `true` if the filter value should be removed from the filter state. eg. Some boolean-style filters may want to remove the filter value from the table state if the filter value is set to `false`.
-
-#### Using Filter Functions
-
-Filter functions can be used/referenced/defined by passing the following to `columnDefinition.filterFn`:
-
-- A `string` that references a built-in filter function
-- A function directly provided to the `columnDefinition.filterFn` option
-
-The final list of filter functions available for the `columnDef.filterFn` option use the following type:
-
-```tsx
-export type FilterFnOption =
- | 'auto'
- | BuiltInFilterFn
- | FilterFn
-```
-
-#### Filter Meta
-
-Filtering data can often expose additional information about the data that can be used to aid other future operations on the same data. A good example of this concept is a ranking-system like that of [`match-sorter`](https://github.com/kentcdodds/match-sorter) that simultaneously ranks, filters and sorts data. While utilities like `match-sorter` make a lot of sense for single-dimensional filter+sort tasks, the decoupled filtering/sorting architecture of building a table makes them very difficult and slow to use.
-
-To make a ranking/filtering/sorting system work with tables, `filterFn`s can optionally mark results with a **filter meta** value that can be used later to sort/group/etc the data to your liking. This is done by calling the `addMeta` function supplied to your custom `filterFn`.
-
-Below is an example using our own `match-sorter-utils` package (a utility fork of `match-sorter`) to rank, filter, and sort the data
-
-```tsx
-import { sortingFns } from '@tanstack/react-table'
-
-import { rankItem, compareItems } from '@tanstack/match-sorter-utils'
-
-const fuzzyFilter = (row, columnId, value, addMeta) => {
- // Rank the item
- const itemRank = rankItem(row.getValue(columnId), value)
-
- // Store the ranking info
- addMeta(itemRank)
-
- // Return if the item should be filtered in/out
- return itemRank.passed
-}
-
-const fuzzySort = (rowA, rowB, columnId) => {
- let dir = 0
-
- // Only sort by rank if the column has ranking information
- if (rowA.columnFiltersMeta[columnId]) {
- dir = compareItems(
- rowA.columnFiltersMeta[columnId]!,
- rowB.columnFiltersMeta[columnId]!
- )
- }
-
- // Provide an alphanumeric fallback for when the item ranks are equal
- return dir === 0 ? sortingFns.alphanumeric(rowA, rowB, columnId) : dir
-}
-```
-
-## Column Def Options
-
-### `filterFn`
-
-```tsx
-filterFn?: FilterFn | keyof FilterFns | keyof BuiltInFilterFns
-```
-
-The filter function to use with this column.
-
-Options:
-
-- A `string` referencing a [built-in filter function](#filter-functions))
-- A [custom filter function](#filter-functions)
-
-### `enableColumnFilter`
-
-```tsx
-enableColumnFilter?: boolean
-```
-
-Enables/disables the **column** filter for this column.
-
-## Column API
-
-### `getCanFilter`
-
-```tsx
-getCanFilter: () => boolean
-```
-
-Returns whether or not the column can be **column** filtered.
-
-### `getFilterIndex`
-
-```tsx
-getFilterIndex: () => number
-```
-
-Returns the index (including `-1`) of the column filter in the table's `state.columnFilters` array.
-
-### `getIsFiltered`
-
-```tsx
-getIsFiltered: () => boolean
-```
-
-Returns whether or not the column is currently filtered.
-
-### `getFilterValue`
-
-```tsx
-getFilterValue: () => unknown
-```
-
-Returns the current filter value of the column.
-
-### `setFilterValue`
-
-```tsx
-setFilterValue: (updater: Updater) => void
-```
-
-A function that sets the current filter value for the column. You can pass it a value or an updater function for immutability-safe operations on existing values.
-
-### `getAutoFilterFn`
-
-```tsx
-getAutoFilterFn: (columnId: string) => FilterFn | undefined
-```
-
-Returns an automatically calculated filter function for the column based off of the columns first known value.
-
-### `getFilterFn`
-
-```tsx
-getFilterFn: (columnId: string) => FilterFn | undefined
-```
-
-Returns the filter function (either user-defined or automatic, depending on configuration) for the columnId specified.
-
-## Row API
-
-### `columnFilters`
-
-```tsx
-columnFilters: Record
-```
-
-The column filters map for the row. This object tracks whether a row is passing/failing specific filters by their column ID.
-
-### `columnFiltersMeta`
-
-```tsx
-columnFiltersMeta: Record
-```
-
-The column filters meta map for the row. This object tracks any filter meta for a row as optionally provided during the filtering process.
-
-## Table Options
-
-### `filterFns`
-
-```tsx
-filterFns?: Record
-```
-
-This option allows you to define custom filter functions that can be referenced in a column's `filterFn` option by their key.
-Example:
-
-```tsx
-declare module '@tanstack/[adapter]-table' {
- interface FilterFns {
- myCustomFilter: FilterFn
- }
-}
-
-const column = columnHelper.data('key', {
- filterFn: 'myCustomFilter',
-})
-
-const table = useReactTable({
- columns: [column],
- filterFns: {
- myCustomFilter: (rows, columnIds, filterValue) => {
- // return the filtered rows
- },
- },
-})
-```
-
-### `filterFromLeafRows`
-
-```tsx
-filterFromLeafRows?: boolean
-```
-
-By default, filtering is done from parent rows down (so if a parent row is filtered out, all of its children will be filtered out as well). Setting this option to `true` will cause filtering to be done from leaf rows up (which means parent rows will be included so long as one of their child or grand-child rows is also included).
-
-### `maxLeafRowFilterDepth`
-
-```tsx
-maxLeafRowFilterDepth?: number
-```
-
-By default, filtering is done for all rows (max depth of 100), no matter if they are root level parent rows or the child leaf rows of a parent row. Setting this option to `0` will cause filtering to only be applied to the root level parent rows, with all sub-rows remaining unfiltered. Similarly, setting this option to `1` will cause filtering to only be applied to child leaf rows 1 level deep, and so on.
-
-This is useful for situations where you want a row's entire child hierarchy to be visible regardless of the applied filter.
-
-### `enableFilters`
-
-```tsx
-enableFilters?: boolean
-```
-
-Enables/disables all filters for the table.
-
-### `manualFiltering`
-
-```tsx
-manualFiltering?: boolean
-```
-
-Disables the `getFilteredRowModel` from being used to filter data. This may be useful if your table needs to dynamically support both client-side and server-side filtering.
-
-### `onColumnFiltersChange`
-
-```tsx
-onColumnFiltersChange?: OnChangeFn
-```
-
-If provided, this function will be called with an `updaterFn` when `state.columnFilters` changes. This overrides the default internal state management, so you will need to persist the state change either fully or partially outside of the table.
-
-### `enableColumnFilters`
-
-```tsx
-enableColumnFilters?: boolean
-```
-
-Enables/disables **all** column filters for the table.
-
-### `getFilteredRowModel`
-
-```tsx
-getFilteredRowModel?: (
- table: Table
-) => () => RowModel
-```
-
-If provided, this function is called **once** per table and should return a **new function** which will calculate and return the row model for the table when it's filtered.
-
-- For server-side filtering, this function is unnecessary and can be ignored since the server should already return the filtered row model.
-- For client-side filtering, this function is required. A default implementation is provided via any table adapter's `{ getFilteredRowModel }` export.
-
-Example:
-
-```tsx
-import { getFilteredRowModel } from '@tanstack/[adapter]-table'
-
-
- getFilteredRowModel: getFilteredRowModel(),
-})
-```
-
-## Table API
-
-### `setColumnFilters`
-
-```tsx
-setColumnFilters: (updater: Updater) => void
-```
-
-Sets or updates the `state.columnFilters` state.
-
-### `resetColumnFilters`
-
-```tsx
-resetColumnFilters: (defaultState?: boolean) => void
-```
-
-Resets the **columnFilters** state to `initialState.columnFilters`, or `true` can be passed to force a default blank state reset to `[]`.
-
-### `getPreFilteredRowModel`
-
-```tsx
-getPreFilteredRowModel: () => RowModel
-```
-
-Returns the row model for the table before any **column** filtering has been applied.
-
-### `getFilteredRowModel`
-
-```tsx
-getFilteredRowModel: () => RowModel
-```
-
-Returns the row model for the table after **column** filtering has been applied.
diff --git a/docs/api/features/column-ordering.md b/docs/api/features/column-ordering.md
deleted file mode 100644
index 37bfb95337..0000000000
--- a/docs/api/features/column-ordering.md
+++ /dev/null
@@ -1,70 +0,0 @@
----
-title: Column Ordering APIs
-id: column-ordering
----
-
-## State
-
-Column ordering state is stored on the table using the following shape:
-
-```tsx
-export type ColumnOrderTableState = {
- columnOrder: ColumnOrderState
-}
-
-export type ColumnOrderState = string[]
-```
-
-## Table Options
-
-### `onColumnOrderChange`
-
-```tsx
-onColumnOrderChange?: OnChangeFn
-```
-
-If provided, this function will be called with an `updaterFn` when `state.columnOrder` changes. This overrides the default internal state management, so you will need to persist the state change either fully or partially outside of the table.
-
-## Table API
-
-### `setColumnOrder`
-
-```tsx
-setColumnOrder: (updater: Updater) => void
-```
-
-Sets or updates the `state.columnOrder` state.
-
-### `resetColumnOrder`
-
-```tsx
-resetColumnOrder: (defaultState?: boolean) => void
-```
-
-Resets the **columnOrder** state to `initialState.columnOrder`, or `true` can be passed to force a default blank state reset to `[]`.
-
-## Column API
-
-### `getIndex`
-
-```tsx
-getIndex: (position?: ColumnPinningPosition) => number
-```
-
-Returns the index of the column in the order of the visible columns. Optionally pass a `position` parameter to get the index of the column in a sub-section of the table.
-
-### `getIsFirstColumn`
-
-```tsx
-getIsFirstColumn: (position?: ColumnPinningPosition) => boolean
-```
-
-Returns `true` if the column is the first column in the order of the visible columns. Optionally pass a `position` parameter to check if the column is the first in a sub-section of the table.
-
-### `getIsLastColumn`
-
-```tsx
-getIsLastColumn: (position?: ColumnPinningPosition) => boolean
-```
-
-Returns `true` if the column is the last column in the order of the visible columns. Optionally pass a `position` parameter to check if the column is the last in a sub-section of the table.
\ No newline at end of file
diff --git a/docs/api/features/column-pinning.md b/docs/api/features/column-pinning.md
deleted file mode 100644
index a312b33823..0000000000
--- a/docs/api/features/column-pinning.md
+++ /dev/null
@@ -1,266 +0,0 @@
----
-title: Column Pinning APIs
-id: column-pinning
----
-
-## Can-Pin
-
-The ability for a column to be **pinned** is determined by the following:
-
-- `options.enablePinning` is not set to `false`
-- `options.enableColumnPinning` is not set to `false`
-- `columnDefinition.enablePinning` is not set to `false`
-
-## State
-
-Pinning state is stored on the table using the following shape:
-
-```tsx
-export type ColumnPinningPosition = false | 'left' | 'right'
-
-export type ColumnPinningState = {
- left?: string[]
- right?: string[]
-}
-
-
-export type ColumnPinningTableState = {
- columnPinning: ColumnPinningState
-}
-```
-
-## Table Options
-
-### `enableColumnPinning`
-
-```tsx
-enableColumnPinning?: boolean
-```
-
-Enables/disables column pinning for all columns in the table.
-
-### `onColumnPinningChange`
-
-```tsx
-onColumnPinningChange?: OnChangeFn
-```
-
-If provided, this function will be called with an `updaterFn` when `state.columnPinning` changes. This overrides the default internal state management, so you will also need to supply `state.columnPinning` from your own managed state.
-
-## Column Def Options
-
-### `enablePinning`
-
-```tsx
-enablePinning?: boolean
-```
-
-Enables/disables pinning for the column.
-
-## Table API
-
-### `setColumnPinning`
-
-```tsx
-setColumnPinning: (updater: Updater) => void
-```
-
-Sets or updates the `state.columnPinning` state.
-
-### `resetColumnPinning`
-
-```tsx
-resetColumnPinning: (defaultState?: boolean) => void
-```
-
-Resets the **columnPinning** state to `initialState.columnPinning`, or `true` can be passed to force a default blank state reset to `{ left: [], right: [], }`.
-
-### `getIsSomeColumnsPinned`
-
-```tsx
-getIsSomeColumnsPinned: (position?: ColumnPinningPosition) => boolean
-```
-
-Returns whether or not any columns are pinned. Optionally specify to only check for pinned columns in either the `left` or `right` position.
-
-_Note: Does not account for column visibility_
-
-### `getLeftHeaderGroups`
-
-```tsx
-getLeftHeaderGroups: () => HeaderGroup[]
-```
-
-Returns the left pinned header groups for the table.
-
-### `getCenterHeaderGroups`
-
-```tsx
-getCenterHeaderGroups: () => HeaderGroup[]
-```
-
-Returns the unpinned/center header groups for the table.
-
-### `getRightHeaderGroups`
-
-```tsx
-getRightHeaderGroups: () => HeaderGroup[]
-```
-
-Returns the right pinned header groups for the table.
-
-### `getLeftFooterGroups`
-
-```tsx
-getLeftFooterGroups: () => HeaderGroup[]
-```
-
-Returns the left pinned footer groups for the table.
-
-### `getCenterFooterGroups`
-
-```tsx
-getCenterFooterGroups: () => HeaderGroup[]
-```
-
-Returns the unpinned/center footer groups for the table.
-
-### `getRightFooterGroups`
-
-```tsx
-getRightFooterGroups: () => HeaderGroup[]
-```
-
-Returns the right pinned footer groups for the table.
-
-### `getLeftFlatHeaders`
-
-```tsx
-getLeftFlatHeaders: () => Header[]
-```
-
-Returns a flat array of left pinned headers for the table, including parent headers.
-
-### `getCenterFlatHeaders`
-
-```tsx
-getCenterFlatHeaders: () => Header[]
-```
-
-Returns a flat array of unpinned/center headers for the table, including parent headers.
-
-### `getRightFlatHeaders`
-
-```tsx
-getRightFlatHeaders: () => Header[]
-```
-
-Returns a flat array of right pinned headers for the table, including parent headers.
-
-### `getLeftLeafHeaders`
-
-```tsx
-getLeftLeafHeaders: () => Header[]
-```
-
-Returns a flat array of leaf-node left pinned headers for the table.
-
-### `getCenterLeafHeaders`
-
-```tsx
-getCenterLeafHeaders: () => Header[]
-```
-
-Returns a flat array of leaf-node unpinned/center headers for the table.
-
-### `getRightLeafHeaders`
-
-```tsx
-getRightLeafHeaders: () => Header[]
-```
-
-Returns a flat array of leaf-node right pinned headers for the table.
-
-### `getLeftLeafColumns`
-
-```tsx
-getLeftLeafColumns: () => Column[]
-```
-
-Returns all left pinned leaf columns.
-
-### `getRightLeafColumns`
-
-```tsx
-getRightLeafColumns: () => Column[]
-```
-
-Returns all right pinned leaf columns.
-
-### `getCenterLeafColumns`
-
-```tsx
-getCenterLeafColumns: () => Column[]
-```
-
-Returns all center pinned (unpinned) leaf columns.
-
-## Column API
-
-### `getCanPin`
-
-```tsx
-getCanPin: () => boolean
-```
-
-Returns whether or not the column can be pinned.
-
-### `getPinnedIndex`
-
-```tsx
-getPinnedIndex: () => number
-```
-
-Returns the numeric pinned index of the column within a pinned column group.
-
-### `getIsPinned`
-
-```tsx
-getIsPinned: () => ColumnPinningPosition
-```
-
-Returns the pinned position of the column. (`'left'`, `'right'` or `false`)
-
-### `pin`
-
-```tsx
-pin: (position: ColumnPinningPosition) => void
-```
-
-Pins a column to the `'left'` or `'right'`, or unpins the column to the center if `false` is passed.
-
-## Row API
-
-### `getLeftVisibleCells`
-
-```tsx
-getLeftVisibleCells: () => Cell[]
-```
-
-Returns all left pinned leaf cells in the row.
-
-### `getRightVisibleCells`
-
-```tsx
-getRightVisibleCells: () => Cell[]
-```
-
-Returns all right pinned leaf cells in the row.
-
-### `getCenterVisibleCells`
-
-```tsx
-getCenterVisibleCells: () => Cell[]
-```
-
-Returns all center pinned (unpinned) leaf cells in the row.
diff --git a/docs/api/features/column-sizing.md b/docs/api/features/column-sizing.md
deleted file mode 100644
index 0bf7631be8..0000000000
--- a/docs/api/features/column-sizing.md
+++ /dev/null
@@ -1,253 +0,0 @@
----
-title: Column Sizing APIs
-id: column-sizing
----
-
-## State
-
-Column sizing state is stored on the table using the following shape:
-
-```tsx
-export type ColumnSizingTableState = {
- columnSizing: ColumnSizing
- columnSizingInfo: ColumnSizingInfoState
-}
-
-export type ColumnSizing = Record
-
-export type ColumnSizingInfoState = {
- startOffset: null | number
- startSize: null | number
- deltaOffset: null | number
- deltaPercentage: null | number
- isResizingColumn: false | string
- columnSizingStart: [string, number][]
-}
-```
-
-## Column Def Options
-
-### `enableResizing`
-
-```tsx
-enableResizing?: boolean
-```
-
-Enables or disables column resizing for the column.
-
-### `size`
-
-```tsx
-size?: number
-```
-
-The desired size for the column
-
-### `minSize`
-
-```tsx
-minSize?: number
-```
-
-The minimum allowed size for the column
-
-### `maxSize`
-
-```tsx
-maxSize?: number
-```
-
-The maximum allowed size for the column
-
-## Column API
-
-### `getSize`
-
-```tsx
-getSize: () => number
-```
-
-Returns the current size of the column
-
-### `getStart`
-
-```tsx
-getStart: (position?: ColumnPinningPosition) => number
-```
-
-Returns the offset measurement along the row-axis (usually the x-axis for standard tables) for the column, measuring the size of all preceding columns.
-
-Useful for sticky or absolute positioning of columns. (e.g. `left` or `transform`)
-
-### `getAfter`
-
-```tsx
-getAfter: (position?: ColumnPinningPosition) => number
-```
-
-Returns the offset measurement along the row-axis (usually the x-axis for standard tables) for the column, measuring the size of all succeeding columns.
-
-Useful for sticky or absolute positioning of columns. (e.g. `right` or `transform`)
-
-### `getCanResize`
-
-```tsx
-getCanResize: () => boolean
-```
-
-Returns `true` if the column can be resized.
-
-### `getIsResizing`
-
-```tsx
-getIsResizing: () => boolean
-```
-
-Returns `true` if the column is currently being resized.
-
-### `resetSize`
-
-```tsx
-resetSize: () => void
-```
-
-Resets the column size to its initial size.
-
-## Header API
-
-### `getSize`
-
-```tsx
-getSize: () => number
-```
-
-Returns the size for the header, calculated by summing the size of all leaf-columns that belong to it.
-
-### `getStart`
-
-```tsx
-getStart: (position?: ColumnPinningPosition) => number
-```
-
-Returns the offset measurement along the row-axis (usually the x-axis for standard tables) for the header. This is effectively a sum of the offset measurements of all preceding headers.
-
-### `getResizeHandler`
-
-```tsx
-getResizeHandler: () => (event: unknown) => void
-```
-
-Returns an event handler function that can be used to resize the header. It can be used as an:
-
-- `onMouseDown` handler
-- `onTouchStart` handler
-
-The dragging and release events are automatically handled for you.
-
-## Table Options
-
-### `enableColumnResizing`
-
-```tsx
-enableColumnResizing?: boolean
-```
-
-Enables/disables column resizing for \*all columns\*\*.
-
-### `columnResizeMode`
-
-```tsx
-columnResizeMode?: 'onChange' | 'onEnd'
-```
-
-Determines when the columnSizing state is updated. `onChange` updates the state when the user is dragging the resize handle. `onEnd` updates the state when the user releases the resize handle.
-
-### `columnResizeDirection`
-
-```tsx
-columnResizeDirection?: 'ltr' | 'rtl'
-```
-
-Enables or disables right-to-left support for resizing the column. defaults to 'ltr'.
-
-### `onColumnSizingChange`
-
-```tsx
-onColumnSizingChange?: OnChangeFn
-```
-
-This optional function will be called when the columnSizing state changes. If you provide this function, you will be responsible for maintaining its state yourself. You can pass this state back to the table via the `state.columnSizing` table option.
-
-### `onColumnSizingInfoChange`
-
-```tsx
-onColumnSizingInfoChange?: OnChangeFn
-```
-
-This optional function will be called when the columnSizingInfo state changes. If you provide this function, you will be responsible for maintaining its state yourself. You can pass this state back to the table via the `state.columnSizingInfo` table option.
-
-## Table API
-
-### `setColumnSizing`
-
-```tsx
-setColumnSizing: (updater: Updater) => void
-```
-
-Sets the column sizing state using an updater function or a value. This will trigger the underlying `onColumnSizingChange` function if one is passed to the table options, otherwise the state will be managed automatically by the table.
-
-### `setColumnSizingInfo`
-
-```tsx
-setColumnSizingInfo: (updater: Updater) => void
-```
-
-Sets the column sizing info state using an updater function or a value. This will trigger the underlying `onColumnSizingInfoChange` function if one is passed to the table options, otherwise the state will be managed automatically by the table.
-
-### `resetColumnSizing`
-
-```tsx
-resetColumnSizing: (defaultState?: boolean) => void
-```
-
-Resets column sizing to its initial state. If `defaultState` is `true`, the default state for the table will be used instead of the initialValue provided to the table.
-
-### `resetHeaderSizeInfo`
-
-```tsx
-resetHeaderSizeInfo: (defaultState?: boolean) => void
-```
-
-Resets column sizing info to its initial state. If `defaultState` is `true`, the default state for the table will be used instead of the initialValue provided to the table.
-
-### `getTotalSize`
-
-```tsx
-getTotalSize: () => number
-```
-
-Returns the total size of the table by calculating the sum of the sizes of all leaf-columns.
-
-### `getLeftTotalSize`
-
-```tsx
-getLeftTotalSize: () => number
-```
-
-If pinning, returns the total size of the left portion of the table by calculating the sum of the sizes of all left leaf-columns.
-
-### `getCenterTotalSize`
-
-```tsx
-getCenterTotalSize: () => number
-```
-
-If pinning, returns the total size of the center portion of the table by calculating the sum of the sizes of all unpinned/center leaf-columns.
-
-### `getRightTotalSize`
-
-```tsx
-getRightTotalSize: () => number
-```
-
-If pinning, returns the total size of the right portion of the table by calculating the sum of the sizes of all right leaf-columns.
diff --git a/docs/api/features/column-visibility.md b/docs/api/features/column-visibility.md
deleted file mode 100644
index e1280e7c03..0000000000
--- a/docs/api/features/column-visibility.md
+++ /dev/null
@@ -1,178 +0,0 @@
----
-title: Column Visibility APIs
-id: column-visibility
----
-
-## State
-
-Column visibility state is stored on the table using the following shape:
-
-```tsx
-export type VisibilityState = Record
-
-export type VisibilityTableState = {
- columnVisibility: VisibilityState
-}
-```
-
-## Column Def Options
-
-### `enableHiding`
-
-```tsx
-enableHiding?: boolean
-```
-
-Enables/disables hiding the column
-
-## Column API
-
-### `getCanHide`
-
-```tsx
-getCanHide: () => boolean
-```
-
-Returns whether the column can be hidden
-
-### `getIsVisible`
-
-```tsx
-getIsVisible: () => boolean
-```
-
-Returns whether the column is visible
-
-### `toggleVisibility`
-
-```tsx
-toggleVisibility: (value?: boolean) => void
-```
-
-Toggles the column visibility
-
-### `getToggleVisibilityHandler`
-
-```tsx
-getToggleVisibilityHandler: () => (event: unknown) => void
-```
-
-Returns a function that can be used to toggle the column visibility. This function can be used to bind to an event handler to a checkbox.
-
-## Table Options
-
-### `onColumnVisibilityChange`
-
-```tsx
-onColumnVisibilityChange?: OnChangeFn
-```
-
-If provided, this function will be called with an `updaterFn` when `state.columnVisibility` changes. This overrides the default internal state management, so you will need to persist the state change either fully or partially outside of the table.
-
-### `enableHiding`
-
-```tsx
-enableHiding?: boolean
-```
-
-Enables/disables hiding of columns.
-
-## Table API
-
-### `getVisibleFlatColumns`
-
-```tsx
-getVisibleFlatColumns: () => Column[]
-```
-
-Returns a flat array of columns that are visible, including parent columns.
-
-### `getVisibleLeafColumns`
-
-```tsx
-getVisibleLeafColumns: () => Column[]
-```
-
-Returns a flat array of leaf-node columns that are visible.
-
-### `getLeftVisibleLeafColumns`
-
-```tsx
-getLeftVisibleLeafColumns: () => Column[]
-```
-
-If column pinning, returns a flat array of leaf-node columns that are visible in the left portion of the table.
-
-### `getRightVisibleLeafColumns`
-
-```tsx
-getRightVisibleLeafColumns: () => Column[]
-```
-
-If column pinning, returns a flat array of leaf-node columns that are visible in the right portion of the table.
-
-### `getCenterVisibleLeafColumns`
-
-```tsx
-getCenterVisibleLeafColumns: () => Column[]
-```
-
-If column pinning, returns a flat array of leaf-node columns that are visible in the unpinned/center portion of the table.
-
-### `setColumnVisibility`
-
-```tsx
-setColumnVisibility: (updater: Updater) => void
-```
-
-Updates the column visibility state via an updater function or value
-
-### `resetColumnVisibility`
-
-```tsx
-resetColumnVisibility: (defaultState?: boolean) => void
-```
-
-Resets the column visibility state to the initial state. If `defaultState` is provided, the state will be reset to `{}`
-
-### `toggleAllColumnsVisible`
-
-```tsx
-toggleAllColumnsVisible: (value?: boolean) => void
-```
-
-Toggles the visibility of all columns
-
-### `getIsAllColumnsVisible`
-
-```tsx
-getIsAllColumnsVisible: () => boolean
-```
-
-Returns whether all columns are visible
-
-### `getIsSomeColumnsVisible`
-
-```tsx
-getIsSomeColumnsVisible: () => boolean
-```
-
-Returns whether some columns are visible
-
-### `getToggleAllColumnsVisibilityHandler`
-
-```tsx
-getToggleAllColumnsVisibilityHandler: () => ((event: unknown) => void)
-```
-
-Returns a handler for toggling the visibility of all columns, meant to be bound to a `input[type=checkbox]` element.
-
-## Row API
-
-### `getVisibleCells`
-
-```tsx
-getVisibleCells: () => Cell[]
-```
-
-Returns an array of cells that account for column visibility for the row.
\ No newline at end of file
diff --git a/docs/api/features/expanding.md b/docs/api/features/expanding.md
deleted file mode 100644
index af7ab0db43..0000000000
--- a/docs/api/features/expanding.md
+++ /dev/null
@@ -1,208 +0,0 @@
----
-title: Expanding APIs
-id: expanding
----
-
-## State
-
-Expanding state is stored on the table using the following shape:
-
-```tsx
-export type ExpandedState = true | Record
-
-export type ExpandedTableState = {
- expanded: ExpandedState
-}
-```
-
-## Row API
-
-### `toggleExpanded`
-
-```tsx
-toggleExpanded: (expanded?: boolean) => void
-```
-
-Toggles the expanded state (or sets it if `expanded` is provided) for the row.
-
-### `getIsExpanded`
-
-```tsx
-getIsExpanded: () => boolean
-```
-
-Returns whether the row is expanded.
-
-### `getIsAllParentsExpanded`
-
-```tsx
-getIsAllParentsExpanded: () => boolean
-```
-
-Returns whether all parent rows of the row are expanded.
-
-### `getCanExpand`
-
-```tsx
-getCanExpand: () => boolean
-```
-
-Returns whether the row can be expanded.
-
-### `getToggleExpandedHandler`
-
-```tsx
-getToggleExpandedHandler: () => () => void
-```
-
-Returns a function that can be used to toggle the expanded state of the row. This function can be used to bind to an event handler to a button.
-
-## Table Options
-
-### `manualExpanding`
-
-```tsx
-manualExpanding?: boolean
-```
-
-Enables manual row expansion. If this is set to `true`, `getExpandedRowModel` will not be used to expand rows and you would be expected to perform the expansion in your own data model. This is useful if you are doing server-side expansion.
-
-### `onExpandedChange`
-
-```tsx
-onExpandedChange?: OnChangeFn
-```
-
-This function is called when the `expanded` table state changes. If a function is provided, you will be responsible for managing this state on your own. To pass the managed state back to the table, use the `tableOptions.state.expanded` option.
-
-### `autoResetExpanded`
-
-```tsx
-autoResetExpanded?: boolean
-```
-
-Enable this setting to automatically reset the expanded state of the table when expanding state changes.
-
-### `enableExpanding`
-
-```tsx
-enableExpanding?: boolean
-```
-
-Enable/disable expanding for all rows.
-
-### `getExpandedRowModel`
-
-```tsx
-getExpandedRowModel?: (table: Table) => () => RowModel
-```
-
-This function is responsible for returning the expanded row model. If this function is not provided, the table will not expand rows. You can use the default exported `getExpandedRowModel` function to get the expanded row model or implement your own.
-
-### `getIsRowExpanded`
-
-```tsx
-getIsRowExpanded?: (row: Row) => boolean
-```
-
-If provided, allows you to override the default behavior of determining whether a row is currently expanded.
-
-### `getRowCanExpand`
-
-```tsx
-getRowCanExpand?: (row: Row) => boolean
-```
-
-If provided, allows you to override the default behavior of determining whether a row can be expanded.
-
-### `paginateExpandedRows`
-
-```tsx
-paginateExpandedRows?: boolean
-```
-
-If `true` expanded rows will be paginated along with the rest of the table (which means expanded rows may span multiple pages).
-
-If `false` expanded rows will not be considered for pagination (which means expanded rows will always render on their parents page. This also means more rows will be rendered than the set page size)
-
-## Table API
-
-### `setExpanded`
-
-```tsx
-setExpanded: (updater: Updater) => void
-```
-
-Updates the expanded state of the table via an update function or value
-
-### `toggleAllRowsExpanded`
-
-```tsx
-toggleAllRowsExpanded: (expanded?: boolean) => void
-```
-
-Toggles the expanded state for all rows. Optionally, provide a value to set the expanded state to.
-
-### `resetExpanded`
-
-```tsx
-resetExpanded: (defaultState?: boolean) => void
-```
-
-Reset the expanded state of the table to the initial state. If `defaultState` is provided, the expanded state will be reset to `{}`
-
-### `getCanSomeRowsExpand`
-
-```tsx
-getCanSomeRowsExpand: () => boolean
-```
-
-Returns whether there are any rows that can be expanded.
-
-### `getToggleAllRowsExpandedHandler`
-
-```tsx
-getToggleAllRowsExpandedHandler: () => (event: unknown) => void
-```
-
-Returns a handler that can be used to toggle the expanded state of all rows. This handler is meant to be used with an `input[type=checkbox]` element.
-
-### `getIsSomeRowsExpanded`
-
-```tsx
-getIsSomeRowsExpanded: () => boolean
-```
-
-Returns whether there are any rows that are currently expanded.
-
-### `getIsAllRowsExpanded`
-
-```tsx
-getIsAllRowsExpanded: () => boolean
-```
-
-Returns whether all rows are currently expanded.
-
-### `getExpandedDepth`
-
-```tsx
-getExpandedDepth: () => number
-```
-
-Returns the maximum depth of the expanded rows.
-
-### `getExpandedRowModel`
-
-```tsx
-getExpandedRowModel: () => RowModel
-```
-
-Returns the row model after expansion has been applied.
-
-### `getPreExpandedRowModel`
-
-```tsx
-getPreExpandedRowModel: () => RowModel
-```
-
-Returns the row model before expansion has been applied.
diff --git a/docs/api/features/filters.md b/docs/api/features/filters.md
deleted file mode 100644
index c7c05fcd73..0000000000
--- a/docs/api/features/filters.md
+++ /dev/null
@@ -1,13 +0,0 @@
----
-title: Filter APIs
-id: filters
----
-
-
-
-The Filtering API docs are now split into multiple API doc pages:
-
-- [Column Faceting](../column-faceting)
-- [Global Faceting](../global-faceting)
-- [Column Filtering](../column-filtering)
-- [Global Filtering](../global-filtering)
\ No newline at end of file
diff --git a/docs/api/features/global-faceting.md b/docs/api/features/global-faceting.md
deleted file mode 100644
index 820df889ff..0000000000
--- a/docs/api/features/global-faceting.md
+++ /dev/null
@@ -1,30 +0,0 @@
----
-title: Global Faceting APIs
-id: global-faceting
----
-
-## Table API
-
-### `getGlobalFacetedRowModel`
-
-```tsx
-getGlobalFacetedRowModel: () => RowModel
-```
-
-Returns the faceted row model for the global filter.
-
-### `getGlobalFacetedUniqueValues`
-
-```tsx
-getGlobalFacetedUniqueValues: () => Map
-```
-
-Returns the faceted unique values for the global filter.
-
-### `getGlobalFacetedMinMaxValues`
-
-```tsx
-getGlobalFacetedMinMaxValues: () => [number, number]
-```
-
-Returns the faceted min and max values for the global filter.
diff --git a/docs/api/features/global-filtering.md b/docs/api/features/global-filtering.md
deleted file mode 100644
index 7b48f55ad7..0000000000
--- a/docs/api/features/global-filtering.md
+++ /dev/null
@@ -1,291 +0,0 @@
----
-title: Global Filtering APIs
-id: global-filtering
----
-
-## Can-Filter
-
-The ability for a column to be **globally** filtered is determined by the following:
-
-- The column was defined a valid `accessorKey`/`accessorFn`.
-- If provided, `options.getColumnCanGlobalFilter` returns `true` for the given column. If it is not provided, the column is assumed to be globally filterable if the value in the first row is a `string` or `number` type.
-- `column.enableColumnFilter` is not set to `false`
-- `options.enableColumnFilters` is not set to `false`
-- `options.enableFilters` is not set to `false`
-
-## State
-
-Filter state is stored on the table using the following shape:
-
-```tsx
-export interface GlobalFilterTableState {
- globalFilter: any
-}
-```
-
-## Filter Functions
-
-You can use the same filter functions that are available for column filtering for global filtering. See the [Column Filtering APIs](../column-filtering) to learn more about filter functions.
-
-#### Using Filter Functions
-
-Filter functions can be used/referenced/defined by passing the following to `options.globalFilterFn`:
-
-- A `string` that references a built-in filter function
-- A function directly provided to the `options.globalFilterFn` option
-
-The final list of filter functions available for the `tableOptions.globalFilterFn` options use the following type:
-
-```tsx
-export type FilterFnOption =
- | 'auto'
- | BuiltInFilterFn
- | FilterFn
-```
-
-#### Filter Meta
-
-Filtering data can often expose additional information about the data that can be used to aid other future operations on the same data. A good example of this concept is a ranking-system like that of [`match-sorter`](https://github.com/kentcdodds/match-sorter) that simultaneously ranks, filters and sorts data. While utilities like `match-sorter` make a lot of sense for single-dimensional filter+sort tasks, the decoupled filtering/sorting architecture of building a table makes them very difficult and slow to use.
-
-To make a ranking/filtering/sorting system work with tables, `filterFn`s can optionally mark results with a **filter meta** value that can be used later to sort/group/etc the data to your liking. This is done by calling the `addMeta` function supplied to your custom `filterFn`.
-
-Below is an example using our own `match-sorter-utils` package (a utility fork of `match-sorter`) to rank, filter, and sort the data
-
-```tsx
-import { sortingFns } from '@tanstack/[adapter]-table'
-
-import { rankItem, compareItems } from '@tanstack/match-sorter-utils'
-
-const fuzzyFilter = (row, columnId, value, addMeta) => {
- // Rank the item
- const itemRank = rankItem(row.getValue(columnId), value)
-
- // Store the ranking info
- addMeta(itemRank)
-
- // Return if the item should be filtered in/out
- return itemRank.passed
-}
-
-const fuzzySort = (rowA, rowB, columnId) => {
- let dir = 0
-
- // Only sort by rank if the column has ranking information
- if (rowA.columnFiltersMeta[columnId]) {
- dir = compareItems(
- rowA.columnFiltersMeta[columnId]!,
- rowB.columnFiltersMeta[columnId]!
- )
- }
-
- // Provide an alphanumeric fallback for when the item ranks are equal
- return dir === 0 ? sortingFns.alphanumeric(rowA, rowB, columnId) : dir
-}
-```
-
-## Column Def Options
-
-### `enableGlobalFilter`
-
-```tsx
-enableGlobalFilter?: boolean
-```
-
-Enables/disables the **global** filter for this column.
-
-## Column API
-
-### `getCanGlobalFilter`
-
-```tsx
-getCanGlobalFilter: () => boolean
-```
-
-Returns whether or not the column can be **globally** filtered. Set to `false` to disable a column from being scanned during global filtering.
-
-## Row API
-
-### `columnFiltersMeta`
-
-```tsx
-columnFiltersMeta: Record
-```
-
-The column filters meta map for the row. This object tracks any filter meta for a row as optionally provided during the filtering process.
-
-## Table Options
-
-### `filterFns`
-
-```tsx
-filterFns?: Record
-```
-
-This option allows you to define custom filter functions that can be referenced in a column's `filterFn` option by their key.
-Example:
-
-```tsx
-declare module '@tanstack/table-core' {
- interface FilterFns {
- myCustomFilter: FilterFn
- }
-}
-
-const column = columnHelper.data('key', {
- filterFn: 'myCustomFilter',
-})
-
-const table = useReactTable({
- columns: [column],
- filterFns: {
- myCustomFilter: (rows, columnIds, filterValue) => {
- // return the filtered rows
- },
- },
-})
-```
-
-### `filterFromLeafRows`
-
-```tsx
-filterFromLeafRows?: boolean
-```
-
-By default, filtering is done from parent rows down (so if a parent row is filtered out, all of its children will be filtered out as well). Setting this option to `true` will cause filtering to be done from leaf rows up (which means parent rows will be included so long as one of their child or grand-child rows is also included).
-
-### `maxLeafRowFilterDepth`
-
-```tsx
-maxLeafRowFilterDepth?: number
-```
-
-By default, filtering is done for all rows (max depth of 100), no matter if they are root level parent rows or the child leaf rows of a parent row. Setting this option to `0` will cause filtering to only be applied to the root level parent rows, with all sub-rows remaining unfiltered. Similarly, setting this option to `1` will cause filtering to only be applied to child leaf rows 1 level deep, and so on.
-
-This is useful for situations where you want a row's entire child hierarchy to be visible regardless of the applied filter.
-
-### `enableFilters`
-
-```tsx
-enableFilters?: boolean
-```
-
-Enables/disables all filters for the table.
-
-### `manualFiltering`
-
-```tsx
-manualFiltering?: boolean
-```
-
-Disables the `getFilteredRowModel` from being used to filter data. This may be useful if your table needs to dynamically support both client-side and server-side filtering.
-
-### `getFilteredRowModel`
-
-```tsx
-getFilteredRowModel?: (
- table: Table
-) => () => RowModel
-```
-
-If provided, this function is called **once** per table and should return a **new function** which will calculate and return the row model for the table when it's filtered.
-
-- For server-side filtering, this function is unnecessary and can be ignored since the server should already return the filtered row model.
-- For client-side filtering, this function is required. A default implementation is provided via any table adapter's `{ getFilteredRowModel }` export.
-
-Example:
-
-```tsx
-import { getFilteredRowModel } from '@tanstack/[adapter]-table'
-
- getFilteredRowModel: getFilteredRowModel(),
-})
-```
-
-### `globalFilterFn`
-
-```tsx
-globalFilterFn?: FilterFn | keyof FilterFns | keyof BuiltInFilterFns
-```
-
-The filter function to use for global filtering.
-
-Options:
-
-- A `string` referencing a [built-in filter function](#filter-functions))
-- A `string` that references a custom filter functions provided via the `tableOptions.filterFns` option
-- A [custom filter function](#filter-functions)
-
-### `onGlobalFilterChange`
-
-```tsx
-onGlobalFilterChange?: OnChangeFn
-```
-
-If provided, this function will be called with an `updaterFn` when `state.globalFilter` changes. This overrides the default internal state management, so you will need to persist the state change either fully or partially outside of the table.
-
-### `enableGlobalFilter`
-
-```tsx
-enableGlobalFilter?: boolean
-```
-
-Enables/disables the global filter for the table.
-
-### `getColumnCanGlobalFilter`
-
-```tsx
-getColumnCanGlobalFilter?: (column: Column) => boolean
-```
-
-If provided, this function will be called with the column and should return `true` or `false` to indicate whether this column should be used for global filtering.
-This is useful if the column can contain data that is not `string` or `number` (i.e. `undefined`).
-
-## Table API
-
-### `getPreFilteredRowModel`
-
-```tsx
-getPreFilteredRowModel: () => RowModel
-```
-
-Returns the row model for the table before any **column** filtering has been applied.
-
-### `getFilteredRowModel`
-
-```tsx
-getFilteredRowModel: () => RowModel
-```
-
-Returns the row model for the table after **column** filtering has been applied.
-
-### `setGlobalFilter`
-
-```tsx
-setGlobalFilter: (updater: Updater) => void
-```
-
-Sets or updates the `state.globalFilter` state.
-
-### `resetGlobalFilter`
-
-```tsx
-resetGlobalFilter: (defaultState?: boolean) => void
-```
-
-Resets the **globalFilter** state to `initialState.globalFilter`, or `true` can be passed to force a default blank state reset to `undefined`.
-
-### `getGlobalAutoFilterFn`
-
-```tsx
-getGlobalAutoFilterFn: (columnId: string) => FilterFn | undefined
-```
-
-Currently, this function returns the built-in `includesString` filter function. In future releases, it may return more dynamic filter functions based on the nature of the data provided.
-
-### `getGlobalFilterFn`
-
-```tsx
-getGlobalFilterFn: (columnId: string) => FilterFn | undefined
-```
-
-Returns the global filter function (either user-defined or automatic, depending on configuration) for the table.
diff --git a/docs/api/features/grouping.md b/docs/api/features/grouping.md
deleted file mode 100644
index b9c21631fc..0000000000
--- a/docs/api/features/grouping.md
+++ /dev/null
@@ -1,353 +0,0 @@
----
-title: Grouping APIs
-id: grouping
----
-
-## State
-
-Grouping state is stored on the table using the following shape:
-
-```tsx
-export type GroupingState = string[]
-
-export type GroupingTableState = {
- grouping: GroupingState
-}
-```
-
-## Aggregation Functions
-
-The following aggregation functions are built-in to the table core:
-
-- `sum`
- - Sums the values of a group of rows
-- `min`
- - Finds the minimum value of a group of rows
-- `max`
- - Finds the maximum value of a group of rows
-- `extent`
- - Finds the minimum and maximum values of a group of rows
-- `mean`
- - Finds the mean/average value of a group of rows
-- `median`
- - Finds the median value of a group of rows
-- `unique`
- - Finds the unique values of a group of rows
-- `uniqueCount`
- - Finds the number of unique values of a group of rows
-- `count`
- - Calculates the number of rows in a group
-
-Every grouping function receives:
-
-- A function to retrieve the leaf values of the groups rows
-- A function to retrieve the immediate-child values of the groups rows
-
-and should return a value (usually primitive) to build the aggregated row model.
-
-This is the type signature for every aggregation function:
-
-```tsx
-export type AggregationFn = (
- getLeafRows: () => Row[],
- getChildRows: () => Row[]
-) => any
-```
-
-#### Using Aggregation Functions
-
-Aggregation functions can be used/referenced/defined by passing the following to `columnDefinition.aggregationFn`:
-
-- A `string` that references a built-in aggregation function
-- A `string` that references a custom aggregation functions provided via the `tableOptions.aggregationFns` option
-- A function directly provided to the `columnDefinition.aggregationFn` option
-
-The final list of aggregation functions available for the `columnDef.aggregationFn` use the following type:
-
-```tsx
-export type AggregationFnOption =
- | 'auto'
- | keyof AggregationFns
- | BuiltInAggregationFn
- | AggregationFn
-```
-
-## Column Def Options
-
-### `aggregationFn`
-
-```tsx
-aggregationFn?: AggregationFn | keyof AggregationFns | keyof BuiltInAggregationFns
-```
-
-The aggregation function to use with this column.
-
-Options:
-
-- A `string` referencing a [built-in aggregation function](#aggregation-functions))
-- A [custom aggregation function](#aggregation-functions)
-
-### `aggregatedCell`
-
-```tsx
-aggregatedCell?: Renderable<
- {
- table: Table
- row: Row
- column: Column
- cell: Cell
- getValue: () => any
- renderValue: () => any
- }
->
-```
-
-The cell to display each row for the column if the cell is an aggregate. If a function is passed, it will be passed a props object with the context of the cell and should return the property type for your adapter (the exact type depends on the adapter being used).
-
-### `enableGrouping`
-
-```tsx
-enableGrouping?: boolean
-```
-
-Enables/disables grouping for this column.
-
-### `getGroupingValue`
-
-```tsx
-getGroupingValue?: (row: TData) => any
-```
-
-Specify a value to be used for grouping rows on this column. If this option is not specified, the value derived from `accessorKey` / `accessorFn` will be used instead.
-
-## Column API
-
-### `aggregationFn`
-
-```tsx
-aggregationFn?: AggregationFnOption
-```
-
-The resolved aggregation function for the column.
-
-### `getCanGroup`
-
-```tsx
-getCanGroup: () => boolean
-```
-
-Returns whether or not the column can be grouped.
-
-### `getIsGrouped`
-
-```tsx
-getIsGrouped: () => boolean
-```
-
-Returns whether or not the column is currently grouped.
-
-### `getGroupedIndex`
-
-```tsx
-getGroupedIndex: () => number
-```
-
-Returns the index of the column in the grouping state.
-
-### `toggleGrouping`
-
-```tsx
-toggleGrouping: () => void
-```
-
-Toggles the grouping state of the column.
-
-### `getToggleGroupingHandler`
-
-```tsx
-getToggleGroupingHandler: () => () => void
-```
-
-Returns a function that toggles the grouping state of the column. This is useful for passing to the `onClick` prop of a button.
-
-### `getAutoAggregationFn`
-
-```tsx
-getAutoAggregationFn: () => AggregationFn | undefined
-```
-
-Returns the automatically inferred aggregation function for the column.
-
-### `getAggregationFn`
-
-```tsx
-getAggregationFn: () => AggregationFn | undefined
-```
-
-Returns the aggregation function for the column.
-
-## Row API
-
-### `groupingColumnId`
-
-```tsx
-groupingColumnId?: string
-```
-
-If this row is grouped, this is the id of the column that this row is grouped by.
-
-### `groupingValue`
-
-```tsx
-groupingValue?: any
-```
-
-If this row is grouped, this is the unique/shared value for the `groupingColumnId` for all of the rows in this group.
-
-### `getIsGrouped`
-
-```tsx
-getIsGrouped: () => boolean
-```
-
-Returns whether or not the row is currently grouped.
-
-### `getGroupingValue`
-
-```tsx
-getGroupingValue: (columnId: string) => unknown
-```
-
-Returns the grouping value for any row and column (including leaf rows).
-
-## Table Options
-
-### `aggregationFns`
-
-```tsx
-aggregationFns?: Record
-```
-
-This option allows you to define custom aggregation functions that can be referenced in a column's `aggregationFn` option by their key.
-Example:
-
-```tsx
-declare module '@tanstack/table-core' {
- interface AggregationFns {
- myCustomAggregation: AggregationFn
- }
-}
-
-const column = columnHelper.data('key', {
- aggregationFn: 'myCustomAggregation',
-})
-
-const table = useReactTable({
- columns: [column],
- aggregationFns: {
- myCustomAggregation: (columnId, leafRows, childRows) => {
- // return the aggregated value
- },
- },
-})
-```
-
-### `manualGrouping`
-
-```tsx
-manualGrouping?: boolean
-```
-
-Enables manual grouping. If this option is set to `true`, the table will not automatically group rows using `getGroupedRowModel()` and instead will expect you to manually group the rows before passing them to the table. This is useful if you are doing server-side grouping and aggregation.
-
-### `onGroupingChange`
-
-```tsx
-onGroupingChange?: OnChangeFn
-```
-
-If this function is provided, it will be called when the grouping state changes and you will be expected to manage the state yourself. You can pass the managed state back to the table via the `tableOptions.state.grouping` option.
-
-### `enableGrouping`
-
-```tsx
-enableGrouping?: boolean
-```
-
-Enables/disables grouping for all columns.
-
-### `getGroupedRowModel`
-
-```tsx
-getGroupedRowModel?: (table: Table) => () => RowModel
-```
-
-Returns the row model after grouping has taken place, but no further.
-
-### `groupedColumnMode`
-
-```tsx
-groupedColumnMode?: false | 'reorder' | 'remove' // default: `reorder`
-```
-
-Grouping columns are automatically reordered by default to the start of the columns list. If you would rather remove them or leave them as-is, set the appropriate mode here.
-
-## Table API
-
-### `setGrouping`
-
-```tsx
-setGrouping: (updater: Updater) => void
-```
-
-Sets or updates the `state.grouping` state.
-
-### `resetGrouping`
-
-```tsx
-resetGrouping: (defaultState?: boolean) => void
-```
-
-Resets the **grouping** state to `initialState.grouping`, or `true` can be passed to force a default blank state reset to `[]`.
-
-### `getPreGroupedRowModel`
-
-```tsx
-getPreGroupedRowModel: () => RowModel
-```
-
-Returns the row model for the table before any grouping has been applied.
-
-### `getGroupedRowModel`
-
-```tsx
-getGroupedRowModel: () => RowModel
-```
-
-Returns the row model for the table after grouping has been applied.
-
-## Cell API
-
-### `getIsAggregated`
-
-```tsx
-getIsAggregated: () => boolean
-```
-
-Returns whether or not the cell is currently aggregated.
-
-### `getIsGrouped`
-
-```tsx
-getIsGrouped: () => boolean
-```
-
-Returns whether or not the cell is currently grouped.
-
-### `getIsPlaceholder`
-
-```tsx
-getIsPlaceholder: () => boolean
-```
-
-Returns whether or not the cell is currently a placeholder.
\ No newline at end of file
diff --git a/docs/api/features/pagination.md b/docs/api/features/pagination.md
deleted file mode 100644
index 5e80d5a7a2..0000000000
--- a/docs/api/features/pagination.md
+++ /dev/null
@@ -1,207 +0,0 @@
----
-title: Pagination APIs
-id: pagination
----
-
-## State
-
-Pagination state is stored on the table using the following shape:
-
-```tsx
-export type PaginationState = {
- pageIndex: number
- pageSize: number
-}
-
-export type PaginationTableState = {
- pagination: PaginationState
-}
-
-export type PaginationInitialTableState = {
- pagination?: Partial
-}
-```
-
-## Table Options
-
-### `manualPagination`
-
-```tsx
-manualPagination?: boolean
-```
-
-Enables manual pagination. If this option is set to `true`, the table will not automatically paginate rows using `getPaginationRowModel()` and instead will expect you to manually paginate the rows before passing them to the table. This is useful if you are doing server-side pagination and aggregation.
-
-### `pageCount`
-
-```tsx
-pageCount?: number
-```
-
-When manually controlling pagination, you can supply a total `pageCount` value to the table if you know it. If you do not know how many pages there are, you can set this to `-1`. Alternatively, you can provide a `rowCount` value and the table will calculate the `pageCount` internally.
-
-### `rowCount`
-
-```tsx
-rowCount?: number
-```
-
-When manually controlling pagination, you can supply a total `rowCount` value to the table if you know it. `pageCount` will be calculated internally from `rowCount` and `pageSize`.
-
-### `autoResetPageIndex`
-
-```tsx
-autoResetPageIndex?: boolean
-```
-
-If set to `true`, pagination will be reset to the first page when page-altering state changes eg. `data` is updated, filters change, grouping changes, etc.
-
-> 🧠 Note: This option defaults to `false` if `manualPagination` is set to `true`
-
-### `onPaginationChange`
-
-```tsx
-onPaginationChange?: OnChangeFn
-```
-
-If this function is provided, it will be called when the pagination state changes and you will be expected to manage the state yourself. You can pass the managed state back to the table via the `tableOptions.state.pagination` option.
-
-### `getPaginationRowModel`
-
-```tsx
-getPaginationRowModel?: (table: Table) => () => RowModel
-```
-
-Returns the row model after pagination has taken place, but no further.
-
-Pagination columns are automatically reordered by default to the start of the columns list. If you would rather remove them or leave them as-is, set the appropriate mode here.
-
-## Table API
-
-### `setPagination`
-
-```tsx
-setPagination: (updater: Updater) => void
-```
-
-Sets or updates the `state.pagination` state.
-
-### `resetPagination`
-
-```tsx
-resetPagination: (defaultState?: boolean) => void
-```
-
-Resets the **pagination** state to `initialState.pagination`, or `true` can be passed to force a default blank state reset to `[]`.
-
-### `setPageIndex`
-
-```tsx
-setPageIndex: (updater: Updater) => void
-```
-
-Updates the page index using the provided function or value.
-
-### `resetPageIndex`
-
-```tsx
-resetPageIndex: (defaultState?: boolean) => void
-```
-
-Resets the page index to its initial state. If `defaultState` is `true`, the page index will be reset to `0` regardless of initial state.
-
-### `setPageSize`
-
-```tsx
-setPageSize: (updater: Updater) => void
-```
-
-Updates the page size using the provided function or value.
-
-### `resetPageSize`
-
-```tsx
-resetPageSize: (defaultState?: boolean) => void
-```
-
-Resets the page size to its initial state. If `defaultState` is `true`, the page size will be reset to `10` regardless of initial state.
-
-### `getPageOptions`
-
-```tsx
-getPageOptions: () => number[]
-```
-
-Returns an array of page options (zero-index-based) for the current page size.
-
-### `getCanPreviousPage`
-
-```tsx
-getCanPreviousPage: () => boolean
-```
-
-Returns whether the table can go to the previous page.
-
-### `getCanNextPage`
-
-```tsx
-getCanNextPage: () => boolean
-```
-
-Returns whether the table can go to the next page.
-
-### `previousPage`
-
-```tsx
-previousPage: () => void
-```
-
-Decrements the page index by one, if possible.
-
-### `nextPage`
-
-```tsx
-nextPage: () => void
-```
-
-Increments the page index by one, if possible.
-
-### `firstPage`
-
-```tsx
-firstPage: () => void
-```
-
-Sets the page index to `0`.
-
-### `lastPage`
-
-```tsx
-lastPage: () => void
-```
-
-Sets the page index to the last available page.
-
-### `getPageCount`
-
-```tsx
-getPageCount: () => number
-```
-
-Returns the page count. If manually paginating or controlling the pagination state, this will come directly from the `options.pageCount` table option, otherwise it will be calculated from the table data using the total row count and current page size.
-
-### `getPrePaginationRowModel`
-
-```tsx
-getPrePaginationRowModel: () => RowModel
-```
-
-Returns the row model for the table before any pagination has been applied.
-
-### `getPaginationRowModel`
-
-```tsx
-getPaginationRowModel: () => RowModel
-```
-
-Returns the row model for the table after pagination has been applied.
diff --git a/docs/api/features/pinning.md b/docs/api/features/pinning.md
deleted file mode 100644
index 92222ac7fe..0000000000
--- a/docs/api/features/pinning.md
+++ /dev/null
@@ -1,11 +0,0 @@
----
-title: Pinning APIs
-id: pinning
----
-
-
-
-The pinning apis are now split into multiple api pages:
-
-- [Column Pinning](../column-pinning)
-- [Row Pinning](../row-pinning)
\ No newline at end of file
diff --git a/docs/api/features/row-pinning.md b/docs/api/features/row-pinning.md
deleted file mode 100644
index 52e46d5628..0000000000
--- a/docs/api/features/row-pinning.md
+++ /dev/null
@@ -1,138 +0,0 @@
----
-title: Row Pinning APIs
-id: row-pinning
----
-
-## Can-Pin
-
-The ability for a row to be **pinned** is determined by the following:
-
-- `options.enableRowPinning` resolves to `true`
-- `options.enablePinning` is not set to `false`
-
-## State
-
-Pinning state is stored on the table using the following shape:
-
-```tsx
-export type RowPinningPosition = false | 'top' | 'bottom'
-
-export type RowPinningState = {
- top?: string[]
- bottom?: string[]
-}
-
-export type RowPinningRowState = {
- rowPinning: RowPinningState
-}
-```
-
-## Table Options
-
-### `enableRowPinning`
-
-```tsx
-enableRowPinning?: boolean | ((row: Row) => boolean)
-```
-
-Enables/disables row pinning for all rows in the table.
-
-### `keepPinnedRows`
-
-```tsx
-keepPinnedRows?: boolean
-```
-
-When `false`, pinned rows will not be visible if they are filtered or paginated out of the table. When `true`, pinned rows will always be visible regardless of filtering or pagination. Defaults to `true`.
-
-### `onRowPinningChange`
-
-```tsx
-onRowPinningChange?: OnChangeFn
-```
-
-If provided, this function will be called with an `updaterFn` when `state.rowPinning` changes. This overrides the default internal state management, so you will also need to supply `state.rowPinning` from your own managed state.
-
-## Table API
-
-### `setRowPinning`
-
-```tsx
-setRowPinning: (updater: Updater) => void
-```
-
-Sets or updates the `state.rowPinning` state.
-
-### `resetRowPinning`
-
-```tsx
-resetRowPinning: (defaultState?: boolean) => void
-```
-
-Resets the **rowPinning** state to `initialState.rowPinning`, or `true` can be passed to force a default blank state reset to `{}`.
-
-### `getIsSomeRowsPinned`
-
-```tsx
-getIsSomeRowsPinned: (position?: RowPinningPosition) => boolean
-```
-
-Returns whether or not any rows are pinned. Optionally specify to only check for pinned rows in either the `top` or `bottom` position.
-
-### `getTopRows`
-
-```tsx
-getTopRows: () => Row[]
-```
-
-Returns all top pinned rows.
-
-### `getBottomRows`
-
-```tsx
-getBottomRows: () => Row[]
-```
-
-Returns all bottom pinned rows.
-
-### `getCenterRows`
-
-```tsx
-getCenterRows: () => Row[]
-```
-
-Returns all rows that are not pinned to the top or bottom.
-
-## Row API
-
-### `pin`
-
-```tsx
-pin: (position: RowPinningPosition) => void
-```
-
-Pins a row to the `'top'` or `'bottom'`, or unpins the row to the center if `false` is passed.
-
-### `getCanPin`
-
-```tsx
-getCanPin: () => boolean
-```
-
-Returns whether or not the row can be pinned.
-
-### `getIsPinned`
-
-```tsx
-getIsPinned: () => RowPinningPosition
-```
-
-Returns the pinned position of the row. (`'top'`, `'bottom'` or `false`)
-
-### `getPinnedIndex`
-
-```tsx
-getPinnedIndex: () => number
-```
-
-Returns the numeric pinned index of the row within a pinned row group.
\ No newline at end of file
diff --git a/docs/api/features/row-selection.md b/docs/api/features/row-selection.md
deleted file mode 100644
index 312fde8573..0000000000
--- a/docs/api/features/row-selection.md
+++ /dev/null
@@ -1,230 +0,0 @@
----
-title: Row Selection APIs
-id: row-selection
----
-
-## State
-
-Row selection state is stored on the table using the following shape:
-
-```tsx
-export type RowSelectionState = Record
-
-export type RowSelectionTableState = {
- rowSelection: RowSelectionState
-}
-```
-
-By default, the row selection state uses the index of each row as the row identifiers. Row selection state can instead be tracked with a custom unique row id by passing in a custom [getRowId](../../../api/core/table.md#getrowid) function to the the table.
-
-## Table Options
-
-### `enableRowSelection`
-
-```tsx
-enableRowSelection?: boolean | ((row: Row) => boolean)
-```
-
-- Enables/disables row selection for all rows in the table OR
-- A function that given a row, returns whether to enable/disable row selection for that row
-
-### `enableMultiRowSelection`
-
-```tsx
-enableMultiRowSelection?: boolean | ((row: Row) => boolean)
-```
-
-- Enables/disables multiple row selection for all rows in the table OR
-- A function that given a row, returns whether to enable/disable multiple row selection for that row's children/grandchildren
-
-### `enableSubRowSelection`
-
-```tsx
-enableSubRowSelection?: boolean | ((row: Row) => boolean)
-```
-
-Enables/disables automatic sub-row selection when a parent row is selected, or a function that enables/disables automatic sub-row selection for each row.
-
-(Use in combination with expanding or grouping features)
-
-### `onRowSelectionChange`
-
-```tsx
-onRowSelectionChange?: OnChangeFn
-```
-
-If provided, this function will be called with an `updaterFn` when `state.rowSelection` changes. This overrides the default internal state management, so you will need to persist the state change either fully or partially outside of the table.
-
-## Table API
-
-### `getToggleAllRowsSelectedHandler`
-
-```tsx
-getToggleAllRowsSelectedHandler: () => (event: unknown) => void
-```
-
-Returns a handler that can be used to toggle all rows in the table.
-
-### `getToggleAllPageRowsSelectedHandler`
-
-```tsx
-getToggleAllPageRowsSelectedHandler: () => (event: unknown) => void
-```
-
-Returns a handler that can be used to toggle all rows on the current page.
-
-### `setRowSelection`
-
-```tsx
-setRowSelection: (updater: Updater) => void
-```
-
-Sets or updates the `state.rowSelection` state.
-
-### `resetRowSelection`
-
-```tsx
-resetRowSelection: (defaultState?: boolean) => void
-```
-
-Resets the **rowSelection** state to the `initialState.rowSelection`, or `true` can be passed to force a default blank state reset to `{}`.
-
-### `getIsAllRowsSelected`
-
-```tsx
-getIsAllRowsSelected: () => boolean
-```
-
-Returns whether or not all rows in the table are selected.
-
-### `getIsAllPageRowsSelected`
-
-```tsx
-getIsAllPageRowsSelected: () => boolean
-```
-
-Returns whether or not all rows on the current page are selected.
-
-### `getIsSomeRowsSelected`
-
-```tsx
-getIsSomeRowsSelected: () => boolean
-```
-
-Returns whether or not any rows in the table are selected.
-
-NOTE: Returns `false` if all rows are selected.
-
-### `getIsSomePageRowsSelected`
-
-```tsx
-getIsSomePageRowsSelected: () => boolean
-```
-
-Returns whether or not any rows on the current page are selected.
-
-### `toggleAllRowsSelected`
-
-```tsx
-toggleAllRowsSelected: (value: boolean) => void
-```
-
-Selects/deselects all rows in the table.
-
-### `toggleAllPageRowsSelected`
-
-```tsx
-toggleAllPageRowsSelected: (value: boolean) => void
-```
-
-Selects/deselects all rows on the current page.
-
-### `getPreSelectedRowModel`
-
-```tsx
-getPreSelectedRowModel: () => RowModel
-```
-
-### `getSelectedRowModel`
-
-```tsx
-getSelectedRowModel: () => RowModel
-```
-
-### `getFilteredSelectedRowModel`
-
-```tsx
-getFilteredSelectedRowModel: () => RowModel
-```
-
-### `getGroupedSelectedRowModel`
-
-```tsx
-getGroupedSelectedRowModel: () => RowModel
-```
-
-## Row API
-
-### `getIsSelected`
-
-```tsx
-getIsSelected: () => boolean
-```
-
-Returns whether or not the row is selected.
-
-### `getIsSomeSelected`
-
-```tsx
-getIsSomeSelected: () => boolean
-```
-
-Returns whether or not some of the row's sub rows are selected.
-
-### `getIsAllSubRowsSelected`
-
-```tsx
-getIsAllSubRowsSelected: () => boolean
-```
-
-Returns whether or not all of the row's sub rows are selected.
-
-### `getCanSelect`
-
-```tsx
-getCanSelect: () => boolean
-```
-
-Returns whether or not the row can be selected.
-
-### `getCanMultiSelect`
-
-```tsx
-getCanMultiSelect: () => boolean
-```
-
-Returns whether or not the row can multi-select.
-
-### `getCanSelectSubRows`
-
-```tsx
-getCanSelectSubRows: () => boolean
-```
-
-Returns whether or not the row can select sub rows automatically when the parent row is selected.
-
-### `toggleSelected`
-
-```tsx
-toggleSelected: (value?: boolean) => void
-```
-
-Selects/deselects the row.
-
-### `getToggleSelectedHandler`
-
-```tsx
-getToggleSelectedHandler: () => (event: unknown) => void
-```
-
-Returns a handler that can be used to toggle the row.
diff --git a/docs/api/features/sorting.md b/docs/api/features/sorting.md
deleted file mode 100644
index e5b60eea50..0000000000
--- a/docs/api/features/sorting.md
+++ /dev/null
@@ -1,385 +0,0 @@
----
-title: Sorting APIs
-id: sorting
----
-
-## State
-
-Sorting state is stored on the table using the following shape:
-
-```tsx
-export type SortDirection = 'asc' | 'desc'
-
-export type ColumnSort = {
- id: string
- desc: boolean
-}
-
-export type SortingState = ColumnSort[]
-
-export type SortingTableState = {
- sorting: SortingState
-}
-```
-
-## Sorting Functions
-
-The following sorting functions are built-in to the table core:
-
-- `alphanumeric`
- - Sorts by mixed alphanumeric values without case-sensitivity. Slower, but more accurate if your strings contain numbers that need to be naturally sorted.
-- `alphanumericCaseSensitive`
- - Sorts by mixed alphanumeric values with case-sensitivity. Slower, but more accurate if your strings contain numbers that need to be naturally sorted.
-- `text`
- - Sorts by text/string values without case-sensitivity. Faster, but less accurate if your strings contain numbers that need to be naturally sorted.
-- `textCaseSensitive`
- - Sorts by text/string values with case-sensitivity. Faster, but less accurate if your strings contain numbers that need to be naturally sorted.
-- `datetime`
- - Sorts by time, use this if your values are `Date` objects.
-- `basic`
- - Sorts using a basic/standard `a > b ? 1 : a < b ? -1 : 0` comparison. This is the fastest sorting function, but may not be the most accurate.
-
-Every sorting function receives 2 rows and a column ID and are expected to compare the two rows using the column ID to return `-1`, `0`, or `1` in ascending order. Here's a cheat sheet:
-
-| Return | Ascending Order |
-| ------ | --------------- |
-| `-1` | `a < b` |
-| `0` | `a === b` |
-| `1` | `a > b` |
-
-This is the type signature for every sorting function:
-
-```tsx
-export type SortingFn = {
- (rowA: Row, rowB: Row, columnId: string): number
-}
-```
-
-#### Using Sorting Functions
-
-Sorting functions can be used/referenced/defined by passing the following to `columnDefinition.sortingFn`:
-
-- A `string` that references a built-in sorting function
-- A `string` that references a custom sorting functions provided via the `tableOptions.sortingFns` option
-- A function directly provided to the `columnDefinition.sortingFn` option
-
-The final list of sorting functions available for the `columnDef.sortingFn` use the following type:
-
-```tsx
-export type SortingFnOption =
- | 'auto'
- | SortingFns
- | BuiltInSortingFns
- | SortingFn
-```
-
-## Column Def Options
-
-### `sortingFn`
-
-```tsx
-sortingFn?: SortingFn | keyof SortingFns | keyof BuiltInSortingFns
-```
-
-The sorting function to use with this column.
-
-Options:
-
-- A `string` referencing a [built-in sorting function](#sorting-functions))
-- A [custom sorting function](#sorting-functions)
-
-### `sortDescFirst`
-
-```tsx
-sortDescFirst?: boolean
-```
-
-Set to `true` for sorting toggles on this column to start in the descending direction.
-
-### `enableSorting`
-
-```tsx
-enableSorting?: boolean
-```
-
-Enables/Disables sorting for this column.
-
-### `enableMultiSort`
-
-```tsx
-enableMultiSort?: boolean
-```
-
-Enables/Disables multi-sorting for this column.
-
-### `invertSorting`
-
-```tsx
-invertSorting?: boolean
-```
-
-Inverts the order of the sorting for this column. This is useful for values that have an inverted best/worst scale where lower numbers are better, eg. a ranking (1st, 2nd, 3rd) or golf-like scoring
-
-### `sortUndefined`
-
-```tsx
-sortUndefined?: 'first' | 'last' | false | -1 | 1 // defaults to 1
-```
-
-- `'first'`
- - Undefined values will be pushed to the beginning of the list
-- `'last'`
- - Undefined values will be pushed to the end of the list
-- `false`
- - Undefined values will be considered tied and need to be sorted by the next column filter or original index (whichever applies)
-- `-1`
- - Undefined values will be sorted with higher priority (ascending) (if ascending, undefined will appear on the beginning of the list)
-- `1`
- - Undefined values will be sorted with lower priority (descending) (if ascending, undefined will appear on the end of the list)
-
-> NOTE: `'first'` and `'last'` options are new in v8.16.0
-
-## Column API
-
-### `getAutoSortingFn`
-
-```tsx
-getAutoSortingFn: () => SortingFn
-```
-
-Returns a sorting function automatically inferred based on the columns values.
-
-### `getAutoSortDir`
-
-```tsx
-getAutoSortDir: () => SortDirection
-```
-
-Returns a sort direction automatically inferred based on the columns values.
-
-### `getSortingFn`
-
-```tsx
-getSortingFn: () => SortingFn
-```
-
-Returns the resolved sorting function to be used for this column
-
-### `getNextSortingOrder`
-
-```tsx
-getNextSortingOrder: () => SortDirection | false
-```
-
-Returns the next sorting order.
-
-### `getCanSort`
-
-```tsx
-getCanSort: () => boolean
-```
-
-Returns whether this column can be sorted.
-
-### `getCanMultiSort`
-
-```tsx
-getCanMultiSort: () => boolean
-```
-
-Returns whether this column can be multi-sorted.
-
-### `getSortIndex`
-
-```tsx
-getSortIndex: () => number
-```
-
-Returns the index position of this column's sorting within the sorting state
-
-### `getIsSorted`
-
-```tsx
-getIsSorted: () => false | SortDirection
-```
-
-Returns whether this column is sorted.
-
-### `getFirstSortDir`
-
-```tsx
-getFirstSortDir: () => SortDirection
-```
-
-Returns the first direction that should be used when sorting this column.
-
-### `clearSorting`
-
-```tsx
-clearSorting: () => void
-```
-
-Removes this column from the table's sorting state
-
-### `toggleSorting`
-
-```tsx
-toggleSorting: (desc?: boolean, isMulti?: boolean) => void
-```
-
-Toggles this columns sorting state. If `desc` is provided, it will force the sort direction to that value. If `isMulti` is provided, it will additivity multi-sort the column (or toggle it if it is already sorted).
-
-### `getToggleSortingHandler`
-
-```tsx
-getToggleSortingHandler: () => undefined | ((event: unknown) => void)
-```
-
-Returns a function that can be used to toggle this column's sorting state. This is useful for attaching a click handler to the column header.
-
-## Table Options
-
-### `sortingFns`
-
-```tsx
-sortingFns?: Record
-```
-
-This option allows you to define custom sorting functions that can be referenced in a column's `sortingFn` option by their key.
-Example:
-
-```tsx
-declare module '@tanstack/table-core' {
- interface SortingFns {
- myCustomSorting: SortingFn
- }
-}
-
-const column = columnHelper.data('key', {
- sortingFn: 'myCustomSorting',
-})
-
-const table = useReactTable({
- columns: [column],
- sortingFns: {
- myCustomSorting: (rowA: any, rowB: any, columnId: any): number =>
- rowA.getValue(columnId).value < rowB.getValue(columnId).value ? 1 : -1,
- },
-})
-```
-
-### `manualSorting`
-
-```tsx
-manualSorting?: boolean
-```
-
-Enables manual sorting for the table. If this is `true`, you will be expected to sort your data before it is passed to the table. This is useful if you are doing server-side sorting.
-
-### `onSortingChange`
-
-```tsx
-onSortingChange?: OnChangeFn
-```
-
-If provided, this function will be called with an `updaterFn` when `state.sorting` changes. This overrides the default internal state management, so you will need to persist the state change either fully or partially outside of the table.
-
-### `enableSorting`
-
-```tsx
-enableSorting?: boolean
-```
-
-Enables/Disables sorting for the table.
-
-### `enableSortingRemoval`
-
-```tsx
-enableSortingRemoval?: boolean
-```
-
-Enables/Disables the ability to remove sorting for the table.
-- If `true` then changing sort order will circle like: 'none' -> 'desc' -> 'asc' -> 'none' -> ...
-- If `false` then changing sort order will circle like: 'none' -> 'desc' -> 'asc' -> 'desc' -> 'asc' -> ...
-
-### `enableMultiRemove`
-
-```tsx
-enableMultiRemove?: boolean
-```
-
-Enables/disables the ability to remove multi-sorts
-
-### `enableMultiSort`
-
-```tsx
-enableMultiSort?: boolean
-```
-
-Enables/Disables multi-sorting for the table.
-
-### `sortDescFirst`
-
-```tsx
-sortDescFirst?: boolean
-```
-
-If `true`, all sorts will default to descending as their first toggle state.
-
-### `getSortedRowModel`
-
-```tsx
-getSortedRowModel?: (table: Table) => () => RowModel
-```
-
-This function is used to retrieve the sorted row model. If using server-side sorting, this function is not required. To use client-side sorting, pass the exported `getSortedRowModel()` from your adapter to your table or implement your own.
-
-### `maxMultiSortColCount`
-
-```tsx
-maxMultiSortColCount?: number
-```
-
-Set a maximum number of columns that can be multi-sorted.
-
-### `isMultiSortEvent`
-
-```tsx
-isMultiSortEvent?: (e: unknown) => boolean
-```
-
-Pass a custom function that will be used to determine if a multi-sort event should be triggered. It is passed the event from the sort toggle handler and should return `true` if the event should trigger a multi-sort.
-
-## Table API
-
-### `setSorting`
-
-```tsx
-setSorting: (updater: Updater) => void
-```
-
-Sets or updates the `state.sorting` state.
-
-### `resetSorting`
-
-```tsx
-resetSorting: (defaultState?: boolean) => void
-```
-
-Resets the **sorting** state to `initialState.sorting`, or `true` can be passed to force a default blank state reset to `[]`.
-
-### `getPreSortedRowModel`
-
-```tsx
-getPreSortedRowModel: () => RowModel
-```
-
-Returns the row model for the table before any sorting has been applied.
-
-### `getSortedRowModel`
-
-```tsx
-getSortedRowModel: () => RowModel
-```
-
-Returns the row model for the table after sorting has been applied.
diff --git a/docs/config.json b/docs/config.json
index 506f16ab8f..57621157a1 100644
--- a/docs/config.json
+++ b/docs/config.json
@@ -9,98 +9,66 @@
{
"label": "Getting Started",
"children": [
- {
- "label": "Introduction",
- "to": "introduction"
- },
- {
- "label": "Overview",
- "to": "overview"
- },
- {
- "label": "Installation",
- "to": "installation"
- },
- {
- "label": "Migrating to V8",
- "to": "guide/migrating"
- },
- {
- "label": "FAQ",
- "to": "faq"
- }
+ { "label": "Introduction", "to": "introduction" },
+ { "label": "Overview", "to": "overview" },
+ { "label": "Installation", "to": "installation" },
+ { "label": "Devtools", "to": "devtools" },
+ { "label": "FAQ", "to": "faq" }
],
"frameworks": [
{
"label": "angular",
"children": [
- {
- "label": "Angular Table Adapter",
- "to": "framework/angular/angular-table"
- }
+ { "label": "Angular Table Adapter", "to": "framework/angular/angular-table" },
+ { "label": "Migrating to V9", "to": "framework/angular/guide/migrating" },
+ { "label": "Rendering components", "to": "framework/angular/guide/rendering" },
+ { "label": "Table composition", "to": "framework/angular/guide/table-composition" }
]
},
{
"label": "lit",
"children": [
- {
- "label": "Lit Table Adapter",
- "to": "framework/lit/lit-table"
- }
+ { "label": "Lit Table Adapter", "to": "framework/lit/lit-table" }
]
},
{
- "label": "qwik",
+ "label": "react",
"children": [
- {
- "label": "Qwik Table Adapter",
- "to": "framework/qwik/qwik-table"
- }
+ { "label": "React Table Adapter", "to": "framework/react/react-table" },
+ { "label": "createTableHook Guide", "to": "framework/react/guide/create-table-hook" },
+ { "label": "Migrating to V9", "to": "framework/react/guide/migrating" },
+ { "label": "useLegacyTable Guide", "to": "framework/react/guide/use-legacy-table" }
]
},
{
- "label": "react",
+ "label": "preact",
"children": [
- {
- "label": "React Table Adapter",
- "to": "framework/react/react-table"
- }
+ { "label": "Preact Table Adapter", "to": "framework/preact/preact-table" },
+ { "label": "createTableHook Guide", "to": "framework/preact/guide/create-table-hook" }
]
},
{
"label": "solid",
"children": [
- {
- "label": "Solid Table Adapter",
- "to": "framework/solid/solid-table"
- }
+ { "label": "Solid Table Adapter", "to": "framework/solid/solid-table" }
]
},
{
"label": "svelte",
"children": [
- {
- "label": "Svelte Table Adapter",
- "to": "framework/svelte/svelte-table"
- }
+ { "label": "Svelte Table Adapter", "to": "framework/svelte/svelte-table" }
]
},
{
"label": "vue",
"children": [
- {
- "label": "Vue Table Adapter",
- "to": "framework/vue/vue-table"
- }
+ { "label": "Vue Table Adapter", "to": "framework/vue/vue-table" }
]
},
{
"label": "vanilla",
"children": [
- {
- "label": "Vanilla JS (No Framework)",
- "to": "vanilla"
- }
+ { "label": "Vanilla JS (No Framework)", "to": "vanilla" }
]
}
]
@@ -108,648 +76,1217 @@
{
"label": "Core Guides",
"children": [
+ { "label": "Data", "to": "guide/data" },
+ { "label": "Column Defs", "to": "guide/column-defs" },
+ { "label": "Table Instance", "to": "guide/tables" },
+ { "label": "Row Models", "to": "guide/row-models" },
+ { "label": "Rows", "to": "guide/rows" },
+ { "label": "Cells", "to": "guide/cells" },
+ { "label": "Header Groups", "to": "guide/header-groups" },
+ { "label": "Headers", "to": "guide/headers" },
+ { "label": "Columns", "to": "guide/columns" }
+ ],
+ "frameworks": [
{
- "label": "Data",
- "to": "guide/data"
- },
- {
- "label": "Column Defs",
- "to": "guide/column-defs"
+ "label": "angular",
+ "children": [
+ { "label": "Table State", "to": "framework/angular/guide/table-state" }
+ ]
},
{
- "label": "Table Instance",
- "to": "guide/tables"
+ "label": "lit",
+ "children": [
+ { "label": "Table State", "to": "framework/lit/guide/table-state" }
+ ]
},
{
- "label": "Row Models",
- "to": "guide/row-models"
+ "label": "react",
+ "children": [
+ { "label": "Table State", "to": "framework/react/guide/table-state" }
+ ]
},
{
- "label": "Rows",
- "to": "guide/rows"
+ "label": "preact",
+ "children": [
+ { "label": "Table State", "to": "framework/preact/guide/table-state" }
+ ]
},
{
- "label": "Cells",
- "to": "guide/cells"
+ "label": "solid",
+ "children": [
+ { "label": "Table State", "to": "framework/solid/guide/table-state" }
+ ]
},
{
- "label": "Header Groups",
- "to": "guide/header-groups"
+ "label": "svelte",
+ "children": [
+ { "label": "Table State", "to": "framework/svelte/guide/table-state" }
+ ]
},
{
- "label": "Headers",
- "to": "guide/headers"
+ "label": "vue",
+ "children": [
+ { "label": "Table State", "to": "framework/vue/guide/table-state" }
+ ]
},
{
- "label": "Columns",
- "to": "guide/columns"
+ "label": "vanilla",
+ "children": [
+ { "label": "Table State", "to": "framework/vanilla/guide/table-state" }
+ ]
}
+ ]
+ },
+ {
+ "label": "Feature Guides",
+ "children": [
+ { "label": "Column Ordering", "to": "guide/column-ordering" },
+ { "label": "Column Pinning", "to": "guide/column-pinning" },
+ { "label": "Column Sizing", "to": "guide/column-sizing" },
+ { "label": "Column Resizing", "to": "guide/column-resizing" },
+ { "label": "Column Visibility", "to": "guide/column-visibility" },
+ { "label": "Column Filtering", "to": "guide/column-filtering" },
+ { "label": "Global Filtering", "to": "guide/global-filtering" },
+ { "label": "Fuzzy Filtering", "to": "guide/fuzzy-filtering" },
+ { "label": "Column Faceting", "to": "guide/column-faceting" },
+ { "label": "Global Faceting", "to": "guide/global-faceting" },
+ { "label": "Grouping", "to": "guide/grouping" },
+ { "label": "Expanding", "to": "guide/expanding" },
+ { "label": "Pagination", "to": "guide/pagination" },
+ { "label": "Row Pinning", "to": "guide/row-pinning" },
+ { "label": "Row Selection", "to": "guide/row-selection" },
+ { "label": "Sorting", "to": "guide/sorting" },
+ { "label": "Virtualization", "to": "guide/virtualization" },
+ { "label": "Custom Features", "to": "guide/custom-features" }
+ ]
+ },
+ {
+ "label": "API Reference",
+ "children": [
+ { "label": "Core API Reference", "to": "reference/index" }
],
"frameworks": [
{
"label": "angular",
"children": [
- {
- "label": "Table State",
- "to": "framework/angular/guide/table-state"
- }
+ { "label": "Angular API Reference", "to": "framework/angular/reference/index" }
]
},
{
- "label": "lit",
- "children": [
- {
- "label": "Table State",
- "to": "framework/lit/guide/table-state"
- }
- ]
- },
- {
- "label": "qwik",
+ "label": "react",
"children": [
- {
- "label": "Table State",
- "to": "framework/qwik/guide/table-state"
- }
+ { "label": "React API Reference", "to": "framework/react/reference/index" }
]
},
{
- "label": "react",
+ "label": "preact",
"children": [
- {
- "label": "Table State",
- "to": "framework/react/guide/table-state"
- }
+ { "label": "Preact API Reference", "to": "framework/preact/reference/index" }
]
},
{
"label": "solid",
"children": [
- {
- "label": "Table State",
- "to": "framework/solid/guide/table-state"
- }
+ { "label": "Solid API Reference", "to": "framework/solid/reference/index" }
]
},
{
"label": "svelte",
"children": [
- {
- "label": "Table State",
- "to": "framework/svelte/guide/table-state"
- }
+ { "label": "Svelte API Reference", "to": "framework/svelte/reference/index" }
]
},
{
"label": "vue",
"children": [
- {
- "label": "Table State",
- "to": "framework/vue/guide/table-state"
- }
+ { "label": "Vue API Reference", "to": "framework/vue/reference/index" }
]
},
{
- "label": "vanilla",
+ "label": "lit",
"children": [
- {
- "label": "Table State",
- "to": "framework/vanilla/guide/table-state"
- }
+ { "label": "Lit API Reference", "to": "framework/lit/reference/index" }
]
}
]
},
{
- "label": "Feature Guides",
+ "collapsible": true,
+ "defaultCollapsed": true,
+ "label": "Table API Reference",
"children": [
+ { "label": "Table", "to": "reference/index/type-aliases/Table" },
+ { "label": "TableOptions", "to": "reference/index/type-aliases/TableOptions" },
+ { "label": "TableState", "to": "reference/index/type-aliases/TableState" },
+ { "label": "TableMeta", "to": "reference/index/interfaces/TableMeta" },
+ { "label": "TableFeature", "to": "reference/index/interfaces/TableFeature" },
+ { "label": "TableFeatures", "to": "reference/index/interfaces/TableFeatures" },
+ { "label": "StockFeatures", "to": "reference/index/interfaces/StockFeatures" },
+ { "label": "CoreFeatures", "to": "reference/index/interfaces/CoreFeatures" },
+ { "label": "BaseAtoms", "to": "reference/index/type-aliases/BaseAtoms" },
+ { "label": "Atoms", "to": "reference/index/type-aliases/Atoms" },
+ { "label": "ExternalAtoms", "to": "reference/index/type-aliases/ExternalAtoms" },
+ { "label": "constructTable", "to": "reference/index/functions/constructTable" },
+ { "label": "tableOptions", "to": "reference/index/functions/tableOptions" },
+ { "label": "tableFeatures", "to": "reference/index/functions/tableFeatures" },
+ { "label": "getInitialTableState", "to": "reference/index/functions/getInitialTableState" },
+ { "label": "OnChangeFn", "to": "reference/index/type-aliases/OnChangeFn" },
+ { "label": "Updater", "to": "reference/index/type-aliases/Updater" },
+ { "label": "DebugOptions", "to": "reference/index/type-aliases/DebugOptions" }
+ ],
+ "frameworks": [
{
- "label": "Column Ordering",
- "to": "guide/column-ordering"
+ "label": "react",
+ "children": [
+ { "label": "useTable", "to": "framework/react/reference/index/functions/useTable" },
+ { "label": "createTableHook", "to": "framework/react/reference/index/functions/createTableHook" },
+ { "label": "ReactTable", "to": "framework/react/reference/index/type-aliases/ReactTable" },
+ { "label": "AppReactTable", "to": "framework/react/reference/index/type-aliases/AppReactTable" },
+ { "label": "CreateTableHookOptions", "to": "framework/react/reference/index/type-aliases/CreateTableHookOptions" },
+ { "label": "Subscribe", "to": "framework/react/reference/index/functions/Subscribe" },
+ { "label": "SubscribeProps", "to": "framework/react/reference/index/type-aliases/SubscribeProps" },
+ { "label": "FlexRender", "to": "framework/react/reference/index/functions/FlexRender-1" },
+ { "label": "flexRender", "to": "framework/react/reference/index/functions/flexRender" },
+ { "label": "FlexRenderProps", "to": "framework/react/reference/index/type-aliases/FlexRenderProps" },
+ { "label": "Renderable", "to": "framework/react/reference/index/type-aliases/Renderable" }
+ ]
},
{
- "label": "Column Pinning",
- "to": "guide/column-pinning"
+ "label": "angular",
+ "children": [
+ { "label": "injectTable", "to": "framework/angular/reference/functions/injectTable" },
+ { "label": "createTableHook", "to": "framework/angular/reference/functions/createTableHook" },
+ { "label": "AngularTable", "to": "framework/angular/reference/type-aliases/AngularTable" },
+ { "label": "AppAngularTable", "to": "framework/angular/reference/type-aliases/AppAngularTable" },
+ { "label": "CreateTableHookResult", "to": "framework/angular/reference/type-aliases/CreateTableHookResult" },
+ { "label": "CreateTableContextOptions", "to": "framework/angular/reference/type-aliases/CreateTableContextOptions" },
+ { "label": "flexRenderComponent", "to": "framework/angular/reference/functions/flexRenderComponent" },
+ { "label": "FlexRenderComponent", "to": "framework/angular/reference/interfaces/FlexRenderComponent" },
+ { "label": "FlexRenderContent", "to": "framework/angular/reference/type-aliases/FlexRenderContent" },
+ { "label": "FlexRenderInputContent", "to": "framework/angular/reference/type-aliases/FlexRenderInputContent" },
+ { "label": "FlexRenderComponentProps", "to": "framework/angular/reference/type-aliases/FlexRenderComponentProps" },
+ { "label": "FlexRender", "to": "framework/angular/reference/variables/FlexRender" },
+ { "label": "FlexRenderDirective", "to": "framework/angular/reference/classes/FlexRenderDirective" },
+ { "label": "FlexRenderCell", "to": "framework/angular/reference/classes/FlexRenderCell" },
+ { "label": "TanStackTable", "to": "framework/angular/reference/classes/TanStackTable" },
+ { "label": "TanStackTableToken", "to": "framework/angular/reference/variables/TanStackTableToken" },
+ { "label": "injectTableContext", "to": "framework/angular/reference/functions/injectTableContext" },
+ { "label": "AngularTableComputed", "to": "framework/angular/reference/interfaces/AngularTableComputed" }
+ ]
},
{
- "label": "Column Sizing",
- "to": "guide/column-sizing"
+ "label": "preact",
+ "children": [
+ { "label": "useTable", "to": "framework/preact/reference/functions/useTable" },
+ { "label": "createTableHook", "to": "framework/preact/reference/functions/createTableHook" },
+ { "label": "PreactTable", "to": "framework/preact/reference/type-aliases/PreactTable" },
+ { "label": "AppPreactTable", "to": "framework/preact/reference/type-aliases/AppPreactTable" },
+ { "label": "CreateTableHookOptions", "to": "framework/preact/reference/type-aliases/CreateTableHookOptions" },
+ { "label": "Subscribe", "to": "framework/preact/reference/functions/Subscribe" },
+ { "label": "SubscribeProps", "to": "framework/preact/reference/type-aliases/SubscribeProps" },
+ { "label": "FlexRender", "to": "framework/preact/reference/functions/FlexRender-1" },
+ { "label": "flexRender", "to": "framework/preact/reference/functions/flexRender" }
+ ]
},
{
- "label": "Column Visibility",
- "to": "guide/column-visibility"
+ "label": "solid",
+ "children": [
+ { "label": "createTable", "to": "framework/solid/reference/functions/createTable" },
+ { "label": "createTableHook", "to": "framework/solid/reference/functions/createTableHook" },
+ { "label": "SolidTable", "to": "framework/solid/reference/type-aliases/SolidTable" },
+ { "label": "AppSolidTable", "to": "framework/solid/reference/type-aliases/AppSolidTable" },
+ { "label": "CreateTableHookOptions", "to": "framework/solid/reference/type-aliases/CreateTableHookOptions" },
+ { "label": "FlexRender", "to": "framework/solid/reference/functions/FlexRender-1" },
+ { "label": "flexRender", "to": "framework/solid/reference/functions/flexRender" }
+ ]
},
{
- "label": "Column Filtering",
- "to": "guide/column-filtering"
+ "label": "svelte",
+ "children": [
+ { "label": "createTable", "to": "framework/svelte/reference/functions/createTable" },
+ { "label": "createTableHook", "to": "framework/svelte/reference/functions/createTableHook" },
+ { "label": "createTableState", "to": "framework/svelte/reference/functions/createTableState" },
+ { "label": "SvelteTable", "to": "framework/svelte/reference/type-aliases/SvelteTable" },
+ { "label": "AppSvelteTable", "to": "framework/svelte/reference/type-aliases/AppSvelteTable" },
+ { "label": "subscribeTable", "to": "framework/svelte/reference/functions/subscribeTable" },
+ { "label": "renderComponent", "to": "framework/svelte/reference/functions/renderComponent" },
+ { "label": "renderSnippet", "to": "framework/svelte/reference/functions/renderSnippet" },
+ { "label": "FlexRender", "to": "framework/svelte/reference/variables/FlexRender" }
+ ]
},
{
- "label": "Global Filtering",
- "to": "guide/global-filtering"
+ "label": "vue",
+ "children": [
+ { "label": "useTable", "to": "framework/vue/reference/functions/useTable" },
+ { "label": "createTableHook", "to": "framework/vue/reference/functions/createTableHook" },
+ { "label": "VueTable", "to": "framework/vue/reference/type-aliases/VueTable" },
+ { "label": "AppVueTable", "to": "framework/vue/reference/type-aliases/AppVueTable" },
+ { "label": "CreateTableHookOptions", "to": "framework/vue/reference/type-aliases/CreateTableHookOptions" },
+ { "label": "FlexRender", "to": "framework/vue/reference/variables/FlexRender" },
+ { "label": "flexRender", "to": "framework/vue/reference/functions/flexRender" }
+ ]
},
{
- "label": "Fuzzy Filtering",
- "to": "guide/fuzzy-filtering"
+ "label": "lit",
+ "children": [
+ { "label": "TableController", "to": "framework/lit/reference/classes/TableController" },
+ { "label": "createTableHook", "to": "framework/lit/reference/functions/createTableHook" },
+ { "label": "LitTable", "to": "framework/lit/reference/type-aliases/LitTable" },
+ { "label": "AppLitTable", "to": "framework/lit/reference/type-aliases/AppLitTable" },
+ { "label": "CreateTableHookOptions", "to": "framework/lit/reference/type-aliases/CreateTableHookOptions" },
+ { "label": "FlexRender", "to": "framework/lit/reference/functions/FlexRender-1" },
+ { "label": "flexRender", "to": "framework/lit/reference/functions/flexRender" }
+ ]
+ }
+ ]
+ },
+ {
+ "collapsible": true,
+ "defaultCollapsed": true,
+ "label": "Column API Reference",
+ "children": [
+ { "label": "Column", "to": "reference/index/type-aliases/Column" },
+ { "label": "ColumnDef", "to": "reference/index/type-aliases/ColumnDef" },
+ { "label": "ColumnDefBase", "to": "reference/index/type-aliases/ColumnDefBase" },
+ { "label": "AccessorColumnDef", "to": "reference/index/type-aliases/AccessorColumnDef" },
+ { "label": "DisplayColumnDef", "to": "reference/index/type-aliases/DisplayColumnDef" },
+ { "label": "GroupColumnDef", "to": "reference/index/type-aliases/GroupColumnDef" },
+ { "label": "ColumnDefTemplate", "to": "reference/index/type-aliases/ColumnDefTemplate" },
+ { "label": "ColumnHelper", "to": "reference/index/type-aliases/ColumnHelper" },
+ { "label": "ColumnMeta", "to": "reference/index/interfaces/ColumnMeta" },
+ { "label": "createColumnHelper", "to": "reference/index/functions/createColumnHelper" },
+ { "label": "constructColumn", "to": "reference/index/functions/constructColumn" },
+ { "label": "AccessorFn", "to": "reference/index/type-aliases/AccessorFn" },
+ { "label": "DeepKeys", "to": "reference/index/type-aliases/DeepKeys" },
+ { "label": "DeepValue", "to": "reference/index/type-aliases/DeepValue" }
+ ],
+ "frameworks": [
+ {
+ "label": "react",
+ "children": [
+ { "label": "AppColumnHelper", "to": "framework/react/reference/index/type-aliases/AppColumnHelper" }
+ ]
},
{
- "label": "Column Faceting",
- "to": "guide/column-faceting"
+ "label": "angular",
+ "children": [
+ { "label": "AppColumnHelper", "to": "framework/angular/reference/type-aliases/AppColumnHelper" }
+ ]
},
{
- "label": "Global Faceting",
- "to": "guide/global-faceting"
+ "label": "preact",
+ "children": [
+ { "label": "AppColumnHelper", "to": "framework/preact/reference/type-aliases/AppColumnHelper" }
+ ]
},
{
- "label": "Grouping",
- "to": "guide/grouping"
+ "label": "solid",
+ "children": [
+ { "label": "AppColumnHelper", "to": "framework/solid/reference/type-aliases/AppColumnHelper" }
+ ]
},
{
- "label": "Expanding",
- "to": "guide/expanding"
+ "label": "svelte",
+ "children": [
+ { "label": "AppColumnHelper", "to": "framework/svelte/reference/type-aliases/AppColumnHelper" }
+ ]
},
{
- "label": "Pagination",
- "to": "guide/pagination"
+ "label": "vue",
+ "children": [
+ { "label": "AppColumnHelper", "to": "framework/vue/reference/type-aliases/AppColumnHelper" }
+ ]
},
{
- "label": "Row Pinning",
- "to": "guide/row-pinning"
+ "label": "lit",
+ "children": [
+ { "label": "AppColumnHelper", "to": "framework/lit/reference/type-aliases/AppColumnHelper" }
+ ]
+ }
+ ]
+ },
+ {
+ "collapsible": true,
+ "defaultCollapsed": true,
+ "label": "Row API Reference",
+ "children": [
+ { "label": "Row", "to": "reference/index/type-aliases/Row" },
+ { "label": "RowData", "to": "reference/index/type-aliases/RowData" },
+ { "label": "RowModel", "to": "reference/index/interfaces/RowModel" },
+ { "label": "constructRow", "to": "reference/index/functions/constructRow" },
+ { "label": "createCoreRowModel", "to": "reference/index/functions/createCoreRowModel" },
+ { "label": "createFilteredRowModel", "to": "reference/index/functions/createFilteredRowModel" },
+ { "label": "createSortedRowModel", "to": "reference/index/functions/createSortedRowModel" },
+ { "label": "createGroupedRowModel", "to": "reference/index/functions/createGroupedRowModel" },
+ { "label": "createExpandedRowModel", "to": "reference/index/functions/createExpandedRowModel" },
+ { "label": "createPaginatedRowModel", "to": "reference/index/functions/createPaginatedRowModel" },
+ { "label": "createFacetedRowModel", "to": "reference/index/functions/createFacetedRowModel" },
+ { "label": "createFacetedMinMaxValues", "to": "reference/index/functions/createFacetedMinMaxValues" },
+ { "label": "createFacetedUniqueValues", "to": "reference/index/functions/createFacetedUniqueValues" },
+ { "label": "expandRows", "to": "reference/index/functions/expandRows" },
+ { "label": "RowModelFns", "to": "reference/index/type-aliases/RowModelFns" },
+ { "label": "CreateRowModels", "to": "reference/index/type-aliases/CreateRowModels" },
+ { "label": "CachedRowModels", "to": "reference/index/type-aliases/CachedRowModels" }
+ ]
+ },
+ {
+ "collapsible": true,
+ "defaultCollapsed": true,
+ "label": "Cell API Reference",
+ "children": [
+ { "label": "Cell", "to": "reference/index/type-aliases/Cell" },
+ { "label": "CellContext", "to": "reference/index/interfaces/CellContext" },
+ { "label": "CellData", "to": "reference/index/type-aliases/CellData" },
+ { "label": "constructCell", "to": "reference/index/functions/constructCell" }
+ ],
+ "frameworks": [
+ {
+ "label": "react",
+ "children": [
+ { "label": "AppCellContext", "to": "framework/react/reference/index/type-aliases/AppCellContext" }
+ ]
},
{
- "label": "Row Selection",
- "to": "guide/row-selection"
+ "label": "angular",
+ "children": [
+ { "label": "AppCellContext", "to": "framework/angular/reference/type-aliases/AppCellContext" }
+ ]
},
{
- "label": "Sorting",
- "to": "guide/sorting"
+ "label": "preact",
+ "children": [
+ { "label": "AppCellContext", "to": "framework/preact/reference/type-aliases/AppCellContext" }
+ ]
},
{
- "label": "Virtualization",
- "to": "guide/virtualization"
+ "label": "solid",
+ "children": [
+ { "label": "AppCellContext", "to": "framework/solid/reference/type-aliases/AppCellContext" }
+ ]
+ },
+ {
+ "label": "svelte",
+ "children": [
+ { "label": "AppCellContext", "to": "framework/svelte/reference/type-aliases/AppCellContext" }
+ ]
},
{
- "label": "Custom Features",
- "to": "guide/custom-features"
+ "label": "vue",
+ "children": [
+ { "label": "AppCellContext", "to": "framework/vue/reference/type-aliases/AppCellContext" }
+ ]
+ },
+ {
+ "label": "lit",
+ "children": [
+ { "label": "AppCellContext", "to": "framework/lit/reference/type-aliases/AppCellContext" }
+ ]
}
]
},
{
- "label": "Core APIs",
+ "collapsible": true,
+ "defaultCollapsed": true,
+ "label": "Header API Reference",
"children": [
+ { "label": "Header", "to": "reference/index/type-aliases/Header" },
+ { "label": "HeaderGroup", "to": "reference/index/type-aliases/HeaderGroup" },
+ { "label": "HeaderContext", "to": "reference/index/interfaces/HeaderContext" },
+ { "label": "constructHeader", "to": "reference/index/functions/constructHeader" },
+ { "label": "buildHeaderGroups", "to": "reference/index/functions/buildHeaderGroups" }
+ ],
+ "frameworks": [
{
- "label": "Column Def",
- "to": "api/core/column-def"
+ "label": "react",
+ "children": [
+ { "label": "AppHeaderContext", "to": "framework/react/reference/index/type-aliases/AppHeaderContext" }
+ ]
},
{
- "label": "Table",
- "to": "api/core/table"
+ "label": "angular",
+ "children": [
+ { "label": "AppHeaderContext", "to": "framework/angular/reference/type-aliases/AppHeaderContext" }
+ ]
},
{
- "label": "Column",
- "to": "api/core/column"
+ "label": "preact",
+ "children": [
+ { "label": "AppHeaderContext", "to": "framework/preact/reference/type-aliases/AppHeaderContext" }
+ ]
},
{
- "label": "Header Group",
- "to": "api/core/header-group"
+ "label": "solid",
+ "children": [
+ { "label": "AppHeaderContext", "to": "framework/solid/reference/type-aliases/AppHeaderContext" }
+ ]
},
{
- "label": "Header",
- "to": "api/core/header"
+ "label": "svelte",
+ "children": [
+ { "label": "AppHeaderContext", "to": "framework/svelte/reference/type-aliases/AppHeaderContext" }
+ ]
},
{
- "label": "Row",
- "to": "api/core/row"
+ "label": "vue",
+ "children": [
+ { "label": "AppHeaderContext", "to": "framework/vue/reference/type-aliases/AppHeaderContext" }
+ ]
},
{
- "label": "Cell",
- "to": "api/core/cell"
+ "label": "lit",
+ "children": [
+ { "label": "AppHeaderContext", "to": "framework/lit/reference/type-aliases/AppHeaderContext" }
+ ]
}
]
},
{
- "label": "Feature APIs",
+ "collapsible": true,
+ "defaultCollapsed": true,
+ "label": "Features API Reference",
+ "children": [
+ { "label": "stockFeatures", "to": "reference/index/variables/stockFeatures" },
+ { "label": "coreFeatures", "to": "reference/index/variables/coreFeatures" },
+ { "label": "coreCellsFeature", "to": "reference/index/variables/coreCellsFeature" },
+ { "label": "coreColumnsFeature", "to": "reference/index/variables/coreColumnsFeature" },
+ { "label": "coreHeadersFeature", "to": "reference/index/variables/coreHeadersFeature" },
+ { "label": "coreRowModelsFeature", "to": "reference/index/variables/coreRowModelsFeature" },
+ { "label": "coreRowsFeature", "to": "reference/index/variables/coreRowsFeature" },
+ { "label": "coreTablesFeature", "to": "reference/index/variables/coreTablesFeature" },
+ { "label": "columnFilteringFeature", "to": "reference/index/variables/columnFilteringFeature" },
+ { "label": "columnFacetingFeature", "to": "reference/index/variables/columnFacetingFeature" },
+ { "label": "columnGroupingFeature", "to": "reference/index/variables/columnGroupingFeature" },
+ { "label": "columnOrderingFeature", "to": "reference/index/variables/columnOrderingFeature" },
+ { "label": "columnPinningFeature", "to": "reference/index/variables/columnPinningFeature" },
+ { "label": "columnResizingFeature", "to": "reference/index/variables/columnResizingFeature" },
+ { "label": "columnSizingFeature", "to": "reference/index/variables/columnSizingFeature" },
+ { "label": "columnVisibilityFeature", "to": "reference/index/variables/columnVisibilityFeature" },
+ { "label": "globalFilteringFeature", "to": "reference/index/variables/globalFilteringFeature" },
+ { "label": "rowExpandingFeature", "to": "reference/index/variables/rowExpandingFeature" },
+ { "label": "rowPaginationFeature", "to": "reference/index/variables/rowPaginationFeature" },
+ { "label": "rowPinningFeature", "to": "reference/index/variables/rowPinningFeature" },
+ { "label": "rowSelectionFeature", "to": "reference/index/variables/rowSelectionFeature" },
+ { "label": "rowSortingFeature", "to": "reference/index/variables/rowSortingFeature" },
+ { "label": "filterFns", "to": "reference/index/variables/filterFns" },
+ { "label": "sortFns", "to": "reference/index/variables/sortFns" },
+ { "label": "aggregationFns", "to": "reference/index/variables/aggregationFns" },
+ { "label": "constructColumnFilteringFeature", "to": "reference/index/functions/constructColumnFilteringFeature" },
+ { "label": "constructColumnFacetingFeature", "to": "reference/index/functions/constructColumnFacetingFeature" },
+ { "label": "constructColumnGroupingFeature", "to": "reference/index/functions/constructColumnGroupingFeature" },
+ { "label": "constructColumnOrderingFeature", "to": "reference/index/functions/constructColumnOrderingFeature" },
+ { "label": "constructColumnPinningFeature", "to": "reference/index/functions/constructColumnPinningFeature" },
+ { "label": "constructColumnResizingFeature", "to": "reference/index/functions/constructColumnResizingFeature" },
+ { "label": "constructColumnSizingFeature", "to": "reference/index/functions/constructColumnSizingFeature" },
+ { "label": "constructColumnVisibilityFeature", "to": "reference/index/functions/constructColumnVisibilityFeature" },
+ { "label": "constructGlobalFilteringFeature", "to": "reference/index/functions/constructGlobalFilteringFeature" },
+ { "label": "constructRowExpandingFeature", "to": "reference/index/functions/constructRowExpandingFeature" },
+ { "label": "constructRowPaginationFeature", "to": "reference/index/functions/constructRowPaginationFeature" },
+ { "label": "constructRowPinningFeature", "to": "reference/index/functions/constructRowPinningFeature" },
+ { "label": "constructRowSelectionFeature", "to": "reference/index/functions/constructRowSelectionFeature" },
+ { "label": "constructRowSortingFeature", "to": "reference/index/functions/constructRowSortingFeature" },
+ { "label": "ColumnFilter", "to": "reference/index/interfaces/ColumnFilter" },
+ { "label": "ColumnPinningState", "to": "reference/index/interfaces/ColumnPinningState" },
+ { "label": "ColumnSort", "to": "reference/index/interfaces/ColumnSort" },
+ { "label": "PaginationState", "to": "reference/index/interfaces/PaginationState" },
+ { "label": "RowPinningState", "to": "reference/index/interfaces/RowPinningState" },
+ { "label": "columnResizingState", "to": "reference/index/interfaces/columnResizingState" },
+ { "label": "FilterFn", "to": "reference/index/interfaces/FilterFn" },
+ { "label": "FilterFns", "to": "reference/index/interfaces/FilterFns" },
+ { "label": "FilterMeta", "to": "reference/index/interfaces/FilterMeta" },
+ { "label": "SortFn", "to": "reference/index/interfaces/SortFn" },
+ { "label": "SortFns", "to": "reference/index/interfaces/SortFns" },
+ { "label": "AggregationFns", "to": "reference/index/interfaces/AggregationFns" },
+ { "label": "ColumnFiltersState", "to": "reference/index/type-aliases/ColumnFiltersState" },
+ { "label": "ColumnOrderState", "to": "reference/index/type-aliases/ColumnOrderState" },
+ { "label": "ColumnPinningPosition", "to": "reference/index/type-aliases/ColumnPinningPosition" },
+ { "label": "ColumnResizeDirection", "to": "reference/index/type-aliases/ColumnResizeDirection" },
+ { "label": "ColumnResizeMode", "to": "reference/index/type-aliases/ColumnResizeMode" },
+ { "label": "ColumnSizingState", "to": "reference/index/type-aliases/ColumnSizingState" },
+ { "label": "ColumnVisibilityState", "to": "reference/index/type-aliases/ColumnVisibilityState" },
+ { "label": "ExpandedState", "to": "reference/index/type-aliases/ExpandedState" },
+ { "label": "GroupingState", "to": "reference/index/type-aliases/GroupingState" },
+ { "label": "RowPinningPosition", "to": "reference/index/type-aliases/RowPinningPosition" },
+ { "label": "RowSelectionState", "to": "reference/index/type-aliases/RowSelectionState" },
+ { "label": "SortDirection", "to": "reference/index/type-aliases/SortDirection" },
+ { "label": "SortingState", "to": "reference/index/type-aliases/SortingState" },
+ { "label": "AggregationFn", "to": "reference/index/type-aliases/AggregationFn" },
+ { "label": "AggregationFnOption", "to": "reference/index/type-aliases/AggregationFnOption" },
+ { "label": "FilterFnOption", "to": "reference/index/type-aliases/FilterFnOption" },
+ { "label": "SortFnOption", "to": "reference/index/type-aliases/SortFnOption" },
+ { "label": "BuiltInAggregationFn", "to": "reference/index/type-aliases/BuiltInAggregationFn" },
+ { "label": "BuiltInFilterFn", "to": "reference/index/type-aliases/BuiltInFilterFn" },
+ { "label": "BuiltInSortFn", "to": "reference/index/type-aliases/BuiltInSortFn" },
+ { "label": "filterFn_arrHas", "to": "reference/index/variables/filterFn_arrHas" },
+ { "label": "filterFn_arrIncludes", "to": "reference/index/variables/filterFn_arrIncludes" },
+ { "label": "filterFn_arrIncludesAll", "to": "reference/index/variables/filterFn_arrIncludesAll" },
+ { "label": "filterFn_arrIncludesSome", "to": "reference/index/variables/filterFn_arrIncludesSome" },
+ { "label": "filterFn_equals", "to": "reference/index/variables/filterFn_equals" },
+ { "label": "filterFn_equalsString", "to": "reference/index/variables/filterFn_equalsString" },
+ { "label": "filterFn_equalsStringSensitive", "to": "reference/index/variables/filterFn_equalsStringSensitive" },
+ { "label": "filterFn_greaterThan", "to": "reference/index/variables/filterFn_greaterThan" },
+ { "label": "filterFn_greaterThanOrEqualTo", "to": "reference/index/variables/filterFn_greaterThanOrEqualTo" },
+ { "label": "filterFn_inNumberRange", "to": "reference/index/variables/filterFn_inNumberRange" },
+ { "label": "filterFn_includesString", "to": "reference/index/variables/filterFn_includesString" },
+ { "label": "filterFn_includesStringSensitive", "to": "reference/index/variables/filterFn_includesStringSensitive" },
+ { "label": "filterFn_lessThan", "to": "reference/index/variables/filterFn_lessThan" },
+ { "label": "filterFn_lessThanOrEqualTo", "to": "reference/index/variables/filterFn_lessThanOrEqualTo" },
+ { "label": "filterFn_weakEquals", "to": "reference/index/variables/filterFn_weakEquals" },
+ { "label": "sortFn_alphanumeric", "to": "reference/index/variables/sortFn_alphanumeric" },
+ { "label": "sortFn_alphanumericCaseSensitive", "to": "reference/index/variables/sortFn_alphanumericCaseSensitive" },
+ { "label": "sortFn_basic", "to": "reference/index/variables/sortFn_basic" },
+ { "label": "sortFn_datetime", "to": "reference/index/variables/sortFn_datetime" },
+ { "label": "sortFn_text", "to": "reference/index/variables/sortFn_text" },
+ { "label": "sortFn_textCaseSensitive", "to": "reference/index/variables/sortFn_textCaseSensitive" },
+ { "label": "aggregationFn_count", "to": "reference/index/variables/aggregationFn_count" },
+ { "label": "aggregationFn_extent", "to": "reference/index/variables/aggregationFn_extent" },
+ { "label": "aggregationFn_max", "to": "reference/index/variables/aggregationFn_max" },
+ { "label": "aggregationFn_mean", "to": "reference/index/variables/aggregationFn_mean" },
+ { "label": "aggregationFn_median", "to": "reference/index/variables/aggregationFn_median" },
+ { "label": "aggregationFn_min", "to": "reference/index/variables/aggregationFn_min" },
+ { "label": "aggregationFn_sum", "to": "reference/index/variables/aggregationFn_sum" },
+ { "label": "aggregationFn_unique", "to": "reference/index/variables/aggregationFn_unique" },
+ { "label": "aggregationFn_uniqueCount", "to": "reference/index/variables/aggregationFn_uniqueCount" }
+ ]
+ },
+ {
+ "collapsible": true,
+ "defaultCollapsed": true,
+ "label": "Static Functions API Reference",
"children": [
+ { "label": "cell_getContext", "to": "reference/static-functions/functions/cell_getContext" },
+ { "label": "cell_getIsAggregated", "to": "reference/static-functions/functions/cell_getIsAggregated" },
+ { "label": "cell_getIsGrouped", "to": "reference/static-functions/functions/cell_getIsGrouped" },
+ { "label": "cell_getIsPlaceholder", "to": "reference/static-functions/functions/cell_getIsPlaceholder" },
+ { "label": "cell_getValue", "to": "reference/static-functions/functions/cell_getValue" },
+ { "label": "cell_renderValue", "to": "reference/static-functions/functions/cell_renderValue" },
+ { "label": "column_clearSorting", "to": "reference/static-functions/functions/column_clearSorting" },
+ { "label": "column_getAfter", "to": "reference/static-functions/functions/column_getAfter" },
+ { "label": "column_getAggregationFn", "to": "reference/static-functions/functions/column_getAggregationFn" },
+ { "label": "column_getAutoAggregationFn", "to": "reference/static-functions/functions/column_getAutoAggregationFn" },
+ { "label": "column_getAutoFilterFn", "to": "reference/static-functions/functions/column_getAutoFilterFn" },
+ { "label": "column_getAutoSortDir", "to": "reference/static-functions/functions/column_getAutoSortDir" },
+ { "label": "column_getAutoSortFn", "to": "reference/static-functions/functions/column_getAutoSortFn" },
+ { "label": "column_getCanFilter", "to": "reference/static-functions/functions/column_getCanFilter" },
+ { "label": "column_getCanGlobalFilter", "to": "reference/static-functions/functions/column_getCanGlobalFilter" },
+ { "label": "column_getCanGroup", "to": "reference/static-functions/functions/column_getCanGroup" },
+ { "label": "column_getCanHide", "to": "reference/static-functions/functions/column_getCanHide" },
+ { "label": "column_getCanMultiSort", "to": "reference/static-functions/functions/column_getCanMultiSort" },
+ { "label": "column_getCanPin", "to": "reference/static-functions/functions/column_getCanPin" },
+ { "label": "column_getCanResize", "to": "reference/static-functions/functions/column_getCanResize" },
+ { "label": "column_getCanSort", "to": "reference/static-functions/functions/column_getCanSort" },
+ { "label": "column_getFacetedMinMaxValues", "to": "reference/static-functions/functions/column_getFacetedMinMaxValues" },
+ { "label": "column_getFacetedRowModel", "to": "reference/static-functions/functions/column_getFacetedRowModel" },
+ { "label": "column_getFacetedUniqueValues", "to": "reference/static-functions/functions/column_getFacetedUniqueValues" },
+ { "label": "column_getFilterFn", "to": "reference/static-functions/functions/column_getFilterFn" },
+ { "label": "column_getFilterIndex", "to": "reference/static-functions/functions/column_getFilterIndex" },
+ { "label": "column_getFilterValue", "to": "reference/static-functions/functions/column_getFilterValue" },
+ { "label": "column_getFirstSortDir", "to": "reference/static-functions/functions/column_getFirstSortDir" },
+ { "label": "column_getFlatColumns", "to": "reference/static-functions/functions/column_getFlatColumns" },
+ { "label": "column_getGroupedIndex", "to": "reference/static-functions/functions/column_getGroupedIndex" },
+ { "label": "column_getIndex", "to": "reference/static-functions/functions/column_getIndex" },
+ { "label": "column_getIsFiltered", "to": "reference/static-functions/functions/column_getIsFiltered" },
+ { "label": "column_getIsFirstColumn", "to": "reference/static-functions/functions/column_getIsFirstColumn" },
+ { "label": "column_getIsGrouped", "to": "reference/static-functions/functions/column_getIsGrouped" },
+ { "label": "column_getIsLastColumn", "to": "reference/static-functions/functions/column_getIsLastColumn" },
+ { "label": "column_getIsPinned", "to": "reference/static-functions/functions/column_getIsPinned" },
+ { "label": "column_getIsResizing", "to": "reference/static-functions/functions/column_getIsResizing" },
+ { "label": "column_getIsSorted", "to": "reference/static-functions/functions/column_getIsSorted" },
+ { "label": "column_getIsVisible", "to": "reference/static-functions/functions/column_getIsVisible" },
+ { "label": "column_getLeafColumns", "to": "reference/static-functions/functions/column_getLeafColumns" },
+ { "label": "column_getNextSortingOrder", "to": "reference/static-functions/functions/column_getNextSortingOrder" },
+ { "label": "column_getPinnedIndex", "to": "reference/static-functions/functions/column_getPinnedIndex" },
+ { "label": "column_getSize", "to": "reference/static-functions/functions/column_getSize" },
+ { "label": "column_getSortFn", "to": "reference/static-functions/functions/column_getSortFn" },
+ { "label": "column_getSortIndex", "to": "reference/static-functions/functions/column_getSortIndex" },
+ { "label": "column_getStart", "to": "reference/static-functions/functions/column_getStart" },
+ { "label": "column_getToggleGroupingHandler", "to": "reference/static-functions/functions/column_getToggleGroupingHandler" },
+ { "label": "column_getToggleSortingHandler", "to": "reference/static-functions/functions/column_getToggleSortingHandler" },
+ { "label": "column_getToggleVisibilityHandler", "to": "reference/static-functions/functions/column_getToggleVisibilityHandler" },
+ { "label": "column_pin", "to": "reference/static-functions/functions/column_pin" },
+ { "label": "column_resetSize", "to": "reference/static-functions/functions/column_resetSize" },
+ { "label": "column_setFilterValue", "to": "reference/static-functions/functions/column_setFilterValue" },
+ { "label": "column_toggleGrouping", "to": "reference/static-functions/functions/column_toggleGrouping" },
+ { "label": "column_toggleSorting", "to": "reference/static-functions/functions/column_toggleSorting" },
+ { "label": "column_toggleVisibility", "to": "reference/static-functions/functions/column_toggleVisibility" },
+ { "label": "getDefaultColumnFiltersState", "to": "reference/static-functions/functions/getDefaultColumnFiltersState" },
+ { "label": "getDefaultColumnOrderState", "to": "reference/static-functions/functions/getDefaultColumnOrderState" },
+ { "label": "getDefaultColumnPinningState", "to": "reference/static-functions/functions/getDefaultColumnPinningState" },
+ { "label": "getDefaultColumnResizingState", "to": "reference/static-functions/functions/getDefaultColumnResizingState" },
+ { "label": "getDefaultColumnSizingColumnDef", "to": "reference/static-functions/functions/getDefaultColumnSizingColumnDef" },
+ { "label": "getDefaultColumnSizingState", "to": "reference/static-functions/functions/getDefaultColumnSizingState" },
+ { "label": "getDefaultColumnVisibilityState", "to": "reference/static-functions/functions/getDefaultColumnVisibilityState" },
+ { "label": "getDefaultExpandedState", "to": "reference/static-functions/functions/getDefaultExpandedState" },
+ { "label": "getDefaultGroupingState", "to": "reference/static-functions/functions/getDefaultGroupingState" },
+ { "label": "getDefaultPaginationState", "to": "reference/static-functions/functions/getDefaultPaginationState" },
+ { "label": "getDefaultRowPinningState", "to": "reference/static-functions/functions/getDefaultRowPinningState" },
+ { "label": "getDefaultRowSelectionState", "to": "reference/static-functions/functions/getDefaultRowSelectionState" },
+ { "label": "getDefaultSortingState", "to": "reference/static-functions/functions/getDefaultSortingState" },
+ { "label": "header_getContext", "to": "reference/static-functions/functions/header_getContext" },
+ { "label": "header_getLeafHeaders", "to": "reference/static-functions/functions/header_getLeafHeaders" },
+ { "label": "header_getResizeHandler", "to": "reference/static-functions/functions/header_getResizeHandler" },
+ { "label": "header_getSize", "to": "reference/static-functions/functions/header_getSize" },
+ { "label": "header_getStart", "to": "reference/static-functions/functions/header_getStart" },
+ { "label": "isRowSelected", "to": "reference/static-functions/functions/isRowSelected" },
+ { "label": "isSubRowSelected", "to": "reference/static-functions/functions/isSubRowSelected" },
+ { "label": "isTouchStartEvent", "to": "reference/static-functions/functions/isTouchStartEvent" },
+ { "label": "orderColumns", "to": "reference/static-functions/functions/orderColumns" },
+ { "label": "passiveEventSupported", "to": "reference/static-functions/functions/passiveEventSupported" },
+ { "label": "row_getAllCells", "to": "reference/static-functions/functions/row_getAllCells" },
+ { "label": "row_getAllCellsByColumnId", "to": "reference/static-functions/functions/row_getAllCellsByColumnId" },
+ { "label": "row_getAllVisibleCells", "to": "reference/static-functions/functions/row_getAllVisibleCells" },
+ { "label": "row_getCanExpand", "to": "reference/static-functions/functions/row_getCanExpand" },
+ { "label": "row_getCanMultiSelect", "to": "reference/static-functions/functions/row_getCanMultiSelect" },
+ { "label": "row_getCanPin", "to": "reference/static-functions/functions/row_getCanPin" },
+ { "label": "row_getCanSelect", "to": "reference/static-functions/functions/row_getCanSelect" },
+ { "label": "row_getCanSelectSubRows", "to": "reference/static-functions/functions/row_getCanSelectSubRows" },
+ { "label": "row_getCenterVisibleCells", "to": "reference/static-functions/functions/row_getCenterVisibleCells" },
+ { "label": "row_getGroupingValue", "to": "reference/static-functions/functions/row_getGroupingValue" },
+ { "label": "row_getIsAllParentsExpanded", "to": "reference/static-functions/functions/row_getIsAllParentsExpanded" },
+ { "label": "row_getIsAllSubRowsSelected", "to": "reference/static-functions/functions/row_getIsAllSubRowsSelected" },
+ { "label": "row_getIsExpanded", "to": "reference/static-functions/functions/row_getIsExpanded" },
+ { "label": "row_getIsGrouped", "to": "reference/static-functions/functions/row_getIsGrouped" },
+ { "label": "row_getIsPinned", "to": "reference/static-functions/functions/row_getIsPinned" },
+ { "label": "row_getIsSelected", "to": "reference/static-functions/functions/row_getIsSelected" },
+ { "label": "row_getIsSomeSelected", "to": "reference/static-functions/functions/row_getIsSomeSelected" },
+ { "label": "row_getLeafRows", "to": "reference/static-functions/functions/row_getLeafRows" },
+ { "label": "row_getLeftVisibleCells", "to": "reference/static-functions/functions/row_getLeftVisibleCells" },
+ { "label": "row_getParentRow", "to": "reference/static-functions/functions/row_getParentRow" },
+ { "label": "row_getParentRows", "to": "reference/static-functions/functions/row_getParentRows" },
+ { "label": "row_getPinnedIndex", "to": "reference/static-functions/functions/row_getPinnedIndex" },
+ { "label": "row_getRightVisibleCells", "to": "reference/static-functions/functions/row_getRightVisibleCells" },
+ { "label": "row_getToggleExpandedHandler", "to": "reference/static-functions/functions/row_getToggleExpandedHandler" },
+ { "label": "row_getToggleSelectedHandler", "to": "reference/static-functions/functions/row_getToggleSelectedHandler" },
+ { "label": "row_getUniqueValues", "to": "reference/static-functions/functions/row_getUniqueValues" },
+ { "label": "row_getValue", "to": "reference/static-functions/functions/row_getValue" },
+ { "label": "row_getVisibleCells", "to": "reference/static-functions/functions/row_getVisibleCells" },
+ { "label": "row_pin", "to": "reference/static-functions/functions/row_pin" },
+ { "label": "row_renderValue", "to": "reference/static-functions/functions/row_renderValue" },
+ { "label": "row_toggleExpanded", "to": "reference/static-functions/functions/row_toggleExpanded" },
+ { "label": "row_toggleSelected", "to": "reference/static-functions/functions/row_toggleSelected" },
+ { "label": "selectRowsFn", "to": "reference/static-functions/functions/selectRowsFn" },
+ { "label": "shouldAutoRemoveFilter", "to": "reference/static-functions/functions/shouldAutoRemoveFilter" },
+ { "label": "table_autoResetExpanded", "to": "reference/static-functions/functions/table_autoResetExpanded" },
+ { "label": "table_autoResetPageIndex", "to": "reference/static-functions/functions/table_autoResetPageIndex" },
+ { "label": "table_firstPage", "to": "reference/static-functions/functions/table_firstPage" },
+ { "label": "table_getAllColumns", "to": "reference/static-functions/functions/table_getAllColumns" },
+ { "label": "table_getAllFlatColumns", "to": "reference/static-functions/functions/table_getAllFlatColumns" },
+ { "label": "table_getAllFlatColumnsById", "to": "reference/static-functions/functions/table_getAllFlatColumnsById" },
+ { "label": "table_getAllLeafColumns", "to": "reference/static-functions/functions/table_getAllLeafColumns" },
+ { "label": "table_getBottomRows", "to": "reference/static-functions/functions/table_getBottomRows" },
+ { "label": "table_getCanNextPage", "to": "reference/static-functions/functions/table_getCanNextPage" },
+ { "label": "table_getCanPreviousPage", "to": "reference/static-functions/functions/table_getCanPreviousPage" },
+ { "label": "table_getCanSomeRowsExpand", "to": "reference/static-functions/functions/table_getCanSomeRowsExpand" },
+ { "label": "table_getCenterFlatHeaders", "to": "reference/static-functions/functions/table_getCenterFlatHeaders" },
+ { "label": "table_getCenterFooterGroups", "to": "reference/static-functions/functions/table_getCenterFooterGroups" },
+ { "label": "table_getCenterHeaderGroups", "to": "reference/static-functions/functions/table_getCenterHeaderGroups" },
+ { "label": "table_getCenterLeafColumns", "to": "reference/static-functions/functions/table_getCenterLeafColumns" },
+ { "label": "table_getCenterLeafHeaders", "to": "reference/static-functions/functions/table_getCenterLeafHeaders" },
+ { "label": "table_getCenterRows", "to": "reference/static-functions/functions/table_getCenterRows" },
+ { "label": "table_getCenterTotalSize", "to": "reference/static-functions/functions/table_getCenterTotalSize" },
+ { "label": "table_getCenterVisibleLeafColumns", "to": "reference/static-functions/functions/table_getCenterVisibleLeafColumns" },
+ { "label": "table_getColumn", "to": "reference/static-functions/functions/table_getColumn" },
+ { "label": "table_getCoreRowModel", "to": "reference/static-functions/functions/table_getCoreRowModel" },
+ { "label": "table_getDefaultColumnDef", "to": "reference/static-functions/functions/table_getDefaultColumnDef" },
+ { "label": "table_getExpandedDepth", "to": "reference/static-functions/functions/table_getExpandedDepth" },
+ { "label": "table_getExpandedRowModel", "to": "reference/static-functions/functions/table_getExpandedRowModel" },
+ { "label": "table_getFilteredRowModel", "to": "reference/static-functions/functions/table_getFilteredRowModel" },
+ { "label": "table_getFilteredSelectedRowModel", "to": "reference/static-functions/functions/table_getFilteredSelectedRowModel" },
+ { "label": "table_getFlatHeaders", "to": "reference/static-functions/functions/table_getFlatHeaders" },
+ { "label": "table_getFooterGroups", "to": "reference/static-functions/functions/table_getFooterGroups" },
+ { "label": "table_getGlobalAutoFilterFn", "to": "reference/static-functions/functions/table_getGlobalAutoFilterFn" },
+ { "label": "table_getGlobalFacetedMinMaxValues", "to": "reference/static-functions/functions/table_getGlobalFacetedMinMaxValues" },
+ { "label": "table_getGlobalFacetedRowModel", "to": "reference/static-functions/functions/table_getGlobalFacetedRowModel" },
+ { "label": "table_getGlobalFacetedUniqueValues", "to": "reference/static-functions/functions/table_getGlobalFacetedUniqueValues" },
+ { "label": "table_getGlobalFilterFn", "to": "reference/static-functions/functions/table_getGlobalFilterFn" },
+ { "label": "table_getGroupedRowModel", "to": "reference/static-functions/functions/table_getGroupedRowModel" },
+ { "label": "table_getGroupedSelectedRowModel", "to": "reference/static-functions/functions/table_getGroupedSelectedRowModel" },
+ { "label": "table_getHeaderGroups", "to": "reference/static-functions/functions/table_getHeaderGroups" },
+ { "label": "table_getIsAllColumnsVisible", "to": "reference/static-functions/functions/table_getIsAllColumnsVisible" },
+ { "label": "table_getIsAllPageRowsSelected", "to": "reference/static-functions/functions/table_getIsAllPageRowsSelected" },
+ { "label": "table_getIsAllRowsExpanded", "to": "reference/static-functions/functions/table_getIsAllRowsExpanded" },
+ { "label": "table_getIsAllRowsSelected", "to": "reference/static-functions/functions/table_getIsAllRowsSelected" },
+ { "label": "table_getIsSomeColumnsPinned", "to": "reference/static-functions/functions/table_getIsSomeColumnsPinned" },
+ { "label": "table_getIsSomeColumnsVisible", "to": "reference/static-functions/functions/table_getIsSomeColumnsVisible" },
+ { "label": "table_getIsSomePageRowsSelected", "to": "reference/static-functions/functions/table_getIsSomePageRowsSelected" },
+ { "label": "table_getIsSomeRowsExpanded", "to": "reference/static-functions/functions/table_getIsSomeRowsExpanded" },
+ { "label": "table_getIsSomeRowsPinned", "to": "reference/static-functions/functions/table_getIsSomeRowsPinned" },
+ { "label": "table_getIsSomeRowsSelected", "to": "reference/static-functions/functions/table_getIsSomeRowsSelected" },
+ { "label": "table_getLeafHeaders", "to": "reference/static-functions/functions/table_getLeafHeaders" },
+ { "label": "table_getLeftFlatHeaders", "to": "reference/static-functions/functions/table_getLeftFlatHeaders" },
+ { "label": "table_getLeftFooterGroups", "to": "reference/static-functions/functions/table_getLeftFooterGroups" },
+ { "label": "table_getLeftHeaderGroups", "to": "reference/static-functions/functions/table_getLeftHeaderGroups" },
+ { "label": "table_getLeftLeafColumns", "to": "reference/static-functions/functions/table_getLeftLeafColumns" },
+ { "label": "table_getLeftLeafHeaders", "to": "reference/static-functions/functions/table_getLeftLeafHeaders" },
+ { "label": "table_getLeftTotalSize", "to": "reference/static-functions/functions/table_getLeftTotalSize" },
+ { "label": "table_getLeftVisibleLeafColumns", "to": "reference/static-functions/functions/table_getLeftVisibleLeafColumns" },
+ { "label": "table_getOrderColumnsFn", "to": "reference/static-functions/functions/table_getOrderColumnsFn" },
+ { "label": "table_getPageCount", "to": "reference/static-functions/functions/table_getPageCount" },
+ { "label": "table_getPageOptions", "to": "reference/static-functions/functions/table_getPageOptions" },
+ { "label": "table_getPaginatedRowModel", "to": "reference/static-functions/functions/table_getPaginatedRowModel" },
+ { "label": "table_getPinnedLeafColumns", "to": "reference/static-functions/functions/table_getPinnedLeafColumns" },
+ { "label": "table_getPinnedVisibleLeafColumns", "to": "reference/static-functions/functions/table_getPinnedVisibleLeafColumns" },
+ { "label": "table_getPreExpandedRowModel", "to": "reference/static-functions/functions/table_getPreExpandedRowModel" },
+ { "label": "table_getPreFilteredRowModel", "to": "reference/static-functions/functions/table_getPreFilteredRowModel" },
+ { "label": "table_getPreGroupedRowModel", "to": "reference/static-functions/functions/table_getPreGroupedRowModel" },
+ { "label": "table_getPrePaginatedRowModel", "to": "reference/static-functions/functions/table_getPrePaginatedRowModel" },
+ { "label": "table_getPreSelectedRowModel", "to": "reference/static-functions/functions/table_getPreSelectedRowModel" },
+ { "label": "table_getPreSortedRowModel", "to": "reference/static-functions/functions/table_getPreSortedRowModel" },
+ { "label": "table_getRightFlatHeaders", "to": "reference/static-functions/functions/table_getRightFlatHeaders" },
+ { "label": "table_getRightFooterGroups", "to": "reference/static-functions/functions/table_getRightFooterGroups" },
+ { "label": "table_getRightHeaderGroups", "to": "reference/static-functions/functions/table_getRightHeaderGroups" },
+ { "label": "table_getRightLeafColumns", "to": "reference/static-functions/functions/table_getRightLeafColumns" },
+ { "label": "table_getRightLeafHeaders", "to": "reference/static-functions/functions/table_getRightLeafHeaders" },
+ { "label": "table_getRightTotalSize", "to": "reference/static-functions/functions/table_getRightTotalSize" },
+ { "label": "table_getRightVisibleLeafColumns", "to": "reference/static-functions/functions/table_getRightVisibleLeafColumns" },
+ { "label": "table_getRow", "to": "reference/static-functions/functions/table_getRow" },
+ { "label": "table_getRowCount", "to": "reference/static-functions/functions/table_getRowCount" },
+ { "label": "table_getRowId", "to": "reference/static-functions/functions/table_getRowId" },
+ { "label": "table_getRowModel", "to": "reference/static-functions/functions/table_getRowModel" },
+ { "label": "table_getSelectedRowModel", "to": "reference/static-functions/functions/table_getSelectedRowModel" },
+ { "label": "table_getSortedRowModel", "to": "reference/static-functions/functions/table_getSortedRowModel" },
+ { "label": "table_getToggleAllColumnsVisibilityHandler", "to": "reference/static-functions/functions/table_getToggleAllColumnsVisibilityHandler" },
+ { "label": "table_getToggleAllPageRowsSelectedHandler", "to": "reference/static-functions/functions/table_getToggleAllPageRowsSelectedHandler" },
+ { "label": "table_getToggleAllRowsExpandedHandler", "to": "reference/static-functions/functions/table_getToggleAllRowsExpandedHandler" },
+ { "label": "table_getToggleAllRowsSelectedHandler", "to": "reference/static-functions/functions/table_getToggleAllRowsSelectedHandler" },
+ { "label": "table_getTopRows", "to": "reference/static-functions/functions/table_getTopRows" },
+ { "label": "table_getTotalSize", "to": "reference/static-functions/functions/table_getTotalSize" },
+ { "label": "table_getVisibleFlatColumns", "to": "reference/static-functions/functions/table_getVisibleFlatColumns" },
+ { "label": "table_getVisibleLeafColumns", "to": "reference/static-functions/functions/table_getVisibleLeafColumns" },
+ { "label": "table_lastPage", "to": "reference/static-functions/functions/table_lastPage" },
+ { "label": "table_mergeOptions", "to": "reference/static-functions/functions/table_mergeOptions" },
+ { "label": "table_nextPage", "to": "reference/static-functions/functions/table_nextPage" },
+ { "label": "table_previousPage", "to": "reference/static-functions/functions/table_previousPage" },
+ { "label": "table_reset", "to": "reference/static-functions/functions/table_reset" },
+ { "label": "table_resetColumnFilters", "to": "reference/static-functions/functions/table_resetColumnFilters" },
+ { "label": "table_resetColumnOrder", "to": "reference/static-functions/functions/table_resetColumnOrder" },
+ { "label": "table_resetColumnPinning", "to": "reference/static-functions/functions/table_resetColumnPinning" },
+ { "label": "table_resetColumnSizing", "to": "reference/static-functions/functions/table_resetColumnSizing" },
+ { "label": "table_resetColumnVisibility", "to": "reference/static-functions/functions/table_resetColumnVisibility" },
+ { "label": "table_resetExpanded", "to": "reference/static-functions/functions/table_resetExpanded" },
+ { "label": "table_resetGlobalFilter", "to": "reference/static-functions/functions/table_resetGlobalFilter" },
+ { "label": "table_resetGrouping", "to": "reference/static-functions/functions/table_resetGrouping" },
+ { "label": "table_resetHeaderSizeInfo", "to": "reference/static-functions/functions/table_resetHeaderSizeInfo" },
+ { "label": "table_resetPageIndex", "to": "reference/static-functions/functions/table_resetPageIndex" },
+ { "label": "table_resetPageSize", "to": "reference/static-functions/functions/table_resetPageSize" },
+ { "label": "table_resetPagination", "to": "reference/static-functions/functions/table_resetPagination" },
+ { "label": "table_resetRowPinning", "to": "reference/static-functions/functions/table_resetRowPinning" },
+ { "label": "table_resetRowSelection", "to": "reference/static-functions/functions/table_resetRowSelection" },
+ { "label": "table_resetSorting", "to": "reference/static-functions/functions/table_resetSorting" },
+ { "label": "table_setColumnFilters", "to": "reference/static-functions/functions/table_setColumnFilters" },
+ { "label": "table_setColumnOrder", "to": "reference/static-functions/functions/table_setColumnOrder" },
+ { "label": "table_setColumnPinning", "to": "reference/static-functions/functions/table_setColumnPinning" },
+ { "label": "table_setColumnResizing", "to": "reference/static-functions/functions/table_setColumnResizing" },
+ { "label": "table_setColumnSizing", "to": "reference/static-functions/functions/table_setColumnSizing" },
+ { "label": "table_setColumnVisibility", "to": "reference/static-functions/functions/table_setColumnVisibility" },
+ { "label": "table_setExpanded", "to": "reference/static-functions/functions/table_setExpanded" },
+ { "label": "table_setGlobalFilter", "to": "reference/static-functions/functions/table_setGlobalFilter" },
+ { "label": "table_setGrouping", "to": "reference/static-functions/functions/table_setGrouping" },
+ { "label": "table_setOptions", "to": "reference/static-functions/functions/table_setOptions" },
+ { "label": "table_setPageIndex", "to": "reference/static-functions/functions/table_setPageIndex" },
+ { "label": "table_setPageSize", "to": "reference/static-functions/functions/table_setPageSize" },
+ { "label": "table_setPagination", "to": "reference/static-functions/functions/table_setPagination" },
+ { "label": "table_setRowPinning", "to": "reference/static-functions/functions/table_setRowPinning" },
+ { "label": "table_setRowSelection", "to": "reference/static-functions/functions/table_setRowSelection" },
+ { "label": "table_setSorting", "to": "reference/static-functions/functions/table_setSorting" },
+ { "label": "table_syncExternalStateToBaseAtoms", "to": "reference/static-functions/functions/table_syncExternalStateToBaseAtoms" },
+ { "label": "table_toggleAllColumnsVisible", "to": "reference/static-functions/functions/table_toggleAllColumnsVisible" },
+ { "label": "table_toggleAllPageRowsSelected", "to": "reference/static-functions/functions/table_toggleAllPageRowsSelected" },
+ { "label": "table_toggleAllRowsExpanded", "to": "reference/static-functions/functions/table_toggleAllRowsExpanded" },
+ { "label": "table_toggleAllRowsSelected", "to": "reference/static-functions/functions/table_toggleAllRowsSelected" }
+ ]
+ },
+ {
+ "collapsible": true,
+ "defaultCollapsed": true,
+ "label": "Legacy API Reference",
+ "children": [],
+ "frameworks": [
+ {
+ "label": "react",
+ "children": [
+ { "label": "Legacy API Overview", "to": "framework/react/reference/legacy/index" },
+ { "label": "useLegacyTable", "to": "framework/react/reference/legacy/functions/useLegacyTable" },
+ { "label": "legacyCreateColumnHelper", "to": "framework/react/reference/legacy/functions/legacyCreateColumnHelper" },
+ { "label": "getCoreRowModel", "to": "framework/react/reference/legacy/functions/getCoreRowModel" },
+ { "label": "getFilteredRowModel", "to": "framework/react/reference/legacy/functions/getFilteredRowModel" },
+ { "label": "getSortedRowModel", "to": "framework/react/reference/legacy/functions/getSortedRowModel" },
+ { "label": "getGroupedRowModel", "to": "framework/react/reference/legacy/functions/getGroupedRowModel" },
+ { "label": "getExpandedRowModel", "to": "framework/react/reference/legacy/functions/getExpandedRowModel" },
+ { "label": "getPaginationRowModel", "to": "framework/react/reference/legacy/functions/getPaginationRowModel" },
+ { "label": "getFacetedRowModel", "to": "framework/react/reference/legacy/functions/getFacetedRowModel" },
+ { "label": "getFacetedMinMaxValues", "to": "framework/react/reference/legacy/functions/getFacetedMinMaxValues" },
+ { "label": "getFacetedUniqueValues", "to": "framework/react/reference/legacy/functions/getFacetedUniqueValues" },
+ { "label": "LegacyRowModelOptions", "to": "framework/react/reference/legacy/interfaces/LegacyRowModelOptions" },
+ { "label": "LegacyTable", "to": "framework/react/reference/legacy/type-aliases/LegacyTable" },
+ { "label": "LegacyTableOptions", "to": "framework/react/reference/legacy/type-aliases/LegacyTableOptions" },
+ { "label": "LegacyReactTable", "to": "framework/react/reference/legacy/type-aliases/LegacyReactTable" },
+ { "label": "LegacyColumnDef", "to": "framework/react/reference/legacy/type-aliases/LegacyColumnDef" },
+ { "label": "LegacyColumn", "to": "framework/react/reference/legacy/type-aliases/LegacyColumn" },
+ { "label": "LegacyRow", "to": "framework/react/reference/legacy/type-aliases/LegacyRow" },
+ { "label": "LegacyCell", "to": "framework/react/reference/legacy/type-aliases/LegacyCell" },
+ { "label": "LegacyHeader", "to": "framework/react/reference/legacy/type-aliases/LegacyHeader" },
+ { "label": "LegacyHeaderGroup", "to": "framework/react/reference/legacy/type-aliases/LegacyHeaderGroup" }
+ ]
+ }
+ ]
+ },
+ {
+ "label": "Basic Examples",
+ "children": [],
+ "frameworks": [
{
- "label": "Column Filtering",
- "to": "api/features/column-filtering"
+ "label": "angular",
+ "children": [
+ { "label": "Basic (Inject Table)", "to": "framework/angular/examples/basic-inject-table" },
+ { "label": "Basic (App Table)", "to": "framework/angular/examples/basic-app-table" }
+ ]
},
{
- "label": "Column Faceting",
- "to": "api/features/column-faceting"
+ "label": "lit",
+ "children": [
+ { "label": "Basic (TableController)", "to": "framework/lit/examples/basic-table-controller" },
+ { "label": "Basic (useAppTable)", "to": "framework/lit/examples/basic-app-table" },
+ { "label": "Basic (External State)", "to": "framework/lit/examples/basic-external-state" },
+ { "label": "Basic (External Atoms)", "to": "framework/lit/examples/basic-external-atoms" },
+ { "label": "Header Groups", "to": "framework/lit/examples/column-groups" }
+ ]
},
{
- "label": "Column Ordering",
- "to": "api/features/column-ordering"
+ "label": "react",
+ "children": [
+ { "label": "Basic (useTable)", "to": "framework/react/examples/basic-use-table" },
+ { "label": "Basic (useAppTable)", "to": "framework/react/examples/basic-use-app-table" },
+ { "label": "Basic (useLegacyTable)", "to": "framework/react/examples/basic-use-legacy-table" },
+ { "label": "Basic (External State)", "to": "framework/react/examples/basic-external-state" },
+ { "label": "Basic (External Atoms)", "to": "framework/react/examples/basic-external-atoms" },
+ { "label": "Basic (Subscribe)", "to": "framework/react/examples/basic-subscribe" },
+ { "label": "Header Groups", "to": "framework/react/examples/column-groups" }
+ ]
},
{
- "label": "Column Pinning",
- "to": "api/features/column-pinning"
+ "label": "solid",
+ "children": [
+ { "label": "Basic (createTable)", "to": "framework/solid/examples/basic-use-table" },
+ { "label": "Basic (createAppTable)", "to": "framework/solid/examples/basic-app-table" },
+ { "label": "Basic (External State)", "to": "framework/solid/examples/basic-external-state" },
+ { "label": "Basic (External Atoms)", "to": "framework/solid/examples/basic-external-atoms" },
+ { "label": "Header Groups", "to": "framework/solid/examples/column-groups" }
+ ]
},
{
- "label": "Column Sizing",
- "to": "api/features/column-sizing"
+ "label": "svelte",
+ "children": [
+ { "label": "Basic (createTable)", "to": "framework/svelte/examples/basic-create-table" },
+ { "label": "Basic (createAppTable)", "to": "framework/svelte/examples/basic-app-table" },
+ { "label": "Basic (Snippets)", "to": "framework/svelte/examples/basic-snippets" },
+ { "label": "Basic (External State)", "to": "framework/svelte/examples/basic-external-state" },
+ { "label": "Basic (External Atoms)", "to": "framework/svelte/examples/basic-external-atoms" },
+ { "label": "Header Groups", "to": "framework/svelte/examples/column-groups" }
+ ]
},
{
- "label": "Column Visibility",
- "to": "api/features/column-visibility"
+ "label": "vue",
+ "children": [
+ { "label": "Basic (useTable)", "to": "framework/vue/examples/basic-use-table" },
+ { "label": "Basic (useAppTable)", "to": "framework/vue/examples/basic-use-app-table" },
+ { "label": "Basic (External State)", "to": "framework/vue/examples/basic-external-state" },
+ { "label": "Basic (External Atoms)", "to": "framework/vue/examples/basic-external-atoms" },
+ { "label": "Header Groups", "to": "framework/vue/examples/column-groups" }
+ ]
},
{
- "label": "Global Faceting",
- "to": "api/features/global-faceting"
+ "label": "preact",
+ "children": [
+ { "label": "Basic (useTable)", "to": "framework/preact/examples/basic-use-table" },
+ { "label": "Basic (useAppTable)", "to": "framework/preact/examples/basic-use-app-table" },
+ { "label": "Basic (External State)", "to": "framework/preact/examples/basic-external-state" },
+ { "label": "Basic (External Atoms)", "to": "framework/preact/examples/basic-external-atoms" },
+ { "label": "Basic (Subscribe)", "to": "framework/preact/examples/basic-subscribe" },
+ { "label": "Header Groups", "to": "framework/preact/examples/column-groups" }
+ ]
},
{
- "label": "Global Filtering",
- "to": "api/features/global-filtering"
+ "label": "vanilla",
+ "children": [
+ { "label": "Basic", "to": "framework/vanilla/examples/basic" }
+ ]
+ }
+ ]
+ },
+ {
+ "label": "Feature Examples",
+ "children": [],
+ "frameworks": [
+ {
+ "label": "angular",
+ "children": [
+ { "label": "Column Filters", "to": "framework/angular/examples/filters" },
+ { "label": "Column Ordering", "to": "framework/angular/examples/column-ordering" },
+ { "label": "Column Pinning", "to": "framework/angular/examples/column-pinning" },
+ { "label": "Column Pinning (Sticky)", "to": "framework/angular/examples/column-pinning-sticky" },
+ { "label": "Column Resizing", "to": "framework/angular/examples/column-resizing-performant" },
+ { "label": "Column Visibility", "to": "framework/angular/examples/column-visibility" },
+ { "label": "Row Expanding", "to": "framework/angular/examples/expanding" },
+ { "label": "Column Grouping", "to": "framework/angular/examples/grouping" },
+ { "label": "Row Selection", "to": "framework/angular/examples/row-selection" },
+ { "label": "Row Selection (Signal)", "to": "framework/angular/examples/row-selection-signal" }
+ ]
},
{
- "label": "Sorting",
- "to": "api/features/sorting"
+ "label": "lit",
+ "children": [
+ { "label": "Column Filters", "to": "framework/lit/examples/filters" },
+ { "label": "Column Filters (Faceted)", "to": "framework/lit/examples/filters-faceted" },
+ { "label": "Fuzzy Search Filters", "to": "framework/lit/examples/filters-fuzzy" },
+ { "label": "Column Ordering", "to": "framework/lit/examples/column-ordering" },
+ { "label": "Column Pinning", "to": "framework/lit/examples/column-pinning" },
+ { "label": "Column Pinning (Split)", "to": "framework/lit/examples/column-pinning-split" },
+ { "label": "Sticky Column Pinning", "to": "framework/lit/examples/column-pinning-sticky" },
+ { "label": "Column Sizing", "to": "framework/lit/examples/column-sizing" },
+ { "label": "Column Resizing", "to": "framework/lit/examples/column-resizing" },
+ { "label": "Performant Column Resizing", "to": "framework/lit/examples/column-resizing-performant" },
+ { "label": "Column Visibility", "to": "framework/lit/examples/column-visibility" },
+ { "label": "Expanding", "to": "framework/lit/examples/expanding" },
+ { "label": "Grouping", "to": "framework/lit/examples/grouping" },
+ { "label": "Pagination", "to": "framework/lit/examples/pagination" },
+ { "label": "Row Pinning", "to": "framework/lit/examples/row-pinning" },
+ { "label": "Row Selection", "to": "framework/lit/examples/row-selection" },
+ { "label": "Sorting", "to": "framework/lit/examples/sorting" },
+ { "label": "Sorting (Dynamic Data)", "to": "framework/lit/examples/sorting-dynamic-data" }
+ ]
},
{
- "label": "Grouping",
- "to": "api/features/grouping"
+ "label": "react",
+ "children": [
+ { "label": "Column Filters", "to": "framework/react/examples/filters" },
+ { "label": "Column Filters (Faceted)", "to": "framework/react/examples/filters-faceted" },
+ { "label": "Fuzzy Search Filters", "to": "framework/react/examples/filters-fuzzy" },
+ { "label": "Column Ordering", "to": "framework/react/examples/column-ordering" },
+ { "label": "Column Ordering (DnD)", "to": "framework/react/examples/column-dnd" },
+ { "label": "Column Pinning", "to": "framework/react/examples/column-pinning" },
+ { "label": "Column Pinning (Split)", "to": "framework/react/examples/column-pinning-split" },
+ { "label": "Sticky Column Pinning", "to": "framework/react/examples/column-pinning-sticky" },
+ { "label": "Column Sizing", "to": "framework/react/examples/column-sizing" },
+ { "label": "Column Resizing", "to": "framework/react/examples/column-resizing" },
+ { "label": "Performant Column Resizing", "to": "framework/react/examples/column-resizing-performant" },
+ { "label": "Column Visibility", "to": "framework/react/examples/column-visibility" },
+ { "label": "Expanding", "to": "framework/react/examples/expanding" },
+ { "label": "Grouping", "to": "framework/react/examples/grouping" },
+ { "label": "Pagination", "to": "framework/react/examples/pagination" },
+ { "label": "Row DnD", "to": "framework/react/examples/row-dnd" },
+ { "label": "Row Pinning", "to": "framework/react/examples/row-pinning" },
+ { "label": "Row Selection", "to": "framework/react/examples/row-selection" },
+ { "label": "Sorting", "to": "framework/react/examples/sorting" }
+ ]
},
{
- "label": "Expanding",
- "to": "api/features/expanding"
+ "label": "solid",
+ "children": [
+ { "label": "Column Filters", "to": "framework/solid/examples/filters" },
+ { "label": "Column Filters (Faceted)", "to": "framework/solid/examples/filters-faceted" },
+ { "label": "Fuzzy Search Filters", "to": "framework/solid/examples/filters-fuzzy" },
+ { "label": "Column Ordering", "to": "framework/solid/examples/column-ordering" },
+ { "label": "Column Pinning", "to": "framework/solid/examples/column-pinning" },
+ { "label": "Column Pinning (Split)", "to": "framework/solid/examples/column-pinning-split" },
+ { "label": "Sticky Column Pinning", "to": "framework/solid/examples/column-pinning-sticky" },
+ { "label": "Column Sizing", "to": "framework/solid/examples/column-sizing" },
+ { "label": "Column Resizing", "to": "framework/solid/examples/column-resizing" },
+ { "label": "Performant Column Resizing", "to": "framework/solid/examples/column-resizing-performant" },
+ { "label": "Column Visibility", "to": "framework/solid/examples/column-visibility" },
+ { "label": "Expanding", "to": "framework/solid/examples/expanding" },
+ { "label": "Grouping", "to": "framework/solid/examples/grouping" },
+ { "label": "Pagination", "to": "framework/solid/examples/pagination" },
+ { "label": "Row Pinning", "to": "framework/solid/examples/row-pinning" },
+ { "label": "Row Selection", "to": "framework/solid/examples/row-selection" },
+ { "label": "Sorting", "to": "framework/solid/examples/sorting" }
+ ]
},
{
- "label": "Pagination",
- "to": "api/features/pagination"
+ "label": "svelte",
+ "children": [
+ { "label": "Column Filters", "to": "framework/svelte/examples/filtering" },
+ { "label": "Column Filters (Faceted)", "to": "framework/svelte/examples/filters-faceted" },
+ { "label": "Fuzzy Search Filters", "to": "framework/svelte/examples/filters-fuzzy" },
+ { "label": "Column Ordering", "to": "framework/svelte/examples/column-ordering" },
+ { "label": "Column Pinning", "to": "framework/svelte/examples/column-pinning" },
+ { "label": "Column Pinning (Split)", "to": "framework/svelte/examples/column-pinning-split" },
+ { "label": "Sticky Column Pinning", "to": "framework/svelte/examples/column-pinning-sticky" },
+ { "label": "Column Sizing", "to": "framework/svelte/examples/column-sizing" },
+ { "label": "Column Resizing", "to": "framework/svelte/examples/column-resizing" },
+ { "label": "Performant Column Resizing", "to": "framework/svelte/examples/column-resizing-performant" },
+ { "label": "Column Visibility", "to": "framework/svelte/examples/column-visibility" },
+ { "label": "Expanding", "to": "framework/svelte/examples/expanding" },
+ { "label": "Grouping", "to": "framework/svelte/examples/grouping" },
+ { "label": "Pagination", "to": "framework/svelte/examples/pagination" },
+ { "label": "Row Pinning", "to": "framework/svelte/examples/row-pinning" },
+ { "label": "Row Selection", "to": "framework/svelte/examples/row-selection" },
+ { "label": "Sorting", "to": "framework/svelte/examples/sorting" }
+ ]
},
{
- "label": "Row Pinning",
- "to": "api/features/row-pinning"
+ "label": "vue",
+ "children": [
+ { "label": "Column Filters", "to": "framework/vue/examples/filters" },
+ { "label": "Column Filters (Faceted)", "to": "framework/vue/examples/filters-faceted" },
+ { "label": "Fuzzy Search Filters", "to": "framework/vue/examples/filters-fuzzy" },
+ { "label": "Column Ordering", "to": "framework/vue/examples/column-ordering" },
+ { "label": "Column Pinning", "to": "framework/vue/examples/column-pinning" },
+ { "label": "Column Pinning (Split)", "to": "framework/vue/examples/column-pinning-split" },
+ { "label": "Sticky Column Pinning", "to": "framework/vue/examples/column-pinning-sticky" },
+ { "label": "Column Sizing", "to": "framework/vue/examples/column-sizing" },
+ { "label": "Column Resizing", "to": "framework/vue/examples/column-resizing" },
+ { "label": "Performant Column Resizing", "to": "framework/vue/examples/column-resizing-performant" },
+ { "label": "Column Visibility", "to": "framework/vue/examples/column-visibility" },
+ { "label": "Expanding", "to": "framework/vue/examples/expanding" },
+ { "label": "Grouping", "to": "framework/vue/examples/grouping" },
+ { "label": "Pagination", "to": "framework/vue/examples/pagination" },
+ { "label": "Row Pinning", "to": "framework/vue/examples/row-pinning" },
+ { "label": "Row Selection", "to": "framework/vue/examples/row-selection" },
+ { "label": "Sorting", "to": "framework/vue/examples/sorting" }
+ ]
},
{
- "label": "Row Selection",
- "to": "api/features/row-selection"
- }
- ]
- },
- {
- "label": "Enterprise",
- "children": [
+ "label": "preact",
+ "children": [
+ { "label": "Column Filters", "to": "framework/preact/examples/filters" },
+ { "label": "Column Filters (Faceted)", "to": "framework/preact/examples/filters-faceted" },
+ { "label": "Fuzzy Search Filters", "to": "framework/preact/examples/filters-fuzzy" },
+ { "label": "Column Ordering", "to": "framework/preact/examples/column-ordering" },
+ { "label": "Column Pinning", "to": "framework/preact/examples/column-pinning" },
+ { "label": "Column Pinning (Split)", "to": "framework/preact/examples/column-pinning-split" },
+ { "label": "Sticky Column Pinning", "to": "framework/preact/examples/column-pinning-sticky" },
+ { "label": "Column Sizing", "to": "framework/preact/examples/column-sizing" },
+ { "label": "Column Resizing", "to": "framework/preact/examples/column-resizing" },
+ { "label": "Performant Column Resizing", "to": "framework/preact/examples/column-resizing-performant" },
+ { "label": "Column Visibility", "to": "framework/preact/examples/column-visibility" },
+ { "label": "Expanding", "to": "framework/preact/examples/expanding" },
+ { "label": "Grouping", "to": "framework/preact/examples/grouping" },
+ { "label": "Pagination", "to": "framework/preact/examples/pagination" },
+ { "label": "Row Pinning", "to": "framework/preact/examples/row-pinning" },
+ { "label": "Row Selection", "to": "framework/preact/examples/row-selection" },
+ { "label": "Sorting", "to": "framework/preact/examples/sorting" }
+ ]
+ },
{
- "label": "AG Grid",
- "to": "enterprise/ag-grid"
+ "label": "vanilla",
+ "children": [
+ { "label": "Pagination", "to": "framework/vanilla/examples/pagination" },
+ { "label": "Sorting", "to": "framework/vanilla/examples/sorting" }
+ ]
}
]
},
{
- "label": "Examples",
+ "label": "Specialized Examples",
"children": [],
"frameworks": [
{
"label": "angular",
"children": [
- {
- "to": "framework/angular/examples/basic",
- "label": "Basic"
- },
- {
- "to": "framework/angular/examples/grouping",
- "label": "Column Grouping"
- },
- {
- "to": "framework/angular/examples/column-ordering",
- "label": "Column Ordering"
- },
- {
- "to": "framework/angular/examples/column-pinning",
- "label": "Column Pinning"
- },
- {
- "to": "framework/angular/examples/column-pinning-sticky",
- "label": "Sticky Column Pinning"
- },
- {
- "to": "framework/angular/examples/column-visibility",
- "label": "Column Visibility"
- },
- {
- "to": "framework/angular/examples/filters",
- "label": "Column Filters"
- },
- {
- "to": "framework/angular/examples/row-selection",
- "label": "Row Selection"
- },
- {
- "to": "framework/angular/examples/signal-input",
- "label": "Signal Input"
- }
+ { "label": "Composable Tables", "to": "framework/angular/examples/composable-tables" },
+ { "label": "Custom Plugin", "to": "framework/angular/examples/custom-plugin" },
+ { "label": "Sub Components", "to": "framework/angular/examples/sub-components" },
+ { "label": "Fetch API data (SPA / SSR)", "to": "framework/angular/examples/remote-data" },
+ { "label": "Signal Input", "to": "framework/angular/examples/signal-input" },
+ { "label": "Editable data", "to": "framework/angular/examples/editable" },
+ { "label": "Row Drag & Drop", "to": "framework/angular/examples/row-dnd" }
]
},
{
"label": "lit",
"children": [
- {
- "to": "framework/lit/examples/basic",
- "label": "Basic"
- },
- {
- "to": "framework/lit/examples/column-sizing",
- "label": "Column Sizing"
- },
- {
- "to": "framework/lit/examples/filters",
- "label": "Filters"
- },
- {
- "to": "framework/lit/examples/row-selection",
- "label": "Row Selection"
- },
- {
- "to": "framework/lit/examples/sorting",
- "label": "Sorting"
- },
- {
- "to": "framework/lit/examples/virtualized-rows",
- "label": "Virtualized Rows"
- }
- ]
- },
- {
- "label": "qwik",
- "children": [
- {
- "to": "framework/qwik/examples/basic",
- "label": "Basic"
- },
- {
- "to": "framework/qwik/examples/filters",
- "label": "Filters"
- },
- {
- "to": "framework/qwik/examples/row-selection",
- "label": "Row Selection"
- },
- {
- "to": "framework/qwik/examples/sorting",
- "label": "Sorting"
- }
+ { "label": "Composable Tables", "to": "framework/lit/examples/composable-tables" },
+ { "label": "Sub Components", "to": "framework/lit/examples/sub-components" },
+ { "label": "With TanStack Virtual - Columns", "to": "framework/lit/examples/virtualized-columns" },
+ { "label": "With TanStack Virtual - Rows", "to": "framework/lit/examples/virtualized-rows" },
+ { "label": "With TanStack Virtual - Infinite Scrolling", "to": "framework/lit/examples/virtualized-infinite-scrolling" }
]
},
{
"label": "react",
"children": [
- {
- "to": "framework/react/examples/basic",
- "label": "Basic"
- },
- {
- "to": "framework/react/examples/column-groups",
- "label": "Header Groups"
- },
- {
- "to": "framework/react/examples/filters",
- "label": "Column Filters"
- },
- {
- "to": "framework/react/examples/filters-faceted",
- "label": "Column Filters (Faceted)"
- },
- {
- "to": "framework/react/examples/filters-fuzzy",
- "label": "Fuzzy Search Filters"
- },
- {
- "to": "framework/react/examples/column-ordering",
- "label": "Column Ordering"
- },
- {
- "to": "framework/react/examples/column-dnd",
- "label": "Column Ordering (DnD)"
- },
- {
- "to": "framework/react/examples/column-pinning",
- "label": "Column Pinning"
- },
- {
- "to": "framework/react/examples/column-pinning-sticky",
- "label": "Sticky Column Pinning"
- },
- {
- "to": "framework/react/examples/column-sizing",
- "label": "Column Sizing"
- },
- {
- "to": "framework/react/examples/column-resizing-performant",
- "label": "Performant Column Resizing"
- },
- {
- "to": "framework/react/examples/column-visibility",
- "label": "Column Visibility"
- },
- {
- "to": "framework/react/examples/editable-data",
- "label": "Editable Data"
- },
- {
- "to": "framework/react/examples/expanding",
- "label": "Expanding"
- },
- {
- "to": "framework/react/examples/sub-components",
- "label": "Sub Components"
- },
- {
- "to": "framework/react/examples/fully-controlled",
- "label": "Fully Controlled"
- },
- {
- "to": "framework/react/examples/grouping",
- "label": "Grouping"
- },
- {
- "to": "framework/react/examples/pagination",
- "label": "Pagination"
- },
- {
- "to": "framework/react/examples/pagination-controlled",
- "label": "Pagination Controlled"
- },
- {
- "to": "framework/react/examples/row-dnd",
- "label": "Row DnD"
- },
- {
- "to": "framework/react/examples/row-pinning",
- "label": "Row Pinning"
- },
- {
- "to": "framework/react/examples/row-selection",
- "label": "Row Selection"
- },
- {
- "to": "framework/react/examples/sorting",
- "label": "Sorting"
- },
- {
- "to": "framework/react/examples/virtualized-columns",
- "label": "Virtualized Columns"
- },
- {
- "to": "framework/react/examples/virtualized-rows",
- "label": "Virtualized Rows"
- },
- {
- "to": "framework/react/examples/virtualized-infinite-scrolling",
- "label": "Virtualized Infinite Scrolling"
- },
- {
- "to": "framework/react/examples/kitchen-sink",
- "label": "Kitchen Sink"
- },
- {
- "to": "framework/react/examples/bootstrap",
- "label": "React Bootstrap"
- },
- {
- "to": "framework/react/examples/material-ui-pagination",
- "label": "Material UI Pagination"
- },
- {
- "to": "framework/react/examples/full-width-table",
- "label": "React Full Width"
- },
- {
- "to": "framework/react/examples/full-width-resizable-table",
- "label": "React Full Width Resizable"
- },
- {
- "to": "framework/react/examples/custom-features",
- "label": "Custom Features"
- },
- {
- "to": "framework/react/examples/query-router-search-params",
- "label": "Query Router Search Params"
- }
+ { "label": "Composable Tables", "to": "framework/react/examples/composable-tables" },
+ { "label": "Custom Plugin", "to": "framework/react/examples/custom-plugin" },
+ { "label": "Sub Components", "to": "framework/react/examples/sub-components" },
+ { "label": "With TanStack Virtual - Columns", "to": "framework/react/examples/virtualized-columns" },
+ { "label": "With TanStack Virtual - Columns (Exp)", "to": "framework/react/examples/virtualized-columns-experimental" },
+ { "label": "With TanStack Virtual - Rows", "to": "framework/react/examples/virtualized-rows" },
+ { "label": "With TanStack Virtual - Rows (Exp)", "to": "framework/react/examples/virtualized-rows-experimental" },
+ { "label": "With TanStack Virtual - Infinite Scrolling", "to": "framework/react/examples/virtualized-infinite-scrolling" },
+ { "label": "With TanStack Form", "to": "framework/react/examples/with-tanstack-form" },
+ { "label": "With TanStack Query", "to": "framework/react/examples/with-tanstack-query" },
+ { "label": "With TanStack Router", "to": "framework/react/examples/with-tanstack-router" }
]
},
{
"label": "solid",
"children": [
- {
- "to": "framework/solid/examples/basic",
- "label": "Basic"
- },
- {
- "to": "framework/solid/examples/column-groups",
- "label": "Column Groups"
- },
- {
- "to": "framework/solid/examples/column-ordering",
- "label": "Column Ordering"
- },
- {
- "to": "framework/solid/examples/column-visibility",
- "label": "Column Visibility"
- },
- {
- "to": "framework/solid/examples/filters",
- "label": "Filters"
- },
- {
- "to": "framework/solid/examples/sorting",
- "label": "Sorting"
- },
- {
- "to": "framework/solid/examples/bootstrap",
- "label": "Solid Bootstrap"
- }
+ { "label": "Composable Tables", "to": "framework/solid/examples/composable-tables" },
+ { "label": "Sub Components", "to": "framework/solid/examples/sub-components" },
+ { "label": "With TanStack Virtual - Columns", "to": "framework/solid/examples/virtualized-columns" },
+ { "label": "With TanStack Virtual - Rows", "to": "framework/solid/examples/virtualized-rows" },
+ { "label": "With TanStack Virtual - Infinite Scrolling", "to": "framework/solid/examples/virtualized-infinite-scrolling" },
+ { "label": "With TanStack Form", "to": "framework/solid/examples/with-tanstack-form" },
+ { "label": "With TanStack Query", "to": "framework/solid/examples/with-tanstack-query" },
+ { "label": "With TanStack Router", "to": "framework/solid/examples/with-tanstack-router" }
]
},
{
"label": "svelte",
"children": [
- {
- "to": "framework/svelte/examples/basic",
- "label": "Basic"
- },
- {
- "to": "framework/svelte/examples/column-groups",
- "label": "Column Groups"
- },
- {
- "to": "framework/svelte/examples/column-ordering",
- "label": "Column Ordering"
- },
- {
- "to": "framework/svelte/examples/column-pinning",
- "label": "Column Pinning"
- },
- {
- "to": "framework/svelte/examples/column-visibility",
- "label": "Column Visibility"
- },
- {
- "to": "framework/svelte/examples/filtering",
- "label": "Filtering"
- },
- {
- "to": "framework/svelte/examples/sorting",
- "label": "Sorting"
- }
+ { "label": "Composable Tables", "to": "framework/svelte/examples/composable-tables" },
+ { "label": "Sub Components", "to": "framework/svelte/examples/sub-components" },
+ { "label": "With TanStack Virtual - Columns", "to": "framework/svelte/examples/virtualized-columns" },
+ { "label": "With TanStack Virtual - Rows", "to": "framework/svelte/examples/virtualized-rows" },
+ { "label": "With TanStack Virtual - Infinite Scrolling", "to": "framework/svelte/examples/virtualized-infinite-scrolling" },
+ { "label": "With TanStack Form", "to": "framework/svelte/examples/with-tanstack-form" },
+ { "label": "With TanStack Query", "to": "framework/svelte/examples/with-tanstack-query" }
]
},
{
"label": "vue",
"children": [
- {
- "to": "framework/vue/examples/basic",
- "label": "Basic"
- },
- {
- "to": "framework/vue/examples/column-ordering",
- "label": "Column Ordering"
- },
- {
- "to": "framework/vue/examples/column-pinning",
- "label": "Column Pinning"
- },
- {
- "to": "framework/vue/examples/pagination",
- "label": "Pagination"
- },
- {
- "to": "framework/vue/examples/row-selection",
- "label": "Row Selection"
- },
- {
- "to": "framework/vue/examples/sorting",
- "label": "Sorting"
- },
- {
- "to": "framework/vue/examples/sub-components",
- "label": "Sub Components"
- },
- {
- "to": "framework/vue/examples/filters",
- "label": "Column Filters"
- },
- {
- "to": "framework/vue/examples/virtualized-rows",
- "label": "Virtualized Rows"
- }
+ { "label": "Composable Tables", "to": "framework/vue/examples/composable-tables" },
+ { "label": "Sub Components", "to": "framework/vue/examples/sub-components" },
+ { "label": "With TanStack Virtual - Columns", "to": "framework/vue/examples/virtualized-columns" },
+ { "label": "With TanStack Virtual - Rows", "to": "framework/vue/examples/virtualized-rows" },
+ { "label": "With TanStack Virtual - Infinite Scrolling", "to": "framework/vue/examples/virtualized-infinite-scrolling" },
+ { "label": "With TanStack Form", "to": "framework/vue/examples/with-tanstack-form" },
+ { "label": "With TanStack Query", "to": "framework/vue/examples/with-tanstack-query" }
]
},
{
- "label": "vanilla",
+ "label": "preact",
+ "children": [
+ { "label": "Composable Tables", "to": "framework/preact/examples/composable-tables" },
+ { "label": "Custom Plugin", "to": "framework/preact/examples/custom-plugin" },
+ { "label": "Sub Components", "to": "framework/preact/examples/sub-components" },
+ { "label": "With TanStack Query", "to": "framework/preact/examples/with-tanstack-query" }
+ ]
+ }
+ ]
+ },
+ {
+ "label": "Component Library Examples",
+ "children": [],
+ "frameworks": [
+ {
+ "label": "react",
"children": [
- {
- "to": "framework/vanilla/examples/basic",
- "label": "Basic"
- },
- {
- "to": "framework/vanilla/examples/pagination",
- "label": "Pagination"
- },
- {
- "to": "framework/vanilla/examples/sorting",
- "label": "Sorting"
- }
+ { "label": "Basic - Shadcn (Radix)", "to": "framework/react/examples/lib-shadcn-radix" },
+ { "label": "Basic - Shadcn (Base UI)", "to": "framework/react/examples/lib-shadcn-base" },
+ { "label": "Basic - React Aria", "to": "framework/react/examples/lib-react-aria" },
+ { "label": "Basic - Hero UI", "to": "framework/react/examples/lib-hero-ui" },
+ { "label": "Basic - Material UI", "to": "framework/react/examples/lib-material-ui" },
+ { "label": "Basic - Mantine", "to": "framework/react/examples/lib-mantine" },
+ { "label": "Kitchen Sink - Shadcn (Radix)", "to": "framework/react/examples/kitchen-sink-shadcn-radix" },
+ { "label": "Kitchen Sink - Shadcn (Base UI)", "to": "framework/react/examples/kitchen-sink-shadcn-base" },
+ { "label": "Kitchen Sink - React Aria", "to": "framework/react/examples/kitchen-sink-react-aria" },
+ { "label": "Kitchen Sink - Hero UI", "to": "framework/react/examples/kitchen-sink-hero-ui" },
+ { "label": "Kitchen Sink - Material UI", "to": "framework/react/examples/kitchen-sink-material-ui" },
+ { "label": "Kitchen Sink - Mantine", "to": "framework/react/examples/kitchen-sink-mantine" },
+ { "label": "Material React Table", "to": "framework/react/examples/material-react-table" },
+ { "label": "Mantine React Table", "to": "framework/react/examples/mantine-react-table" }
]
}
]
diff --git a/docs/devtools.md b/docs/devtools.md
new file mode 100644
index 0000000000..b5674020c4
--- /dev/null
+++ b/docs/devtools.md
@@ -0,0 +1,207 @@
+---
+title: Devtools
+id: devtools
+---
+
+TanStack Table provides framework-specific devtools adapters that plug into the [TanStack Devtools](https://tanstack.com/devtools) multi-panel UI.
+
+The table devtools let you inspect registered table instances, switch between multiple tables, and inspect features, state, options, rows, and columns in real time.
+
+> [!NOTE]
+> By default, the framework adapters only include the live devtools in development mode. In production builds they export no-op implementations unless you opt into the `/production` entrypoints.
+
+## Installation
+
+Install the TanStack Devtools host package and the Table adapter for your framework:
+
+### React
+
+```sh
+npm install @tanstack/react-devtools @tanstack/react-table-devtools
+```
+
+### Preact
+
+```sh
+npm install @tanstack/preact-devtools @tanstack/preact-table-devtools
+```
+
+### Solid
+
+```sh
+npm install @tanstack/solid-devtools @tanstack/solid-table-devtools
+```
+
+### Vue
+
+```sh
+npm install @tanstack/vue-devtools @tanstack/vue-table-devtools
+```
+
+Angular, Lit, Svelte, and vanilla do not currently ship dedicated table devtools adapters.
+
+## Setup Pattern
+
+The recommended setup has two parts:
+
+1. Mount `TanStackDevtools` at the app root with `tableDevtoolsPlugin()`
+2. Call `useTanStackTableDevtools(table, name?)` immediately after creating each table
+
+If you register multiple tables, the Table panel shows a selector so you can switch between them.
+
+## React Setup
+
+```tsx
+import React from 'react'
+import ReactDOM from 'react-dom/client'
+import { useTable } from '@tanstack/react-table'
+import { TanStackDevtools } from '@tanstack/react-devtools'
+import {
+ tableDevtoolsPlugin,
+ useTanStackTableDevtools,
+} from '@tanstack/react-table-devtools'
+
+function App() {
+ const table = useTable({
+ // ...
+ })
+
+ useTanStackTableDevtools(table, 'Users Table')
+
+ return
+}
+
+ReactDOM.createRoot(document.getElementById('root')!).render(
+
+
+
+ ,
+)
+```
+
+See the [React row-selection example](./framework/react/examples/row-selection).
+
+## Preact Setup
+
+```tsx
+import { render } from 'preact'
+import { useTable } from '@tanstack/preact-table'
+import { TanStackDevtools } from '@tanstack/preact-devtools'
+import {
+ tableDevtoolsPlugin,
+ useTanStackTableDevtools,
+} from '@tanstack/preact-table-devtools'
+
+function App() {
+ const table = useTable({
+ // ...
+ })
+
+ useTanStackTableDevtools(table, 'Users Table')
+
+ return
+}
+
+render(
+ <>
+
+
+ >,
+ document.getElementById('root')!,
+)
+```
+
+See the [Preact sorting example](./framework/preact/examples/sorting).
+
+## Solid Setup
+
+```tsx
+import { render } from 'solid-js/web'
+import { createTable } from '@tanstack/solid-table'
+import { TanStackDevtools } from '@tanstack/solid-devtools'
+import {
+ tableDevtoolsPlugin,
+ useTanStackTableDevtools,
+} from '@tanstack/solid-table-devtools'
+
+function App() {
+ const table = createTable({
+ // ...
+ })
+
+ useTanStackTableDevtools(table, 'Users Table')
+
+ return
+}
+
+render(
+ () => (
+ <>
+
+
+ >
+ ),
+ document.getElementById('root')!,
+)
+```
+
+See the [Solid row-selection example](./framework/solid/examples/row-selection).
+
+## Vue Setup
+
+```ts
+// main.ts
+import { createApp, defineComponent, h } from 'vue'
+import { TanStackDevtools } from '@tanstack/vue-devtools'
+import { tableDevtoolsPlugin } from '@tanstack/vue-table-devtools'
+import App from './App.vue'
+
+const Root = defineComponent({
+ setup() {
+ return () => [
+ h(App),
+ h(TanStackDevtools, {
+ plugins: [tableDevtoolsPlugin()],
+ }),
+ ]
+ },
+})
+
+createApp(Root).mount('#app')
+```
+
+```vue
+
+```
+
+See the [Vue row-selection example](./framework/vue/examples/row-selection).
+
+## Naming Tables
+
+The optional second argument lets you label a table in the devtools selector:
+
+```ts
+useTanStackTableDevtools(table, 'Orders Table')
+```
+
+If you omit the name, the devtools assign fallback names such as `Table 1` and `Table 2`.
+
+## Production Builds
+
+If you need the live devtools in production, import from the `/production` entrypoint for your framework package:
+
+```tsx
+import { tableDevtoolsPlugin } from '@tanstack/react-table-devtools/production'
+import { useTanStackTableDevtools } from '@tanstack/react-table-devtools/production'
+```
+
+Equivalent `/production` entrypoints are available for the Preact, Solid, and Vue adapters as well.
diff --git a/docs/enterprise/ag-grid.md b/docs/enterprise/ag-grid.md
deleted file mode 100644
index 6836b9af11..0000000000
--- a/docs/enterprise/ag-grid.md
+++ /dev/null
@@ -1,43 +0,0 @@
----
-title: AG Grid - An alternative enterprise data-grid solution
----
-
-
-
-
-
-
-
-While we clearly love TanStack Table, we acknowledge that it is not a "batteries" included product packed with customer support and enterprise polish. We realize that some of our users may need this though! To help out here, we want to introduce you to AG Grid, an enterprise-grade data grid solution that can supercharge your applications with its extensive feature set and robust performance. While TanStack Table is also a powerful option for implementing data grids, we believe in providing our users with a diverse range of choices that best fit their specific requirements. AG Grid is one such choice, and we're excited to highlight its capabilities for you.
-
-## Why Choose [AG Grid](https://ag-grid.com/react-data-grid/?utm_source=reacttable&utm_campaign=githubreacttable)?
-
-Here are some good reasons to consider AG Grid for your next project:
-
-### Comprehensive Feature Set
-
-AG Grid offers an extensive set of features, making it a versatile and powerful data grid solution. With AG Grid, you get access to a wide range of functionalities that cater to the needs of complex enterprise applications. From advanced sorting, filtering, and grouping capabilities to column pinning, multi-level headers, and tree data structure support, AG Grid provides you with the tools to create dynamic and interactive data grids that meet your application's unique demands.
-
-### High Performance
-
-When it comes to handling large datasets and achieving exceptional performance, AG Grid delivers outstanding results. It employs highly optimized rendering techniques, efficient data updates, and virtualization to ensure smooth scrolling and fast response times, even when dealing with thousands or millions of rows of data. AG Grid's performance optimizations make it an excellent choice for applications that require high-speed data manipulation and visualization.
-
-### Customization and Extensibility
-
-AG Grid is designed to be highly customizable and extensible, allowing you to tailor the grid to your specific needs. It provides a rich set of APIs and events that enable you to integrate custom functionality seamlessly. You can define custom cell renderers, editors, filters, and aggregators to enhance the grid's behavior and appearance. AG Grid also supports a variety of themes, allowing you to match the grid's visual style to your application's design.
-
-### Support for Enterprise Needs
-
-As an enterprise-focused solution, AG Grid caters to the requirements of complex business applications. It offers enterprise-specific features such as row grouping, column pinning, server-side row model, master/detail grids, and rich editing capabilities. AG Grid also integrates well with other enterprise frameworks and libraries, making it a reliable choice for large-scale projects.
-
-### Active Development and Community Support
-
-AG Grid benefits from active development and a thriving community of developers. The team behind AG Grid consistently introduces new features and enhancements, ensuring that the product evolves to meet the changing needs of the industry. The community support is robust, with forums, documentation, and examples readily available to assist you in utilizing the full potential of AG Grid.
-
-## Conclusion
-
-While TanStack Table remains a powerful and flexible option for implementing data grids, we understand that different projects have different requirements. AG Grid offers a compelling enterprise-grade solution that may be particularly suited to your needs. Its comprehensive feature set, high performance, customization options, and focus on enterprise requirements make AG Grid an excellent choice for projects that demand a robust and scalable data grid solution.
-
-We encourage you to explore AG Grid further by visiting their website and trying out their demo. Remember that both TanStack Table and AG Grid have their unique strengths and considerations. We believe in providing options to our users, empowering you to make informed decisions and choose the best fit for your specific use case.
-
-Visit the [AG Grid website](https://www.ag-grid.com).
diff --git a/docs/faq.md b/docs/faq.md
index 32bda46315..714a9fa448 100644
--- a/docs/faq.md
+++ b/docs/faq.md
@@ -26,8 +26,8 @@ export default function MyComponent() {
// ...
];
- //❌ Columns and data are defined in the same scope as `useReactTable` without a stable reference, will cause infinite loop!
- const table = useReactTable({
+ //❌ Columns and data are defined in the same scope as `useTable` without a stable reference, will cause infinite loop!
+ const table = useTable({
columns,
data,
});
@@ -64,7 +64,7 @@ export default function MyComponent() {
]);
// Columns and data are defined in a stable reference, will not cause infinite loop!
- const table = useReactTable({
+ const table = useTable({
columns,
data,
});
@@ -89,7 +89,7 @@ export default function MyComponent() {
//...
});
- const table = useReactTable({
+ const table = useTable({
columns,
//❌ BAD: This will cause an infinite loop of re-renders because `data` is mutated in place (destroys stable reference)
data: data?.filter(d => d.isActive) ?? [],
@@ -118,7 +118,7 @@ export default function MyComponent() {
//✅ GOOD: This will not cause an infinite loop of re-renders because `filteredData` is memoized
const filteredData = useMemo(() => data?.filter(d => d.isActive) ?? [], [data]);
- const table = useReactTable({
+ const table = useTable({
columns,
data: filteredData, // stable reference!
});
@@ -156,7 +156,7 @@ React.useEffect(() => {
skipPageResetRef.current = false
})
-useReactTable({
+useTable({
...
autoResetPageIndex: !skipPageResetRef.current,
autoResetExpanded: !skipPageResetRef.current,
diff --git a/docs/framework/angular/angular-table.md b/docs/framework/angular/angular-table.md
index c3e74071d2..e9553238f5 100644
--- a/docs/framework/angular/angular-table.md
+++ b/docs/framework/angular/angular-table.md
@@ -2,270 +2,171 @@
title: Angular Table
---
-The `@tanstack/angular-table` adapter is a wrapper around the core table logic. Most of it's job is related to managing
-state the "angular signals" way, providing types and the rendering implementation of cell/header/footer templates.
+The `@tanstack/angular-table` adapter wraps `@tanstack/table-core` with Angular signals, rendering directives, dependency-injection helpers, and types. `injectTable` supplies Angular reactivity bindings for you, so table atoms can update Angular signals, computed values, effects, and templates.
-## Exports
+TanStack Table v9 is explicit about what a table uses. Register features with `_features`, and register client-side row model factories with `_rowModels`. The core row model is included by default, so a basic table can use `_rowModels: {}`.
-`@tanstack/angular-table` re-exports all of `@tanstack/table-core`'s APIs and the following:
+## Creating a Table
-### `createAngularTable`
-
-Accepts an options function or a computed value that returns the table options, and returns a table.
+Use `injectTable` inside an Angular injection context. The initializer is re-run when Angular signals read inside it change, then the adapter syncs the table options.
```ts
-import {createAngularTable} from '@tanstack/angular-table'
-
-export class AppComponent {
- data = signal([])
+import { ChangeDetectionStrategy, Component, signal } from '@angular/core'
+import {
+ FlexRender,
+ injectTable,
+ tableFeatures,
+ type ColumnDef,
+} from '@tanstack/angular-table'
- table = createAngularTable(() => ({
- data: this.data(),
- columns: defaultColumns,
- getCoreRowModel: getCoreRowModel(),
- }))
+type Person = {
+ firstName: string
+ lastName: string
+ age: number
}
-// ...render your table in template
-
-```
-
-### `FlexRender`
-
-An Angular structural directive for rendering cell/header/footer templates with dynamic values.
-
-FlexRender supports any type of content supported by Angular:
-
-- A string, or a html string via `innerHTML`
-- A [TemplateRef](https://angular.dev/api/core/TemplateRef)
-- A [Component](https://angular.dev/api/core/Component) wrapped into `FlexRenderComponent`
+const _features = tableFeatures({})
-Example:
+const columns: Array> = [
+ {
+ accessorKey: 'firstName',
+ header: 'First name',
+ cell: (info) => info.getValue(),
+ },
+]
-```ts
@Component({
- imports: [FlexRenderDirective],
- //...
+ selector: 'app-root',
+ imports: [FlexRender],
+ templateUrl: './app.html',
+ changeDetection: ChangeDetectionStrategy.OnPush,
})
-```
-
-```angular-html
+export class App {
+ readonly data = signal([])
-
-@for (row of table.getRowModel().rows; track row.id) {
-
- @for (cell of row.getVisibleCells(); track cell.id) {
-|
-
-
- {{ cell }}
-
-
-
- |
-}
-
+ readonly table = injectTable(() => ({
+ _features,
+ _rowModels: {},
+ columns,
+ data: this.data(),
+ }))
}
-
```
-#### Rendering a TemplateRef
-
-In order to render a TemplateRef into a specific column header/cell/footer, you can pass the TemplateRef into the column
-definition.
-
-You can access the TemplateRef data via the `$implicit` property, which is valued based on what is passed in the props
-field of flexRender.
+For feature-specific row models, register the feature and put the row model factory under `_rowModels`.
-In most cases, each TemplateRef will be rendered with the $implicit context valued based on the cell type in this way:
+```ts
+import {
+ createPaginatedRowModel,
+ createSortedRowModel,
+ rowPaginationFeature,
+ rowSortingFeature,
+ sortFns,
+ tableFeatures,
+} from '@tanstack/angular-table'
-- Header: `HeaderContext`
-- Cell: `CellContext`,
-- Footer: `HeaderContext`
+const _features = tableFeatures({
+ rowPaginationFeature,
+ rowSortingFeature,
+})
-```angular-html
+const tableOptions = {
+ _features,
+ _rowModels: {
+ paginatedRowModel: createPaginatedRowModel(),
+ sortedRowModel: createSortedRowModel(sortFns),
+ },
+}
+```
-
-
- {{ cell }}
-
-
-
+## Table State
-
-
-
-```
+Table state is managed with TanStack Store atoms in v9. For most tables, you do not need to manage table state yourself: set `initialState` when you need starting values, and use feature APIs like `table.nextPage()`, `table.setSorting(...)`, and `row.toggleSelected()` instead of mutating state directly.
-Full example:
+Angular apps usually own state with signals and pass it through `state` with the matching `on[State]Change` option. The `atoms` table option is also available for TanStack Store atom ownership. Table atoms are backed by Angular signals, so reading `table.atoms.someSlice.get()` in a template, `computed(...)`, or `effect(...)` participates in Angular reactivity.
-```angular-ts
-import type {
- CellContext,
- ColumnDef,
- HeaderContext,
+```ts
+import { signal } from '@angular/core'
+import {
+ injectTable,
+ rowPaginationFeature,
+ tableFeatures,
+ type PaginationState,
} from '@tanstack/angular-table'
-import {Component, TemplateRef, viewChild} from '@angular/core'
-@Component({
- template: `
-
- @for (row of table.getRowModel().rows; track row.id) {
-
- @for (cell of row.getVisibleCells(); track cell.id) {
- |
-
-
- {{ cell }}
-
-
-
- |
- }
-
- }
-
-
-
- {{ context.getValue() }}
-
-
- {{ context.getValue() }}
-
- `,
+const _features = tableFeatures({
+ rowPaginationFeature,
})
-class AppComponent {
- customHeader =
- viewChild.required }>>(
- 'customHeader'
- )
- customCell =
- viewChild.required }>>(
- 'customCell'
- )
-
- columns: ColumnDef[] = [
- {
- id: 'customCell',
- header: () => this.customHeader(),
- cell: () => this.customCell(),
+
+export class App {
+ readonly pagination = signal({
+ pageIndex: 0,
+ pageSize: 10,
+ })
+
+ readonly table = injectTable(() => ({
+ _features,
+ _rowModels: {},
+ columns,
+ data: this.data(),
+ state: {
+ pagination: this.pagination(),
+ },
+ onPaginationChange: (updater) => {
+ this.pagination.update((old) =>
+ updater instanceof Function ? updater(old) : updater,
+ )
},
- ]
+ }))
}
```
-#### Rendering a Component
+See the [Table State Guide](./guide/table-state.md) for reactive reads, external atoms, and state ownership patterns.
-To render a Component into a specific column header/cell/footer, you can pass a `FlexRenderComponent instantiated with
-your `ComponentType, with the ability to include optional parameters such as inputs and an injector.
+## Rendering Headers, Cells, and Footers
-```ts
-import {FlexRenderComponent} from "@tanstack/angular-table";
-
-class AppComponent {
- columns: ColumnDef[] = [
- {
- id: 'customCell',
- header: () => new FlexRenderComponent(
- CustomCellComponent,
- {}, // optional inputs
- injector // optional injector
- ),
- cell: () => this.customCell(),
- },
- ]
-}
+Use the `FlexRender` directive helpers to render column `header`, `cell`, and `footer` definitions. They handle primitive values, templates, and components wrapped with `flexRenderComponent`.
+
+```html
+
+ @for (row of table.getRowModel().rows; track row.id) {
+
+ @for (cell of row.getVisibleCells(); track cell.id) {
+ |
+ {{ rendered }}
+ |
+ }
+
+ }
+
```
-Underneath, this utilizes
-the [ViewContainerRef#createComponent](https://angular.dev/api/core/ViewContainerRef#createComponent) api.
-Therefore, you should declare your custom inputs using the @Input decorator or input/model signals.
+For `*flexRender`, `*flexRenderHeader`, `*flexRenderFooter`, `flexRenderComponent`, and render context helpers, see the [Rendering components Guide](./guide/rendering.md).
-You can still access the table cell context through the `injectFlexRenderContext` function, which returns the context
-value based on the props you pass to the `FlexRenderDirective`.
+## createTableHook
+
+`createTableHook` creates app-specific Angular table helpers. Use it when multiple tables should share `_features`, `_rowModels`, default options, column helpers, and component conventions.
```ts
-@Component({
- // ...
+import { createTableHook, tableFeatures } from '@tanstack/angular-table'
+
+const { injectAppTable, createAppColumnHelper } = createTableHook({
+ _features: tableFeatures({}),
+ _rowModels: {},
})
-class CustomCellComponent {
- // context of a cell component
- readonly context = injectFlexRenderContext>();
- // context of a header/footer component
- readonly context = injectFlexRenderContext>();
-}
-```
-Alternatively, you can render a component into a specific column header, cell, or footer by passing the component type
-to the corresponding column definitions. These column definitions will be provided to the `flexRender` directive along with the `context`.
+const columnHelper = createAppColumnHelper()
-```ts
-import {FlexRenderComponent} from "@tanstack/angular-table";
-
-class AppComponent {
- columns: ColumnDef[] = [
- {
- id: 'select',
- header: () => TableHeadSelectionComponent,
- cell: () => TableRowSelectionComponent,
- },
- ]
+export class App {
+ readonly table = injectAppTable(() => ({
+ columns,
+ data: this.data(),
+ }))
}
```
-```angular2html
-