From be97b81534c5952038b6df8cbcdf36074512ecfc Mon Sep 17 00:00:00 2001
From: greymoth-jp <m.hirakawa07@icloud.com>
Date: Sun, 28 Jun 2026 21:57:10 +0000
Subject: [PATCH 1/2] fix(table-core): auto-remove empty arrHas filter values
 like the other array filters

arrHas was the only array-valued filter function without an autoRemove handler, so an empty array filter value was never removed and hid every row.
---
 packages/table-core/src/fns/filterFns.ts      | 20 ++++++++---------
 .../tests/unit/fns/filterFns.test.ts          | 22 +++++++++++++++++++
 2 files changed, 32 insertions(+), 10 deletions(-)

diff --git a/packages/table-core/src/fns/filterFns.ts b/packages/table-core/src/fns/filterFns.ts
index 7e85698890..47995dc239 100644
--- a/packages/table-core/src/fns/filterFns.ts
+++ b/packages/table-core/src/fns/filterFns.ts
@@ -296,16 +296,16 @@ export const filterFn_inNumberRange = Object.assign(
 /**
  * Keeps rows whose scalar column value equals at least one filter value.
  */
-export const filterFn_arrHas = <
-  TFeatures extends TableFeatures,
-  TData extends RowData,
->(
-  row: Row<TFeatures, TData>,
-  columnId: string,
-  filterValue: Array<unknown>,
-) => {
-  return filterValue.some((val) => row.getValue<unknown>(columnId) === val)
-}
+export const filterFn_arrHas = Object.assign(
+  <TFeatures extends TableFeatures, TData extends RowData>(
+    row: Row<TFeatures, TData>,
+    columnId: string,
+    filterValue: Array<unknown>,
+  ) => {
+    return filterValue.some((val) => row.getValue<unknown>(columnId) === val)
+  },
+  { autoRemove: (val: any) => testFalsy(val) || !val?.length },
+)
 
 /**
  * Keeps rows whose array or string column value includes at least one filter value.
diff --git a/packages/table-core/tests/unit/fns/filterFns.test.ts b/packages/table-core/tests/unit/fns/filterFns.test.ts
index 1b6f74a092..79adcb4de4 100644
--- a/packages/table-core/tests/unit/fns/filterFns.test.ts
+++ b/packages/table-core/tests/unit/fns/filterFns.test.ts
@@ -563,4 +563,26 @@ describe('Filter Functions', () => {
       })
     })
   })
+
+  describe('Array Filters', () => {
+    describe('filterFns.arrHas.autoRemove', () => {
+      const autoRemove = filterFns.arrHas.autoRemove!
+
+      it('should auto-remove when the filter value is undefined', () => {
+        expect(autoRemove(undefined)).toBe(true)
+      })
+      it('should auto-remove when the filter value is null', () => {
+        expect(autoRemove(null)).toBe(true)
+      })
+      it('should auto-remove when the filter value is an empty string', () => {
+        expect(autoRemove('')).toBe(true)
+      })
+      it('should auto-remove when the filter value is an empty array', () => {
+        expect(autoRemove([])).toBe(true)
+      })
+      it('should NOT auto-remove when the filter value is a non-empty array', () => {
+        expect(autoRemove(['a'])).toBe(false)
+      })
+    })
+  })
 })

From 426274af9ef5bab6a1543acc3ca8ec2dccd7adbf Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Sun, 28 Jun 2026 23:12:40 +0000
Subject: [PATCH 2/2] ci: apply automated fixes

---
 .../with-tanstack-form/src/app/app.html       | 14 +++++++-----
 .../src/app/header-components.ts              | 22 ++++++++++++-------
 .../src/app/row-submit-table-row.ts           |  4 +++-
 .../src/app/table-components.ts               |  8 ++-----
 .../preact/with-tanstack-form/src/form.tsx    |  5 +----
 .../react/with-tanstack-form/src/form.tsx     |  5 +----
 examples/solid/with-tanstack-form/src/App.tsx |  4 +---
 .../solid/with-tanstack-form/src/index.tsx    |  4 +++-
 .../solid/with-tanstack-form/src/table.tsx    |  6 ++---
 examples/vue/with-tanstack-form/src/App.vue   |  4 +++-
 examples/vue/with-tanstack-form/src/table.ts  | 17 +++-----------
 11 files changed, 42 insertions(+), 51 deletions(-)

diff --git a/examples/angular/with-tanstack-form/src/app/app.html b/examples/angular/with-tanstack-form/src/app/app.html
index a26a9f84f8..7de54ccab9 100644
--- a/examples/angular/with-tanstack-form/src/app/app.html
+++ b/examples/angular/with-tanstack-form/src/app/app.html
@@ -4,10 +4,16 @@ <h2 class="section-title">Single form around the table</h2>
     <form (submit)="submitFullTable($event)">
       <div class="form-actions">
         <div class="form-status">
-          <span [class.warning-text]="fullFormState().isDirty" [class.muted-text]="!fullFormState().isDirty">
+          <span
+            [class.warning-text]="fullFormState().isDirty"
+            [class.muted-text]="!fullFormState().isDirty"
+          >
             {{ fullFormState().isDirty ? 'Modified' : 'Pristine' }}
           </span>
-          <span [class.success-text]="fullFormState().isValid" [class.error-text]="!fullFormState().isValid">
+          <span
+            [class.success-text]="fullFormState().isValid"
+            [class.error-text]="!fullFormState().isValid"
+          >
             {{ fullFormState().isValid ? 'Valid' : 'Invalid' }}
           </span>
         </div>
@@ -18,9 +24,7 @@ <h2 class="section-title">Single form around the table</h2>
         >
           {{ fullFormState().isSubmitting ? 'Submitting...' : 'Save All Changes' }}
         </button>
-        <button class="demo-button success-action" type="button" (click)="addRow()">
-          Add Row
-        </button>
+        <button class="demo-button success-action" type="button" (click)="addRow()">Add Row</button>
         <button class="demo-button secondary-action" type="button" (click)="refreshData()">
           Regenerate Data
         </button>
diff --git a/examples/angular/with-tanstack-form/src/app/header-components.ts b/examples/angular/with-tanstack-form/src/app/header-components.ts
index ef725bbbdd..8dcf792cb1 100644
--- a/examples/angular/with-tanstack-form/src/app/header-components.ts
+++ b/examples/angular/with-tanstack-form/src/app/header-components.ts
@@ -61,22 +61,28 @@ export class _ColumnFilter {
       .getPreFilteredRowModel()
       .flatRows[0]?.getValue(this.header().column.id),
   )
-  readonly isNumberColumn = computed(() => typeof this.firstValue() === 'number')
+  readonly isNumberColumn = computed(
+    () => typeof this.firstValue() === 'number',
+  )
   readonly filterValue = computed(() => this.header().column.getFilterValue())
   readonly numberFilterValue = computed(
     () => this.filterValue() as [number, number] | undefined,
   )
-  readonly textFilterValue = computed(() => (this.filterValue() ?? '') as string)
+  readonly textFilterValue = computed(
+    () => (this.filterValue() ?? '') as string,
+  )
 
   setMin(value: string | number) {
-    this.header().column.setFilterValue(
-      (old: [number, number] | undefined) => [value, old?.[1]],
-    )
+    this.header().column.setFilterValue((old: [number, number] | undefined) => [
+      value,
+      old?.[1],
+    ])
   }
 
   setMax(value: string | number) {
-    this.header().column.setFilterValue(
-      (old: [number, number] | undefined) => [old?.[0], value],
-    )
+    this.header().column.setFilterValue((old: [number, number] | undefined) => [
+      old?.[0],
+      value,
+    ])
   }
 }
diff --git a/examples/angular/with-tanstack-form/src/app/row-submit-table-row.ts b/examples/angular/with-tanstack-form/src/app/row-submit-table-row.ts
index 70f7b7ab91..9e6114805d 100644
--- a/examples/angular/with-tanstack-form/src/app/row-submit-table-row.ts
+++ b/examples/angular/with-tanstack-form/src/app/row-submit-table-row.ts
@@ -146,7 +146,9 @@ import type { Row } from '@tanstack/angular-table'
                 <button
                   type="button"
                   class="demo-button demo-button-sm primary-action"
-                  [disabled]="!formState().canSubmit || formState().isSubmitting"
+                  [disabled]="
+                    !formState().canSubmit || formState().isSubmitting
+                  "
                   (click)="form.handleSubmit()"
                 >
                   {{ formState().isSubmitting ? 'Saving...' : 'Save' }}
diff --git a/examples/angular/with-tanstack-form/src/app/table-components.ts b/examples/angular/with-tanstack-form/src/app/table-components.ts
index ee83bdf3c6..ab503a1664 100644
--- a/examples/angular/with-tanstack-form/src/app/table-components.ts
+++ b/examples/angular/with-tanstack-form/src/app/table-components.ts
@@ -85,18 +85,14 @@ export class PaginationControls {
   }
 
   onPageSizeChange(event: Event) {
-    this.table().setPageSize(
-      Number((event.target as HTMLSelectElement).value),
-    )
+    this.table().setPageSize(Number((event.target as HTMLSelectElement).value))
   }
 }
 
 @Component({
   selector: 'app-row-count',
   template: `
-    <div class="row-count">
-      Showing {{ length() }} of {{ rowCount() }} Rows
-    </div>
+    <div class="row-count">Showing {{ length() }} of {{ rowCount() }} Rows</div>
   `,
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
diff --git a/examples/preact/with-tanstack-form/src/form.tsx b/examples/preact/with-tanstack-form/src/form.tsx
index f3fbc623d9..a6ef216dd6 100644
--- a/examples/preact/with-tanstack-form/src/form.tsx
+++ b/examples/preact/with-tanstack-form/src/form.tsx
@@ -1,7 +1,4 @@
-import {
-  createFormHook,
-  createFormHookContexts,
-} from '@tanstack/preact-form'
+import { createFormHook, createFormHookContexts } from '@tanstack/preact-form'
 
 // Create form and field contexts
 export const { fieldContext, useFieldContext, formContext, useFormContext } =
diff --git a/examples/react/with-tanstack-form/src/form.tsx b/examples/react/with-tanstack-form/src/form.tsx
index 305cb21505..bd8546e443 100644
--- a/examples/react/with-tanstack-form/src/form.tsx
+++ b/examples/react/with-tanstack-form/src/form.tsx
@@ -1,7 +1,4 @@
-import {
-  createFormHook,
-  createFormHookContexts,
-} from '@tanstack/react-form'
+import { createFormHook, createFormHookContexts } from '@tanstack/react-form'
 
 // Create form and field contexts
 export const { fieldContext, useFieldContext, formContext, useFormContext } =
diff --git a/examples/solid/with-tanstack-form/src/App.tsx b/examples/solid/with-tanstack-form/src/App.tsx
index 85e257ec61..8044afb0ae 100644
--- a/examples/solid/with-tanstack-form/src/App.tsx
+++ b/examples/solid/with-tanstack-form/src/App.tsx
@@ -394,9 +394,7 @@ function RowSubmitFormExample() {
             </thead>
             <tbody>
               <For each={table.getRowModel().rows}>
-                {(row) => (
-                  <RowSubmitTableRow row={row} onSave={saveRow} />
-                )}
+                {(row) => <RowSubmitTableRow row={row} onSave={saveRow} />}
               </For>
             </tbody>
           </table>
diff --git a/examples/solid/with-tanstack-form/src/index.tsx b/examples/solid/with-tanstack-form/src/index.tsx
index aaae071f45..85abe13a7a 100644
--- a/examples/solid/with-tanstack-form/src/index.tsx
+++ b/examples/solid/with-tanstack-form/src/index.tsx
@@ -10,7 +10,9 @@ render(
   () => (
     <>
       <App />
-      <TanStackDevtools plugins={[tableDevtoolsPlugin(), formDevtoolsPlugin()]} />
+      <TanStackDevtools
+        plugins={[tableDevtoolsPlugin(), formDevtoolsPlugin()]}
+      />
     </>
   ),
   document.getElementById('root') as HTMLElement,
diff --git a/examples/solid/with-tanstack-form/src/table.tsx b/examples/solid/with-tanstack-form/src/table.tsx
index be3e0dc5a4..21deae192a 100644
--- a/examples/solid/with-tanstack-form/src/table.tsx
+++ b/examples/solid/with-tanstack-form/src/table.tsx
@@ -52,8 +52,7 @@ function ColumnFilter() {
             <DebouncedInput
               type="number"
               value={
-                (columnFilterValue() as [number, number] | undefined)?.[0] ??
-                ''
+                (columnFilterValue() as [number, number] | undefined)?.[0] ?? ''
               }
               onChange={(value) =>
                 header.column.setFilterValue(
@@ -66,8 +65,7 @@ function ColumnFilter() {
             <DebouncedInput
               type="number"
               value={
-                (columnFilterValue() as [number, number] | undefined)?.[1] ??
-                ''
+                (columnFilterValue() as [number, number] | undefined)?.[1] ?? ''
               }
               onChange={(value) =>
                 header.column.setFilterValue(
diff --git a/examples/vue/with-tanstack-form/src/App.vue b/examples/vue/with-tanstack-form/src/App.vue
index 193ffb5d20..405dafd200 100644
--- a/examples/vue/with-tanstack-form/src/App.vue
+++ b/examples/vue/with-tanstack-form/src/App.vue
@@ -156,7 +156,9 @@ function handleSubmit(event: Event) {
   fullTableForm.handleSubmit()
 }
 
-function getSortTitle(column: ReturnType<typeof fullTable.getAllColumns>[number]) {
+function getSortTitle(
+  column: ReturnType<typeof fullTable.getAllColumns>[number],
+) {
   if (!column.getCanSort()) return undefined
 
   const nextOrder = column.getNextSortingOrder()
diff --git a/examples/vue/with-tanstack-form/src/table.ts b/examples/vue/with-tanstack-form/src/table.ts
index 7ef212fb48..5d91ccc2e1 100644
--- a/examples/vue/with-tanstack-form/src/table.ts
+++ b/examples/vue/with-tanstack-form/src/table.ts
@@ -11,12 +11,7 @@ import {
   tableFeatures,
 } from '@tanstack/vue-table'
 import { computed, defineComponent, h } from 'vue'
-import type {
-  CellData,
-  Header,
-  RowData,
-  VueTable,
-} from '@tanstack/vue-table'
+import type { CellData, Header, RowData, VueTable } from '@tanstack/vue-table'
 
 const features = tableFeatures({
   rowPaginationFeature,
@@ -75,10 +70,7 @@ const ColumnFilter = defineComponent({
               onInput: (event: Event) => {
                 const nextValue = (event.target as HTMLInputElement).value
                 header.column.setFilterValue(
-                  (old: [number, number] | undefined) => [
-                    nextValue,
-                    old?.[1],
-                  ],
+                  (old: [number, number] | undefined) => [nextValue, old?.[1]],
                 )
               },
             }),
@@ -90,10 +82,7 @@ const ColumnFilter = defineComponent({
               onInput: (event: Event) => {
                 const nextValue = (event.target as HTMLInputElement).value
                 header.column.setFilterValue(
-                  (old: [number, number] | undefined) => [
-                    old?.[0],
-                    nextValue,
-                  ],
+                  (old: [number, number] | undefined) => [old?.[0], nextValue],
                 )
               },
             }),