{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "button-group2",
  "title": "Button group",
  "description": "A container that groups related buttons together with consistent styling. The variants fit naturally into codebases using Radix UI or Base UI.",
  "files": [
    {
      "path": "contents/components/button-group/2/index.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuRadioGroup,\n  DropdownMenuRadioItem,\n  DropdownMenuSeparator,\n  DropdownMenuSub,\n  DropdownMenuSubContent,\n  DropdownMenuSubTrigger,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport {\n  ArchiveIcon,\n  CalendarPlusIcon,\n  ClockIcon,\n  ListFilterIcon,\n  MailCheckIcon,\n  MoreHorizontalIcon,\n  TagIcon,\n  Trash2Icon,\n} from \"lucide-react\";\nimport { ButtonGroup } from \"@/components/ui/button-group\";\n\nexport default function ButtonGroupComponent() {\n  const [label, setLabel] = React.useState(\"personal\");\n\n  return (\n    <ButtonGroup>\n      <Button variant=\"outline\">Save and Exit</Button>\n      <DropdownMenu>\n        <DropdownMenuTrigger asChild>\n          <Button variant=\"outline\" size=\"icon\" aria-label=\"More Options\">\n            <MoreHorizontalIcon />\n          </Button>\n        </DropdownMenuTrigger>\n        <DropdownMenuContent align=\"end\" className=\"w-40\">\n          <DropdownMenuGroup>\n            <DropdownMenuItem>\n              <MailCheckIcon />\n              Mark as Read\n            </DropdownMenuItem>\n            <DropdownMenuItem>\n              <ArchiveIcon />\n              Archive\n            </DropdownMenuItem>\n          </DropdownMenuGroup>\n          <DropdownMenuSeparator />\n          <DropdownMenuGroup>\n            <DropdownMenuItem>\n              <ClockIcon />\n              Snooze\n            </DropdownMenuItem>\n            <DropdownMenuItem>\n              <CalendarPlusIcon />\n              Add to Calendar\n            </DropdownMenuItem>\n            <DropdownMenuItem>\n              <ListFilterIcon />\n              Add to List\n            </DropdownMenuItem>\n            <DropdownMenuSub>\n              <DropdownMenuSubTrigger>\n                <TagIcon />\n                Label As...\n              </DropdownMenuSubTrigger>\n              <DropdownMenuSubContent>\n                <DropdownMenuRadioGroup value={label} onValueChange={setLabel}>\n                  <DropdownMenuRadioItem value=\"personal\">\n                    Personal\n                  </DropdownMenuRadioItem>\n                  <DropdownMenuRadioItem value=\"work\">\n                    Work\n                  </DropdownMenuRadioItem>\n                  <DropdownMenuRadioItem value=\"other\">\n                    Other\n                  </DropdownMenuRadioItem>\n                </DropdownMenuRadioGroup>\n              </DropdownMenuSubContent>\n            </DropdownMenuSub>\n          </DropdownMenuGroup>\n          <DropdownMenuSeparator />\n          <DropdownMenuGroup>\n            <DropdownMenuItem variant=\"destructive\">\n              <Trash2Icon />\n              Trash\n            </DropdownMenuItem>\n          </DropdownMenuGroup>\n        </DropdownMenuContent>\n      </DropdownMenu>\n    </ButtonGroup>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/button-group2.tsx"
    }
  ],
  "type": "registry:component"
}