{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "auth-06",
  "dependencies": [
    "lucide-react",
    "react-icons"
  ],
  "registryDependencies": [
    "button",
    "input",
    "separator"
  ],
  "files": [
    {
      "path": "src/components/watermelon-ui/auth-06.tsx",
      "content": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Separator } from \"@/components/ui/separator\";\nimport { MdRocketLaunch, MdArrowForward } from \"react-icons/md\";\n\nexport interface SocialProviderItem {\n  /** Display label for the provider button */\n  label: string;\n  /** React node for the provider icon */\n  icon: React.ReactNode;\n  /** Callback fired when this provider button is clicked */\n  onClick?: () => void;\n}\n\nexport interface LegalLink {\n  /** Display text */\n  text: string;\n  /** URL or callback */\n  href?: string;\n  onClick?: () => void;\n}\n\nexport interface Auth6Props {\n  /** Brand icon rendered inside the logo mark */\n  brandIcon?: React.ReactNode;\n  /** Main heading text */\n  heading?: string;\n  /** Supporting description below the heading */\n  description?: string;\n  /** Array of social/OAuth providers to display */\n  socialProviders?: SocialProviderItem[];\n  /** Text shown in the divider between social buttons and email */\n  dividerText?: string;\n  /** Placeholder for the email input */\n  emailPlaceholder?: string;\n  /** Label for the email submit button */\n  emailButtonLabel?: string;\n  /** Prefix text before the legal links */\n  legalPrefix?: string;\n  /** Array of legal links (e.g. Terms, Privacy) */\n  legalLinks?: LegalLink[];\n  /** Conjunction between legal links (e.g. \"and\") */\n  legalConjunction?: string;\n  /** Callback when email form is submitted */\n  onEmailSubmit?: (email: string) => void;\n}\n\nexport function Auth6({\n  brandIcon,\n  heading = \"Get started with Orbit\",\n  description = \"Launch your next project in seconds. Sign up or log in below.\",\n  socialProviders = [],\n  dividerText = \"or\",\n  emailPlaceholder = \"your@email.com\",\n  emailButtonLabel = \"Continue with email\",\n  legalPrefix = \"By proceeding, you accept our\",\n  legalLinks = [\n    { text: \"Terms of Service\", href: \"#\" },\n    { text: \"Privacy Policy\", href: \"#\" },\n  ],\n  legalConjunction = \"and the\",\n  onEmailSubmit,\n}: Auth6Props) {\n  const [email, setEmail] = useState(\"\");\n\n  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    onEmailSubmit?.(email);\n  };\n\n  return (\n    <div className=\"bg-background flex min-h-screen w-full items-center justify-center px-4 py-16\">\n      <div className=\"flex w-full max-w-sm flex-col items-center gap-6\">\n        <div className=\"bg-primary flex h-14 w-14 items-center justify-center rounded-2xl\">\n          {brandIcon ?? (\n            <MdRocketLaunch className=\"text-primary-foreground h-7 w-7\" />\n          )}\n        </div>\n\n        <div className=\"space-y-2 text-center\">\n          <h1 className=\"text-foreground text-2xl font-bold tracking-tight sm:text-3xl\">\n            {heading}\n          </h1>\n          <p className=\"text-muted-foreground text-sm leading-relaxed\">\n            {description}\n          </p>\n        </div>\n\n        {socialProviders.length > 0 && (\n          <div className=\"flex w-full flex-wrap items-center justify-center gap-2.5\">\n            {socialProviders.map((provider) => (\n              <Button\n                key={provider.label}\n                variant=\"outline\"\n                type=\"button\"\n                className=\"bg-muted h-10 cursor-pointer gap-2 rounded-full px-5 text-sm font-medium shadow-[inset_0_1px_0_0_rgba(255,255,255,1),0px_0px_0px_0.5px_rgba(0,0,0,0.08),0px_1px_2px_-1px_rgba(0,0,0,0.08),0px_2px_4px_0px_rgba(0,0,0,0.08)] dark:shadow-[inset_0_1px_0_0_rgba(255,255,255,0.25),0px_0px_0px_0.5px_rgba(255,255,255,0.03),0px_1px_2px_-1px_rgba(255,255,255,0.08),0px_2px_4px_0px_rgba(255,255,255,0.08)]\"\n                onClick={provider.onClick}\n              >\n                {provider.icon}\n                {provider.label}\n              </Button>\n            ))}\n          </div>\n        )}\n        {socialProviders.length > 0 && (\n          <div className=\"flex w-full items-center gap-4\">\n            <Separator className=\"flex-1\" />\n            <span className=\"text-muted-foreground shrink-0 text-sm font-medium tracking-widest\">\n              {dividerText}\n            </span>\n            <Separator className=\"flex-1\" />\n          </div>\n        )}\n\n        <form onSubmit={handleSubmit} className=\"flex w-full flex-col gap-3\">\n          <Input\n            id=\"auth6-email\"\n            type=\"email\"\n            placeholder={emailPlaceholder}\n            autoComplete=\"email\"\n            value={email}\n            onChange={(e) => setEmail(e.target.value)}\n            className=\"bg-muted focus-visible:ring-primary/20 focus-visible:border-primary/50 h-10 rounded-lg text-sm\"\n            required\n          />\n          <Button\n            type=\"submit\"\n            className=\"from-primary to-primary/70 dark:to-primary/50 h-10 w-full cursor-pointer gap-2 rounded-lg bg-gradient-to-b text-sm font-semibold shadow-[inset_0_2px_0_0_rgba(255,255,255,0.15)]\"\n          >\n            {emailButtonLabel}\n            <MdArrowForward className=\"h-4 w-4\" />\n          </Button>\n        </form>\n\n        {legalLinks.length > 0 && (\n          <p className=\"text-muted-foreground max-w-xs text-center text-xs leading-relaxed\">\n            {legalPrefix}{\" \"}\n            {legalLinks.map((link, idx) => (\n              <span key={link.text}>\n                {idx > 0 && <span> {legalConjunction} </span>}\n                <a\n                  href={link.href}\n                  onClick={link.onClick}\n                  className=\"text-foreground hover:text-primary font-medium underline underline-offset-4 transition-colors\"\n                >\n                  {link.text}\n                </a>\n              </span>\n            ))}\n            .\n          </p>\n        )}\n      </div>\n    </div>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/ui/auth-06.tsx"
    }
  ],
  "type": "registry:ui"
}
