Bug: "ARIA roles used must conform to valid values" in button

[cseas]

Use Case

The below error shows up in the browser (Microsoft Edge) when we check the Elements tab in developer tools.

It's clear that role is being used as a custom Input to the <ht-button> component.

This is wrong, because role is a valid HTML attribute and should never be used as a custom Input: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles

The possible values for the role Input don't conform to valid values of the role HTML attribute and that's why the browser is showing the error.

https://github.com/hypertrace/hypertrace-ui/blob/main/projects/components/src/button/button.ts#L3-L8

Proposal

The role Input should be refactored to something else, e.g, variant. The role HTML attribute is only used for accessibility purposes and shouldn't affect the appearance of the component.

Questions to address (if any)

N/A