{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "nextjs-sign-up-page",
  "title": "Clerk Next.js Sign Up Page (App Router)",
  "description": "A sign up page for Next.js App Router with Clerk authentication.",
  "dependencies": [
    "@clerk/nextjs",
    "lucide-react"
  ],
  "files": [
    {
      "path": "nextjs/aio/sign-up-page/page.tsx",
      "content": "import { SignUp } from '@clerk/nextjs';\nimport { ChartLine, Clock, ShieldCheck, Sparkles } from 'lucide-react';\n\nexport default function SignUpPage() {\n  return (\n    <div className='bg-muted grid flex-1 lg:grid-cols-2'>\n      <div className='hidden flex-1 items-center justify-end p-6 md:p-10 lg:flex'>\n        <ul className='max-w-sm space-y-8'>\n          <li>\n            <div className='flex items-center gap-2'>\n              <Clock className='size-4' />\n              <p className='font-semibold'>Save on development time</p>\n            </div>\n            <p className='text-muted-foreground mt-2 text-sm'>\n              Add authentication and user management to your app with just a few lines of code.\n            </p>\n          </li>\n          <li>\n            <div className='flex items-center gap-2'>\n              <ChartLine className='size-4' />\n              <p className='font-semibold'>Increase engagement</p>\n            </div>\n            <p className='text-muted-foreground mt-2 text-sm'>\n              Add intuitive UIs designed to decrease friction for your users.\n            </p>\n          </li>\n          <li>\n            <div className='flex items-center gap-2'>\n              <ShieldCheck className='size-4' />\n              <p className='font-semibold'>Protect your users</p>\n            </div>\n            <p className='text-muted-foreground mt-2 text-sm'>\n              Enable features like two-step verification and enjoy automatic security updates.\n            </p>\n          </li>\n          <li>\n            <div className='flex items-center gap-2'>\n              <Sparkles className='size-4' />\n              <p className='font-semibold'>Match your brand</p>\n            </div>\n            <p className='text-muted-foreground mt-2 text-sm'>\n              Theme our pre-built components, or integrate with our easy-to-use APIs.\n            </p>\n          </li>\n        </ul>\n      </div>\n      <div className='flex flex-1 items-center justify-center p-6 md:p-10 lg:justify-start'>\n        <SignUp />\n      </div>\n    </div>\n  );\n}\n",
      "type": "registry:page",
      "target": "app/sign-up/[[...sign-up]]/page.tsx"
    }
  ],
  "envVars": {
    "NEXT_PUBLIC_CLERK_SIGN_UP_URL": "/sign-up"
  },
  "type": "registry:page"
}