Radio

<Radio> is a form control that allows users to select one option from a list of options. All properties are sent directly to the underlying HTML <input type="radio"> element. bind:group can be used to set the current value. The default events are forwarded from the input element.

Examples

Basic

<InputGroup>
    <Radio name="radio" value="1" bind:group={option}>Option 1</Radio>
    <Radio name="radio" value="2" bind:group={option}>Option 2</Radio>
    <Radio name="radio" value="3" bind:group={option}>Option 3</Radio>
    <Radio name="radio" value="4" bind:group={option} disabled>Option 4</Radio>
</InputGroup>

with SplitControl

<SplitControl
    label="Hosted at"
    caption="Where to host your blog"
>
    <InputGroup>
        <Radio 
            name="hosted-at" 
            value="subdomain" 
            bind:group={hostedAt}
        >Subdomain</Radio>
        <Radio 
            name="hosted-at" 
            value="domain" 
            bind:group={hostedAt}
        >Custom Domain</Radio>
        <Radio 
            name="hosted-at" 
            value="self" 
            bind:group={hostedAt}
        >Self-hosted</Radio>
    </InputGroup>
</SplitControl>