feat(icons)!: s2 icons (workflow + ui) v2

[jawinn]

Description

Uses and updates to the latest icon sets for S2.

🚨 This is a breaking change.

Workflow icons

Uses the latest version of this package. There is a large difference between the set of icons available for S1 and S2. These differences are documented separately from this work.

UI icons

Updates the ui-icons package with the latest set of icons. This includes deprecations and some new icons. See the change set in this PR for a full list of changes.

The UI icons no longer contain both a medium and a large SVG asset. The file structure and loading have been changed to use the single asset.

Icon component storybook updates

Adds additional templates for displaying and testing the different icon sets. Includes a grid with sizing numbers in the Default story Chromatic template that displays UI icons. See screenshots below.

TO-DO:

• Newly added UI icons do not yet have tokens available for their sizes (that define width/height for both platform scales). We may need to hide these temporarily unless the tokens can be released first.
  • add-icon-size-50
  • add-icon-size-75
  • add-icon-size-100
  • add-icon-size-200
  • add-icon-size-300
  • drag-handle-icon-size-75
  • drag-handle-icon-size-100
  • drag-handle-icon-size-200
  • drag-handle-icon-size-300
  • gripper-icon-size-100
  • link-out-icon-size-100
  • link-out-icon-size-200
  • link-out-icon-size-300
  • link-out-icon-size-400

History

This branch is a rebased and updated version of #2836 that:

• Resolves major differences between main and the s2 icons branch after rebase.
• Adds additional error handling and logging
• Fixes a few issues with UI icons rendering the wrong size, some missing S1 icons, and sorting.

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

WIP

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

Default story's updated Chromatic template:

Story: list of workflow icons:

Story: list of UI icons:

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.
• [ ] If my change impacts documentation, I have updated the documentation accordingly.
• [ ] ✨ This pull request is ready to merge. ✨