{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "radio-group-07",
  "title": "Radio Group with Cards (Style 1)",
  "description": "A radio group component with card-style options (style 1)",
  "registryDependencies": [
    "radio-group"
  ],
  "files": [
    {
      "path": "src/components/customized/radio-group/radio-group-07.tsx",
      "content": "import { RadioGroup as RadioGroupPrimitive } from \"radix-ui\";\n\nconst options = [\n  {\n    value: \"4gb\",\n    label: \"4GB + 64GB\",\n  },\n  {\n    value: \"6gb\",\n    label: \"6GB + 128GB\",\n  },\n  {\n    value: \"8gb\",\n    label: \"8GB + 128GB\",\n  },\n];\n\nconst RadioCardsDemo = () => {\n  return (\n    <RadioGroupPrimitive.Root\n      className=\"grid w-full max-w-md grid-cols-3 gap-3\"\n      defaultValue={options[0].value}\n    >\n      {options.map((option) => (\n        <RadioGroupPrimitive.Item\n          className=\"rounded-lg px-3 py-1 ring-[1px] ring-border data-[state=checked]:ring-2 data-[state=checked]:ring-blue-500\"\n          key={option.value}\n          value={option.value}\n        >\n          <span className=\"font-semibold tracking-tight\">{option.label}</span>\n        </RadioGroupPrimitive.Item>\n      ))}\n    </RadioGroupPrimitive.Root>\n  );\n};\n\nexport default RadioCardsDemo;\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}