Radio Group

Radio buttons allow the user to select one option from a set.

Horizontal

Vertical

With Second Label

Add a secondary text below each radio option for additional context (left aligned).

interface RadioOption {
  value: string;
  label: string;
  secondLabel?: string; // Secondary text below radio option (left aligned)
}

interface RadioGroupProps {
  options: RadioOption[];
  selectedValue: string;
  onChange: (value: string) => void;
  direction?: 'horizontal' | 'vertical';
}