React-select: Creatable grouped options show "create" option even when that option already exists

[romdoq]

See example:
https://codesandbox.io/s/react-select-grouped-creatable-4m0sk
Type "Ocean" in the grouped-creatable select box, and you will get a choice of the existing "Ocean" option, but also an option to create "Ocean" (unless "Ocean" is the currently selected choice).

When there is no grouping, no option is shown to create "Ocean" if it already exists, which is the behaviour I would expect.

A pull request #2659 to fix this issue was closed without comment on 2019-05-27, but the behaviour is still present in the most recent releases of both v2 and v3.

[benkindt]

It seems like the options can only be created in the base layer. When you type "Colour", you can't create a new option as it is the label of one of your groups. The problem is that you can't define in which group the new option should be created.

[ashercoren]

Any update about this? Is a fix planned?

[sanks]

The workaround for v3 is to pass your own implementation to the isValidNewOption param, like this:
https://codesandbox.io/s/react-select-grouped-creatable-forked-2ntfb

[ebonow]

Greetings,

It would seem that @sanks has identified the proper solution for this. I will close this issue but if anyone has any other questions, thoughts, or concerns, please feel free to reply and we can re-open if necessary.

[romdoq]

@ebonow While the workaround may be the way to go, I disagree that this issue should be closed now.
There still remains incorrect/unexpected/inconsistent default behaviour when combining two built-in use cases, so I would argue that React-Select should fully support using the two options (creatable, grouped options) in combination out of the box, and integrate the workaround into the main package.