{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tab-navbar",
  "title": "Tab Navbar",
  "description": "component for the Tab Navbar",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "avatar",
    "input",
    "label",
    "navigation-menu"
  ],
  "files": [
    {
      "path": "app/registry/navbar/usage/tabnavbar.tsx",
      "content": "import * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport {\n  NavigationMenu,\n  NavigationMenuContent,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n  navigationMenuTriggerStyle,\n} from \"@/components/ui/navigation-menu\";\nimport { Search } from \"lucide-react\";\nimport Link from \"next/link\";\n\nexport default function Tabnavbar() {\n  return (\n    <nav className=\"border-b\">\n      <div className=\"container mx-auto flex items-center justify-between px-4 py-2 sm:px-6 lg:px-8\">\n        <div className=\"flex items-center space-x-4\">\n          <Link href=\"#\" className=\"text-2xl font-bold\">\n            Logo\n          </Link>\n          <NavigationMenu>\n            <NavigationMenuList>\n              <NavigationMenuItem>\n                <NavigationMenuTrigger>Products</NavigationMenuTrigger>\n                <NavigationMenuContent>\n                  <ul className=\"grid gap-3 p-6 md:w-[400px] lg:w-[500px] lg:grid-cols-[.75fr_1fr]\">\n                    <li className=\"row-span-3\">\n                      <NavigationMenuLink asChild>\n                        <Link\n                          className=\"flex h-full w-full select-none flex-col justify-end rounded-md bg-linear-to-b from-muted/50 to-muted p-6 no-underline outline-hidden focus:shadow-md\"\n                          href=\"#\"\n                        >\n                          <div className=\"mb-2 mt-4 text-lg font-medium\">\n                            Featured Product\n                          </div>\n                          <p className=\"text-sm leading-tight text-muted-foreground\">\n                            Check out our latest and greatest offering\n                          </p>\n                        </Link>\n                      </NavigationMenuLink>\n                    </li>\n                    <ListItem href=\"#\" title=\"Product 1\">\n                      Description for Product 1\n                    </ListItem>\n                    <ListItem href=\"#\" title=\"Product 2\">\n                      Description for Product 2\n                    </ListItem>\n                    <ListItem href=\"#\" title=\"Product 3\">\n                      Description for Product 3\n                    </ListItem>\n                  </ul>\n                </NavigationMenuContent>\n              </NavigationMenuItem>\n              <NavigationMenuItem>\n                <NavigationMenuLink\n                  className={navigationMenuTriggerStyle()}\n                  href=\"#\"\n                >\n                  About\n                </NavigationMenuLink>\n              </NavigationMenuItem>\n              <NavigationMenuItem>\n                <NavigationMenuLink\n                  className={navigationMenuTriggerStyle()}\n                  href=\"#\"\n                >\n                  Contact\n                </NavigationMenuLink>\n              </NavigationMenuItem>\n            </NavigationMenuList>\n          </NavigationMenu>\n        </div>\n        <div className=\"flex items-center space-x-4\">\n          <form className=\"relative\">\n            <Search className=\"absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground\" />\n            <Input type=\"search\" placeholder=\"Search...\" className=\"pl-8\" />\n          </form>\n          <Button>Sign In</Button>\n        </div>\n      </div>\n    </nav>\n  );\n}\n\nconst ListItem = React.forwardRef<\n  React.ElementRef<\"a\">,\n  React.ComponentPropsWithoutRef<\"a\">\n>(({ className, title, children, ...props }, ref) => {\n  return (\n    <li>\n      <NavigationMenuLink asChild>\n        <a\n          ref={ref}\n          className={cn(\n            \"block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-hidden transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground\",\n            className,\n          )}\n          {...props}\n        >\n          <div className=\"text-sm font-medium leading-none\">{title}</div>\n          <p className=\"line-clamp-2 text-sm leading-snug text-muted-foreground\">\n            {children}\n          </p>\n        </a>\n      </NavigationMenuLink>\n    </li>\n  );\n});\nListItem.displayName = \"ListItem\";\n",
      "type": "registry:component",
      "target": "components/spectrumui/tabnavbar.tsx"
    }
  ],
  "type": "registry:component"
}
