Select

<div>
  <h3>Airport with `option` children.</h3>
  <Select name="airport">
    <option value="MSY">Louis Armstrong</option>
    <option value="JFK">John F. Kennedy</option>
  </Select>
  <h3>Airport with `options` prop.</h3>
  <Select name="airport" options={[
    {label: 'Louis Armstrong', value: 'MSY'},
    {label: 'John F. Kennedy', value: 'JFK'},
  ]} />
</div>

<Select options={
  [
    {label: 'North', value: 'N'},
    {label: 'South', value: 'S'},
    {label: 'East', value: 'E'},
    {label: 'West', value: 'W'},
  ]
} defaultValue={['S', 'E']} multiple />

React.createElement(
class Stacks extends Component {
  get options() {
    return [
      {label: 'North', value: 'N'},
      {label: 'South', value: 'S'},
      {label: 'East', value: 'E'},
      {label: 'West', value: 'W'},
    ]
  }

  render() {
    return (
      <div>
        <Select.Stack 
          options={this.options} 
          label="Has help text" 
          help="This is the help text." 
        />
        <Select.Stack 
          options={this.options} 
          label="Has error" 
          error="This is the error." 
        />
        <Select.Stack 
          options={this.options} 
          label="Stacks both help and error" 
          help="This is the help text." 
          error="This is the error." 
        />
      </div>
    )
  }
}
)