Fix issue with nested interactive elements in the Modal component

[julianguyen]

Description

In the Modal component (code), the element that opens the modal has a role="button" on it. This causes a problem because the nested element should be an interactive element like a button or link. This will reduce the quality of the screen-reader experience.

We want to remove this role if the child element has a role and is an interactive element. For safe measure, keep role="button" if the child element doesn't have a role and is an interactive element.

---

Please assign yourself (via the Assignees dropdown), if you do want to work on this issue. Can't find yourself? You need to join our organization.

Check out our Picking Up Issues guide if you haven't already!

[AudreyKj]

Hello! I just assigned myself and would like to work on this :)

[julianguyen]

Awesome, thanks @AudreyKj! Hope you're doing well :)