{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "signup-form",
  "description": "User registration form with email and password",
  "dependencies": [
    "react-hook-form",
    "@hookform/resolvers",
    "zod",
    "sonner"
  ],
  "registryDependencies": [
    "https://formscn.space/r/auth-client.json",
    "https://formscn.space/r/button.json",
    "https://formscn.space/r/input.json",
    "https://formscn.space/r/label.json"
  ],
  "files": [
    {
      "path": "src/registry/default/templates/signup-form.tsx",
      "content": "\"use client\";\n\nimport { useForm, Controller } from \"react-hook-form\";\nimport { zodResolver } from \"@hookform/resolvers/zod\";\nimport * as z from \"zod\";\nimport { Button } from \"@/components/ui/button\";\nimport { Card, CardContent, CardDescription, CardHeader, CardTitle } from \"@/components/ui/card\";\nimport { Input } from \"@/components/ui/input\";\nimport { Label } from \"@/components/ui/label\";\nimport { toast } from \"sonner\";\nimport { Checkbox } from \"@/components/ui/checkbox\";\nimport { signUp } from \"@/lib/auth-client\";\n\nconst formSchema = z.object({\n  fullName: z.string().min(1, \"Full Name is required\"),\n  email: z.string().email(\"Invalid email address\").min(1, \"Email Address is required\"),\n  password: z.string().min(1, \"Password is required\"),\n  confirmPassword: z.string().min(1, \"Confirm Password is required\"),\n  agreeToTerms: z.boolean().refine((val) => val === true, { message: \"You must agree to I agree to the terms and conditions\" }),\n});\n\ntype FormValues = z.infer<typeof formSchema>;\nexport function SignupFormForm() {\n  const form = useForm<FormValues>({\n    resolver: zodResolver(formSchema),\n    defaultValues: {\n      fullName: \"\",\n      email: \"\",\n      password: \"\",\n      confirmPassword: \"\",\n      agreeToTerms: false,\n    },\n  });\n\n  const onSubmit = async (data: FormValues) => {\n    await signUp.email({\n      email: data.email,\n      password: data.password,\n      name: data.fullName,\n      callbackURL: \"/dashboard\",\n      fetchOptions: {\n        onResponse: () => {\n          // toast.loading(\"Creating account...\");\n        },\n        onRequest: () => {\n          toast.loading(\"Creating account...\");\n        },\n        onSuccess: () => {\n          toast.dismiss();\n          toast.success(\"Account created successfully!\");\n        },\n        onError: (ctx) => {\n          toast.dismiss();\n          toast.error(ctx.error.message);\n        },\n      },\n    });\n  };\n\n  return (\n    <Card className=\"w-full max-w-md mx-auto\">\n      <CardHeader>\n        <CardTitle>Signup Form</CardTitle>\n        <CardDescription>User registration with email and password</CardDescription>\n      </CardHeader>\n      <CardContent>\n        <form onSubmit={form.handleSubmit(onSubmit)} className=\"space-y-4\">\n          <div className=\"space-y-2\">\n            <Label htmlFor=\"fullName\">Full Name</Label>\n            <Input\n              id=\"fullName\"\n              type=\"text\"\n              placeholder=\"John Doe\"\n              {...form.register(\"fullName\")}\n            />\n            {form.formState.errors.fullName && (\n            <p className=\"text-sm text-destructive\">{form.formState.errors.fullName.message}</p>\n          )}\n          </div>\n\n          <div className=\"space-y-2\">\n            <Label htmlFor=\"email\">Email Address</Label>\n            <Input\n              id=\"email\"\n              type=\"email\"\n              placeholder=\"john@example.com\"\n              {...form.register(\"email\")}\n            />\n            {form.formState.errors.email && (\n            <p className=\"text-sm text-destructive\">{form.formState.errors.email.message}</p>\n          )}\n          </div>\n\n          <div className=\"space-y-2\">\n            <Label htmlFor=\"password\">Password</Label>\n            <Input\n              id=\"password\"\n              type=\"password\"\n              placeholder=\"••••••••\"\n              {...form.register(\"password\")}\n            />\n            {form.formState.errors.password && (\n            <p className=\"text-sm text-destructive\">{form.formState.errors.password.message}</p>\n          )}\n          <p className=\"text-sm text-muted-foreground\">Must be at least 8 characters</p>\n          </div>\n\n          <div className=\"space-y-2\">\n            <Label htmlFor=\"confirmPassword\">Confirm Password</Label>\n            <Input\n              id=\"confirmPassword\"\n              type=\"password\"\n              placeholder=\"••••••••\"\n              {...form.register(\"confirmPassword\")}\n            />\n            {form.formState.errors.confirmPassword && (\n            <p className=\"text-sm text-destructive\">{form.formState.errors.confirmPassword.message}</p>\n          )}\n          </div>\n\n          <div className=\"flex items-center space-x-2\">\n            <Controller\n              control={form.control}\n              name=\"agreeToTerms\"\n              render={({ field }) => (\n                <Checkbox\n                  id=\"agreeToTerms\"\n                  checked={field.value}\n                  onCheckedChange={field.onChange}\n                />\n              )}\n            />\n            <Label htmlFor=\"agreeToTerms\" className=\"font-normal\">\n              I agree to the terms and conditions\n            </Label>\n            {form.formState.errors.agreeToTerms && (\n            <p className=\"text-sm text-destructive\">{form.formState.errors.agreeToTerms.message}</p>\n          )}\n          </div>\n\n          <Button type=\"submit\" className=\"w-full\">Submit</Button>\n        </form>\n      </CardContent>\n    </Card>\n  );\n}",
      "type": "registry:block",
      "target": "components/forms/signup-form.tsx"
    }
  ],
  "type": "registry:block"
}