Encountered two children with the same key warning - Select with creatable prop

[osolliec]

What package has an issue

@mantine/core

Describe the bug

Warning of duplicate keys when you hover on options if you have the creatable prop enabled.

In which browser did the problem occur

Chrome

If possible, please include a link to a codesandbox with the reproduced problem

https://codesandbox.io/s/cocky-currying-hlkgei?file=/src/App.tsx

Do you know how to fix the issue

No

Are you willing to participate in fixing this issue and create a pull request with the fix

Yes

Possible fix

No response

[jpemberton94]

The creatable div's key is assigned the value of the Select input field. This will happen any time the value of the Select matches an existing value in the SelectList. Appending '-creatable' to the key would be the easiest way to bypass this warning.

This does beg a larger question... Does it make sense for the Select component w/ creatable to allow the creation of an item which already exists in the list? It may make more sense that the creatable div doesn't render at all if the value already exists in the list

[rtivital]

shouldCreate function determines whether creatable option should be displayed in the list, in the provided sandbox it always returns true, and thus creatable option is always rendered.

[rtivital]

Fixed in 5.1.5