{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "app-breadcrumbs",
  "title": "App Breadcrumbs",
  "description": "Breadcrumb navigation styled for the nx app shell.",
  "dependencies": [
    "@untitledui/icons@^0.0.22"
  ],
  "registryDependencies": [
    "@nx-ui/breadcrumb",
    "@nx-ui/dropdown-menu",
    "@nx-ui/utils"
  ],
  "files": [
    {
      "path": "components/blocks/app-breadcrumbs.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { Check, ChevronDown } from \"@untitledui/icons\"\n\nimport { cn } from \"@/lib/utils\"\nimport {\n  Breadcrumb,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbList,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n} from \"@/components/ui/breadcrumb\"\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\"\n\nexport type BreadcrumbMenuEntry = {\n  label: string\n  href?: string\n  onSelect?: () => void\n  /** Marks the entry as the current selection (shows a tick). */\n  active?: boolean\n}\n\nexport type AppBreadcrumbItem = {\n  label: string\n  href?: string\n  /** When present, the crumb becomes a dropdown switcher (org ▸ project pattern). */\n  menu?: BreadcrumbMenuEntry[]\n}\n\nfunction CrumbMenu({ item }: { item: AppBreadcrumbItem }) {\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger\n        className=\"flex shrink-0 items-center gap-1.5 rounded-md px-1.5 py-1 text-sm font-semibold text-foreground outline-none transition hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring\"\n        aria-label={`Switch ${item.label}`}\n      >\n        <span className=\"max-w-40 truncate\">{item.label}</span>\n        <ChevronDown className=\"size-3.5 shrink-0 text-fg-quaternary\" />\n      </DropdownMenuTrigger>\n      <DropdownMenuContent align=\"start\" className=\"min-w-56\">\n        {item.menu?.map((entry) => {\n          const content = (\n            <>\n              <span className=\"flex-1 truncate text-sm font-semibold text-secondary-foreground\">\n                {entry.label}\n              </span>\n              {entry.active ? (\n                <Check className=\"size-4 shrink-0 text-fg-brand-primary\" aria-label=\"Current\" />\n              ) : null}\n            </>\n          )\n          if (entry.href) {\n            return (\n              <DropdownMenuItem\n                key={entry.label}\n                onClick={entry.onSelect}\n                render={<a href={entry.href} />}\n              >\n                {content}\n              </DropdownMenuItem>\n            )\n          }\n          return (\n            <DropdownMenuItem key={entry.label} onClick={entry.onSelect}>\n              {content}\n            </DropdownMenuItem>\n          )\n        })}\n      </DropdownMenuContent>\n    </DropdownMenu>\n  )\n}\n\n/**\n * AppBreadcrumbs — the nx header breadcrumb trail. Plain crumbs render as links\n * (or the current page for the last item); crumbs carrying a `menu` render as a\n * dropdown switcher, recreating the org ▸ project selector pattern from the nx\n * app header.\n */\nfunction AppBreadcrumbs({\n  items,\n  className,\n  ...props\n}: React.ComponentProps<typeof Breadcrumb> & {\n  items: AppBreadcrumbItem[]\n}) {\n  return (\n    <Breadcrumb className={cn(className)} {...props}>\n      <BreadcrumbList className=\"gap-1 sm:gap-1\">\n        {items.map((item, index) => {\n          const isLast = index === items.length - 1\n          return (\n            <React.Fragment key={`${item.label}-${index}`}>\n              {index > 0 ? <BreadcrumbSeparator /> : null}\n              <BreadcrumbItem>\n                {item.menu ? (\n                  <CrumbMenu item={item} />\n                ) : item.href && !isLast ? (\n                  <BreadcrumbLink\n                    render={<a href={item.href} />}\n                    className=\"rounded-md px-1.5 py-1 font-medium hover:bg-muted\"\n                  >\n                    {item.label}\n                  </BreadcrumbLink>\n                ) : (\n                  <BreadcrumbPage className=\"px-1.5 py-1 font-semibold\">\n                    {item.label}\n                  </BreadcrumbPage>\n                )}\n              </BreadcrumbItem>\n            </React.Fragment>\n          )\n        })}\n      </BreadcrumbList>\n    </Breadcrumb>\n  )\n}\n\nexport { AppBreadcrumbs }\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:block"
}