title: react-boostrap-typeahead reset with formik
body: <p>I am using the AsyncTypeahead from the react-boostrap-typeahead library along with Formik. Both great little libraries.
  A simplified version of my code looks like this</p>
  
  <pre><code>const SearchFilter = withFormik({ 
    mapPropsToValues: (props) {
      office: someIncomingValue || [{name: 'office1', id: 1}]
    }
  })(TheForm)
  
  const TheForm = (props) =&gt; {
    const {values, handleReset} = props;
    return (
      &lt;form&gt;
       &lt;AsyncTypeahead 
         defaultSelected={[values.office]}  
         options={...} 
         onChange={...SetNewValue...}
         onSearch={...}/&gt;
  
        &lt;button onClick={handleReset}
      &lt;/form&gt;
    )
  }
  </code></pre>
  
  <p>By using defaultSelected property on the AsynchTypeahead. i can set a default INITIAL value.  But the issue i am having is when i click the button to handleRest, formik does its thing and reset the value back to office 1, but AsynchTypeahead doesnt have a way of manually passing a value back into it.  So it does not change.  I saw there is a <code>selected</code> prop available, but it just blows up when i try to use it.
  Any input would be gerat</p>
  
  <p>UPDATE: </p>
  
  <p>Yes Selected is what i needed.  i had to add an onInputChange property to keep the parent in sync with what was being typed. </p>