Radio Group
Radio group with roving focus and arrow keys, plus a card variant for plan/option pickers with icons and prices.
3 files · 150 locdeps: clsx, tailwind-merge
Installation
With the shadcn CLI, pointing at this platform’s registry:
npx shadcn@latest add https://opusui.131199999.xyz/r/radio-group.jsonOr offline, straight from your opus55 checkout (copies every file it needs):
node ../tailwind_component/opus55/scripts/add.mjs radio-groupUsage
import { RadioGroup, RadioGroupItem } from "@/components/opus/ui/radio-group";
<RadioGroup variant="card" value={plan} onValueChange={setPlan}>
<RadioGroupItem value="pro" label="Pro" description="For teams" aside="$20" />
</RadioGroup>API
| Prop | Type | Default | Description |
|---|---|---|---|
| value / defaultValue / onValueChange | string | — | Selection. |
| variant | "default" | "card" | "default" | List or tiles. |
| orientation | "vertical" | "horizontal" | "vertical" | Layout. |
| RadioGroupItem | { value, label, description?, aside?, icon?, disabled? } | — | An option. |