Being more productive by pressing ENTER

[acataluddi]

Hi Guys,

we hopefully added a small improvement to the widget logic to let user being more productive by using the keyboard.

Only when allowNew is false, we automatically select the first entry so that, should it be the right entry for you, you can immediately confirm by pressing ENTER. Otherwise, you can:

• continue typing to increase the selectivity and filter the entries.
• use the top/bottom arrows to select the suggested entries

In addition, we added the possibility to easily switch between the input control and the suggested values by pressing TAB.

Credits - Roberto Rizzo

Best regards,
Adriano C.

[coveralls]

Coverage remained the same at 100.0% when pulling 27a70df on metagusto:use-tab-to-browse-suggestions into a9d7788 on i-like-robots:master.

[i-like-robots]

Thanks for your contribution @acataluddi. This feature has been suggested a few times over the years (#55) but it's always seemed confusing so I've avoided implementing it. I'll check out your branch and see how it works.

[acataluddi]

Thanks for your contribution @acataluddi. This feature has been suggested a few times over the years (#55) but it's always seemed confusing so I've avoided implementing it. I'll check out your branch and see how it works.

Hi Matt,

Sorry, we implemented the new behaviour without checking for any previous occurrence/request for this feature: our bad.

If I can elaborate a bit further the rationale behind this feature, the big plus of advanced selection widgets like react-tags, select2 and similar is, in my opinion, to speed up the item search/selection by the keyboard. That said, is mega powerful having a way to immediately confirm a tag as soon as the typed chars are enough to select the desired one.

Arguably, there is no better key than the ENTER one for this.

Of course, when the allowNew property is true, this behaviour should be disabled as the user expectation would be instead to commit the type chars into a new tag.

This is the behaviour implemented in this pull request.

Thank you for checking it,
Adriano C.

[joscaohenri]

Hello guys, is this feature not implemented on 6.1.0? For some reason I can't use it! Thanks for the great library!

[acataluddi]

Hello guys, is this feature not implemented on 6.1.0? For some reason I can't use it! Thanks for the great library!

Hi @joscaohenri,

As you can see, the branch has not yet been merged (status open), so it can be part of any release. I’m sorry.

In the meantime, you might want to use our internal company version:
https://github.com/metagusto/react-tags

Regards,
Adriano

[sepsol]

Still waiting for this to be merged 👀

[juanlet]

@i-like-robots Could you merge this? There are several people waiting for this feature