From 39bda78cd26b9ef7db8c276186ca474f2d085727 Mon Sep 17 00:00:00 2001
From: Alex Liu <dsa1314@gmail.com>
Date: Mon, 4 Mar 2024 09:42:41 +0800
Subject: [PATCH] chore: add example about `valibot` to readme

---
 packages/resolvers/README.md | 60 ++++++++++++++++++++++++++++++++++++
 1 file changed, 60 insertions(+)

diff --git a/packages/resolvers/README.md b/packages/resolvers/README.md
index a6502bf..a09acc2 100644
--- a/packages/resolvers/README.md
+++ b/packages/resolvers/README.md
@@ -6,6 +6,65 @@ npm install @vorms/resolvers
 
 ## Quickstart
 
+### [Valibot](https://github.com/fabian-hiller/valibot)
+
+The modular and type safe schema library for validating structural data 🤖
+
+```vue
+<script setup lang="ts">
+import { useForm } from '@vorms/core';
+import { valibotResolver } from '@vorms/resolvers/valibot';
+import { object, string, minLength } from 'valibot'
+
+const { register, errors, handleSubmit } = useForm({
+  initialValues: {
+    account: '',
+    password: '',
+  },
+  validate: valibotResolver(object({
+    account: string([minLength()]),
+    password: string([minLength()])
+  })),
+  onSubmit(values) {
+    alert(JSON.stringify(values, null, 2));
+  },
+});
+
+const { value: account, attrs: accountAttrs } = register('account');
+const { value: password, attrs: passwordAttrs } = register('password');
+</script>
+
+<template>
+  <form @submit="handleSubmit">
+    <div>
+      <input
+        v-model="account"
+        type="text"
+        placeholder="Account"
+        v-bind="accountAttrs"
+      />
+      <div v-show="'account' in errors">
+        {{ errors.account }}
+      </div>
+    </div>
+    <div>
+      <input
+        v-model="password"
+        type="password"
+        placeholder="Password"
+        v-bind="passwordAttrs"
+      />
+      <div v-show="'password' in errors">
+        {{ errors.password }}
+      </div>
+    </div>
+    <div>
+      <input type="submit" />
+    </div>
+  </form>
+</template>
+```
+
 ### [Yup](https://github.com/jquense/yup)
 
 Dead simple Object schema validation
@@ -126,6 +185,7 @@ const { value: password, attrs: passwordAttrs } = register('password');
 
 ## Examples
 
+- [Validate With Valibot](https://stackblitz.com/edit/vorms-validate-with-valibot?file=src%2FApp.vue)
 - [Validate With Yup](https://stackblitz.com/edit/vorms-validate-with-yup?file=src%2FApp.vue)
 - [Validate With Zod](https://stackblitz.com/edit/vorms-validate-with-zod?file=src%2FApp.vue)