[calcite-shell-center-row] Add `role="dialog"` for proper structure to assistive technology

[tayMAPNeil]

Description

In the a11y audit it was determined that <arcgis-table> needed proper dialog structure to convey dialog boundaries to AT.

<arcgis-table> sits inside <calcite-shell-center-row>. Since <arcgis-table> can be used in other components, it was determined that it would not be appropriate to add it to the table component itself.

Currently we have the application setting the role and aria-live/aria-label attributes on <calcite-shell-center-row>.

Acceptance Criteria

Have the role="dialog" and aria attributes (aria-live, aria-label) set on the calcite-shell-center-row component itself.

Relevant Info

This is a common use case in MapViewer. Since the role is always needed(?) we would like for it to be added to the component itself so the app doesn't have to set it in the future.

Which Component

calcite-shell-center-row

Example Use Case

Example of role="dialog" used with aria-label and aria-live="polite" for Calcite's popover that provides context to AT when changes have occurred here.

Priority impact

p4 - not time sensitive

Esri team

ArcGIS Online

[macandcheese]

cc @geospatialem would this apply to Shell Panel as well or Center Row that are always present / don’t have a table as slotted content? May need to update Shell Panel or provide guidance depending on if it’s always needed based on content.

[geospatialem]

would this apply to Shell Panel as well or Center Row that are always present / don’t have a table as slotted content? May need to update Shell Panel or provide guidance depending on if it’s always needed based on content.

We could add a prop for both shell-panel and shell-center-row for folks to add it where it makes sense to their workflow. Concur with your thoughts, would be dependent on the workflow need.

And agree, we could provide some guidance with a sample, and some context in the Accessibility section, too. 👍🏻