fix(rux-segmented-button) allow tabbing between segmented button sets.

kiley-mitti commented 1 year ago

Brief Description

rux-segmented-button is radio group under the hood. Because all of the segmented button groups were named the same thing, there were issues tabbing between them. This fix adds 5 random numbers to the name of the underlying inputs so that when two button sets are next to each other, you can tab between them as expected.

JIRA Link

ASTRO-5270

Related Issue

General Notes

Motivation and Context

This isn't a huge gamebreaking issue.. especially since segmented buttons are suggested only to be used in certain situations. But keyboard controls not functioning as one would expect can be hugely annoying so its worth shoring up anyways.

Issues and Limitations

Random numbers are generally not a great idea but in this specific instance I think its alright since no one can access the 'name' property on input anyway.

Types of changes

[x] Bug fix
[ ] New feature
[ ] Breaking change

Checklist

[ ] This PR adds or removes a Storybook story.
[x] I have added tests to cover my changes.
[x] Regressions are passing and/or failures are documented
[x] Changes have been checked in evergreen browsers

changeset-bot[bot] commented 1 year ago

🦋 Changeset detected

Latest commit: 634e3331ba8ffa9c6c1b26e79ceb44118ba66799

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

netlify[bot] commented 1 year ago

Deploy Preview for astro-preview ready!

Name	Link
Latest commit	634e3331ba8ffa9c6c1b26e79ceb44118ba66799
Latest deploy log	https://app.netlify.com/sites/astro-preview/deploys/652ea2b1f4a9620007176180
Deploy Preview	https://deploy-preview-1227--astro-preview.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] commented 1 year ago

Deploy Preview for astro-stencil ready!

Name	Link
Latest commit	634e3331ba8ffa9c6c1b26e79ceb44118ba66799
Latest deploy log	https://app.netlify.com/sites/astro-stencil/deploys/652ea2b1e0cb0e0008c45c4f
Deploy Preview	https://deploy-preview-1227--astro-stencil.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

RocketCommunicationsInc / astro