import { html } from 'lit-html'

export default {
    title: 'Bootstrap/Forms/Form Check',
    component: 'bs-form-check',
}

export const checkbox = () => html`
    <div>
        <bs-form-row>
            <bs-form-group md="6">
                <bs-form-check control-id="checkbox-1" type="checkbox" value="default">default 1 checkbox </bs-form-check>
                <bs-form-check control-id="checkbox-2" type="checkbox" value="default 2">default 2 checkbox </bs-form-check>
                <bs-form-check control-id="checkbox-2" type="checkbox" value="default 3">default 3 checkbox </bs-form-check>
            </bs-form-group>
        </bs-form-row>
    </div>
`

export const radio = () => html`
    <div>
        <bs-form-row>
            <bs-form-group md="6">
                <bs-form-check-group>
                    <bs-form-check inline control-id="radio-1" name="exampleRadios" type="radio" value="bob" checked> Bob Radio </bs-form-check>
                    <bs-form-check inline control-id="radio-2" name="exampleRadios" type="radio" value="max"> Max Radio 2 </bs-form-check>
                    <bs-form-check inline control-id="radio-3" name="exampleRadios" type="radio" value="smith"> Smith Radio 3 </bs-form-check>
                </bs-form-check-group>
            </bs-form-group>
        </bs-form-row>
    </div>
`
