Components
Radio
Radio enables a user to make a single selection from a group of options.
Every radio element must be labeled appropriately. There are a few ways to label radios and groups of radios:
- To group multiple radio inputs, use the
Fieldset
component in addition to giving radio buttons the samename
attribute - Use the
label
prop to label individual radio inputs
import { Radio } from '@sproutsocial/racine'
Properties
Name | Type | Default | Description | Required? |
---|---|---|---|---|
id | string | ID of the form element, should match the "for" value of the associated label | ||
name | string | |||
label | string | Label text to display next to the radio input | ||
ariaLabel | string | Label used to describe the input if not used with an accompanying visual label | ||
value | string | |||
checked | boolean | |||
disabled | boolean | false | ||
qa | Object | |||
onChange | (e: SyntheticInputEvent<HTMLInputElement>) => void | |||
onFocus | (e: SyntheticFocusEvent<HTMLInputElement>) => void | |||
onBlur | (e: SyntheticFocusEvent<HTMLInputElement>) => void |