winterfell react autosuggest custom input wrapper

GeoSuggestCustomInput.js

import React from 'react';
import Geosuggest from 'react-geosuggest';

class GeoSuggestCustomInput extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      value: this.props.value,
    };
    this.handleChange = this.handleChange.bind(this);
  }

  handleChange(address) {
    this.setState({
      value: address,
    }, this.props.onChange.bind(null, address));
  }

  render() {
    return (
      <Geosuggest
        name={this.props.name}
        id={this.props.id}
        aria-labelledby={this.props.labelId}
        className={this.props.classes.input}
        placeholder={this.props.placeholder}
        value={this.state.value}
        required={this.props.required ? 'required' : undefined}
        onChange={this.handleChange}
        onKeyDown={this.props.onKeyDown}
        onSuggestSelect={this.handleChange}
      />
    );
  }
}

GeoSuggestCustomInput.defaultProps = {
  classes: {},
  name: undefined,
  id: undefined,
  value: undefined,
  placeholder: undefined,
  onChange: () => {},
  onBlur: () => {},
  onKeyDown: () => {},
  onSuggestSelect: () => {},
};

export default GeoSuggestCustomInput;