{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "header-4",
  "registryDependencies": [
    "@fulldev/button",
    "@fulldev/header",
    "@fulldev/icon",
    "@fulldev/logo",
    "@fulldev/navigation-menu",
    "@fulldev/sheet"
  ],
  "files": [
    {
      "path": "src/components/blocks/header-4.astro",
      "content": "---\nimport type { ImageMetadata } from \"astro\"\nimport { Image } from \"astro:assets\"\n\nimport { cn } from \"@/lib/utils\"\nimport { Button } from \"@/components/ui/button\"\nimport { Header, HeaderContainer, HeaderGroup } from \"@/components/ui/header\"\nimport { Icon } from \"@/components/ui/icon\"\nimport { Logo, LogoImage, LogoText } from \"@/components/ui/logo\"\nimport {\n  NavigationMenu,\n  NavigationMenuContent,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n  navigationMenuTriggerStyle,\n} from \"@/components/ui/navigation-menu\"\nimport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n} from \"@/components/ui/sheet\"\n\ntype Props = {\n  class?: string\n  logo: {\n    label: string\n    href: string\n    src?: any\n    srcLight?: any\n    srcDark?: any\n    alt?: string\n  }\n  navigation: {\n    label: string\n    href: string\n    description?: string\n    active?: boolean\n    image?: {\n      src: ImageMetadata\n      alt: string\n    }\n    links?: {\n      label: string\n      href: string\n      description?: string\n      icon?: string\n      active?: boolean\n    }[]\n  }[]\n  buttons: {\n    label: string\n    href: string\n    icon?: string\n    variant?: \"default\" | \"outline\" | \"secondary\" | \"ghost\"\n  }[]\n}\n\nconst { class: className, logo, navigation, buttons } = Astro.props\n---\n\n<Header class={cn(\"border-b\", className)}>\n  <HeaderContainer class=\"justify-between\">\n    <HeaderGroup>\n      <Logo href={logo.href}>\n        <LogoImage\n          src={logo.src}\n          srcLight={logo.srcLight}\n          srcDark={logo.srcDark}\n          alt={logo.alt}\n        />\n        {logo.label && <LogoText>{logo.label}</LogoText>}\n      </Logo>\n    </HeaderGroup>\n    <NavigationMenu\n      class=\"absolute left-1/2 hidden max-w-none -translate-x-1/2 lg:flex\"\n      align=\"center\"\n    >\n      <NavigationMenuList>\n        {\n          navigation.map((item, index) =>\n            item.links?.length ? (\n              <NavigationMenuItem value={`nav-${index}`}>\n                <NavigationMenuTrigger>{item.label}</NavigationMenuTrigger>\n                <NavigationMenuContent>\n                  <div class=\"grid w-[min(46rem,calc(100vw-2rem))] gap-2 p-1 lg:grid-cols-[1fr_1.1fr]\">\n                    <NavigationMenuLink\n                      href={item.href}\n                      active={item.active}\n                      class=\"bg-muted/50 hover:bg-muted focus:bg-muted flex min-h-40 flex-col items-start justify-end gap-3 p-4 text-left\"\n                    >\n                      {item.image && (\n                        <Image\n                          src={item.image.src}\n                          alt={item.image.alt}\n                          class=\"mb-auto aspect-[16/9] w-full rounded-md object-cover\"\n                          widths={[320, 480, 640]}\n                          sizes=\"(min-width: 1024px) 22rem, 100vw\"\n                        />\n                      )}\n                      <span class=\"text-base font-medium\">{item.label}</span>\n                      {item.description && (\n                        <span class=\"text-muted-foreground text-sm leading-relaxed\">\n                          {item.description}\n                        </span>\n                      )}\n                    </NavigationMenuLink>\n                    <div class=\"grid gap-1\">\n                      {item.links.map((link) => (\n                        <NavigationMenuLink\n                          href={link.href}\n                          active={link.active}\n                          class=\"items-start gap-3 p-3\"\n                        >\n                          {link.icon && (\n                            <Icon\n                              name={link.icon}\n                              class=\"text-muted-foreground mt-0.5\"\n                            />\n                          )}\n                          <span class=\"grid gap-1\">\n                            <span class=\"font-medium\">{link.label}</span>\n                            {link.description && (\n                              <span class=\"text-muted-foreground text-sm leading-relaxed\">\n                                {link.description}\n                              </span>\n                            )}\n                          </span>\n                        </NavigationMenuLink>\n                      ))}\n                    </div>\n                  </div>\n                </NavigationMenuContent>\n              </NavigationMenuItem>\n            ) : (\n              <NavigationMenuItem value={`nav-${index}`}>\n                <NavigationMenuLink\n                  href={item.href}\n                  active={item.active}\n                  class={navigationMenuTriggerStyle()}\n                >\n                  {item.label}\n                </NavigationMenuLink>\n              </NavigationMenuItem>\n            )\n          )\n        }\n      </NavigationMenuList>\n    </NavigationMenu>\n    <HeaderGroup class=\"ml-auto hidden justify-end lg:flex\">\n      <slot />\n      {\n        buttons.map(({ label, icon, ...button }) => (\n          <Button\n            as=\"a\"\n            size={icon && !label ? \"icon-sm\" : \"sm\"}\n            aria-label={label}\n            target={button.href.startsWith(\"http\") ? \"_blank\" : undefined}\n            rel={button.href.startsWith(\"http\") ? \"noreferrer\" : undefined}\n            {...button}\n          >\n            {icon && <Icon name={icon} />}\n            {label}\n          </Button>\n        ))\n      }\n    </HeaderGroup>\n    <Sheet class=\"lg:hidden\">\n      <SheetTrigger\n        variant=\"ghost\"\n        size=\"icon-sm\"\n        class=\"ml-auto\"\n        aria-label=\"Open menu\"\n      >\n        <Icon name=\"menu\" />\n      </SheetTrigger>\n      <SheetContent side=\"right\" class=\"p-0\">\n        <SheetHeader class=\"sr-only\">\n          <SheetTitle>Menu</SheetTitle>\n          <SheetDescription>Site navigation and actions.</SheetDescription>\n        </SheetHeader>\n        <div class=\"flex h-full flex-col gap-6 overflow-y-auto px-4 py-12\">\n          <nav aria-label=\"Main navigation\" class=\"flex flex-col gap-4\">\n            {\n              navigation.map((item) => (\n                <div class=\"grid gap-1\">\n                  <SheetClose variant=\"ghost\" class=\"justify-start font-medium\">\n                    {item.label}\n                  </SheetClose>\n                  {item.links?.length && (\n                    <div class=\"border-border ml-3 grid gap-1 border-l pl-3\">\n                      {item.links.map((link) => (\n                        <SheetClose\n                          variant=\"ghost\"\n                          class=\"text-muted-foreground justify-start\"\n                        >\n                          {link.icon && <Icon name={link.icon} />}\n                          {link.label}\n                        </SheetClose>\n                      ))}\n                    </div>\n                  )}\n                </div>\n              ))\n            }\n          </nav>\n          <div class=\"mt-auto flex flex-col gap-2\">\n            <slot />\n          </div>\n        </div>\n      </SheetContent>\n    </Sheet>\n  </HeaderContainer>\n</Header>\n",
      "type": "registry:block"
    }
  ],
  "type": "registry:block"
}