Merge branch 'beta' into mh/grouping_fix

Author: dvmoritzschoefl

.github/workflows/pr.yml

@@ -40,6 +40,20 @@ jobs:
       - name: Stop Nx Agents
         if: ${{ always() }}
         run: npx nx-cloud stop-all-agents
+  coverage:
+    name: Coverage Report
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
+        with:
+          persist-credentials: false
+      - name: Setup Tools
+        uses: tanstack/config/.github/setup@e4b48f16568324f76f467aa4c2aac2f05db632c3 # main
+      - name: Collect Coverage
+        run: pnpm --filter "@tanstack/table-core" test:coverage
+      - name: Write Coverage Summary
+        run: node scripts/coverage-summary.mjs packages/table-core/coverage/coverage-summary.json "table-core Coverage" >> "$GITHUB_STEP_SUMMARY"
   preview:
     name: Preview
     runs-on: ubuntu-latest

.github/workflows/release.yml

@@ -8,6 +8,9 @@ on:
         required: false
   push:
     branches: [main, alpha, beta, rc]
+    paths:
+      - 'packages/**'
+      - 'pnpm-lock.yaml'
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.event.number || github.ref }}
@@ -18,15 +21,17 @@ env:
   NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
 
 permissions:
-  contents: write
-  id-token: write
-  pull-requests: write
+  contents: read
 
 jobs:
   release:
     name: Release
     if: github.repository_owner == 'TanStack'
     runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      id-token: write
+      pull-requests: write
     steps:
       - name: Checkout
         uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
@@ -72,3 +77,24 @@ jobs:
             --body "Automated version bump created after publishing packages."
         env:
           RELEASE_BRANCH: ${{ steps.release-branch.outputs.branch }}
+
+  audit:
+    name: Audit
+    needs: release
+    if: github.repository_owner == 'TanStack' && contains(fromJSON('["main","alpha","beta"]'), github.ref_name)
+    runs-on: ubuntu-latest
+    timeout-minutes: 120
+    steps:
+      - name: Checkout
+        uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
+        with:
+          fetch-depth: 0
+          persist-credentials: false
+      - name: Setup Tools
+        uses: tanstack/config/.github/setup@e4b48f16568324f76f467aa4c2aac2f05db632c3 # main
+      - name: Build Packages
+        run: pnpm run build:all
+      - name: Install Playwright Browsers
+        run: pnpm run test:e2e:install
+      - name: Run E2E Tests
+        run: pnpm run test:e2e

.prettierignore

@@ -4,9 +4,10 @@
 **/build
 **/coverage
 **/dist
-**/docs
+**/reference
 **/old-examples
 **/examples/**/*.svelte
 pnpm-lock.yaml
+docs/config.json
 
 .angular

docs/config.json

@@ -74,7 +74,7 @@
         {
           "label": "vanilla",
           "children": [
-            { "label": "Vanilla JS (No Framework)", "to": "vanilla" }
+            { "label": "Quick Start", "to": "framework/vanilla/quick-start" }
           ]
         }
       ]
@@ -86,6 +86,7 @@
         { "label": "Column Definitions", "to": "guide/column-defs" },
         { "label": "Table Instance", "to": "guide/tables" },
         { "label": "Row Models", "to": "guide/row-models" },
+        { "label": "Worker Row Models (Experimental)", "to": "guide/worker-row-models" },
         { "label": "Rows", "to": "guide/rows" },
         { "label": "Cells", "to": "guide/cells" },
         { "label": "Header Groups", "to": "guide/header-groups" },
@@ -859,6 +860,7 @@
             { "to": "framework/alpine/examples/basic-app-table", "label": "Basic (createAppTable)" },
             { "to": "framework/alpine/examples/basic-external-state", "label": "Basic (External State)" },
             { "to": "framework/alpine/examples/basic-external-atoms", "label": "Basic (External Atoms)" },
+            { "to": "framework/alpine/examples/basic-dynamic-columns", "label": "Basic (Dynamic Columns)" },
             { "to": "framework/alpine/examples/column-groups", "label": "Header Groups" }
           ]
         },
@@ -869,6 +871,7 @@
             { "label": "Basic (createAppTable)", "to": "framework/angular/examples/basic-app-table" },
             { "label": "Basic (External State)", "to": "framework/angular/examples/basic-external-state" },
             { "label": "Basic (External Atoms)", "to": "framework/angular/examples/basic-external-atoms" },
+            { "label": "Basic (Dynamic Columns)", "to": "framework/angular/examples/basic-dynamic-columns" },
             { "label": "Header Groups", "to": "framework/angular/examples/column-groups" }
           ]
         },
@@ -880,6 +883,7 @@
             { "label": "Basic (External State)", "to": "framework/lit/examples/basic-external-state" },
             { "label": "Basic (External Atoms)", "to": "framework/lit/examples/basic-external-atoms" },
             { "label": "Basic (Subscribe)", "to": "framework/lit/examples/basic-subscribe" },
+            { "label": "Basic (Dynamic Columns)", "to": "framework/lit/examples/basic-dynamic-columns" },
             { "label": "Header Groups", "to": "framework/lit/examples/column-groups" }
           ]
         },
