Releases: logaretm/vee-validate
v4.11.7
💣 Breaking Changes
- Removed default export from the
@vee-validate/rules
package which caused issues for ESM importing #4470
This only affects you if you are importing all the rules.
Migration:
- import AllRules from '@vee-validate/rules';
+ import * as AllRules from '@vee-validate/rules';
👕 Types
useSetFormValues
now accepts values generic type parameters (#4475) thanks to @ivan-angjelkoski- Exported missing internal types causing a build error #4478 (a1414f6)
🆕 New Features
- Added Joi schema support thanks to @lallenfrancisl (#4463), it was sneaked in a previous release tag but it is being announced here to acknowledge that addition.
- Valibot and Yup schemas now merge their default values with the initial form values, allowing you to use each lib's schema defaults more freely (c372718)
v4.11.6
👕 TypeScript
This release is aimed at resolving #4421
useForm#defineComponentBinds
is now more strict and provides accurate typings for bothmodelValue
andupdate:modeValue
properties. Previously they were not exposed.
Try the following example.
const { defineComponentBinds } = useForm({
validationSchema: toTypedSchema(yup.object({
date: yup.date().required(),
number: yup.number().required(),
string: yup.string().required(),
valueModel: yup.string().required(),
})),
});
const date = defineComponentBinds('date');
const number = defineComponentBinds('number');
const string = defineComponentBinds('string');
const valueModel = defineComponentBinds('valueModel');
v4.11.5
v4.11.4
v4.11.3
v4.11.2
🆕 New features
You can now query fields meta state using isFieldTouched
, isFieldDirty
, and isFieldValid
helpers on useForm
.
const { isFieldDirty } = useForm();
isFieldDirty('myField') // true or false
// or compose it to be reactive:
const isFieldDirty = computed(() => isFieldDirty('myField'));
🐛 Bug Fixes
👕 Types
v4.11.1
v4.11.0
This release contains a couple of new features
🆕 Composition API setters
Added composition functions to set field and form values, meta, and errors from their child components. The functions are:
useSetFieldValue
: sets a field's value.useSetFieldTouched
: sets a field's touched state.useSetFieldError
: sets a field's error message.useSetFormValues
: sets form values.useSetFormTouched
: sets multiple or all fields touched state.useSetFormErrors
: sets form error messages.
🆕 Initial support for Valibot
Valibot is an impressive new schema validation library, mainly it offers Zod-like features at a much less bundle size due to its non-chainable API while still being easy to use and fully typed.
Because of this, vee-validate now supports it as a schema provider using the @vee-validate/valibot
package that exposes the same API function toTypedSchema
that you can use to get TypeScript support into your forms input and output values.
Quick example:
import { useForm } from 'vee-validate';
import { toTypedSchema } from '@vee-validate/valibot';
import { email, string, minLength, object } from 'valibot';
const { errors, values } = useForm({
validationSchema: toTypedSchema(
object({
email: string([minLength(1, 'Email is required'), email()]),
password: string([minLength(6, 'password too short')]),
}),
),
});
Refer to the docs for live examples and more information on typed schemas.