Skip to main content
/
/
/
Radio

Radio

Toggleable circle, for single-choice group

import Radio from "@intility/bifrost-react/Radio";
Props

Basic radio buttons

For convenience, <Radio> is provided as an alias for <Checkbox type="radio"> and supports the same props.

Group by name for mutually exclusive radio buttons.

Group label

If you want to label a group, use <fieldset> and <legend>.

This example also uses <Grid> since <Radio> is an inline element by default.

Button style

Use button and small props to display as a button.

Inactive state

Use state="inactive" for a focusable, screen-readable, tooltip-friendly replacement for disabled. See <Checkbox> for the full pattern.

Controlled mode

Use checked and onChange props (forwarded to native <input>) to control the checked state.