Select.Async returns undefined

Hi,

I’m writing about a curious case. (Just followed the given documentation). First off is it broken?

utils/requests/schools

import axios from 'axios'
import 'utils/interceptors'

export function search (id) {
  return (query) => {
    return axios.get(__API__ + '/division/' + id + '/school', {
      params: {
        query: query
      }
    })
    .then((response) => {
      return response.json()
    })
    .then((json) => {
      return {
        options: json
      }
    })
  }
}

react component

import React, { PropTypes } from 'react'

import Select from 'react-select'
import { search } from 'utils/requests/schools'

class MyExampleView extends React.Component {

  render () {
    return (
      <div className='panel'>
              <Select.Async
                loadOptions={search(this.props.params.id)}
                autoload={true} />

      </div>
    )
  }
}

It seems that Async is undefined.

I tried

import { Async } from 'react-select'
console.log(Async) //returned undefined

import Select from 'react-select'
console.log(Select.Async) //returned undefined  

Why do you think is that?

[tomRedox]

Possibly the issue here is that Select.Async only works with version 1.0.0 of react-select onwards. The documentation is now showing 1.0.0 syntax, but doing an npm install for react-select will currently get the 0.9.x version, so the docs are then wrong for that version.

I have just found this out the hard way!

[lightshire]

@aeleftheriadis fixed it with:

<Select
              asyncOptions={search(this.props.params.id)}
                onChange={::this.handleSelectChange}
                value={selected.label}
               />

note: i didn’t use Select.Async, i used Select