feat(illustratedmessage): adding new s2 tokens

[aramos-adobe]

Description

Adding new S2 tokens for illustratedmessage

Validation steps

• [x] Added title and body tokens
• [x] Added CJK tokens

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

To-do list

• [ ] I have read the contribution guidelines.
• [ ] 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. ✨

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: c608159d27e6498a41de3c49f7941709683f406d

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

This PR includes changesets to release 2 packages

Name	Type
@spectrum-css/illustratedmessage	Major
@spectrum-css/dropzone	Major

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

[github-actions[bot]]

File metrics

Summary

Total size: 2.23 MB^* Total change (Δ): 🔴 ⬆ 5.54 KB (0.24%)

Table reports on changes to a package's main file. Other changes can be found in the collapsed Details section below.

Package	Size	Δ
dropzone	12.28 KB	🔴 ⬆ 2.60 KB
illustratedmessage	7.65 KB	🔴 ⬆ 1.68 KB

Details

dropzone

Filename	Head	Compared to base
index.css	12.28 KB	🔴 ⬆ 2.60 KB (26.83%)
metadata.json	6.55 KB	🔴 ⬆ 0.20 KB (3.15%)

illustratedmessage

Filename	Head	Compared to base
index.css	7.65 KB	🔴 ⬆ 1.68 KB (28.14%)
metadata.json	4.70 KB	🔴 ⬆ 1.07 KB (29.29%)

* Size determined by adding together the size of the main file for all packages in the library.
* Results are not gzipped or minified.
* An ASCII character in UTF-8 is 8 bits or 1 byte.

[github-actions[bot]]

🚀 Deployed on https://pr-3246--spectrum-css.netlify.app

[aramos-adobe]

This is looking great! There are some typography tokens that need to be updated to match the spec, and the illustration color token also needs updating, but otherwise colors and layouts are looking good!

A couple of other thoughts I had:

• Could we drop the update tokens commit and use the yarn.lock from spectrum-two? That might be safer than the updates on this branch.
• We'll need to update documentation (like the Docs page in Storybook) for Illustrated message since we're introducing a new variant and t-shirt sizing), I think it'd be ok to do this later once we get these changes in main since we've had a lot of documentation changes between these two branches, but maybe we could ensure that we write a Jira card so we don't lose track of the fact that the work needs to be done? What do you think?

I thought I merged the updates from spectrum-two

[rise-erpelding]

This is looking great! There are some typography tokens that need to be updated to match the spec, and the illustration color token also needs updating, but otherwise colors and layouts are looking good! A couple of other thoughts I had:

• Could we drop the update tokens commit and use the yarn.lock from spectrum-two? That might be safer than the updates on this branch.
• We'll need to update documentation (like the Docs page in Storybook) for Illustrated message since we're introducing a new variant and t-shirt sizing), I think it'd be ok to do this later once we get these changes in main since we've had a lot of documentation changes between these two branches, but maybe we could ensure that we write a Jira card so we don't lose track of the fact that the work needs to be done? What do you think?

I thought I merged the updates from spectrum-two

You did! There were just deviations in the yarn.lock and we probably don't need to increment the tokens/package.json here either. I'm not sure if a git revert on that commit would also do the trick, but the goal would be to avoid committing a new yarn.lock when we merge this branch since we're not making any package changes (anymore).

[aramos-adobe]

Adobe Clean doesn't render correctly for the component anymore 😅

[rise-erpelding]

Adobe Clean doesn't render correctly for the component anymore 😅

Do you have a screen shot of what this looks like for you? I did notice some weirdness with tokens disappearing - like for instance the space between the description and button group would suddenly stop being defined, but I couldn't figure out what was triggering it and so far it's been rendering fine for me.

[aramos-adobe]

Adobe Clean doesn't render correctly for the component anymore 😅

Do you have a screen shot of what this looks like for you? I did notice some weirdness with tokens disappearing - like for instance the space between the description and button group would suddenly stop being defined, but I couldn't figure out what was triggering it and so far it's been rendering fine for me.

Here's the screenshot of how the font renders for illustrated message. Not sure what happened to the tokens but I'm doing some investigation.