@@ -892,6 +896,7 @@
             { "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": "Basic (Dynamic Columns)", "to": "framework/react/examples/basic-dynamic-columns" },
             { "label": "Header Groups", "to": "framework/react/examples/column-groups" }
           ]
         },
@@ -902,6 +907,7 @@
             { "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": "Basic (Dynamic Columns)", "to": "framework/solid/examples/basic-dynamic-columns" },
             { "label": "Header Groups", "to": "framework/solid/examples/column-groups" }
           ]
         },
@@ -913,6 +919,7 @@
             { "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": "Basic (Dynamic Columns)", "to": "framework/svelte/examples/basic-dynamic-columns" },
             { "label": "Header Groups", "to": "framework/svelte/examples/column-groups" }
           ]
         },
@@ -923,6 +930,7 @@
             { "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": "Basic (Dynamic Columns)", "to": "framework/vue/examples/basic-dynamic-columns" },
             { "label": "Header Groups", "to": "framework/vue/examples/column-groups" }
           ]
         },
@@ -934,6 +942,7 @@
             { "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": "Basic (Dynamic Columns)", "to": "framework/preact/examples/basic-dynamic-columns" },
             { "label": "Header Groups", "to": "framework/preact/examples/column-groups" }
           ]
         },
@@ -1193,6 +1202,7 @@
           "children": [
             { "label": "Composable Tables (createTableHook)", "to": "framework/react/examples/composable-tables" },
             { "label": "Custom Plugin", "to": "framework/react/examples/custom-plugin" },
+            { "label": "Experimental Web Workers Plugin", "to": "framework/react/examples/web-worker-row-models" },
             { "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" },
@@ -1254,18 +1264,20 @@
         {
           "label": "react",
           "children": [
-            { "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 - Shadcn (Radix)", "to": "framework/react/examples/lib-shadcn-radix" },
             { "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": "Basic - Chakra UI", "to": "framework/react/examples/lib-chakra-ui" },
             { "label": "Kitchen Sink - Shadcn (Base UI)", "to": "framework/react/examples/kitchen-sink-shadcn-base" },
+            { "label": "Kitchen Sink - Shadcn (Radix)", "to": "framework/react/examples/kitchen-sink-shadcn-radix" },
             { "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": "Kitchen Sink - Chakra UI", "to": "framework/react/examples/kitchen-sink-chakra-ui" },
             { "label": "Material React Table", "to": "framework/react/examples/material-react-table" },
             { "label": "Mantine React Table", "to": "framework/react/examples/mantine-react-table" }
           ]

docs/framework/alpine/guide/column-faceting.md

@@ -165,10 +165,7 @@ Alpine.data('table', () => {
 <template x-if="!isNumberColumn(header.column)">
   <div>
     <datalist :id="header.column.id + 'list'">
-      <template
-        x-for="value in uniqueValues(header.column)"
-        :key="value"
-      >
+      <template x-for="value in uniqueValues(header.column)" :key="value">
         <option :value="value"></option>
       </template>
     </datalist>

docs/framework/alpine/guide/column-ordering.md

@@ -15,7 +15,11 @@ Read your reactive inputs such as `data` through a getter (for example backing t
 Here's how you set up your table to use column ordering features. Adding the column ordering feature enables the related APIs.
 
 ```ts
-import { createTable, tableFeatures, columnOrderingFeature } from '@tanstack/alpine-table'
+import {
+  createTable,
+  tableFeatures,
+  columnOrderingFeature,
+} from '@tanstack/alpine-table'
 
 const features = tableFeatures({ columnOrderingFeature })
 
@@ -73,7 +77,11 @@ In v9, the recommended way to own a state slice is with an external atom passed
 
 ```ts
 import { createAtom } from '@tanstack/store'
-import { createTable, tableFeatures, columnOrderingFeature } from '@tanstack/alpine-table'
+import {
+  createTable,
+  tableFeatures,
+  columnOrderingFeature,
+} from '@tanstack/alpine-table'
 import type { ColumnOrderState } from '@tanstack/alpine-table'
 
 const features = tableFeatures({ columnOrderingFeature })

docs/framework/alpine/guide/column-pinning.md

@@ -17,7 +17,11 @@ Read your reactive inputs such as `data` through a getter (for example backing t
 Here's how you set up your table to use column pinning features. Adding the column pinning feature enables the related APIs.
 
 ```ts
-import { createTable, tableFeatures, columnPinningFeature } from '@tanstack/alpine-table'
+import {
+  createTable,
+  tableFeatures,
+  columnPinningFeature,
+} from '@tanstack/alpine-table'
 
 const features = tableFeatures({ columnPinningFeature })
 
@@ -52,7 +56,11 @@ In v9, the recommended way to own a state slice is with an external atom passed
 
 ```ts
 import { createAtom } from '@tanstack/store'
-import { createTable, tableFeatures, columnPinningFeature } from '@tanstack/alpine-table'
+import {
+  createTable,
+  tableFeatures,
+  columnPinningFeature,
+} from '@tanstack/alpine-table'
 import type { ColumnPinningState } from '@tanstack/alpine-table'
 
 const features = tableFeatures({ columnPinningFeature })