{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "navbar-breadcrumb",
  "type": "registry:ui",
  "title": "Navbar Breadcrumb",
  "description": "A navigation bar with breadcrumb navigation for multi-level hierarchy.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "button",
    "avatar"
  ],
  "files": [
    {
      "path": "registry/ruixenui/navbar-breadcrumb.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport Link from \"next/link\";\nimport { ChevronRight, Bell } from \"lucide-react\";\nimport { cn } from \"@/lib/utils\";\nimport { Button } from \"@/components/ui/button\";\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\";\n\nexport interface NavbarBreadcrumbProps {\n  logo?: React.ReactNode;\n  breadcrumbs?: { label: string; href?: string }[];\n  user?: {\n    name: string;\n    avatar?: string;\n    initials?: string;\n  };\n  notificationCount?: number;\n  className?: string;\n}\n\nexport default function NavbarBreadcrumb({\n  logo = <span className=\"font-semibold\">Logo</span>,\n  breadcrumbs = [\n    { label: \"Personal Account\", href: \"#\" },\n    { label: \"Projects\", href: \"#\" },\n    { label: \"Website\" },\n  ],\n  user = { name: \"John\", initials: \"JD\" },\n  notificationCount = 0,\n  className,\n}: NavbarBreadcrumbProps) {\n  return (\n    <header className={cn(\"w-full border-b\", className)}>\n      <div className=\"flex h-14 items-center justify-between px-4\">\n        <div className=\"flex items-center gap-4\">\n          <Link href=\"/\" className=\"flex items-center\">\n            {logo}\n          </Link>\n          <nav className=\"hidden items-center md:flex\">\n            {breadcrumbs.map((item, index) => (\n              <React.Fragment key={item.label}>\n                {index > 0 && (\n                  <ChevronRight className=\"mx-1 size-4 text-muted-foreground\" />\n                )}\n                {item.href ? (\n                  <Link\n                    href={item.href}\n                    className=\"text-sm text-muted-foreground transition-colors hover:text-foreground\"\n                  >\n                    {item.label}\n                  </Link>\n                ) : (\n                  <span className=\"text-sm\">{item.label}</span>\n                )}\n              </React.Fragment>\n            ))}\n          </nav>\n        </div>\n        <div className=\"flex items-center gap-2\">\n          <Button variant=\"ghost\" size=\"icon\" className=\"relative\">\n            <Bell className=\"size-4\" />\n            {notificationCount > 0 && (\n              <span className=\"absolute -right-0.5 -top-0.5 flex size-4 items-center justify-center rounded-full bg-destructive text-[10px] font-medium text-destructive-foreground\">\n                {notificationCount}\n              </span>\n            )}\n          </Button>\n          <Avatar className=\"size-8\">\n            <AvatarImage src={user.avatar} alt={user.name} />\n            <AvatarFallback className=\"text-xs\">{user.initials}</AvatarFallback>\n          </Avatar>\n        </div>\n      </div>\n    </header>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/ruixen/navbar-breadcrumb.tsx"
    }
  ]
}