menu → focus-group refactoring

[ai]

• Rename menuKeyUX to focusGroupKeyUX with all files and tests
• Add role="listbox" support in additional to role="menu"
• Add role="tablist" support in additional to role="menu"
• Add role="toolbar" support with horizontal default direction.
• Add role="menubar" support with horizontal default direction.
• Update docs to explain listbox and tablist support

[dmitry-kurmanov]

@ai could you please clarify how to run tests in the project?

If I understand it correctly the test command from package.json runs:

• lint
• coverage (failed for some reasons)
• build
• size-limit

But what about the tests themselves?

[ai]

test:coverage script is a script of unit tests. It runs better-node-test, which is a wrapper around node --test.

You need to update Node.js (I recommend latest 20.x).

[dmitry-kurmanov]

I think that the issue might be more complex because of various possible item roles:

1. menu and menubar require menuitem item role - see the w3c example
2. listbox requires option item role - the w3c example
3. tablist require tab item role - example

As for toolbar it might be a problem because it can contains different types of items e.g. button, spinbutton, checkbox, radio etc - the toolbar example

I propose to support menubar, listbox, and tablist within this issue and create a separate one for toolbar.

@ai what do you think?

[ai]

Yes, we can do toolbox in a separated PR

[dmitry-kurmanov]

@ai here is my draft PR #16 (without toolbox). Can you please look at it?

I have not added new groups to the doc yet. I need some clarifications. Do we want to add all new supported focus group types to the doc?

upd I found the explanation:

Update docs to explain listbox and tablist support

I will update the PR tomorrow

[ai]

Forgot to close