chore: script clean-up for packages and tokens[swc-808] #5419

castastrophe · 2025-04-30T16:05:45Z

Description

Process-spectrum is a command that runs several scripts that auto-generate and compile stylesheets from @spectrum-css repo and the spectrum-config defined in component directories. This rewrites every stylesheet each time it runs to catch differences in the output.

Process-spectrum runs in many of our commands in the package.json as a dependency or directly called. We need to remove it and check that yarn build no longer compiles styles.

Related issue(s)

SWC-808
SWC-809

How has this been tested?

I expect the Spectrum CSS assets not to be imported or regenerated by the yarn build command
I expect all previously generated CSS files are checked into the repository, where they will become the source for future edits.
I expect all commands besides process-spectrum continue to run correctly and produce correct output; all tests still pass.

Checklist

I have signed the Adobe Open Source CLA.
My code follows the code style of this project.
If my change required a change to the documentation, I have updated the documentation in this pull request.
I have read the CONTRIBUTING document.
[n/a] I have added tests to cover my changes.
All new and existing tests passed.
I have reviewed at the Accessibility Practices for this feature, see: Aria Practices

Best practices

This repository uses conventional commit syntax for each commit message; note that the GitHub UI does not use this by default so be cautious when accepting suggested changes. Avoid the "Update branch" button on the pull request and opt instead for rebasing your branch against main.

changeset-bot · 2025-04-30T16:05:48Z

⚠️ No Changeset found

Latest commit: 729d1bc

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

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

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

package.json

github-actions · 2025-04-30T16:08:01Z

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 · 2025-04-30T16:10:51Z

Tachometer results

Currently, no packages are changed by this PR...

tasks/watch-css.js

tasks/run-check-cem.js

scripts/process-icons.js

packages/icons-workflow/package.json

.github/CODEOWNERS

.gitignore

INVENTORY.md

projects/documentation/scripts/copy-component-docs.js

tasks/build-css.js

tasks/build-react.js

package.json

castastrophe · 2025-05-06T17:41:35Z

package.json

        "docs:production": "yarn workspace documentation build:production",
        "docs:review": "alex packages/**/*.md",
        "docs:start": "yarn workspace documentation serve --watch",
-        "find": "test -f custom-elements.json",
-        "format:css": "yarn lint:css --fix && pretty-quick --pattern \"{packages,tools}/**/*.css\"",


I removed this formatter since we're looking to migrate to lint-staged but we can bring back a forced formatting command if we need it.

does lint-staged need to be merged in first?

No I don't think it does, the format:css command isn't called by anything so it's really just a question of if anyone is manually using this one.

i have never used it fwiw

castastrophe · 2025-05-06T17:43:12Z

package.json

@@ -48,31 +46,20 @@
        "lint:packagejson": "pretty-quick --pattern package.json --pattern \"packages/*/package.json\" --pattern \"projects/*/package.json\" --pattern \"tools/*/package.json\" --pattern \"react/*/package.json\"",
        "lint:ts": "pretty-quick --pattern \"packages/**/*.ts\" && eslint -f pretty \"packages/**/*.ts\" && pretty-quick --pattern \"tools/**/*.ts\" && eslint -f pretty \"tools/**/*.ts\"",
        "lint:versions": "node ./scripts/lint-versions.js",
-        "new-package": "cd projects/templates && plop",


You can see this updated below, we don't have to move into the directory to run the command since we can leverage yarn workspaces

projects/documentation/package.json

custom-elements-manifest.config.js

* chore: remove spectrum-config.js files from various packages * chore; remove spectrum-css dependencies * chore: remove unused @spectrum-css dependencies from yarn.lock * Update packages/icons-ui/package.json * Update packages/icons-ui/package.json --------- Co-authored-by: Casey Eickhoff <48574582+caseyisonit@users.noreply.github.com>

* chore: add styling guide * chore: remove spectrum-config and update other docs * fix: update yarn new-package to not depend on spectrum-css * chore: update styling guide * chore: remove formating from plopfile

Co-authored-by: rise-erpelding <54716846+rise-erpelding@users.noreply.github.com>

* chore: move tasks into scripts [swc-854] * chore: update custom element manifest scripts to simpify

castastrophe commented Apr 30, 2025

View reviewed changes

package.json Show resolved Hide resolved

castastrophe force-pushed the castastrophe/swc-808-disable-process-spectrum branch 3 times, most recently from e0f9c5f to 5945a6d Compare May 1, 2025 16:53

castastrophe commented May 1, 2025

View reviewed changes

tasks/watch-css.js Outdated Show resolved Hide resolved

castastrophe commented May 1, 2025

View reviewed changes

tasks/run-check-cem.js Outdated Show resolved Hide resolved

castastrophe commented May 1, 2025

View reviewed changes

scripts/process-icons.js Outdated Show resolved Hide resolved

castastrophe commented May 1, 2025

View reviewed changes

packages/icons-workflow/package.json Show resolved Hide resolved

castastrophe force-pushed the CSS-Cutoff branch from c20587b to 8cbaade Compare May 1, 2025 19:50

castastrophe force-pushed the castastrophe/swc-808-disable-process-spectrum branch from 5945a6d to 1045ca1 Compare May 1, 2025 19:52

castastrophe force-pushed the CSS-Cutoff branch from 8cbaade to 561f12a Compare May 5, 2025 13:38

castastrophe force-pushed the castastrophe/swc-808-disable-process-spectrum branch from 1045ca1 to 618cb83 Compare May 5, 2025 13:38

castastrophe force-pushed the CSS-Cutoff branch from 561f12a to 67be4f0 Compare May 6, 2025 15:06

castastrophe force-pushed the castastrophe/swc-808-disable-process-spectrum branch 2 times, most recently from 11d4edb to 4f12157 Compare May 6, 2025 17:13