feat(listbox-popover): Tab stop for search

[a-m-dev]

Motivation

we need to have a tab stop in search field in sn-table side according to our a11y standards. Since we can't use the useKeyboard () hook directly inside of nebula, we need to mimic it's return values and in this case passing { enabled: false } into ListBoxSearch as keyboard prop does the job for us!

Screen.Recording.2023-03-02.at.09.54.26.mov

Screen.Recording.2023-03-02.at.09.57.26.mov

Update:

now the logic updated and:

1. by default, when we open listbox popover -> focus is on search field
2. unless user sends in autoFocus: false as option from where embeds the popover
   (NOTE: 👆that is only for popover mode!)

Requirements checklist

• Api specification
  • Ran yarn spec
    • No changes OR API changes has been formally approved
• Unit/Component test coverage
• Correct PR title for the changes (fix, chore, feat)

When build and tests have passed:

• Add code reviewers, for example @qlik-oss/nebula-core

[LiKang6688]

When the listbox is shown, the focus should be on the search box, it will be in other PRs?

[a-m-dev]

I don't think we've discussed that. We only needed to have a tab stop for search field. Is that some new requirement that I'm missing maybe?

[haxxmaxx]

I think that would be nice, since you press "search" to open it. It is also the way it works with the old table

[a-m-dev]

then i think that should come as an option to the popover, because we can have popover on a button which we may not want to have it focused by default (mash up example), will update the pr soon

[haxxmaxx]

then i think that should come as an option to the popover, because we can have popover on a button which we may not want to have it focused by default (mash up example), will update the pr soon

@Caele thoughts on this?

[niekvanstaveren]

then i think that should come as an option to the popover, because we can have popover on a button which we may not want to have it focused by default (mash up example), will update the pr soon

@Caele thoughts on this?

I would say that this is actually the correct behaviour from accessibility perspective. The real issue is probably the design of the popover. We actually faced the same issue with the old table before. If you focus the search field directly how would you know that you have skipped some buttons?

[Caele]

This should work nicely I think. But what Niek mentioned might need some extra stuff, to make sure the user understands that focus shifted.

[a-m-dev]

Yes, I think that requires some design discussions and thinking deeply about what we might take action on it (another PR after we have concrete decisions on it)

[LiKang6688]

LGTM. 👍 Would be nice to update the description as well.

[haxxmaxx]

As Niek says, the problem is already there in the old listbox. Since it is not really a downgrade, but rather aligning the new and the old, I don't think we have to consider it in this PR.

[johanlahti]

Suggested change

	autoFocus,
	autoFocus = true,

and can remove the ?? below

[a-m-dev]

Yes, we can, but saw this comment after merge, sorry 😅