Dialog/Drawer ARIA enhancements

[jaredcwhite]

Currently the Dialog & Drawer components use role="dialog" but otherwise do not offer ARIA attributes. We should review how to ensure accessible markup is generated, and that even includes two different role possibilities…for example:

<div
  id="alert-dialog"
  role="alertdialog"
  aria-modal="true"
  aria-labelledby="dialog_label"
  aria-describedby="dialog_desc">
  <h2 id="dialog_label">Confirmation</h2>
  <div id="dialog_desc">
    <p>Are you sure you want to delete this image?</p>
    <p>This change can't be undone.</p>
  </div>
  ...
</div>

and

<div
  role="dialog"
  aria-labelledby="dialog1Title"
  aria-describedby="dialog1Desc">
  <h2 id="dialog1Title">Your personal details were successfully updated</h2>
  <p id="dialog1Desc">
    You can change your details at any time in the user account section.
  </p>
  <button>Close</button>
</div>

as presented in: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/alertdialog_role and: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/dialog_role

[jaredcwhite]

Closing, already implemented and being used in uptake.