fix(Form): improve errors type

[zAlweNy26]

🔗 Linked issue

None

❓ Type of change

• 📖 Documentation (updates to the documentation or readme)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

I was using the Form component and needed the fields IDs.
I saw this from the Vue DevTools:

but the interface was not aware of it.

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 0347367d-94f6-4723-8b21-4233508ac7ee

📥 Commits

Reviewing files that changed from the base of the PR and between d1bd40c and 17730ce.

📒 Files selected for processing (2)

• docs/content/docs/2.components/form.md
• src/runtime/components/Form.vue

✅ Files skipped from review due to trivial changes (2)

• src/runtime/components/Form.vue
• docs/content/docs/2.components/form.md

---

📝 Walkthrough

Walkthrough

The changes update the Form component’s public API types and documentation. The errors ref and getErrors(...) return type were changed from FormError[] to FormErrorWithId[]. The interaction-tracking properties dirtyFields, touchedFields, and blurredFields were changed from DeepReadonly<Set<keyof T>> to ReadonlySet<DeepReadonly<keyof T>>. The Form slot prop typing was updated to reflect FormErrorWithId[] for errors.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title clearly describes the main change: updating error types in the Form component to include ID information, which is the core objective of this PR.
Description check	✅ Passed	The description is directly related to the changeset, explaining the motivation (needing field IDs from Vue DevTools) and confirming documentation was updated accordingly.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ 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.}

[coderabbitai]

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

src/runtime/types/form.ts (1)

17-19: ⚠️ Potential issue | 🟡 Minor

Minor inconsistency with documentation types.

The type definition here uses ReadonlySet<DeepReadonly<keyof FormData<S, false>>>, but the documentation in form.md shows DeepReadonly<Set<keyof T>>. While semantically similar in intent (both aim for read-only access), the actual types differ:

• ReadonlySet<X> - a set with read-only interface
• DeepReadonly<Set<X>> - a deeply frozen set

Consider aligning the documentation with the actual type signature for accuracy.

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@src/runtime/types/form.ts` around lines 17 - 19, The types for dirtyFields,
touchedFields, and blurredFields currently use ReadonlySet<DeepReadonly<keyof
FormData<S, false>>> which differs from the documentation's
DeepReadonly<Set<keyof T>>; update either the docs or the type to match: either
change the declarations (dirtyFields, touchedFields, blurredFields) to
DeepReadonly<Set<keyof FormData<S, false>>> or update form.md to show
ReadonlySet<DeepReadonly<keyof T>>> so the signature and docs align; reference
the type names DeepReadonly, ReadonlySet, Set and the symbols dirtyFields,
touchedFields, blurredFields and FormData when making the change.

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Outside diff comments:
In `@src/runtime/types/form.ts`:
- Around line 17-19: The types for dirtyFields, touchedFields, and blurredFields
currently use ReadonlySet<DeepReadonly<keyof FormData<S, false>>> which differs
from the documentation's DeepReadonly<Set<keyof T>>; update either the docs or
the type to match: either change the declarations (dirtyFields, touchedFields,
blurredFields) to DeepReadonly<Set<keyof FormData<S, false>>> or update form.md
to show ReadonlySet<DeepReadonly<keyof T>>> so the signature and docs align;
reference the type names DeepReadonly, ReadonlySet, Set and the symbols
dirtyFields, touchedFields, blurredFields and FormData when making the change.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 18eed3f6-1386-4405-baa5-b12dbd80b5a8

📥 Commits

Reviewing files that changed from the base of the PR and between 566fbee and cd1a78f.

📒 Files selected for processing (2)

• docs/content/docs/2.components/form.md
• src/runtime/types/form.ts

[pkg-pr-new]

npm i https://pkg.pr.new/@nuxt/ui@6208

commit: 17730ce

[benjamincanac]

@zAlweNy26 Sorry for the delay on this, should we also update this type in Form default slot? 🤔

[zAlweNy26]

@benjamincanac the errors are already defined with FormErrorWithId interface as I see in the Form component code

[benjamincanac]

I'm talking about the slots:

export interface FormSlots {
  default?(props: { errors: FormError[], loading: boolean }): VNode[]
}  

[zAlweNy26]

Sorry @benjamincanac, I missed it.
Fixed

[benjamincanac]

Thanks and sorry for the delay! 😊