cosscom__coss/apps/ui/public/r/radio-group-with-description.json

{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "radio-group-with-description",
  "type": "registry:example",
  "description": "Radio options with helper text",
  "registryDependencies": ["@coss/radio-group", "@coss/label"],
  "files": [
    {
      "path": "registry/default/examples/radio-group-with-description.tsx",
      "content": "import { Label } from \"@/registry/default/ui/label\"\nimport { Radio, RadioGroup } from \"@/registry/default/ui/radio-group\"\n\nexport default function RadioGroupWithDescriptionDemo() {\n  return (\n    <RadioGroup defaultValue=\"r-1\">\n      <div className=\"flex items-start gap-2\">\n        <Radio value=\"r-1\" id=\"r-1\" />\n        <div className=\"flex flex-col gap-1\">\n          <Label htmlFor=\"r-1\">Free</Label>\n          <p className=\"text-xs text-muted-foreground\">\n            Basic features for personal use.\n          </p>\n        </div>\n      </div>\n      <div className=\"flex items-start gap-2\">\n        <Radio value=\"r-2\" id=\"r-2\" />\n        <div className=\"flex flex-col gap-1\">\n          <Label htmlFor=\"r-2\">Pro</Label>\n          <p className=\"text-xs text-muted-foreground\">\n            Advanced tools for professionals.\n          </p>\n        </div>\n      </div>\n    </RadioGroup>\n  )\n}\n",
      "type": "registry:example"
    }
  ],
  "categories": ["radio", "label", "helper", "hint"]
}