[React] Pagination component accessibility improvements

[sawyerh]

Mayflower version: 11.4.1

There are a number of potential accessibility improvements for the Mayflower Pagination component:

1. It does not indicate to screen readers which page is currently selected, although there is visual styling to indicate this for sighted users. aria-current="true" could be set on the selected page number.
2. <a> element is used for essentially a <button>. The elements could instead be changed to a <button> if this behavior is preserved, however it would also be useful for projects to be able to define the href of the <a> element so that it behaves like a link. This would allow projects to render the component as static HTML and preserve the active page number state in the page URL. For example:

   <Pagination pages={[ { active: false, text: "2", href: "/my-page?page=2" } ]} ...

More details about accessible pagination components: https://www.a11ymatters.com/pattern/pagination/

[clairesunstudio]

Good points! we probably initially just ported the component from pattenlab which was created for mass.gov only which didn't take into account SPAs. I will add this as a ticket to surface it on our Jira board, or if you are interested in submitting a PR you are very welcome to do so.

[clairesunstudio]

For 1. aria-current isn't supported in IE and firefox https://developer.mozilla.org/en-US/docs/Web/API/Element/ariaCurrent. But we should definitely announce current page in aria-label
For 2. I noticed we are using <a> with role="button"