How to forbit the use of a character in a chip label ?

[nicolas-saubi]

Hi,

I would like the "space" to be my chip creator, BUT, I don't want to create empty chips (done with "handleBeforeAdd") and I don't want the input to contains the typed "space" (which "handleBeforeAdd" can't do).

How can I achieve that ? I bet I would need to set the state of the embedded input through some "onInputChange", but it doesn't seems to be possible. Any idea ?

Thanks

[leMaik]

You can achieve that by adding the keycode for space (32) to the newChipKeyCodes prop. E.g. newChipKeyCodes={[13, 32 ]} for enter and space.

[nicolas-saubi]

Sorry my question was uncomplete, but my previous title was better I think...

Of course I did the newChipKeyCodes thing, but let's imagine you want at least 3 characters long chips...
So I have the space bar listened for creation with newChipKeyCodes, I have handleBeforeAdd to return false if trim(string).length < 3, BUT this way, the input is fulled with spaces I don't want. I want space bar to be removed from the input when the handleBeforeAdd returns false...

Clearly, I want to forbid the use of a character in chip label, while being able to use this character to create a chip (which newChipKeyCodes achieves).

[nicolas-saubi]

Any news ?

[JonathasRodrigues]

I did a pull request that can help you, but we have to wait the merge.

See here
#251

[leMaik]

@nsaubi @JonathasRodrigues It's been a while (I was pretty busy the last 6 months), but this is finally possible by using controlled mode for the text input with inputValue and onUpdateInput. I added an example here.

A new release will be out in a few minutes. 🚀