Simplify the Inserter accessibility

[afercia]

Description

This PR aims to simplify the Inserter accessibility. The Inserter is now based on collapsible accordions and many a11y things were implemented with the previous version in mind. Please refer to the related issue #7052 for more details

• removes the ARIA roles
• removes arrows navigation
• removes the active item tracking
• uses a list for the items list

Using a list adds an useful information for users: assistive technologies will announce the total number of items in a list and some screen readers will also announce the position of each item. See screenshot below:

Worth noting Safari has a bug (or "feature"?) and doesn't expose styled lists as lists. It needs an explicitly set ARIA role list which would trigger a jsx-a11y validation error (while the W3C validator throws just a warning). It's a known Safari bug you can test on this pen: https://codepen.io/afercia/full/WxmJWx/

Check the Safari dev tools > "node" tab, and see the styled ul has "no matching ARIA roles". Now that Chrome has a nice accessibility tab, you can double check on Chrome and see it correctly exposes the styled list as list. So, it seems Safari-specific.

How has this been tested?

• npm test
• rebased to latest changes from Improve child blocks API's and UI. #7003 / Inserter Tweaks for Child Blocks #6998 and tested

Fixes #7052

[afercia]

Advantages:

• there's a lot of red in the diff
• keyboard interaction and a11y is simpler
• it will further improve when tabbing will be constrained, see Add a higher order component to constrain Tab keyboard navigation. #6987
• screen reader users already have tools to "jump" through the block type groups: the headings (there are also shortcuts to jump through lists)

[mtias]

there's a lot of red in the diff

Always good!

[youknowriad]

LGTM 👍