{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "login-form",
  "type": "registry:block",
  "title": "Login Form",
  "description": "A login form with email and password fields.",
  "files": [
    {
      "path": "registry/alpine/auth/login-form.tsx",
      "content": "import { cn } from \"@/lib/utils\"\nimport { Button } from \"@/registry/alpine/ui/button\"\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n} from \"@/registry/alpine/ui/card\"\nimport { Input } from \"@/registry/alpine/ui/input\"\nimport { Label } from \"@/registry/alpine/ui/label\"\n\nexport function LoginForm({\n  className,\n  ...props\n}: React.ComponentPropsWithoutRef<\"div\">) {\n  return (\n    <div className={cn(\"flex flex-col gap-6\", className)} {...props}>\n      <Card>\n        <CardHeader>\n          <CardTitle>Login or Sign Up</CardTitle>\n        </CardHeader>\n        <CardContent>\n          <form>\n            <div className=\"flex flex-col gap-6\">\n              <div className=\"flex flex-col gap-6\">\n                <div className=\"flex flex-col gap-2\">\n                  <Label htmlFor=\"phone\">Phone number</Label>\n                  <Input\n                    id=\"phone\"\n                    type=\"tel\"\n                    placeholder=\"+1 (123) 456-7890\"\n                    required\n                  />\n                  <div className=\"text-sm text-muted-foreground\">\n                    We will send a text message to verify your phone number.\n                  </div>\n                </div>\n                <Button type=\"submit\" className=\"w-full\">\n                  Login\n                </Button>\n              </div>\n              <div className=\"relative text-center text-sm after:absolute after:inset-0 after:top-1/2 after:z-0 after:flex after:items-center after:border-t after:border-border\">\n                <span className=\"relative z-10 bg-background px-2 text-muted-foreground\">\n                  Or\n                </span>\n              </div>\n              <div className=\"flex flex-col gap-4\">\n                <Button variant=\"outline\" className=\"w-full\">\n                  Continue with Apple\n                </Button>\n                <Button variant=\"outline\" className=\"w-full\">\n                  Continue with Google\n                </Button>\n                <Button variant=\"outline\" className=\"w-full\">\n                  Continue with Email\n                </Button>\n                <Button variant=\"outline\" className=\"w-full\">\n                  Continue with Facebook\n                </Button>\n              </div>\n            </div>\n          </form>\n        </CardContent>\n      </Card>\n      <div className=\"text-balance text-center text-xs text-muted-foreground [&_a]:underline [&_a]:underline-offset-4 [&_a]:hover:text-primary  \">\n        By clicking continue, you agree to our <a href=\"#\">Terms of Service</a>{\" \"}\n        and <a href=\"#\">Privacy Policy</a>.\n      </div>\n    </div>\n  )\n}\n",
      "type": "registry:component"
    }
  ]
}