React-bootstrap-typeahead: Failed prop type: You provided a `value` prop to a form field without an `onChange` handler.

[JDProductions]

Warning Message

index.js:2178 Warning: Failed prop type: You provided a `value` prop to a form field without an `onChange` handler. This will render a read-only field. If the field should be mutable use `defaultValue`. Otherwise, set either `onChange` or `readOnly`.
    in input (created by HintContainer(TypeaheadInputSingle))
    in div (created by HintContainer(TypeaheadInputSingle))
    in HintContainer(TypeaheadInputSingle) (created by InputContainer(HintContainer(TypeaheadInputSingle)))
    in InputContainer(HintContainer(TypeaheadInputSingle)) (created by Typeahead)
    in div (created by Typeahead)
    in Typeahead (created by WrappedTypeahead)
    in WrappedTypeahead (created by TypeaheadContainer(WrappedTypeahead))
    in TypeaheadContainer(WrappedTypeahead) (created by OnClickOutside(TypeaheadContainer(WrappedTypeahead)))
    in OnClickOutside(TypeaheadContainer(WrappedTypeahead)) (at AutoComplete.js:22)
    in AutoComplete (at FindCharacter.js:46)
    in div (at FindCharacter.js:44)
    in form (at FindCharacter.js:43)
    in div (at FindCharacter.js:42)
    in FindCharacter (at App.js:18)
    in div (at App.js:17)
    in div (at App.js:15)
    in App (at src/index.js:7)

Version

"dependencies": {
  "axios": "^0.18.0",
  "bootstrap": "^4.1.3",
  "jquery": "^3.3.1",
  "popper.js": "^1.14.4",
  "react": "^16.5.0",
  "react-bootstrap-typeahead": ^3.2.2",
  "react-dom": "^16.5.0",
  "react-scripts": "1.1.5",
  "reactstrap": "^6.4.0"
},

Steps to reproduce

Install typehead and throw it on the screen. Once typehead is rendered you will see the warning.

Expected Behavior

I would expect the console not throw a warning because the autocomplete is working but It thinks its missing something or I'm supplying something wrong so I'm not entirely sure what's going on.

Actual Behavior

The autocomplete works and I can get the value but the warning will not go away inside my console.

My Code

import React, { Component } from "react";

import {Typeahead} from 'react-bootstrap-typeahead';

var options = [
  'John',
  'Miles',
  'Charles',
  'Herbie',
];

export default class AutoComplete extends React.Component {
  state = {
    multiple: false,
    selected: []
  };

  render() {
    const {multiple} = this.state;

    return (
      <Typeahead
        multiple={multiple}
        onChange={(selected) => {
          this.setState({selected});
        }}
        options={options}
        selected={this.state.selected}
      />
    );
  }
}

[ericgio]

Fixed in v3.2.3