fix(sideNav): implemented aria-hidden, implemented tab-index #229

[gselderslaghs]

Proposed changes

Desktop navbar and sidenav are basically 2 html components, as mentioned in issue [#229] this causes a web accessibility reduction in usability by screenreaders as both navigations are exposed to the accessibility API.

Who does this affect?

• People who rely on keyboard control
• People with dexterity impairments using voice control or a keyboard-like switch device
• People with low vision who use screen magnification with keyboard control
• People using a screen reader, including blind, low vision, and neurodivergent people
• Neurodivergent people who use the keyboard
• Older adults who use the keyboard

Codepen:

Codepen

Types of changes

Implemented aria-hidden and tab-index states to fix the duplicate exposure to the accessibility API. This ensures the WCAG standard Focus Visible (Level AA) that applies to SC 2.4.7 meets the requirements

• Bug fix (non-breaking change which fixes an issue).
• New feature (non-breaking change which adds functionality).
• Breaking change (fix or feature that would cause existing functionality to change).

Checklist:

• I have read the CONTRIBUTING document.
• My commit messages follows the conventional commit format
• My change requires a change to the documentation, and updated it accordingly.
• I have added tests to cover my changes.
  • Test using the IBM Equal Access Accessibility Checker browser extension or integration testing module to identify issues detected for this requirement
  • Check component keyboard interaction
• All new and existing tests passed.

[wuda-io]

LGTM

[wuda-io]

The dist files have a conflict. We should add the dist directory to .gitignore i think.

[gselderslaghs]

The dist files have a conflict. We should add the dist directory to .gitignore i think.

@wuda-io
This might be a fault as of my commit, as dist files should be in the release branches for projects that are not depending on compiling the assets, it was implemented according to including the compiled assets in the CodePen example
Would it be sufficient reverting the changes on the dist files and changing the CodePen examples with screenshots of the scenario?

[wuda-io]

It's ok, don't mind. Someone suggested to do this a while ago. So no problem, I fixed it. The dist files should be available via Release page, cdn or npm directly.