Skip to content

feat(core): add form listners for reset#2102

Open
harry-whorlow wants to merge 5 commits intomainfrom
reset-listeners
Open

feat(core): add form listners for reset#2102
harry-whorlow wants to merge 5 commits intomainfrom
reset-listeners

Conversation

@harry-whorlow
Copy link
Copy Markdown
Contributor

@harry-whorlow harry-whorlow commented Mar 31, 2026

adds form listeners for the reset event

Summary by CodeRabbit

  • New Features

    • Added support for onReset listener callbacks on forms and fields to handle reset events
    • Added a new reset method to the Field API
    • Extended listener cause types to include 'reset' and 'unmount' as additional event triggers
  • Documentation

    • Updated Angular, React, and Vue guides to document the new onReset listener event
  • Tests

    • Added tests verifying form- and field-level onReset behavior and payloads

@harry-whorlow
Copy link
Copy Markdown
Contributor Author

relates to #1570

@nx-cloud
Copy link
Copy Markdown

nx-cloud bot commented Mar 31, 2026

View your CI Pipeline Execution ↗ for commit 4b32346

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

☁️ Nx Cloud last updated this comment at 2026-03-31 16:13:11 UTC

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Mar 31, 2026

🚀 Changeset Version Preview

1 package(s) bumped directly, 12 bumped as dependents.

🟨 Minor bumps

Package Version Reason
@tanstack/form-core 1.28.6 → 1.29.0 Changeset
@tanstack/angular-form 1.28.6 → 1.29.0 Dependent
@tanstack/react-form 1.28.6 → 1.29.0 Dependent
@tanstack/react-form-nextjs 1.28.6 → 1.29.0 Dependent
@tanstack/react-form-remix 1.28.6 → 1.29.0 Dependent
@tanstack/react-form-start 1.28.6 → 1.29.0 Dependent
@tanstack/solid-form 1.28.6 → 1.29.0 Dependent
@tanstack/svelte-form 1.28.6 → 1.29.0 Dependent
@tanstack/vue-form 1.28.6 → 1.29.0 Dependent

🟩 Patch bumps

Package Version Reason
@tanstack/form-devtools 0.2.20 → 0.2.21 Dependent
@tanstack/lit-form 1.23.26 → 1.23.27 Dependent
@tanstack/react-form-devtools 0.2.20 → 0.2.21 Dependent
@tanstack/solid-form-devtools 0.2.20 → 0.2.21 Dependent

@coderabbitai
Copy link
Copy Markdown

coderabbitai bot commented Mar 31, 2026

📝 Walkthrough

Walkthrough

This PR adds reset listener support: it introduces onReset for form- and field-level listeners, adds a reset method on FieldApi, and expands the ListenerCause union to include 'reset' and 'unmount'.

Changes

Cohort / File(s) Summary
Core APIs
packages/form-core/src/FieldApi.ts, packages/form-core/src/FormApi.ts, packages/form-core/src/types.ts
Added optional onReset callbacks to FieldListeners and FormListeners; implemented FieldApi.reset() which calls form.resetField(...) and the field onReset listener; updated FormApi.reset() to call form-level onReset; expanded ListenerCause to include 'reset' and 'unmount'.
Tests
packages/form-core/tests/FieldApi.spec.ts, packages/form-core/tests/FormApi.spec.ts
Added tests verifying field.reset() triggers field onReset with the default value and fieldApi, and that form.reset() invokes form-level onReset with formApi (and does not call field onReset when calling form.reset() directly).
Docs & Changeset
.changeset/reset-listeners.md, docs/framework/angular/guides/listeners.md, docs/framework/react/guides/listeners.md, docs/framework/vue/guides/listeners.md
Documented the new onReset listener in framework guides and added a changeset entry for the package bump.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐇 I twitch my whiskers, ears alert and bright,
OnReset whispers through field and form tonight,
A gentle hop resets each value true,
Listeners wake, the callbacks hum anew,
— a rabbit cheers for fresh starts, light as dew.

🚥 Pre-merge checks | ✅ 1 | ❌ 2

❌ Failed checks (2 warnings)

Check name Status Explanation Resolution
Title check ⚠️ Warning The title contains a typo: 'listners' should be 'listeners'. This spelling error in the title undermines its clarity and professionalism. Correct the typo in the PR title from 'listners' to 'listeners' so it reads: 'feat(core): add form listeners for reset'.
Description check ⚠️ Warning The PR description is incomplete and does not follow the required template structure. It is missing the '🎯 Changes' section with detailed explanation and motivation, the '✅ Checklist' section, and the '🚀 Release Impact' section. Complete the PR description by following the template: add detailed changes explanation, check the Contributing guide and testing steps, and confirm changeset generation or docs-only status.
✅ Passed checks (1 passed)
Check name Status Explanation
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch reset-listeners

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new bot commented Mar 31, 2026

More templates

@tanstack/angular-form

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

@tanstack/form-core

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

@tanstack/form-devtools

npm i https://pkg.pr.new/@tanstack/form-devtools@2102

@tanstack/lit-form

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

@tanstack/react-form

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

