ui5-webcomponents icon indicating copy to clipboard operation
ui5-webcomponents copied to clipboard

input: The should not be multiple tab stops for a Single ui component

Open pppwr7 opened this issue 1 month ago • 6 comments

Describe the bug

For Input field with interactive icon added, if the current focus is on the input field then on tab key press the focus moves to the interactive icon. As per the UX guideline, for any UI only 1 tab stop should be provided. This issue has been raised by the UX colleague.

Isolated Example

https://stackblitz.com/edit/github-zbkxaj?file=src%2FApp.tsx

Reproduction steps

  1. open https://stackblitz.com/edit/github-zbkxaj?file=src%2FApp.tsx
  2. keep the focus on input field
  3. hit tab key and see that the icon as well as the input box is focused. Ideally, the control should move to next component away from the input field

Expected Behaviour

should be focussed aut of the input field on tab press

Screenshots or Videos

No response

UI5 Web Components for React Version

latest

UI5 Web Components Version

latest

Browser

Chrome

Operating System

No response

Additional Context

No response

Relevant log output

No response

Organization

No response

Declaration

  • [X] I’m not disclosing any internal or sensitive information.

pppwr7 avatar Jun 26 '24 04:06 pppwr7