feat: update valibot support (#4415)

Author: logaretm

.changeset/spotty-queens-dress.md

@@ -0,0 +1,5 @@
+---
+'@vee-validate/valibot': patch
+---
+
+feat: upgrade valibot support

docs/package.json

@@ -30,7 +30,7 @@
     "shiki": "^0.14.3",
     "tailwindcss": "^3.3.3",
     "unist-util-visit": "^5.0.0",
-    "valibot": "^0.12.0",
+    "valibot": "^0.13.0",
     "vee-validate": "^4.11.1",
     "vue": "^3.3.0",
     "yup": "^1.2.0",

docs/src/pages/guide/composition-api/typed-schema.mdx

@@ -331,15 +331,15 @@ You can also define default values on your schema directly and it will be picked
 
 ```ts
 import { useForm } from 'vee-validate';
-import { object, string, useDefault, minLength } from 'valibot';
+import { object, string, withDefault, minLength } from 'valibot';
 import { toTypedSchema } from '@vee-validate/valibot';
 
 const { values, handleSubmit } = useForm({
   validationSchema: toTypedSchema(
     object({
-      email: useDefault(string([minLength(1, 'required')]), '[email protected]'),
-      password: useDefault(string([minLength(1, 'required')]), ''),
-      name: useDefault(string(), ''),
+      email: withDefault(string([minLength(1, 'required')]), '[email protected]'),
+      password: withDefault(string([minLength(1, 'required')]), ''),
+      name: withDefault(string(), ''),
     }),
   ),
 });

packages/valibot/package.json

@@ -29,7 +29,7 @@
   ],
   "dependencies": {
     "type-fest": "^4.2.0",
-    "valibot": "^0.12.0",
+    "valibot": "^0.13.0",
     "vee-validate": "4.11.2"
   }
 }

packages/valibot/src/index.ts

@@ -1,10 +1,10 @@
 import { PartialDeep } from 'type-fest';
 import type { TypedSchema, TypedSchemaError } from 'vee-validate';
-import { Output, Input, BaseSchema, safeParseAsync, parse, Issue } from 'valibot';
+import { Output, Input, BaseSchema, BaseSchemaAsync, safeParseAsync, safeParse, Issue } from 'valibot';
 import { normalizeFormPath } from '../../shared';
 
 export function toTypedSchema<
-  TSchema extends BaseSchema,
+  TSchema extends BaseSchema | BaseSchemaAsync,
   TOutput = Output<TSchema>,
   TInput = PartialDeep<Input<TSchema>>,
 >(valibotSchema: TSchema): TypedSchema<TInput, TOutput> {
@@ -20,18 +20,20 @@ export function toTypedSchema<
       }
 
       const errors: Record<string, TypedSchemaError> = {};
-      processIssues(result.error.issues, errors);
+      processIssues(result.issues, errors);
 
       return {
         errors: Object.values(errors),
       };
     },
     cast(values) {
-      try {
-        return parse(valibotSchema, values);
-      } catch {
+      if (valibotSchema.async) {
         return values;
       }
+
+      const result = safeParse(valibotSchema, values);
+
+      return result.success ? result.data : values;
     },
   };
 

packages/valibot/tests/valibot.spec.ts

@@ -1,6 +1,6 @@
 import { Ref } from 'vue';
 import { useField, useForm } from '@/vee-validate';
-import { string, minLength, email as emailV, object, coerce, any, number, useDefault, optional } from 'valibot';
+import { string, minLength, email as emailV, object, coerce, any, number, withDefault, optional } from 'valibot';
 import { toTypedSchema } from '@/valibot';
 import { mountWithHoc, flushPromises, setValue } from '../../vee-validate/tests/helpers';
 
@@ -227,7 +227,7 @@ describe('valibot', () => {
       setup() {
         const schema = toTypedSchema(
           object({
-            age: useDefault(number(), 11),
+            age: withDefault(number(), 11),
           }),
         );
 
@@ -261,13 +261,13 @@ describe('valibot', () => {
       setup() {
         const schema = toTypedSchema(
           object({
-            name: useDefault(string(), 'test'),
-            age: useDefault(number(), 11),
+            name: withDefault(string(), 'test'),
+            age: withDefault(number(), 11),
             unknownKey: optional(string()),
-            object: useDefault(
+            object: withDefault(
               object({
                 nestedKey: optional(string()),
-                nestedDefault: useDefault(string(), 'nested'),
+                nestedDefault: withDefault(string(), 'nested'),
               }),
               {} as any,
             ),