{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "hero-04",
  "title": "Hero 04",
  "description": "A simple hero block",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "badge",
    "button"
  ],
  "files": [
    {
      "path": "src/registry/blocks/radix/hero-04/components/hero.tsx",
      "content": "import { ArrowUpRight, CirclePlay } from \"lucide-react\";\nimport Link from \"next/link\";\nimport { Badge } from \"@/registry/bases/radix/ui/badge\";\nimport { Button } from \"@/registry/bases/radix/ui/button\";\n\nexport default function Hero() {\n  return (\n    <div className=\"flex min-h-screen items-center justify-center overflow-hidden\">\n      <div className=\"mx-auto grid w-full max-w-(--breakpoint-xl) gap-12 px-6 py-12 lg:grid-cols-2 lg:py-0\">\n        <div className=\"my-auto\">\n          <Badge\n            asChild\n            className=\"rounded-full border-border py-1\"\n            variant=\"secondary\"\n          >\n            <Link href=\"#\">\n              Just released v1.0.0 <ArrowUpRight className=\"ml-1 size-4\" />\n            </Link>\n          </Badge>\n          <h1 className=\"mt-6 max-w-[17ch] font-medium text-4xl leading-[1.2]! tracking-[-0.04em] md:text-5xl lg:text-[2.75rem] xl:text-[3.25rem]\">\n            A better way to build clean interfaces\n          </h1>\n          <p className=\"mt-4 max-w-[60ch] text-foreground/60 text-lg sm:mt-6 sm:text-xl/normal\">\n            Explore a collection of Shadcn UI blocks and components, ready to\n            preview and copy. Streamline your development workflow with\n            easy-to-implement examples.\n          </p>\n          <div className=\"mt-8 flex items-center gap-4 sm:mt-12\">\n            <Button className=\"rounded-full\" size=\"lg\">\n              Get Started <ArrowUpRight className=\"h-5! w-5!\" />\n            </Button>\n            <Button\n              className=\"rounded-full shadow-none\"\n              size=\"lg\"\n              variant=\"outline\"\n            >\n              <CirclePlay className=\"h-5! w-5!\" /> Watch Demo\n            </Button>\n          </div>\n        </div>\n        <div className=\"aspect-video w-full rounded-xl bg-accent lg:aspect-auto lg:h-[calc(100vh-4rem)] lg:w-[1000px]\" />\n      </div>\n    </div>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:block"
}