feat(form-core): add array method field.filterValues and form.filterFieldValues

[Pascalmh]

Problem

When setting a field back to an empty array

const form = new FormApi({
  defaultValues: {
    people: [
        { firstName: "Bob" },
        { firstName: "Marry" },
    ],
  },
});

form.setFieldValue('people', [
  { firstName: "Marry" }, // <-- "Bob" should be removed
]);

items[0].firstName would still exist - when there's a validation on the firstName (on the Field-level) form.canSubmit would be false.

Solution

adding field.filterValues and form.filterFieldValues to TSF:

form.filterFieldValues(
  'people',
  ({firstName}) => firstName === "Marry"
)

[nx-cloud]

View your CI Pipeline Execution ↗ for commit f5c8c02.

Command	Status	Duration	Result
nx affected --targets=test:sherif,test:knip,tes...	✅ Succeeded	1m 24s	View ↗
nx run-many --target=build --exclude=examples/**	✅ Succeeded	24s	View ↗

---

☁️ Nx Cloud last updated this comment at 2025-06-02 14:35:45 UTC

[pkg-pr-new]

More templates

• @tanstack/form-example-angular-array
• @tanstack/form-example-angular-simple
• @tanstack/form-example-lit-simple
• @tanstack/form-example-lit-ui-libraries
• @tanstack/form-example-react-array
• @tanstack/form-example-react-compiler
• @tanstack/field-errors-from-form-validators
• @tanstack/form-example-react-large-form
• @tanstack/form-example-react-next-server-actions
• @tanstack/form-example-react-query-integration
• @tanstack/form-example-remix
• @tanstack/form-example-react-simple
• @tanstack/form-example-react-standard-schema
• @tanstack/form-example-react-tanstack-start
• @tanstack/form-example-react-ui-libraries
• @tanstack/form-example-solid-array
• @tanstack/form-example-solid-simple
• @tanstack/form-example-svelte-array
• @tanstack/form-example-svelte-simple
• @tanstack/form-example-vue-array
• @tanstack/form-example-vue-simple

@tanstack/angular-form

npm i https://pkg.pr.new/@tanstack/angular-form@1426

@tanstack/form-core

npm i https://pkg.pr.new/@tanstack/form-core@1426

@tanstack/lit-form

npm i https://pkg.pr.new/@tanstack/lit-form@1426

@tanstack/react-form

npm i https://pkg.pr.new/@tanstack/react-form@1426

@tanstack/solid-form

npm i https://pkg.pr.new/@tanstack/solid-form@1426

@tanstack/svelte-form

npm i https://pkg.pr.new/@tanstack/svelte-form@1426

@tanstack/vue-form

npm i https://pkg.pr.new/@tanstack/vue-form@1426

commit: f5c8c02

[codecov]

Codecov Report

Attention: Patch coverage is 87.06897% with 15 lines in your changes missing coverage. Please review.

Project coverage is 88.65%. Comparing base (803f864) to head (f5c8c02).

Files with missing lines	Patch %	Lines
packages/form-core/src/metaHelper.ts	82.71%	13 Missing and 1 partial ⚠️
packages/form-core/src/FormApi.ts	96.77%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1426      +/-   ##
==========================================
- Coverage   89.24%   88.65%   -0.59%     
==========================================
  Files          31       31              
  Lines        1432     1490      +58     
  Branches      366      386      +20     
==========================================
+ Hits         1278     1321      +43     
- Misses        137      151      +14     
- Partials       17       18       +1     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[LeCarbonator]

I think if/when this gets merged, it would be great to rework the Arrays section of the docs to write about swap, insert, push, filter and clear. Thoughts? Should it be somewhere else?

[LeCarbonator]

Oof, it did not like that refactor of metaHelper. I'll get to it later today.

Looks like it's beccause I'm trying to avoid a breaking change. I guess I can add some tests for that