docs(popover, radio, rating, sidenav): site docs to storybook

[jawinn]

Description

This continues the migration work to move the documentation from the deprecated docs site to Storybook, covering the components Popover, Radio, Rating, and Sidenav. Variants shown on the docs site for these components have been added to Storybook as new stories if they did not already exist. No custom MDX files were needed for these components.

Component-specific changes and notes:

• Popover
  • Docs notes have been moved to relevant stories where possible, and many have been reworded to make them easier to understand.
  • Displays the formerly chromatic-only list of all positions in a story or the docs, now organized within columns in a grid. All positions are within one Docs story instead of being spread out amongst different examples.
  • FIX: Refactors and improves some of the play() functions. Fixes the issue where clicking between the different Storybook stories for Popover would result in the Popover sometimes closing instead of being open.
  • FIX: The vertical transition (of the translateY) now appears when the popover is toggled. As it does on the docs site. Some of the custom positioning JS in Storybook was preventing it.
• Radio
  • Increases Storybook coverage of the missing selected/checked + not emphasized; previously this was only showing emphasized + selected.
  • Separates disabled, read-only, and emphasized options out into their own Docs stories for the user's view, as single radios would not have those options mixed in a group of radios.
  • Also includes a connected fix for Field group, to include a missing role="radiogroup" and to make use of aria-readonly for radios.
• Rating
  • Minor cleanup; adjusts some stories and controls to improve documentation and make sure that any docs site documentation is represented.
• Sidenav
  • Migrates some of the story descriptions from the docs page, and adjusts story content to clarify what is being displayed
  • Adds additional description to document disabled and selected.

Other overall Storybook updates:

• Repurposes sizing decorator for use in docs: Modifies the existing unused sizing decorator to avoid repetition within the docs. Once merged, this can also be used in Icon and PickerButton (as of PR #2854). Moves the sizing map with size display names to helpers, so it can be used throughout the rest of the stories.
• Adjusts global story sorting config to put "Sizing" and "Standard" at the start (after "Default"), which matches the convention on the docs site, where these stories typically appear first.

How and where has this been tested?

Please tag yourself on the tests you've marked complete to confirm the tests have been run by someone other than the author.

Validation steps

• [x] Popover - includes all necessary information compared to the docs site
• [x] Popover fix - shows vertical transition when open is toggled on the Default story
• [x] Popover fix - clicking between Default and Default with tip stories should keep the popover open
• [x] Radio - includes all necessary information compared to the docs site
• [x] Rating - includes all necessary information compared to the docs site
• [ ] Sidenav - includes all necessary information compared to the docs site

Regression testing

Validate:

1. The documentation pages for at least two other components are still loading, including:

• [ ] The pages render correctly, are accessible, and are responsive.

2. If components have been modified, VRTs have been run on this branch:

• [ ] VRTs have been run and looked at.
• [ ] Any VRT changes have been accepted (by reviewer and/or PR author), or there are no changes.

To-do list

• [x] I have read the contribution guidelines.
• [x] I have updated relevant storybook stories and templates.
• [ ] I have tested these changes in Windows High Contrast mode.
• [ ] If my change impacts other components, I have tested to make sure they don't break.
• [x] If my change impacts documentation, I have updated the documentation accordingly.
• [ ] ✨ This pull request is ready to merge. ✨