{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "site-header-01",
  "title": "Site Header",
  "description": "A responsive product header with desktop navigation, mobile menu and profile actions.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "@rivelle/utils",
    "@rivelle/avatar",
    "@rivelle/button",
    "@rivelle/dropdown-menu",
    "@rivelle/sheet"
  ],
  "files": [
    {
      "path": "registry/nova/blocks/site-header-01.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport {\n  ArrowRight,\n  ChevronDown,\n  CreditCard,\n  LogOut,\n  Menu,\n  Settings,\n  Sparkles,\n  User,\n} from \"lucide-react\";\n\nimport { Avatar, AvatarFallback } from \"@/components/ui/avatar\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport {\n  Sheet,\n  SheetContent,\n  SheetDescription,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n} from \"@/components/ui/sheet\";\nimport { cn } from \"@/lib/utils\";\n\ntype SiteHeaderLink = { label: string; href: string };\n\ntype SiteHeader01Props = React.ComponentProps<\"header\"> & {\n  brand?: string;\n  links?: SiteHeaderLink[];\n  ctaLabel?: string;\n  ctaHref?: string;\n  profileName?: string;\n  profileEmail?: string;\n};\n\nconst defaultLinks: SiteHeaderLink[] = [\n  { label: \"Product\", href: \"#product\" },\n  { label: \"Solutions\", href: \"#solutions\" },\n  { label: \"Customers\", href: \"#customers\" },\n  { label: \"Pricing\", href: \"#pricing\" },\n];\n\nfunction SiteHeader01({\n  brand = \"Northstar\",\n  links = defaultLinks,\n  ctaLabel = \"Start building\",\n  ctaHref = \"#contact\",\n  profileName = \"Maya Chen\",\n  profileEmail = \"maya@northstar.dev\",\n  className,\n  ...props\n}: SiteHeader01Props) {\n  const initials = profileName\n    .split(\" \")\n    .map((part) => part[0])\n    .join(\"\")\n    .slice(0, 2)\n    .toUpperCase();\n\n  return (\n    <header\n      className={cn(\n        \"sticky top-0 z-50 border-b border-foreground/8 bg-background/82 backdrop-blur-xl\",\n        className,\n      )}\n      data-slot=\"site-header\"\n      {...props}\n    >\n      <div className=\"mx-auto flex h-16 w-full max-w-7xl items-center gap-6 px-5 sm:px-8\">\n        <a\n          className=\"flex shrink-0 items-center gap-2.5 font-semibold\"\n          href=\"#top\"\n        >\n          <span className=\"grid size-9 place-items-center rounded-xl bg-primary text-primary-foreground shadow-[0_10px_30px_-16px_var(--primary)]\">\n            <Sparkles className=\"size-4\" />\n          </span>\n          {brand}\n        </a>\n        <nav\n          className=\"hidden items-center gap-1 lg:flex\"\n          aria-label=\"Main navigation\"\n        >\n          {links.map((link) => (\n            <a\n              className=\"rounded-lg px-3 py-2 text-sm font-medium text-muted-foreground transition-colors hover:bg-foreground/[.045] hover:text-foreground\"\n              href={link.href}\n              key={link.label}\n            >\n              {link.label}\n            </a>\n          ))}\n        </nav>\n        <div className=\"ml-auto flex items-center gap-2\">\n          <Button className=\"hidden sm:inline-flex\" asChild size=\"sm\">\n            <a href={ctaHref}>\n              {ctaLabel} <ArrowRight />\n            </a>\n          </Button>\n          <DropdownMenu>\n            <DropdownMenuTrigger asChild>\n              <Button\n                aria-label=\"Open profile menu\"\n                className=\"gap-2 px-1.5 sm:pr-2.5\"\n                size=\"sm\"\n                variant=\"ghost\"\n              >\n                <Avatar className=\"size-7\">\n                  <AvatarFallback className=\"text-[.65rem]\">\n                    {initials}\n                  </AvatarFallback>\n                </Avatar>\n                <span className=\"hidden max-w-28 truncate text-xs sm:inline\">\n                  {profileName}\n                </span>\n                <ChevronDown className=\"hidden size-3.5 text-muted-foreground sm:block\" />\n              </Button>\n            </DropdownMenuTrigger>\n            <DropdownMenuContent align=\"end\" className=\"w-60\">\n              <DropdownMenuLabel>\n                <span className=\"block text-xs font-semibold\">\n                  {profileName}\n                </span>\n                <span className=\"mt-0.5 block text-[.68rem] font-normal text-muted-foreground\">\n                  {profileEmail}\n                </span>\n              </DropdownMenuLabel>\n              <DropdownMenuSeparator />\n              <DropdownMenuItem>\n                <User /> Profile\n              </DropdownMenuItem>\n              <DropdownMenuItem>\n                <Settings /> Settings\n              </DropdownMenuItem>\n              <DropdownMenuItem>\n                <CreditCard /> Billing\n              </DropdownMenuItem>\n              <DropdownMenuSeparator />\n              <DropdownMenuItem className=\"text-destructive\">\n                <LogOut /> Sign out\n              </DropdownMenuItem>\n            </DropdownMenuContent>\n          </DropdownMenu>\n          <Sheet>\n            <SheetTrigger asChild>\n              <Button\n                aria-label=\"Open navigation\"\n                className=\"lg:hidden\"\n                size=\"icon-sm\"\n                variant=\"outline\"\n              >\n                <Menu />\n              </Button>\n            </SheetTrigger>\n            <SheetContent className=\"w-[min(88vw,360px)]\" side=\"right\">\n              <SheetHeader>\n                <SheetTitle className=\"flex items-center gap-2\">\n                  <span className=\"grid size-8 place-items-center rounded-xl bg-primary text-primary-foreground\">\n                    <Sparkles className=\"size-4\" />\n                  </span>\n                  {brand}\n                </SheetTitle>\n                <SheetDescription>\n                  Explore the product and get started.\n                </SheetDescription>\n              </SheetHeader>\n              <nav className=\"mt-8 grid gap-1\" aria-label=\"Mobile navigation\">\n                {links.map((link) => (\n                  <a\n                    className=\"rounded-xl px-3 py-3 text-sm font-semibold hover:bg-muted\"\n                    href={link.href}\n                    key={link.label}\n                  >\n                    {link.label}\n                  </a>\n                ))}\n              </nav>\n              <Button asChild className=\"mt-6 w-full\">\n                <a href={ctaHref}>\n                  {ctaLabel} <ArrowRight />\n                </a>\n              </Button>\n            </SheetContent>\n          </Sheet>\n        </div>\n      </div>\n    </header>\n  );\n}\n\nexport { SiteHeader01 };\nexport type { SiteHeader01Props, SiteHeaderLink };\n",
      "type": "registry:block"
    }
  ],
  "type": "registry:block"
}