Radio Group
A set of checkable buttons where only one can be checked at a time.
Installation
import { RadioGroup, RadioGroupItem } from "@ramp-ds/ui"Usage
Examples
Plan Selection
With Descriptions
System picks the best option based on your activity.
You decide when updates are applied.
Set specific times for updates to run.
Disabled
Horizontal Layout
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| value | string | - | The controlled value of the radio group. |
| defaultValue | string | - | The default value when uncontrolled. |
| onValueChange | (value: string) => void | - | Callback when the value changes. |
| disabled | boolean | false | Whether the entire group is disabled. |
Accessibility
- Built on Radix UI RadioGroup for full accessibility
- Keyboard navigation (Arrow keys to move, Space to select)
- WAI-ARIA radiogroup pattern
- Always pair with Label components