Skip to content

Conversation

@renovate
Copy link
Contributor

@renovate renovate bot commented Apr 4, 2025

This PR contains the following updates:

Package Change Age Adoption Passing Confidence
@spectrum-css/swatchgroup (source) 4.0.0-s2-foundations.15 -> 5.1.0 age adoption passing confidence

Release Notes

adobe/spectrum-css (@​spectrum-css/swatchgroup)

v5.1.0

Compare Source

Minor Changes

📝 205182b Thanks @​castastrophe!

v5.0.1

Compare Source

Patch Changes

📝 #​3534 68e0057 Thanks @​castastrophe!

Fixes a bug in the content of the dist/index-theme.css file.

Expected index-theme.css to include the component selectors with component-level custom properties mapped to the --system prefixed ones in order to allow a component to support various contexts.

Expected output example for the index-theme.css:

.spectrum-ActionButton {
  --spectrum-actionbutton-background-color-default: var(--system-action-button-background-color-default);
  --spectrum-actionbutton-background-color-hover: var(--system-action-button-background-color-hover);

v5.0.0

Compare Source

Major Changes

📝 #​2786 6c19fcf Thanks @​pfulton!

🛑 Breaking change

This major update creates a bridge between the Spectrum 1 (S1) and Spectrum 2 (S2) designs, dubbed "Spectrum 2 Foundations". These do NOT reflect a fully migrated S2 component. This approach allows consumers to swap the appearance of their components between S1, Express, and S2 by leveraging a "system" layer that remaps the necessary component-level tokens to the appropriate token dataset.

For these components to appear S2, you must load the assets with the @spectrum-css/tokens at v16 or higher.

For S1 or Express, load assets with the @spectrum-css/tokens at v14.x or v15.x.

If you are looking to implement a fully S2 design, please explore the next tag releases instead of using this foundations release. This release is used in Spectrum Web Components 1.x.

Deprecations

The metadata folder containing the mods.md and metadata.json assets has been removed from source. To find information about the components including what selectors, modifiers, and passthroughs are used, please see the dist/metadata.json asset shipped with every component containing CSS.

The index-vars.css asset has been removed in this release as it was previously deprecated and is no longer maintained. Please use the index.css or index-base.css

File usage

If you are rendering components and need only the S2 Foundations styles, you can make use of the index.css asset which contains all the base styles plus the system mappings for S2 Foundations.

If you are using this version to publish only an S1 or Express component, you can use the index-base.css plus the desired themes/(spectrum|express).css file.

To render a component that can be easily swapped between the S2 Foundations, S1, or Express contexts, load index-base.css with the index-theme.css file and leverage the appropriate context classes (.spectrum--legacy for S1 and .spectrum--express for Express).

Patch Changes

v4.0.1

Compare Source

Patch Changes

📝 #​3522 7a47c22 Thanks @​castastrophe!

v4.0.0

Compare Source

Major Changes

📝 #​3502 562396e Thanks @​castastrophe!

  • Remove empty theme references to reduce complexity for components that don't need to define any mappings. This involves removing the source themes directories with the empty spectrum.css and express.com files as well as removing the following empty or unnecessary exports:

    • index-base.css
    • index-theme.css
    • themes/spectrum.css
    • themes/express.css
Patch Changes

v4.0.0-s2-foundations.17

Compare Source

Major Changes
  • #​2786 7fa37a7 Thanks @​pfulton! - Removes empty theme assets from the component; no longer publishing a themes folder or index-theme.css map.

v4.0.0-s2-foundations.16

Compare Source

Major Changes
  • #​2786 f6ad55e Thanks @​pfulton! - feat: s2 foundations non-gray-800 colors update

    Property name Context Old value Updated value
    --spectrum-blue-800 dark rgb(69, 110, 254) rgb(64, 105, 253)
    --spectrum-red-800 dark rgb(230, 54, 35) rgb(223, 52, 34)
    --spectrum-orange-800 dark rgb(205, 86, 0) rgb(199, 82, 0)
    --spectrum-yellow-800 dark rgb(169, 110, 0) rgb(164, 106, 0)
    --spectrum-chartreuse-800 dark rgb(109, 131, 0) rgb(106, 127, 0)
    --spectrum-celery-800 dark rgb(69, 138, 19) rgb(66, 134, 18)
    --spectrum-green-800 dark rgb(6, 140, 82) rgb(6, 136, 80)
    --spectrum-seafoam-800 dark rgb(8, 138, 116) rgb(8, 134, 112)
    --spectrum-cyan-800 dark rgb(15, 128, 194) rgb(13, 125, 186)
    --spectrum-indigo-800 dark rgb(119, 97, 252) rgb(116, 91, 252)
    --spectrum-purple-800 dark rgb(161, 84, 229) rgb(157, 78, 228)
    --spectrum-fuchsia-800 dark rgb(192, 64, 212) rgb(186, 60, 206)
    --spectrum-magenta-800 dark rgb(231, 41, 105) rgb(224, 38, 101)
    --spectrum-pink-800 dark rgb(220, 47, 156) rgb(213, 45, 151)
    --spectrum-turqoise-800 dark rgb(9, 135, 147) rgb(9, 131, 142)
    --spectrum-brown-800 dark rgb(148, 118, 73) rgb(143, 114, 69)
    --spectrum-silver-800 dark rgb(123, 123, 123) rgb(118, 118, 118)
    --spectrum-cinnamon-800 dark rgb(179, 103, 64) rgb(176, 98, 59)
Patch Changes

Configuration

📅 Schedule: Branch creation - "after 12pm on thursday" in timezone America/Los_Angeles, Automerge - At any time (no schedule defined).

🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.

Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about this update again.


  • If you want to rebase/retry this PR, check this box

This PR was generated by Mend Renovate. View the repository job log.

@renovate renovate bot requested a review from a team as a code owner April 4, 2025 17:41
@renovate renovate bot added the Spectrum CSS label Apr 4, 2025
@changeset-bot
Copy link

changeset-bot bot commented Apr 4, 2025

🦋 Changeset detected

Latest commit: 6e1a034

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

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

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
Copy link
Contributor

github-actions bot commented Apr 4, 2025

Branch preview

Review the following VRT differences

When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:

If the changes are expected, update the current_golden_images_cache hash in the circleci config to accept the new images. Instructions are included in that file.
If the changes are unexpected, you can investigate the cause of the differences and update the code accordingly.

@github-actions
Copy link
Contributor

github-actions bot commented Apr 4, 2025

Tachometer results

Chrome

swatch permalink

basic-test

Version Bytes Avg Time vs remote vs branch
npm latest 462 kB 13.70ms - 14.39ms - faster ✔
7% - 13%
1.05ms - 2.12ms
branch 436 kB 15.22ms - 16.03ms slower ❌
7% - 15%
1.05ms - 2.12ms
-
Firefox

swatch permalink

basic-test

Version Bytes Avg Time vs remote vs branch
npm latest 462 kB 32.89ms - 35.51ms - unsure 🔍
-10% - +1%
-3.61ms - +0.41ms
branch 436 kB 34.27ms - 37.33ms unsure 🔍
-1% - +11%
-0.41ms - +3.61ms
-

@renovate renovate bot force-pushed the renovate/spectrum-css-swatchgroup-5.x branch 2 times, most recently from 2ffaa03 to 21a4d6e Compare April 4, 2025 22:11
@renovate
Copy link
Contributor Author

renovate bot commented Apr 4, 2025

Edited/Blocked Notification

Renovate will not automatically rebase this PR, because it does not recognize the last commit author and assumes somebody else may have edited the PR.

You can manually request rebase by checking the rebase/retry box above.

⚠️ Warning: custom changes will be lost.

@castastrophe castastrophe self-assigned this Apr 5, 2025
@castastrophe castastrophe added Component: Swatch Includes Swatch group Component: Swatch Group Status: Ready for review PR ready for review or re-review. labels Apr 5, 2025
@castastrophe castastrophe force-pushed the renovate/spectrum-css-swatchgroup-5.x branch 2 times, most recently from 0c20116 to f1d8f02 Compare April 10, 2025 22:57
@castastrophe castastrophe removed the Status: Ready for review PR ready for review or re-review. label Apr 10, 2025
@castastrophe castastrophe force-pushed the renovate/spectrum-css-swatchgroup-5.x branch 2 times, most recently from a5f2c57 to f40c03b Compare April 18, 2025 17:43
@castastrophe castastrophe force-pushed the renovate/spectrum-css-swatchgroup-5.x branch 2 times, most recently from f7bc278 to 416d73f Compare April 23, 2025 16:28
@castastrophe castastrophe added the Status: On hold PR on hold for whatever reason, including the work requiring more discussion label Apr 23, 2025
Copy link
Contributor

@castastrophe castastrophe left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@caseyisonit Are you okay if I close this one? The changes result in a lot of regressions in the baselines so I don't think there's value in updating this right now.

@castastrophe castastrophe force-pushed the renovate/spectrum-css-swatchgroup-5.x branch from 416d73f to 0bbb7d4 Compare April 25, 2025 22:19
@castastrophe castastrophe force-pushed the renovate/spectrum-css-swatchgroup-5.x branch from 0bbb7d4 to 6e1a034 Compare May 5, 2025 18:32
@renovate
Copy link
Contributor Author

renovate bot commented May 5, 2025

Renovate Ignore Notification

Because you closed this PR without merging, Renovate will ignore this update. You will not get PRs for any future 5.x releases. But if you manually upgrade to 5.x then Renovate will re-enable minor and patch updates automatically.

If you accidentally closed this PR, or if you changed your mind: rename this PR to get a fresh replacement PR.

@renovate renovate bot deleted the renovate/spectrum-css-swatchgroup-5.x branch May 5, 2025 18:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Component: Swatch Includes Swatch group Spectrum CSS Status: On hold PR on hold for whatever reason, including the work requiring more discussion

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants