Skip to content

fix(calendar,dial,pickerbutton,progressbar,radio,stepper): unused custom properties #3487

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged

Conversation

rise-erpelding
Copy link
Collaborator

@rise-erpelding rise-erpelding commented Jan 9, 2025

Description

Fixes to align spectrum-two with s2-foundations-redux/main, mostly defining unused custom properties, but addresses any other lint warnings or inconsistencies noted in the following components:

Calendar: Defines 1 previously undefined custom property to align with main and s2-foundations-redux
Dial: Defines 6 previously undefined custom properties, removes 3 unused custom properties
Pickerbutton: Defines 9 previously undefined custom properties to align with main and s2-foundations-redux
Progressbar: Removes 3 unused custom properties, reverts background-color to background to accommodate gradients, adjusts template to fix static variant
Radio: Defines 4 previously undefined custom properties to align with main and s2-foundations-redux
Stepper: moves high contrast block further down to align with other components' CSS structure, defines multiple undefined custom properties, adds disable-next-line comment to suppress no-unused-custom-properties warning

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

Pull down the branch and run it locally.

  • Run yarn build to ensure that there is no missing metadata
  • Check out calendar
    • Running yarn linter calendar returns no errors
    • The calendar component looks reasonably like its counterpart in s2-foundations-redux. Note that there may still be some inconsistencies with the actionbutton within calendar.
  • Check out dial
    • Running yarn linter dial returns no errors
    • The dial component looks reasonably like its counterpart in s2-foundations-redux
  • Check out picker button
    • Running yarn linter pickerbutton returns no errors
    • The picker button component looks reasonably like its counterpart in s2-foundations-redux
  • Check out progress bar
    • Running yarn linter progressbar returns no errors
    • The progress bar component looks reasonably like its counterpart in s2-foundations-redux
  • Check out radio
    • Running yarn linter radio returns no errors
    • The radio component looks reasonably like its counterpart in s2-foundations-redux
  • Check out stepper
    • Running yarn linter stepper returns no errors
    • The stepper component looks reasonably like its counterpart in s2-foundations-redux

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.
  1. 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. ✨

Copy link

changeset-bot bot commented Jan 9, 2025

🦋 Changeset detected

Latest commit: 28f6c83

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

This PR includes changesets to release 6 packages
Name Type
@spectrum-css/pickerbutton Patch
@spectrum-css/progressbar Patch
@spectrum-css/calendar Patch
@spectrum-css/stepper Patch
@spectrum-css/radio Patch
@spectrum-css/dial Patch

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

Copy link
Contributor

github-actions bot commented Jan 9, 2025

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

Copy link
Contributor

github-actions bot commented Jan 9, 2025

File metrics

Summary

Total size: 1.73 MB*
Total change (Δ): 🔴 ⬆ 2.43 KB (0.14%)

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

Package Size Δ
calendar 19.56 KB 🔴 ⬆ 0.10 KB
dial 11.15 KB 🔴 ⬆ 0.21 KB
pickerbutton 12.33 KB 🔴 ⬆ 0.61 KB
progressbar 9.03 KB 🟢 ⬇ 0.27 KB
radio 15.41 KB 🔴 ⬆ 0.28 KB
stepper 17.40 KB 🔴 ⬆ 1.52 KB

Details

calendar

Filename Head Compared to base
index.css 19.56 KB 🔴 ⬆ 0.10 KB (0.51%)

dial

Filename Head Compared to base
index.css 11.15 KB 🔴 ⬆ 0.21 KB (1.87%)

pickerbutton

Filename Head Compared to base
index.css 12.33 KB 🔴 ⬆ 0.61 KB (5.05%)

progressbar

Filename Head Compared to base
index.css 9.03 KB 🟢 ⬇ 0.27 KB (-2.86%)

radio

Filename Head Compared to base
index.css 15.41 KB 🔴 ⬆ 0.28 KB (1.84%)

stepper

Filename Head Compared to base
index.css 17.40 KB 🔴 ⬆ 1.52 KB (9.57%)
* 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.

@rise-erpelding rise-erpelding marked this pull request as ready for review January 9, 2025 18:35
@rise-erpelding rise-erpelding added size-1 XS ~1-6hrs; nearly trivial, a few hours, could do more than one in a single day. ready-for-review S2 Spectrum 2 labels Jan 9, 2025
@@ -133,14 +133,14 @@
block-size: var(--mod-progressbar-thickness, var(--spectrum-progressbar-thickness));
border-radius: var(--spectrum-progressbar-corner-radius);

background-color: var(--highcontrast-progressbar-track-color, var(--mod-progressbar-track-color, var(--spectrum-progressbar-track-color)));
background: var(--highcontrast-progressbar-track-color, var(--mod-progressbar-track-color, var(--spectrum-progressbar-track-color)));
Copy link
Collaborator Author

@rise-erpelding rise-erpelding Jan 9, 2025

Choose a reason for hiding this comment

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

These background-color to background changes were a fix we'd made in #2929 to allow gradients. I think those would only occur in the express theme so that may not be something we even need to have working in this branch, but keeping it consistent with the other branches seemed like the most reasonable thing to do, open to other opinions though!

@castastrophe castastrophe merged commit 92855aa into spectrum-two Jan 13, 2025
24 of 30 checks passed
@castastrophe castastrophe deleted the rise-erpelding/css-1085-add-theme-custom-props branch January 13, 2025 15:08
castastrophe pushed a commit that referenced this pull request Jan 17, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Jan 17, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Jan 21, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Jan 22, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Feb 5, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Feb 7, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Feb 7, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Feb 7, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Feb 11, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Feb 24, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Feb 24, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
castastrophe pushed a commit that referenced this pull request Feb 25, 2025
…tom properties (#3487)

* fix(pickerbutton): add missing custom properties
* fix(radio): add missing custom props
* fix(calendar): add missing custom properties
* fix(stepper): define unused custom props
* fix(progressbar): remove unused custom properties; change background-color to background see #2929; fix static color
* fix(dial): remove unused custom properties; add undefined custom properties
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
ready-for-review S2 Spectrum 2 size-1 XS ~1-6hrs; nearly trivial, a few hours, could do more than one in a single day.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants