{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "sign-up-1",
  "type": "registry:block",
  "title": "Sign Up 1",
  "description": "Sign-up form with name, email, password and social providers.",
  "registryDependencies": [
    "button",
    "input",
    "label"
  ],
  "files": [
    {
      "path": "app/preview/sign-up/one/page.tsx",
      "content": "import { Logo } from '@/components/logo'\nimport { Button } from '@/components/ui/button'\nimport { Input } from '@/components/ui/input'\nimport { Label } from '@/components/ui/label'\nimport Link from 'next/link'\n\nexport default function LoginPage() {\n    return (\n        <section className=\"flex min-h-screen bg-zinc-50 px-4 py-16 md:py-32 dark:bg-transparent\">\n            <form\n                action=\"\"\n                className=\"bg-card m-auto h-fit w-full max-w-sm rounded-[calc(var(--radius)+.125rem)] border p-0.5 shadow-md dark:[--color-muted:var(--color-zinc-900)]\">\n                <div className=\"p-8 pb-6\">\n                    <div>\n                        <Link\n                            href=\"/\"\n                            aria-label=\"go home\">\n                            <Logo />\n                        </Link>\n                        <h1 className=\"text-title mb-1 mt-4 text-xl font-semibold\">Create a Lyra account</h1>\n                        <p className=\"text-sm\">Welcome! Create an account to get started</p>\n                    </div>\n\n                    <div className=\"mt-6 grid grid-cols-2 gap-3\">\n                        <Button\n                            type=\"button\"\n                            variant=\"outline\">\n                            <svg\n                                xmlns=\"http://www.w3.org/2000/svg\"\n                                width=\"0.98em\"\n                                height=\"1em\"\n                                viewBox=\"0 0 256 262\">\n                                <path\n                                    fill=\"#4285f4\"\n                                    d=\"M255.878 133.451c0-10.734-.871-18.567-2.756-26.69H130.55v48.448h71.947c-1.45 12.04-9.283 30.172-26.69 42.356l-.244 1.622l38.755 30.023l2.685.268c24.659-22.774 38.875-56.282 38.875-96.027\"></path>\n                                <path\n                                    fill=\"#34a853\"\n                                    d=\"M130.55 261.1c35.248 0 64.839-11.605 86.453-31.622l-41.196-31.913c-11.024 7.688-25.82 13.055-45.257 13.055c-34.523 0-63.824-22.773-74.269-54.25l-1.531.13l-40.298 31.187l-.527 1.465C35.393 231.798 79.49 261.1 130.55 261.1\"></path>\n                                <path\n                                    fill=\"#fbbc05\"\n                                    d=\"M56.281 156.37c-2.756-8.123-4.351-16.827-4.351-25.82c0-8.994 1.595-17.697 4.206-25.82l-.073-1.73L15.26 71.312l-1.335.635C5.077 89.644 0 109.517 0 130.55s5.077 40.905 13.925 58.602z\"></path>\n                                <path\n                                    fill=\"#eb4335\"\n                                    d=\"M130.55 50.479c24.514 0 41.05 10.589 50.479 19.438l36.844-35.974C195.245 12.91 165.798 0 130.55 0C79.49 0 35.393 29.301 13.925 71.947l42.211 32.783c10.59-31.477 39.891-54.251 74.414-54.251\"></path>\n                            </svg>\n                            <span>Google</span>\n                        </Button>\n                        <Button\n                            type=\"button\"\n                            variant=\"outline\">\n                            <svg\n                                xmlns=\"http://www.w3.org/2000/svg\"\n                                width=\"1em\"\n                                height=\"1em\"\n                                viewBox=\"0 0 256 256\">\n                                <path\n                                    fill=\"#f1511b\"\n                                    d=\"M121.666 121.666H0V0h121.666z\"></path>\n                                <path\n                                    fill=\"#80cc28\"\n                                    d=\"M256 121.666H134.335V0H256z\"></path>\n                                <path\n                                    fill=\"#00adef\"\n                                    d=\"M121.663 256.002H0V134.336h121.663z\"></path>\n                                <path\n                                    fill=\"#fbbc09\"\n                                    d=\"M256 256.002H134.335V134.336H256z\"></path>\n                            </svg>\n                            <span>Microsoft</span>\n                        </Button>\n                    </div>\n\n                    <hr className=\"my-4 border-dashed\" />\n\n                    <div className=\"space-y-5\">\n                        <div className=\"grid grid-cols-2 gap-3\">\n                            <div className=\"space-y-2\">\n                                <Label\n                                    htmlFor=\"firstname\"\n                                    className=\"block text-sm\">\n                                    Firstname\n                                </Label>\n                                <Input\n                                    type=\"text\"\n                                    required\n                                    name=\"firstname\"\n                                    id=\"firstname\"\n                                />\n                            </div>\n                            <div className=\"space-y-2\">\n                                <Label\n                                    htmlFor=\"lastname\"\n                                    className=\"block text-sm\">\n                                    Lastname\n                                </Label>\n                                <Input\n                                    type=\"text\"\n                                    required\n                                    name=\"lastname\"\n                                    id=\"lastname\"\n                                />\n                            </div>\n                        </div>\n\n                        <div className=\"space-y-2\">\n                            <Label\n                                htmlFor=\"email\"\n                                className=\"block text-sm\">\n                                Username\n                            </Label>\n                            <Input\n                                type=\"email\"\n                                required\n                                name=\"email\"\n                                id=\"email\"\n                            />\n                        </div>\n\n                        <div className=\"space-y-2\">\n                            <Label\n                                htmlFor=\"pwd\"\n                                className=\"text-title text-sm\">\n                                Password\n                            </Label>\n                            <Input\n                                type=\"password\"\n                                required\n                                name=\"pwd\"\n                                id=\"pwd\"\n                                className=\"input sz-md variant-mixed\"\n                            />\n                        </div>\n\n                        <Button className=\"w-full\">Continue</Button>\n                    </div>\n                </div>\n\n                <div className=\"bg-muted rounded-(--radius) border p-3\">\n                    <p className=\"text-accent-foreground text-center text-sm\">\n                        Have an account ?\n                        <Button\n                            asChild\n                            variant=\"link\"\n                            className=\"px-2\">\n                            <Link href=\"#\">Sign In</Link>\n                        </Button>\n                    </p>\n                </div>\n            </form>\n        </section>\n    )\n}\n",
      "type": "registry:component",
      "target": "components/sign-up.tsx"
    },
    {
      "path": "components/logo.tsx",
      "content": "import { cn } from '@/lib/utils'\n\n/**\n * Brand mark: four blocks, two squared and two rounded, stacked on a grid.\n * Purely presentational — wrap it in your own <Link> where it should navigate.\n */\nexport function Logo({ className }: { className?: string }) {\n    return (\n        <svg\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            aria-hidden=\"true\"\n            className={cn('size-6 text-foreground', className)}>\n            <rect\n                x=\"2\"\n                y=\"2\"\n                width=\"9\"\n                height=\"9\"\n                rx=\"2.25\"\n                fill=\"currentColor\"\n            />\n            <rect\n                x=\"13\"\n                y=\"2\"\n                width=\"9\"\n                height=\"9\"\n                rx=\"4.5\"\n                fill=\"currentColor\"\n                fillOpacity=\".3\"\n            />\n            <rect\n                x=\"2\"\n                y=\"13\"\n                width=\"9\"\n                height=\"9\"\n                rx=\"4.5\"\n                fill=\"currentColor\"\n                fillOpacity=\".3\"\n            />\n            <rect\n                x=\"13\"\n                y=\"13\"\n                width=\"9\"\n                height=\"9\"\n                rx=\"2.25\"\n                fill=\"currentColor\"\n            />\n        </svg>\n    )\n}\n",
      "type": "registry:component"
    }
  ]
}