Dialog: Full screen & Bottom sheet support

[joshblack]

Previous Pull Request: #4048

Closes https://github.com/github/primer/issues/2414
Closes https://github.com/github/primer/issues/2413

Note: I've chosen not to tackle the issues mentioned here to avoid causing any disruptive changes.

Changelog

New

1️⃣ action-sheet dialog

We've implemented a range slider to easily adjust the size of the dialog using only a keyboard, enhancing accessibility. We've used a similar approach for our SplitPageLayout resizer. I've also implemented reduced-motion support.

Screen.Recording.2023-12-12.at.17.14.30.mov

keyboard.mov

2️⃣ full-screen dialog

This is quite simple, as it closely resembles the existing dialog behavior, with the only difference being that it's full-screen.

Screen.Recording.2023-12-12.at.17.15.47.mov

Changed

• Storybook features always display dialogs in an open state so that snapshots can effectively capture any changes.
• Removed the ability to change props in features for simplicity and consistency with other components
• In the example called 'WithCustomRenderers', I've placed the header, content, and footer components inside the 'WithCustomRenderers' component. This change improves readability, especially when highlighting the code.

Removed

Rollout strategy

• Patch release
• Minor release
• Major release; if selected, include a written rollout or migration plan
• None; if selected, include a brief description as to why

Testing & Reviewing

Merge checklist

• Added/updated tests
• Added/updated documentation
• Added/updated previews (Storybook)
• Changes are SSR compatible
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge
• (GitHub staff only) Integration tests pass at github/github (Learn more about how to run integration tests)

[langermank]

Closing in favor of the followup PRs we've merged