react-select-plus keys not working example

Example.js

import React from 'react';
import createClass from 'create-react-class';
import Select from 'react-select-plus';
import SearchState from '../data/searchState';

var ExampleDemo = createClass({
	displayName: 'ExampleDemo',

	getInitialState() {
		return {
			currentLocation: null
		};
	},
	handleOnChange(value) {
		const { multi } = this.state;
		if (multi) {
			this.setState({ multiValue: value });
		} else {
			this.setState({ value });
		}
	},
	getLocationList(input, callback) {
		console.log(SearchState);
		return callback(null, { options: SearchState });
	},
	renderOption(option) {
		return (
			<span>
				{option.name}
      </span>
		);
	},
	valueRender(options) {
		return (
			<span>{options.name}, {options.level}</span>
		);
	},
	handleChange(option) {
		if (option && option.id) {
			this.setState({
				currentLocation: option
			});
		}
	},
	handleFocus() {
		this.setState({
			currentLocation: '',
			previousLocation: this.state.currentLocation
		});
	},

	handleBlur() {
		if (!this.state.currentLocation || this.state.currentLocation === '') {
			this.setState({
				currentLocation: this.state.previousLocation,
				previousLocation: this.state.currentLocation
			});
		}
	},
	setInput(inputValue) {
		this.setState({ inputValue });
	},
	render() {
		return (
			<div className="section">
				<Select.Async
					onChange={this.handleChange}
					autoload={false}
					loadOptions={this.getLocationList}
					onInputChange={this.setInput}
					value={this.state.currentLocation}
					onFocus={this.handleFocus}
					onBlur={this.handleBlur}
					instanceId="searchBar"
					name="search-bar"
					labelKey="name"
					valueLabel="id"
					clearable={false}
					valueRenderer={this.valueRender}
					optionRenderer={this.renderOption}
				/>
			</div>
		);
	}
});

module.exports = ExampleDemo;