Selectable List

Close

import React from 'react'
import { SelectableList } from '../..'

const SelectableListDefault = (props) => {
  return (
    <div>
      <SelectableList variant="checkbox">
        <SelectableList.Item
            label="Mild"
            name="checkbox-name-1"
            value="1"
            {...props}
        />
        <SelectableList.Item
            checked
            label="Medium"
            name="checkbox-name-2"
            value="2"
            {...props}
        />
        <SelectableList.Item
            label="Hot"
            name="checkbox-name-3"
            value="3"
            {...props}
        />
      </SelectableList>
    </div>
  )
}

export default SelectableListDefault

Close

import React from 'react'
import { SelectableList } from '../..'

const SelectableListDefault = (props) => {
  return (
    <div>
      <SelectableList variant="radio">
        <SelectableList.Item
            label="Small"
            name="radio"
            value="1"
            {...props}
        />
        <SelectableList.Item
            defaultChecked
            label="Medium"
            name="radio"
            value="2"
            {...props}
        />
        <SelectableList.Item
            label="Large"
            name="radio"
            value="3"
            {...props}
        />
      </SelectableList>
    </div>
  )
}

export default SelectableListDefault