Cannot use with react-autocomplete

[mellis481]

I'm attempting to wrap react-autocomplete's component with RRF, but I'm having issues. Here is what I have:

const typeaheadComponent = (props: any) => (
  <Autocomplete
    getItemValue={(item: string) => item}
    items={this.getOptions()}
    renderInput={(props: any) => (
      <input type="text" {...props} />
    )}
    renderItem={(item: string, isHighlighted: boolean) => {
      <div key={uuid.v4()}>{item}</div>;
    }}
    value={value}
    onChange={this.onChange}
    onSelect={this.onSelect}
    inputProps={{
      onKeyUp: this.onKeyPress
    }}
  />
);

return (
  <Control.text
    component={typeaheadComponent}
    mapProps={{
      value: props => props.modelValue
    }}
    model={model}
    id={model}
    value={value}
    persist
  />
);

}

I've reviewed issue #887 and also the custom controls documentation, but I'm still struggling to understand what I'm missing.

With the code above, when I focus on my textbox and press a key, the RRF rrf/clearIntents action fires, but nothing else. Also, focus on the input blurs after each press of the keyboard.