Radio Groups
A styled select list that can have a single entry checked at any one time. The RadioGroup component wraps Radio components, which should be used as children.
Interactive Examples
Base
Need more examples? Find a bug?
For even more examples, please take a preview of our development environment built on the popular Storybook platform that is an always up-to-date deploy of this repository's master branch. All example code on this page can be found in the /components/radio-group/__examples__/ folder. Storybook example code can be found in /components/radio-group/__docs__/storybook-stories.jsx.
Property Details
All public, supported component props are listed below. If you believe there is a clearer way to describe a property, please submit a pull request. Property descriptions are built from source code comments (written in Markdown) located within propTypes objects which are typically found in each component's index.jsx. Pull requests to update these descriptions can easily be done without cloning this repository by clicking "Edit this file" in the Github user interface.
| Name | Type | Required | Default | Description |
|---|---|---|---|---|
| assistiveText | shape | { required: Required } | Assistive text for accessibility
| |
| children | node | Children are expected to be Radio components. | ||
| className | union | Custom CSS classes added to the node. | ||
| labels | shape | {} | Text labels for internationalization This object is merged with the default props object on every render.
| |
| onChange | func | This event fires when the radio selection changes. | ||
| disabled | bool | Disable all radio inputs. | ||
| required | bool | Adds an indicator that this field is required. | ||
| name | string | The name of this radio group. | ||
| errorId | string | The ID of the error message, for linking to radio inputs with aria-describedby. | ||
| variant | string: base | button-group | base | Variants of radio groups such as Radio Button Group |