Skip to content

v4.11.0

Compare
Choose a tag to compare
@logaretm logaretm released this 30 Jul 23:59
· 230 commits to main since this release

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.