fix(vue-form): keep field slot state reactive

[anguiao]

Summary

• Keep useField().state as a getter so Vue renders read the latest computed field state
• Add a vue-form regression test for the Field scoped slot state
• Add a patch changeset for @tanstack/vue-form

Root cause

useField returned state: fieldState.value, which captured the field state object once during setup. field.state stayed reactive through its getter, but the state value passed to the Field scoped slot could become stale after value or meta updates.

Fixes #2191

Checks

• pnpm --filter @tanstack/vue-form test:lib -- --run
• pnpm --filter @tanstack/vue-form test:eslint
• pnpm --filter @tanstack/vue-form build

I also verified that the new regression test fails on main before this fix.

Summary by CodeRabbit

• Bug Fixes
  • Fixed an issue where the Field component's scoped slot state wasn't updating reactively when field values or metadata changed. The slot state now properly reflects all field updates in real-time.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 3ef1e5b6-9b6f-422e-95b3-960696ae4e8d

📥 Commits

Reviewing files that changed from the base of the PR and between 6f6f85c and b299631.

📒 Files selected for processing (3)

• .changeset/vue-form-field-slot-state.md
• packages/vue-form/src/useField.tsx
• packages/vue-form/tests/useField.test.tsx

---

📝 Walkthrough

Walkthrough

Fixes the regression in version 1.32.0 where Field scoped slot state became stale after field updates. useField now returns state as a getter that dynamically reads fieldState.value, ensuring slot consumers see reactive updates. Includes comprehensive test coverage validating state reactivity after changes, resets, and meta updates.

Changes

Field slot state reactivity fix

Layer / File(s)	Summary
State getter implementation and release note packages/vue-form/src/useField.tsx, .changeset/vue-form-field-slot-state.md	useField now returns state as a getter function that reads fieldState.value on access, replacing the snapshot value pattern. The patch release fix is documented in the changeset.
Slot state reactivity test coverage packages/vue-form/tests/useField.test.tsx	New test validates that Field slot state updates reactively after field.handleChange, form.reset, and form.setFieldMeta operations, ensuring slot consumers receive current field values and meta.

Estimated Code Review Effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Poem

🐰 A slot was frozen in time, oh no!
But now the getter makes the state flow,
Each access finds the truth so bright,
The Field updates—reactivity's right! ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'fix(vue-form): keep field slot state reactive' clearly and concisely describes the main change: making the field slot state reactive as a fix.
Description check	✅ Passed	The PR description covers the changes made, root cause analysis, verification steps, and includes a link to the fixed issue #2191.
Linked Issues check	✅ Passed	The code changes directly address issue #2191 by converting useField().state to a getter, adding the regression test, and including the changeset as specified in the issue requirements.
Out of Scope Changes check	✅ Passed	All changes are directly related to the PR objective: modifying useField to expose state as a getter, adding a regression test, and including a changeset entry for the fix.

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

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[Copilot]

Pull request overview

This PR fixes stale Vue Field scoped slot state by returning useField().state through a getter, so render-time reads observe the latest computed field state.

Changes:

• Exposes useField().state as a getter instead of a setup-time snapshot.
• Adds a regression test covering slot state.value and state.meta.errorMap.onServer updates.
• Adds a patch changeset for @tanstack/vue-form.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated no comments.

File	Description
packages/vue-form/src/useField.tsx	Updates the returned state property to resolve the latest fieldState.value.
packages/vue-form/tests/useField.test.tsx	Adds regression coverage for reactive scoped slot state after typing, reset, and meta updates.
.changeset/vue-form-field-slot-state.md	Records a patch release note for the Vue form fix.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.