Niklas/shadcn-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: update demo abit

Browse Source
This commit is contained in:
zernonia 2024-02-06 10:05:41 +08:00
parent 98f8281235
commit f96a756175
2 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
apps/www/src/lib/registry/default/example/PinInputFormDemo.vue
View File

@ -19,7 +19,7 @@ import {
import { toast } from '@/lib/registry/default/ui/toast'
const formSchema = toTypedSchema(z.object({
pin: z.array(z.string().min(1)).length(5),
pin: z.array(z.coerce.string()).length(5, { message: 'Invalid input' }),
}))
const { handleSubmit, setValues } = useForm({
@ -43,7 +43,7 @@ const handleComplete = (e: string[]) => console.log(e.join(''))
<form class="w-2/3 space-y-6 mx-auto" @submit="onSubmit">
<FormField v-slot="{ componentField }" name="pin">
<FormItem>
<FormLabel>Otp</FormLabel>
<FormLabel>OTP</FormLabel>
<FormControl>
<PinInput
id="pin-input"
@ -55,7 +55,7 @@ const handleComplete = (e: string[]) => console.log(e.join(''))
@complete="handleComplete"
@update:model-value="(arrStr) => {
setValues({
pin: arrStr,
pin: arrStr.filter(Boolean),
})
}"
>

6
apps/www/src/lib/registry/new-york/example/PinInputFormDemo.vue
View File

@ -19,7 +19,7 @@ import {
import { toast } from '@/lib/registry/new-york/ui/toast'
const formSchema = toTypedSchema(z.object({
pin: z.array(z.string().min(1)).length(5),
pin: z.array(z.coerce.string()).length(5, { message: 'Invalid input' }),
}))
const { handleSubmit, setValues } = useForm({
@ -43,7 +43,7 @@ const handleComplete = (e: string[]) => console.log(e.join(''))
<form class="w-2/3 space-y-6 mx-auto" @submit="onSubmit">
<FormField v-slot="{ componentField }" name="pin">
<FormItem>
<FormLabel>Otp</FormLabel>
<FormLabel>OTP</FormLabel>
<FormControl>
<PinInput
id="pin-input"
@ -55,7 +55,7 @@ const handleComplete = (e: string[]) => console.log(e.join(''))
@complete="handleComplete"
@update:model-value="(arrStr) => {
setValues({
pin: arrStr,
pin: arrStr.filter(Boolean),
})
}"
>