feat: create a single postcss entry point #2466

castastrophe · 2024-01-25T23:39:28Z

Description

This update moves the project to leveraging a standard postcss.config.js file at the root of the project to manage PostCSS processing. All script have been updated to fetch the config using postcss-load-config.

Unnecessary abstractions in component-builder were combined into a unified tasks/component-builder.js script which now contains all necessary functions for processing CSS.

Removed unused dependencies component-builder and component-builder-simple.

Resolves CSS-319 replace gulp
Resolves CSS-672 async mod-extractor reporting
Possibly resolves CSS-554 CSS metadata

Why?

This migrates each package to a standard format which will make it easier to merge these configs in the future.

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

Expect to see no changes to rendered results. (VRT passes)
- Caveat: there are 16 expected diffs related to the use of the neutral token font color which is a subtly lighter black than full black
Expect to see no regressions in storybook CSS processing. (Storybook locally & storybook built show no visual differences or error messages) @mdt2
yarn compare: should build all components and spin up a local site with diffs for all changed components (expect to see no diffs other than rearranging output and whitespace changes) @jawinn

Regression testing

Validate:

The documentation pages for at least two other components are still loading, including:

The pages render correctly, are accessible, and are responsive.

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.

To-do list

I have read the [contribution guidelines](/.github/CONTRIB
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. ✨

github-actions · 2024-01-25T23:47:45Z

File metrics

Summary

Total size: 4.51 MB^*
Total change (Δ): ⬆ 462.80 KB (11.14%)

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

Package	Size	Δ
checkbox	24.94 KB	⬇ < 0.01 KB
clearbutton	7.43 KB	⬇ < 0.01 KB
combobox	26.23 KB	⬇ < 0.01 KB
infieldbutton	18.81 KB	⬆ < 0.01 KB
slider	33.18 KB	⬇ 0.09 KB

Details

checkbox

File	Head	Base	Δ
index-base.css	24.32 KB	24.32 KB	⬇ < 0.01 KB (-0.00%)
index-theme.css	1.20 KB	1.20 KB	-
index-vars.css	24.94 KB	24.94 KB	⬇ < 0.01 KB (-0.00%)
index.css	24.94 KB	24.94 KB	⬇ < 0.01 KB (-0.00%)
metadata.json	13.16 KB	-	🎉 new
themes/express.css	0.92 KB	0.92 KB	⬆ < 0.01 KB (0.22%)
themes/spectrum.css	0.91 KB	0.91 KB	⬇ < 0.01 KB (-0.44%)
mods.json	-	1.62 KB	🚨 deleted, moved, or renamed

clearbutton

File	Head	Base	Δ
index-base.css	6.65 KB	6.65 KB	⬇ < 0.01 KB (-0.04%)
index-theme.css	1.36 KB	1.36 KB	-
index-vars.css	7.43 KB	7.44 KB	⬇ < 0.01 KB (-0.04%)
index.css	7.43 KB	7.44 KB	⬇ < 0.01 KB (-0.04%)
metadata.json	3.83 KB	-	🎉 new
themes/express.css	1.00 KB	1.02 KB	⬆ < 0.01 KB (0.20%)
themes/spectrum.css	0.96 KB	0.97 KB	⬇ < 0.01 KB (-0.41%)
mods.json	-	0.58 KB	🚨 deleted, moved, or renamed

combobox

File	Head	Base	Δ
index-base.css	25.44 KB	25.45 KB	⬇ < 0.01 KB (-0.01%)
index-theme.css	1.36 KB	1.36 KB	-
index-vars.css	26.23 KB	26.23 KB	⬇ < 0.01 KB (-0.01%)
index.css	26.23 KB	26.23 KB	⬇ < 0.01 KB (-0.01%)
metadata.json	12.58 KB	-	🎉 new
themes/express.css	1.00 KB	1.00 KB	⬆ < 0.01 KB (0.20%)
themes/spectrum.css	0.99 KB	0.99 KB	⬇ 0.01 KB (-0.50%)
mods.json	-	2.16 KB	🚨 deleted, moved, or renamed

infieldbutton

File	Head	Base	Δ
index-base.css	16.67 KB	16.67 KB	-
index-theme.css	2.72 KB	2.72 KB	-
index-vars.css	18.81 KB	18.81 KB	⬆ < 0.01 KB (0.01%)
index.css	18.81 KB	18.81 KB	⬆ < 0.01 KB (0.01%)
metadata.json	8.77 KB	-	🎉 new
themes/express.css	1.64 KB	1.64 KB	⬆ < 0.01 KB (0.12%)
themes/spectrum.css	1.66 KB	1.67 KB	⬇ 0.01 KB (-0.58%)
mods.json	-	2.16 KB	🚨 deleted, moved, or renamed

slider

File	Head	Base	Δ
index-base.css	30.87 KB	30.96 KB	⬇ 0.09 KB (-0.28%)
index-theme.css	2.89 KB	2.89 KB	-
index-vars.css	33.18 KB	33.27 KB	⬇ 0.09 KB (-0.27%)
index.css	33.18 KB	33.27 KB	⬇ 0.09 KB (-0.27%)
metadata.json	13.70 KB	-	🎉 new
themes/express.css	1.75 KB	1.75 KB	⬆ < 0.01 KB (0.11%)
themes/spectrum.css	1.72 KB	1.74 KB	⬇ 0.02 KB (-0.90%)
mods.json	-	2.19 KB	🚨 deleted, moved, or renamed

* 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.

BREAKING CHANGE: - Removes component-builder & component-builder-simple for script leveraging postcss - Imports added to index.css and themes/express.css

castastrophe · 2024-03-22T14:57:37Z

.eslintrc

@@ -10,10 +11,10 @@
 	"rules": {
 		"brace-style": ["warn", "stroustrup", { "allowSingleLine": true }],
 		"func-call-spacing": ["warn", "never"],
-		"indent": ["warn", 2],
+		"indent": ["warn", "tab", { "ignoredNodes": ["TemplateLiteral *"] }],


Made sure this was aligned with our prettier settings so they weren't fighting with each other

mdt2

Thanks for the explanation about the VRT diffs, that was helpful! This is looking good to me. Storybook runs well locally, my updates are still hot reloading, high contrast mode looks good. As far as I can tell this should be good to go 🤞

BREAKING CHANGE: - Removes component-builder & component-builder-simple for script leveraging postcss - Imports added to index.css and themes/express.css

castastrophe force-pushed the feat-single-postcss-entry-point branch from f4a9efd to 5ffd5f0 Compare January 26, 2024 00:07

castastrophe marked this pull request as ready for review January 26, 2024 00:07

castastrophe added the run_vrt For use on PRs looking to kick off VRT label Jan 26, 2024

castastrophe self-assigned this Jan 26, 2024

castastrophe requested a review from pfulton January 26, 2024 00:09

castastrophe added ready-for-review and removed ready-for-review labels Jan 26, 2024

castastrophe force-pushed the feat-single-postcss-entry-point branch 12 times, most recently from 5b856b0 to 15bb021 Compare February 5, 2024 19:52

castastrophe force-pushed the feat-single-postcss-entry-point branch 10 times, most recently from 4ebcf77 to 834aea1 Compare February 6, 2024 02:52

castastrophe force-pushed the feat-single-postcss-entry-point branch 3 times, most recently from 51506b5 to b41a4aa Compare March 22, 2024 13:51

castastrophe added skip_vrt Add to a PR to skip running VRT (but still pass the action) skip_lint Skip the linting workflow and removed skip_vrt Add to a PR to skip running VRT (but still pass the action) labels Mar 22, 2024

castastrophe requested review from pfulton, jawinn and mdt2 March 22, 2024 14:09

castastrophe removed the skip_lint Skip the linting workflow label Mar 22, 2024

castastrophe force-pushed the feat-single-postcss-entry-point branch 4 times, most recently from f06004e to 30d20d0 Compare March 22, 2024 14:36

feat!: postcss config build and script; remove gulp

ef6c6bd

BREAKING CHANGE: - Removes component-builder & component-builder-simple for script leveraging postcss - Imports added to index.css and themes/express.css

castastrophe force-pushed the feat-single-postcss-entry-point branch from 30d20d0 to ef6c6bd Compare March 22, 2024 14:56

castastrophe commented Mar 22, 2024

View reviewed changes

mdt2 approved these changes Mar 22, 2024

View reviewed changes

castastrophe merged commit b0f337b into main Mar 22, 2024
13 checks passed

castastrophe deleted the feat-single-postcss-entry-point branch March 22, 2024 18:03

This was referenced Apr 19, 2024

chore: release (next) #2680

Merged

chore: release #2698

Merged

chore: release (next) #2699

Closed

github-actions bot mentioned this pull request Apr 26, 2024

chore: release (next) #2706

Merged

github-actions bot mentioned this pull request May 8, 2024

chore: release (next) #2739

Merged

github-actions bot mentioned this pull request May 22, 2024

chore: release #2776

Merged

github-actions bot mentioned this pull request May 30, 2024

chore: release (next) #2798

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: create a single postcss entry point #2466

feat: create a single postcss entry point #2466

castastrophe commented Jan 25, 2024 •

edited

Loading

github-actions bot commented Jan 25, 2024 •

edited

Loading

checkbox

clearbutton

combobox

infieldbutton

slider

castastrophe Mar 22, 2024

mdt2 left a comment

feat: create a single postcss entry point #2466

feat: create a single postcss entry point #2466

Conversation

castastrophe commented Jan 25, 2024 • edited Loading

Description

Why?

How and where has this been tested?

Validation steps

Regression testing

To-do list

github-actions bot commented Jan 25, 2024 • edited Loading

File metrics

Summary

checkbox

clearbutton

combobox

infieldbutton

slider

castastrophe Mar 22, 2024

Choose a reason for hiding this comment

mdt2 left a comment

Choose a reason for hiding this comment

castastrophe commented Jan 25, 2024 •

edited

Loading

github-actions bot commented Jan 25, 2024 •

edited

Loading