{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "button-21",
  "title": "Split button",
  "description": "Primary action button paired with a chevron that opens a dropdown of secondary actions.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "button",
    "button-group",
    "dropdown-menu"
  ],
  "files": [
    {
      "path": "registry/patterns/button/button-21.tsx",
      "content": "import { ChevronDownIcon } from 'lucide-react'\n\nimport { Button } from '@/components/ui/button'\nimport { ButtonGroup } from '@/components/ui/button-group'\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuGroup,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n} from '@/components/ui/dropdown-menu'\n\nexport function Button21() {\n  return (\n    <ButtonGroup>\n      <Button variant=\"outline\">Save</Button>\n      <DropdownMenu>\n        <DropdownMenuTrigger\n          render={\n            <Button\n              variant=\"outline\"\n              size=\"icon\"\n              aria-label=\"More save options\"\n            >\n              <ChevronDownIcon />\n            </Button>\n          }\n        />\n        <DropdownMenuContent align=\"end\">\n          <DropdownMenuGroup>\n            <DropdownMenuItem>Save as draft</DropdownMenuItem>\n            <DropdownMenuItem>Save and publish</DropdownMenuItem>\n            <DropdownMenuItem>Save as template</DropdownMenuItem>\n          </DropdownMenuGroup>\n        </DropdownMenuContent>\n      </DropdownMenu>\n    </ButtonGroup>\n  )\n}\n",
      "type": "registry:component",
      "target": "components/flx/patterns/button/button-21.tsx"
    }
  ],
  "type": "registry:block"
}