onBlur resets search to empty string

[ranyefet]

Hi,

Thanks for the great library. I'm using the useSelect hook and building my own UI around it. I'm building a tagging feature where user can search for tags and create new tag if not exists.

To decide if i like to allow the user to create a new tag i do something like:

const showCreateButton = snapshot.options.length === 0 && snapshot.search.length > 0 && !snapshot.searching;

The thing is, the moment i try to click on my button, the input loses focus, and the hook set snapshot.search to empty string. Which makes showCreateButton false and I can't click on it.

I tried using the controlled input example, but the input value was out of sync.

Is there a way to tell the hook to not reset the search on blur? Also is there a way to control the input value from the outside?

Thanks!

[8gentile]

+1

I'm using the component (with a head) as a controlled search component and its great so far besides one major issue.

In order to get the onChange callback to fire, I have to set closeOnSelect={false}. Only then could I receive the selected value and set it to be the selected value. The downside is now the dropdown won't close... kinda annoying. Not sure what the issue is with the value being set to "".

I'm almost certaincloseOnSelect is the culprit behind

the moment i try to click on my button, the input loses focus, and the hook set snapshot.search to empty string.

Setting that to false might fix the issue.

[tbleckert]

Interesting, will look in to it. Actually the search shouldn't clear on blur and instead let the component decide which value to display and when.