[Bug Fix] Radio-group label seems to be having issues with accesibility

[JohnMica]

Problem to solve

the label property on a radio-group returns an ID that unfortunately doesnt exists.

• label prop is created but no ID assigned to it ?
• aria-labelledby created but the ID doesnt exist on SSR page

Proposed solution

• update the prop label to become only the aria-label
• is using a different HTML element as the Label, provide an aria-labellledby that can take a variable / id / etc...

[johnleider]

According to https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute , aria-label should only be used for labels that are not visible. Also the id issue must have been resolved because I wasn't able to reproduce it.

With that being said, while looking into this I found that v-radio-group was using the incorrect elements for a11y. Also that the label in particular wasn't getting the correct css and didn't have the proper height, breaking margin...basically, it was all jacked up.

This will go out with the next 2.2 patch.

[johnleider]

Relevant a11y information:

https://webaim.org/techniques/forms/controls#radio
https://webaim.org/standards/wcag/checklist#sc1.1.1
https://webaim.org/standards/wcag/checklist#sc1.3.1
https://webaim.org/standards/wcag/checklist#sc2.4.6
https://webaim.org/standards/wcag/checklist#sc3.3.2

[KaelWD]

Related to this commit: #10146, #10214