{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "button-group-select-demo",
  "type": "registry:example",
  "registryDependencies": [
    "button-group"
  ],
  "files": [
    {
      "path": "src/registry/pure-ui/examples/button-group/button-group-select-demo.tsx",
      "content": "\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { ArrowRightIcon, ChevronsUpDownIcon } from \"lucide-react\";\r\n\r\nimport { Button } from \"@/registry/pure-ui/ui/button\";\r\nimport { ButtonGroup } from \"@/registry/pure-ui/ui/button-group\";\r\nimport { Input } from \"@/registry/pure-ui/ui/input\";\r\nimport {\r\n  Select,\r\n  SelectPopup,\r\n  SelectItem,\r\n  SelectTrigger,\r\n  SelectValue,\r\n  SelectList,\r\n  SelectIcon,\r\n} from \"@/registry/pure-ui/ui/select\";\r\n\r\ninterface Currency {\r\n  value: string;\r\n  label: string;\r\n}\r\n\r\nconst CURRENCIES = [\r\n  {\r\n    value: \"$\",\r\n    label: \"US Dollar\",\r\n  },\r\n  {\r\n    value: \"€\",\r\n    label: \"Euro\",\r\n  },\r\n  {\r\n    value: \"£\",\r\n    label: \"British Pound\",\r\n  },\r\n];\r\n\r\nexport function ButtonGroupSelectDemo() {\r\n  return (\r\n    <ButtonGroup>\r\n      <ButtonGroup>\r\n        <Select\r\n          defaultValue={CURRENCIES[0]}\r\n          itemToStringValue={(currency) => (currency as Currency)?.value}\r\n        >\r\n          <SelectTrigger className=\"w-fit min-w-none\">\r\n            <SelectValue>{(currency: Currency) => currency.value}</SelectValue>\r\n            <SelectIcon>\r\n              <ChevronsUpDownIcon className=\"size-3.5\" />\r\n            </SelectIcon>\r\n          </SelectTrigger>\r\n          <SelectPopup className=\"min-w-48\" alignItemWithTrigger>\r\n            <SelectList>\r\n              {CURRENCIES.map((curr) => (\r\n                <SelectItem key={curr.value} value={curr}>\r\n                  {curr.value}{\" \"}\r\n                  <span className=\"text-muted-foreground\">{curr.label}</span>\r\n                </SelectItem>\r\n              ))}\r\n            </SelectList>\r\n          </SelectPopup>\r\n        </Select>\r\n        <Input placeholder=\"10.00\" pattern=\"[0-9]*\" />\r\n      </ButtonGroup>\r\n      <ButtonGroup>\r\n        <Button aria-label=\"Send\" size=\"icon\" variant=\"outline\">\r\n          <ArrowRightIcon />\r\n        </Button>\r\n      </ButtonGroup>\r\n    </ButtonGroup>\r\n  );\r\n}\r\n",
      "type": "registry:example"
    }
  ]
}