{
  "name": "spreadsheet-sheet-bar-menu-button",
  "type": "registry:component",
  "dependencies": [
    "@unsanity/spreadsheet"
  ],
  "registryDependencies": [
    "dropdown-menu",
    "button"
  ],
  "files": [
    {
      "path": "components/spreadsheet/spreadsheet-sheet-bar-menu-button.tsx",
      "content": "\"use client\";\n\nimport { useSpreadsheetSheetTabs } from \"@unsanity/spreadsheet\";\nimport { Check, Menu } from \"lucide-react\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport { cn } from \"@/lib/utils\";\n\nconst iconBtn = \"spreadsheet-sheet-bar__btn spreadsheet-sheet-bar__btn--icon\";\n\nexport function SpreadsheetSheetBarMenuButton() {\n  const { sheets, activeSheetId, setActiveSheet } = useSpreadsheetSheetTabs();\n\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger asChild>\n        <Button\n          type=\"button\"\n          variant=\"ghost\"\n          size=\"sm\"\n          className={cn(iconBtn)}\n          title=\"All sheets\"\n        >\n          <Menu className=\"size-4\" />\n        </Button>\n      </DropdownMenuTrigger>\n      <DropdownMenuContent align=\"start\" className=\"spreadsheet-sheet-bar__dropdown\">\n        {sheets.map((s) => (\n          <DropdownMenuItem\n            key={s.id}\n            onClick={() => setActiveSheet(s.id)}\n            className=\"gap-2\"\n          >\n            {s.id === activeSheetId ? (\n              <Check className=\"spreadsheet-sheet-bar__check\" />\n            ) : (\n              <span className=\"size-4 shrink-0\" aria-hidden />\n            )}\n            <span className=\"truncate\">{s.name}</span>\n          </DropdownMenuItem>\n        ))}\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n}\n",
      "type": "registry:component"
    }
  ]
}