Radio Group
Form Input
Select one value from a list of options
Quickstart #
<script>
import { RadioGroup, RadioButton } from "@steeze-ui/components"
let stance = "goofy"
</script>
<RadioGroup label="Stance" name="stance" bind:value={stance} orientation="vertical">
<RadioButton label="Goofy" value="goofy" />
<RadioButton label="Regular" value="regular" />
</RadioGroup>API Reference - RadioGroup #
| Property | Type | Default |
|---|---|---|
name
|
String
|
null
|
value
|
String
|
null
|
label
|
String
|
null
|
orientation
|
GroupOrientation
|
'horizontal'
|
Styling - RadioGroup #
| Name | Default | Notes |
|---|---|---|
--st-radio-group-gap
|
0.25rem
|
The gap between label and items |
--st-radio-group-items-horizontal-gap
|
0.75rem
|
The gap between RadioButton's when horizontal |
--st-radio-group-items-vertical-gap
|
0.5rem
|
The gap between RadioButton's when vertical |