arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-27 02:10:40 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(FormField): display multiple errors

Browse Source 
Adds the `errors` and `maxErrors` properties to the FormField component which
allows to display multiple errors. The `maxErrors` prop is used to limit
the number of errors displayed and defaults to 1 for backward
compatibility.

This change is compatible with the `Form` component error's too.

Resolves #2389
This commit is contained in:
Romain Hamel
2025-06-14 17:19:16 +02:00
parent 59c26ec123
commit 5829aebe7d
4 changed files with 103 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
test/components/__snapshots__/FormField.spec.ts.snap
View File

@@ -148,6 +148,59 @@ exports[`FormField > renders with label slot correctly 1`] = `
</div>"
`;
exports[`FormField > renders with maxErrors correctly 1`] = `
"<div class="text-sm">
<div class="">
<!--v-if-->
<!--v-if-->
</div>
<div class="">
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
</div>
</div>"
`;
exports[`FormField > renders with maxErrors false correctly 1`] = `
"<div class="text-sm">
<div class="">
<!--v-if-->
<!--v-if-->
</div>
<div class="">
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
</div>
</div>"
`;
exports[`FormField > renders with maxErrors negative correctly 1`] = `
"<div class="text-sm">
<div class="">
<!--v-if-->
<!--v-if-->
</div>
<div class="">
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
<div id="v-0-0-error" class="mt-2 text-error">This should be visible</div>
</div>
</div>"
`;
exports[`FormField > renders with multiple errors correctly 1`] = `
"<div class="text-sm">
<div class="">
<!--v-if-->
<!--v-if-->
</div>
<div class="">
<div id="v-0-0-error" class="mt-2 text-error">Username is already taken</div>
</div>
</div>"
`;
exports[`FormField > renders with required correctly 1`] = `
"<div class="text-sm">
<div class="">