@tanstack/react-form-devtools

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

@tanstack/react-form-nextjs

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

@tanstack/react-form-remix

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

@tanstack/react-form-start

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

@tanstack/solid-form

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

@tanstack/solid-form-devtools

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

@tanstack/svelte-form

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

@tanstack/vue-form

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

commit: 4b32346

@sentry
Copy link
Copy Markdown

sentry bot commented Mar 31, 2026

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 90.26%. Comparing base (6892ed0) to head (4b32346).
⚠️ Report is 161 commits behind head on main.

Additional details and impacted files
@@            Coverage Diff             @@
##             main    #2102      +/-   ##
==========================================
- Coverage   90.35%   90.26%   -0.09%     
==========================================
  Files          38       49      +11     
  Lines        1752     2045     +293     
  Branches      444      532      +88     
==========================================
+ Hits         1583     1846     +263     
- Misses        149      179      +30     
  Partials       20       20              

☔ 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.

@harry-whorlow harry-whorlow marked this pull request as ready for review March 31, 2026 15:54
Copy link
Copy Markdown

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🧹 Nitpick comments (1)
.changeset/reset-listeners.md (1)

5-5: Consider clarifying reset propagation semantics in the release note.

A short note that form.reset() does not invoke field-level onReset (only field.reset() does) would set clearer expectations for users upgrading.

📝 Suggested wording
-Add `onReset` listener support for forms and fields, add `reset` method to `FieldApi`, and expand `ListenerCause` type with `'reset'` and `'unmount'` values
+Add `onReset` listener support for forms and fields, add `reset` method to `FieldApi`, and expand `ListenerCause` type with `'reset'` and `'unmount'` values. Note: field-level `onReset` is triggered by `field.reset()`; `form.reset()` triggers only the form-level `onReset`.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In @.changeset/reset-listeners.md at line 5, The release note is unclear about
reset propagation: explicitly state that calling form.reset() will not trigger
field-level onReset listeners and that only calling field.reset() invokes those
field-level onReset handlers; mention the added FieldApi.reset method and the
new ListenerCause union values ('reset' and 'unmount') so readers know to update
expectations and listener handling when upgrading.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@docs/framework/react/guides/listeners.md`:
- Line 23: The docs add global `onReset` but the "Form listeners" section omits
it; update the Form listeners subsection to document `onReset` alongside
`onMount`/`onSubmit` and the propagated `onChange`/`onBlur`. Describe when
`onReset` fires (form reset events), its signature/params, whether it is
propagated to fields, and give a short usage example/notes consistent with
`onSubmit`/`onMount` entries so the global event list and form-level
documentation match.

In `@packages/form-core/src/FieldApi.ts`:
- Around line 11-14: Remove the unused imports getBy and setBy from the import
list in FieldApi.ts: locate the import that currently lists getBy,
getSyncValidatorArray, mergeOpts, setBy and delete getBy and setBy so only used
utilities (e.g., getSyncValidatorArray, mergeOpts) remain; ensure no other
references to getBy or setBy exist in the file before committing.

---

Nitpick comments:
In @.changeset/reset-listeners.md:
- Line 5: The release note is unclear about reset propagation: explicitly state
that calling form.reset() will not trigger field-level onReset listeners and
that only calling field.reset() invokes those field-level onReset handlers;
mention the added FieldApi.reset method and the new ListenerCause union values
('reset' and 'unmount') so readers know to update expectations and listener
handling when upgrading.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 6f949218-a373-4a2f-aab6-b1e7a6e0c763

📥 Commits

Reviewing files that changed from the base of the PR and between 4e7c8a6 and 3b60484.

📒 Files selected for processing (9)
  • .changeset/reset-listeners.md
  • docs/framework/angular/guides/listeners.md
  • docs/framework/react/guides/listeners.md
  • docs/framework/vue/guides/listeners.md
  • packages/form-core/src/FieldApi.ts
  • packages/form-core/src/FormApi.ts
  • packages/form-core/src/types.ts
  • packages/form-core/tests/FieldApi.spec.ts
  • packages/form-core/tests/FormApi.spec.ts

Copy link
Copy Markdown

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@docs/framework/react/guides/listeners.md`:
- Line 16: The header text "Field level events that can be "listened" to are:"
should use standard phrasing and a hyphenated adjective; update the phrase to
"Field-level events that can be listened to are:" by hyphenating "Field-level"
and removing the quotes around listened so the sentence reads naturally; locate
the string "Field level events that can be "listened" to are:" in the
listeners.md content and replace it accordingly.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: a4fed69e-5a25-429f-a760-b27dc28c1881

📥 Commits

Reviewing files that changed from the base of the PR and between 3b60484 and 4b32346.

📒 Files selected for processing (3)
  • .changeset/reset-listeners.md
  • docs/framework/react/guides/listeners.md
  • packages/form-core/src/FieldApi.ts
✅ Files skipped from review due to trivial changes (1)
  • .changeset/reset-listeners.md
🚧 Files skipped from review as they are similar to previous changes (1)
  • packages/form-core/src/FieldApi.ts

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant