Tab Key replicates enter key behaviour.

[stefan1968]

Is there anyway to do this? I want to be able to press tab to enter the next token value, basically just replicating 'enter key' behaviour.

I've tried an onKeydown function/blur function, but as the component doesn't accept a reference, there doesn't seem a way of 'blurring' the component progmatically.

[seawind543]

Hi @stefan1968,
Do you mean to keep the focus on the TokenInput after press Tab? So that you could continually make new tokens.

If yes, then let me think about how to make the special keyDown (Enter, Esc, Backspace, and Tab) all become configurable. So far, TokenInput only supports Enter, Esc, and Backspace.

Note: Some users might prefer to keep the tab's native browser behavior.

As-Is:

• TokenInput does not handle Tab, so it will follow browser native behavior: Switch to next focusable item.
• TokenInput will create a new token when you blur, so press Tab will cause a new token to be created.

[stefan1968]

That's precisely what I meant. Obviously keep the default behaviour, but as you mentioned make it configurable.

I'm very much obliged.

[seawind543]

Hi @stefan1968, the requested feature has been released at v1.4.1

You could apply prop specialKeyDown to turn on the functionality about creating a token by Tab.

Please reference the below links for how to use it. Let me know if have any questions or any issues are found.

• prop specialKeyDown
• Example: Config special keyDown event handlers
• Predefined KeyDown Event Handlers

[stefan1968]

Wonderful! Thank you.