Selectable List

import React from 'react'
import { SelectableList } from 'playbook-ui'

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

export default SelectableListDefault

import React from 'react'
import { SelectableList } from 'playbook-ui'

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

export default SelectableListDefault