refactor Dialog to use <dialog> internally

[keithamus]

Reviewers: By approving this Pull Request you are approving the code change, as well as its deployment and mitigation plans.
Please read this description carefully. If you feel there is anything unclear or missing, please ask for updates.

What are you trying to accomplish?

This PR removes the modal-dialog element we had created to "ponyfill" the native dialog element. Now that native <dialog> is well supported, we can simply use that and remove the vast majority of our code.

We still need a <dialog-helper> element for 2 features:

• Our dialog-show/close-id attributes. These will be resolved one day by Invokers (Add invokers (invoketarget & invokeaction) whatwg/html#9841)
• Closing the dialog on backdrop click. This will be one day resolved by Bikeshed a name for "light dismiss for dialog" openui/open-ui#834

Screenshots

It is identical in appearance.

Integration

Yes there is a subtle difference which we'll need to change code in dotcom for.

Our modal-dialog element mistakenly dispatches the cancel or close events on a dialog. This

List the issues that this change affects.

Risk Assessment

• Low risk the change is small, highly observable, and easily rolled back.
• Medium risk changes that are isolated, reduced in scope or could impact few users. The change will not impact library availability.
• High risk changes are those that could impact customers and SLOs, low or no test coverage, low observability, or slow to rollback.

What approach did you choose and why?

Anything you want to highlight for special attention from reviewers?

Accessibility

• Fixes axe scan violation - This change fixes an existing axe scan violation.
• No new axe scan violation - This change does not introduce any new axe scan violations.
• New axe violation - This change introduces a new axe scan violation. Please describe why the violation cannot be resolved below.

Merge checklist

• Added/updated tests
• Added/updated documentation
• Added/updated previews (Lookbook)
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge

Take a look at the What we look for in reviews section of the contributing guidelines for more information on how we review PRs.

[changeset-bot]

🦋 Changeset detected

Latest commit: 2928786

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

This PR includes changesets to release 1 package

Name	Type
@primer/view-components	Minor

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

[camertron]

One last thing: the screenshots are showing a different text color for the body, is that intentional? Approving for now 👍

[keithamus]

Yeah we should pause on this for a tick because there are some CSS issues that need resolving (e.g. primer/css#2563)

[langermank]

Looks like the visual changes are gone 😄

[camertron]

Sadly I had to revert this in #2468