RadioCard
Use this component to group options that are mutually exclusive.
Usage
Examples
RadioCard.Group System Props
margin
RadioCard.Group API
collpaseBelow
string
Possible values:
"xs"
"sm"
"md"
"lg"
"xl"
Cards vertically stack below this breakpoint
children
node
The content of the Group
label
string
Required
Label of the group
labelHidden
bool
Hides the label visually
optional
bool
Adds an optional indicator to the label
orientation
string
default: "vertical"
Possible values:
"vertical"
"horizontal"
"grid"
Orientation of the child cards
RadioCard System Props
None
RadioCard API
checked
bool
Whether the input is selected or not
defaultChecked
bool
Whether the input is selected or not
disabled
bool
Whether the input is disabled or not
id
string
Required
The ID for the form input
label
node
Label for the form input
name
string
The name of the form input
onChange
function
default: (e) => void
Callback when the input state changes
onFocus
function
default: (e) => void
Callback when the input becomes focused
onBlur
function
default: (e) => void
Callback when the input loses focus
value
string
Value for the form input
weight
string
default: "light"
Possible values:
"light"
"heavy"
Visual weight of the child cards