Semantic-UI-React icon indicating copy to clipboard operation
Semantic-UI-React copied to clipboard

Ability to pass enterkeyhint to an Input

Open supersime opened this issue 3 years ago • 2 comments
trafficstars

Problem description

We have recently encountered an issue with the keyboard displayed on Chromium on Android (https://support.google.com/chrome/thread/164815517/google-chrome-101-on-android-shows-tab-key-on-soft-keyboard-instead-of-enter-for-html-input-field?hl=en).

It seems that an Input can, for some unknown reason, show a "Next" value on the keyboard, rather than a "Go" (submit). Pressing Next appears to take you to the next tabIndex element on the page. However we need to catch the "enter" key being pressed to trigger a submit.

Proposed solution

Update lib/htmlPropsUtils.js (https://github.com/Semantic-Org/Semantic-UI-React/blob/master/src/lib/htmlPropsUtils.js#L3) so that htmlInputAttrs supports enterkeyhint as a valid attribute to pass through to the Input element on the DOM.

supersime avatar Jun 08 '22 08:06 supersime

👋 Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you've completed all the fields in the issue template so we can best help.

We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

welcome[bot] avatar Jun 08 '22 08:06 welcome[bot]

According to React (https://github.com/facebook/react/blob/ca106a02d1648f4f0048b07c6b88f69aac175d3c/packages/react-dom/src/shared/possibleStandardNames.js#L62) it should have different casing i.e. enterKeyHint. But, feel free to a submit a PR 👍

layershifter avatar Jun 08 '22 09:06 layershifter