```
<div style={{marginBottom: '100px'}}>
  <p>redux form 5</p>
  <SelectInput
    label="Request Type"
    options={[
      { value: 'business', label: 'Business' },
      { value: 'information', label: 'Information' },
      { value: 'partnership', label: 'Partnership' },
      { value: 'samples', label: 'Samples' }
    ]}
    mandatory
    value={typeof state.selectValue5 === 'object' ? state.selectValue5 : { value: state.selectValue5, label: state.selectValue5}}
    onChange={e => setState({selectValue5: e.target.value}) }
    allowCreate
  />
  <p>redux form 6</p>
  <SelectInput
    label="Request Type"
    options={[
      { value: 'business', label: 'Business' },
      { value: 'information', label: 'Information' },
      { value: 'partnership', label: 'Partnership' },
      { value: 'samples', label: 'Samples' }
    ]}
    input={{
      value: state.selectValue6,
      onChange: e => setState({ selectValue6: e.target.value }),
      onBlur: e => console.log('onBlur select simple : ', e.target.value)
    }}
    mandatory
  />
  <p>redux form 5</p>
  <SelectInput
    label="Request Type"
    options={[
      {
        value: 'business',
        label: 'Business'
      },
      {
        value: 'information',
        label: 'Information'
      },
      {
        value: 'partnership',
        label: 'Partnership'
      },
      {
        value: 'samples',
        label: (
          <Tooltip
            overlay="test sample"
            placement="top"
            component="div"
          >
            Samples
          </Tooltip>
        ),
        disabled: true
      }     
    ]}
    mandatory
    value={state.selectValues5 || null}
    multi
    onChange={(e) => console.log(e) || setState({selectValues5: e.target.value}) }
    onBlur={(e) => console.log(e) || setState({selectValues5: e.target.value}) }
    allowCreate
  />
  <p>redux form 6</p>
  <SelectInput
    label="Request Type"
    options={[
      {
        value: 'business',
        label: 'Business'
      },
      {
        value: 'information',
        label: 'Information'
      },
      {
        value: 'partnership',
        label: 'Partnership'
      },
      {
        value: 'samples',
        label: (
          <Tooltip
            overlay="test sample"
            placement="top"
            component="div"
          >
            Samples
          </Tooltip>
        ),
        disabled: true
      }     
    ]}
    mandatory
    multi
    allowCreate
    input={
      {
        value: state.selectValues6 || 'business',
        onChange: e => setState({selectValues6: e.target.value}),
        onBlur: e => console.log('onBlur select multiple : ', e.target.value)
      }
    }
  />
  <SelectInput
    label="Request Type with checkable variant"
    options={[
      { value: 'business', label: 'Business' },
      { value: 'information', label: 'Information' },
      { value: 'partnership', label: 'Partnership' },
      { value: 'samples', label: 'Samples' }
    ]}
    input={{
      value: state.selectValue7,
      onChange: (value) => setState({ selectValue7: value }),
      onBlur: value => console.log('onBlur select simple : ', value)
    }}
    variant="checkable"
    mandatory
  />
  <SelectInput
    label="Request Type with error and checkable variant"
    options={[
      { value: 'business', label: 'Business' },
      { value: 'information', label: 'Information' },
      { value: 'partnership', label: 'Partnership' },
      { value: 'samples', label: 'Samples' }
    ]}
    input={{
      value: state.selectValue8,
      onChange: (value) => setState({ selectValue8: value }),
      onBlur: value => console.log('onBlur select simple : ', value)
    }}
    variant="checkable"
    mandatory
    multi
    error="Empty"
  />
  <SelectInput
    label="Request Type with getError and checkable variant"
    options={[
      { value: 'business', label: 'Business' },
      { value: 'information', label: 'Information' },
      { value: 'partnership', label: 'Partnership' },
      { value: 'samples', label: 'Samples' }
    ]}
    input={{
      value: state.selectValue9,
      onChange: (value) => setState({ selectValue9: value }),
      onBlur: value => console.log('onBlur select simple : ', value)
    }}
    variant="checkable"
    mandatory
    multi
    getError={props => (!props.input.value || props.input.value.length === 0)}
  />
</div>
```