feat(alertbanner): migrate to spectrum 2

[jawinn]

Description

Alert banner now uses Spectrum 2 tokens and specifications. In this new design, the divider has been removed. Some spacing has been updated to match the specs. Includes a custom MDX "Docs" page for Storybook, along with some updated Storybook coverage.

TO-DO before final review and merge:

1. Integrate new icons when they are available for use.
2. Make sure tokens release is made and set with revised alert-banner-top-to-workflow-icon value. This will move the icon up slightly to align better with the text. -- this should be complete, but needs to be verified

The following mod custom properties have been changed:

• --mod-alert-banner-size was renamed to --mod-alert-banner-inline-size
• --mod-alert-banner-neutral-background was previously misspelled. The mod --mod-alert-banner-background was also added, which will take precendence over the variant background mods.
• --mod-alert-banner-top-text was renamed to --mod-alert-banner-top-to-text
• --mod-alert-banner-top-icon was renamed to --mod-alert-banner-top-to-icon
• --mod-alert-banner-bottom-text was renamed to --mod-alert-banner-bottom-to-text
• --mod-alert-banner-start-edge was renamed to --mod-alert-banner-inline-start-to-content
• --mod-alert-banner-edge-to-button was renamed to --mod-alert-banner-block-edge-to-button
• The spacing on either side of the close button is now controlled by two separate mods; --mod-alert-banner-close-button-to-inline-end and --mod-alert-banner-close-button-to-content. The previous --mod-alert-banner-close-button-spacing has been removed.

CSS-704

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

• [ ] Design team review approval [ @jawinn ]
• [x] The divider and its relevant code no longer exists
• [x] Test the Default story as well as the Chromatic testing preview. This looks like the design spec.
• [ ] Updated spacing looks correct. There should not be extra vertical spacing between text and button when the button wraps to the next line (as compared to current version in S1 which has this issue).
• [ ] The text of the button in alert banner is now customizable within Storybook. When empty, the button does not appear (note: this will likely trigger a "Rendered fewer hooks than expected.." error which is a known issue in our stories that contain a component that uses updateArgs. Refresh the page and it will render properly).
• [ ] Proofread migration guide updates

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.

Screenshots

WIP

To-do list

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