[EuiModal] Accessibility

[cjcenizal]

From elastic/kibana#11823.

We need to make sure our modals are keyboard- and screen-reader-accessible. For the full breakdown, see https://www.marcozehe.de/2015/02/05/advanced-aria-tip-2-accessible-modal-dialogs/.

Here's an example of some of the markup we need:

<div role="dialog" aria-labelledby="modalTitle" aria-describedby="modalDescription">
  <div id="modalTitle">Save "untitled" document?</div>
  <div id="modalDescription">You have made changes to "untitled.txt" that have not been saved. What do you want to do?</div>
  <button type="button">Save changes</button>
  <button type="button">Discard changes</button>
  <button type="button">Cancel</button>
</div>

Here are the crib notes:

• Add role="dialog" to the Modal root element.
• Use aria-labelledby and aria-describedby to point screen readers to the title and body text of the modal.
• When the modal is opened, focus on the first tabbable element.
• Use JS to trap tabbing within the modal. Add keypress handlers to the first and last tabbable elements so that tabbing from the last element focuses on the first one, and shift-tabbing from the first element focuses on the last one.
• Add an ESC keypress handler, so hitting escape closes the modal.
• When the modal is closed, use JS to restore focus to the element which was last focused (this should be the button which was clicked to open the modal).

[myasonik]

Adding onto here for when we get around to fixing modals: we should also probably upgrade our focus trapping (at least on modals but probably on other things too) to use react-focus-on instead of react-focus-lock which we currently use. (Explanation as to why is in the react-focus-on readme.

[chandlerprall]

🎯The final solution for WAI ARIA compatible modal dialogs or full-screen tasks.

🤣🎢

For people who don't click through to react-focus-on, it is react-focus-lock plus

• disables page scroll and user interactions using react-remove-scroll
• hides rest of a page from screen-readers using aria-hidden

[chandlerprall]

At least some of the changes mentioned here have been applied, and the rest are now being tracked in #3889