Can't control the filtering when using creatable / broken filtering

I have a use case in which I want the following things:

1. Fill the dropdown with predefined elements
2. Make a fetch and pull some additional elements when the menu gets opened (emulated with a setTimeout and a Promise in my demo)
3. Make it possible to create new elements by typing inside the dropdown without filtering the currently shown elements

“1” and “2” are easy to implement, but adding “3” to the mix seems impossible. As soon as I start typing, the “Create new” element shows up, and everything else is filtered.

Demo: https://codesandbox.io/s/react-select-v3-sandbox-forked-x3qy2?file=/example.js

It seems that this should be possible by using the filterOption={() => true} prop in order to avoid elements to get filtered / hidden, but in practice it doesn’t seem to be working.

Is this a bug or is this the expected behaviour?

[alexandernst]

@ebonow I’m getting back just to say that removing the Async component and managing the state myself completely worked out! Thank you once again!

[alexandernst]

Thank you for the reply! Let me give this approach a shot