@asphalt-react/radio

Radio

Radio buttons are used when options are mutually exclusive, that is only one option can be selected. Radio button can be rendered in various sizes bases on the size prop. Radio uses its own <label> element. To add text for the label, use the label prop. Label can be hidden optionally to show only the Radio input.

Most of the input="radio" attributes are supported. If you need to get hold of the underlying DOM element, use React's refs as usual.

Usage

import Radio from "@asphalt-react/radio"
;<div>
  <Radio label="option 1" />
  <Radio label="option 2" />
</div>

Accessibility

• Use tab to move focus between radio groups
• Press space to make a selection
• Use ⬆ or ⬇ arrow keys to change the selection
• Additional aria attributes like aria-labelledby, aria-checked can be applied too.

Props

label

Label for the radio

type	required	default
string	false	""

size

Size of the radio. accepts s, m, l for small, medium & large

type	required	default
enum	false	"m"