[Project Solar / Phase 1 / Follo-up] Fix tokens values comparison + other small bugs#3941
Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
There was a problem hiding this comment.
Pull request overview
Updates the tokens build pipeline in packages/tokens to correctly handle themed $modes values that are arrays/objects (including new DTCG dimension object values), and regenerates the derived token artifacts so outputs reflect the corrected behavior.
Changes:
- Switch
$valuevs$modes.defaultvalidation to a deep comparison to avoid false warnings for structurally-equal arrays/objects. - Fix
$modesapplication logic to distinguish “property override” objects (with their own$value) from “standard” values (including arrays and DTCG value objects). - Update the
dimension/unitcustom transform to support DTCG{ value, unit }dimension values, then regenerate CSS/JSON outputs.
Reviewed changes
Copilot reviewed 4 out of 18 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| showcase/public/assets/styles/@hashicorp/themed-tokens/with-css-selectors/tokens.css | Regenerated themed CSS output (generated artifact). |
| showcase/public/assets/styles/@hashicorp/themed-tokens/with-css-selectors--migration/tokens.css | Regenerated themed CSS output (generated artifact). |
| showcase/public/assets/styles/@hashicorp/themed-tokens/with-css-selectors--advanced/tokens.css | Regenerated themed CSS output (generated artifact). |
| packages/tokens/scripts/build.ts | Fixes $modes application logic, deep-compares default values, and supports DTCG dimension object values. |
| packages/tokens/dist/products/css/themed-tokens/with-scss-mixins/tokens.css | Regenerated themed CSS output (generated artifact). |
| packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g90/themed-tokens.css | Regenerated themed CSS output (generated artifact). |
| packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g100/themed-tokens.css | Regenerated themed CSS output (generated artifact). |
| packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g10/themed-tokens.css | Regenerated themed CSS output (generated artifact). |
| packages/tokens/dist/products/css/themed-tokens/with-root-selector/cds-g0/themed-tokens.css | Regenerated themed CSS output (generated artifact). |
| packages/tokens/dist/products/css/themed-tokens/with-css-selectors/tokens.css | Regenerated themed CSS output (generated artifact). |
| packages/tokens/dist/products/css/themed-tokens/with-css-selectors--migration/tokens.css | Regenerated themed CSS output (generated artifact). |
| packages/tokens/dist/products/css/themed-tokens/with-css-selectors--advanced/tokens.css | Regenerated themed CSS output (generated artifact). |
| packages/tokens/dist/docs/products/themed-tokens/default.json | Regenerated docs JSON output (generated artifact). |
| packages/tokens/dist/docs/products/themed-tokens/cds-g90.json | Regenerated docs JSON output (generated artifact). |
| packages/tokens/dist/docs/products/themed-tokens/cds-g100.json | Regenerated docs JSON output (generated artifact). |
| packages/tokens/dist/docs/products/themed-tokens/cds-g10.json | Regenerated docs JSON output (generated artifact). |
| packages/tokens/dist/docs/products/themed-tokens/cds-g0.json | Regenerated docs JSON output (generated artifact). |
| packages/tokens/dist/docs/products/themed-tokens.json | Regenerated docs JSON output (generated artifact). |
didoo
force-pushed
the
project-solar/phase-1-main-feature-branch
branch
from
June 24, 2026 18:02
fb1f8aa to
f830ab1
Compare
didoo
force-pushed
the
project-solar/phase-1-main-feature-branch
branch
from
June 24, 2026 18:04
f830ab1 to
647be91
Compare
…n the values are objects/arrays
… format for “dimension” values
eg. `"$value": { "value": 4, "unit": "px" }`
…d correctly see regenerated files in output diff for how this bug was not generating the correct token values
didoo
force-pushed
the
project-solar/phase-1/HDS-6472/fix-tokens-values-comparison
branch
from
June 24, 2026 18:53
ae37b98 to
bd87a5c
Compare
dchyun
approved these changes
Jun 24, 2026
dchyun
left a comment
dchyun
left a comment
Contributor
There was a problem hiding this comment.
Looks good to me! Tested using the following token value and everything generated as expected.
"testing-dimension": {
"$type": "dimension",
"$value": { "value": 1, "unit": "px" },
"$modes": {
"default": { "value": 1, "unit": "px" },
"cds-g0": { "value": 10, "unit": "px" },
"cds-g10": { "value": 10, "unit": "px" },
"cds-g90": { "value": 10, "unit": "rem" },
"cds-g100": { "value": 10, "unit": "rem" }
}
},
Also got the NaN error to throw in testing as expected
didoo
merged commit Jun 25, 2026
64aeb0e
into
project-solar/phase-1-main-feature-branch
15 checks passed
didoo
deleted the
project-solar/phase-1/HDS-6472/fix-tokens-values-comparison
branch
June 25, 2026 09:45
didoo
added a commit
that referenced
this pull request
Jun 25, 2026
…anch (at 25 Jun 2026) TODO - added temporary file to main feature branch for phase 1 added temporary changeset to feature branch for `$modes` support TEMP - added `$modes` entry to `color.palette.neutral-0` refactored logic used to provide SD configuration per target progress on logic for handling `$modes` - 1 TEMP - added `modes-testing` tokens TEMP - added `expected-CSS-output` files progress on logic for handling `$modes` - 2 added `attributes/themeable` transformation progress on logic for handling `$modes` - 3 progress on logic for handling `$modes` - 4 TEMP generated temporary dist files for testing TEMP - added examples of generated themed tokens added logic to generate theming CSS files REVERT - Removed `modes-testing` tokens removed `modes-testing` folder from compilation added `carbon-extracted` reference in the `source` definitions TEMP - added `$modes` entries for some color and typography tokens, with references to Carbon tokens, for testing changed `outputReferences` to `false` (temporary) to bypass issue with missing references when using Carbon tokens with theming logic added commented code to `build` to use for debugging issue with missing references and filtering when theming is applied added two new themed tokens generated files, for Scss mixins and for combined strategies fixed issue with `cds` naming missing the `g` fixed some issues with how the “extra” themed CSS files were generated TEMP - Re-generated tokens REVERT - added examples of generated themed tokens This reverts commit 194b9fb. REVERT - added `expected-CSS-output` files This reverts commit 7462def. fixed wrong check for existence of key in object (`0` values would trigger an error, but they’re valid) added `.hds-theme-light/dark` and `[data-hds-theme=“light/dark”]` to generated CSS selectors (later we may decide to remove them, but for the moment we need them for the showcase theming page to work in its current implementation) re-generated themed tokens updated generation of tokens’ CSS helpers to use CSS variables for `font-weight` helpers re-generated CSS helper files updated generation of extra CSS files to include `.hds-theme-hds/[data-hds-theme="hds"]` selectors for default (non-themed) HDS styling (later we will understand if we want to rename the `hds` theme to `default` to avoid this strange class name `hds-theme-hds`) updated design tokens pipeline to generate a `themed-tokens.json` file for documentation, including all the tokens for all the themes (it will be used in the showcase, and potentially the website) re-generated themed tokens updated “src” files to replace `hds` key with `default` in `$modes` definitions updated logic to replace `hds` key with `default` in `$modes` definitions re-generated tokens in `dist` folder tweaked logic for CSS selectors for `@media (prefers-color-scheme)` to use explicit selectors `.hds-theme-system`/`[data-hds-theme="system”]` to avoid specificity issues `:root:not([class*="hds-theme-"]):not([data-hds-theme])` has specificity 030 so when used inside `@media (prefers-color-scheme: light|dark)` it becomes the default compares to other selectors re-generated tokens in `dist` folder updated generation of extra theming CSS files to avoid CSS variables “staleness” updated generation of extra theming CSS files to differentiate between `theme` and `mode` CSS selectors re-generated tokens in `dist` folder removed `[data-hds-theme]` CSS selectors for simplicity asked feedback in Slack (https://ibm-hashicorp.slack.com/archives/C09KZL43EKU/p1762987902565479) and then discussed with Dylan/Kristin; we agreed they’re not really necessary/needed re-generated tokens in `dist` folder updated logic for generation of extra “themed” CSS files (removed `prefers-color-scheme`-only case, generalized `css-selectors`) re-generated tokens in `dist` folder small tweakings before code review renamed `generateExtra***` to `generate***` updated comment updated SCSS files organization for components (split common part) updated `includePaths` for design tokens in Showcase and Website `ember-cli-build.js` removed `rollup-plugin-scss` dev dependency (we use our own custom plugin for every Scss compilation) updated the `prePublish` script in `package.json` of `components` to validate that all the new CSS files are generated too simplified architecture of CSS compilation for HDS components (as agreed) fixed `prepublisOnly` script that was causing error in build (looking for old CSS files that don’t exist anymore) updated `cssFilePath` in blueprints to reflect new Scss file organization, per code review suggestion #3259 (comment) Apply suggestions from code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Update packages/components/src/styles/@hashicorp/design-system-components.scss Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> added `Hds::ThemeSwitcher` component added `Hds::Theming` service added theming to the Showcase itself (and replaced hardcoded values with `—shw` CSS variables) added `Shw::ThemeSwitcher` component for showcase updated `Mock::App` and added new yielded sub-components added `Shw:: ThemeSwitcher` to the Showcase page header added `foundations/theming` showcase page (and a frameless demo) refactored `hds-theming` service to align with the new themes/modes and be open to configurations added `hdsTheming` initialization to main showcase app removed compilation of components Scss and replaced it with static inclusion of pre-compiled (standard and themed) CSS The pre-compiled CSS files have been manually copied in the `public/assets` folder, while waiting to understand what is the best way to proceed to have them added at build time from the `@hashicorp/design-system-components` package added theming options via popover - part 1 added theming options via popover - part 2 added theming options via popover - part 3 added theming options via popover - part 4 added theming options via popover - part 5 big code refactoring for the theme selector, to streamline user selection and expand use cases we can cover updated logic that sets the theming for the showcase itself (without relying on HDS selectors) small fixes here and there for cleanup and linting fixed issue with `pnpm lint:format` (missing newline at the end of `package.json` solution: run `pnpm prettier . --cache --write` locally and then commit fixed accessibility issue in `advanced-table` page, due to changes to “themed” `—shw` colors fixed typescript error due to new mock page being added added fix for tests failing see #3298 started large refactoring/rewrite of the theming switcher and page in the showcase updated logic by creating a `shwTheming` service that extends `hdsTheming` moved theming logic from `ShwThemeSwitcher` component/subcomponents to `hdsTheming` service updated reference CSS files to follow new theming approach/logic further refactoring/rewriting of theming logic updated approach to `light/dark` styles in showcase by using the HDS CSS selectors migrated back the `Contextual` demo content to the index page added a `DebuggingPanel` to the `ShwThemeSwitcher` controls refactored/improved `DebuggingPanel` and added new preferences to advanced options small cleanups and refactorings fixed small issue with `ShwThemeSwitcher` selector removed some outdated comments small refactorings added local storage support for theming options big refactoring of the `hdsTheming` service to simplify logic and reduce redundant methods invocations cleanup of debugging comments and other stuff refactor and cleanup in preparation for PR review refactored code to fix logic flow for theming initialization fixed how the theming options were saved in local storage Apply suggestions from Copilot's code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> fixed issue with `setTheme` not being passed `options` by the `ShwThemeSwitcher` fix issue with the popover of the ShwThemeSwitcher component, where the states were potentially out of sync Update showcase/app/services/shw-theming.ts Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> small tweak to the typing of `HdsModes` per code review suggestion updated how the CSS files (tokens and components, with/without theming) are consumed by the showcase application updated logic for styleshet switching using the `disabled` attribute removed unused import removed `isInitialized` logic from the `hdeTheming` service to avoid bug Assertion Failed: You attempted to update _isInitialized on <HdsThemingService:ember77>, but it had already been used previously in the same computation. Attempting to update a value after using it in a computation can cause logical errors, infinite revalidation bugs, and performance issues, and is not supported. _isInitialized was first used: While rendering: {{outlet}} for -top-level -top-level {{outlet}} for application Application TEMP - added temporary `hds-theme-light/dark` selectors while we understand how to do nesting of theming TEMP - Added back custom token values for testing purpose fixed small issue with the `HdsThemeSwitcher` components used in the `Theming` showcase page context: #3240 (comment) added small comment updated `hdsTheming` service to support `default` theme / mode added support for `default` option to HDS ThemeSwitcher component Updated “foundations/theming” showcase page to include variants of HDS ThemeSwitcher with `default` option updated Showcase ThemeSwitcher to use ``default` as theme option updated logic for how CSS selectors are applied to the `html:root` element + scrappy implementation of `isComplex` (to be completed later) updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline added fake theming for display/text typography to `public/assets` themed tokens CSS files (for debugging purpose) updated “foundations/theming” showcase page to include `default` and `system` themes + improved contextual theming using custom typographic theming implemented `ThemeContex` component added demos of `ThemeContext` component to showcase “foundations/theming” page improved type definitions for ThemeContext and showcase “foundations/theming” page refactored how CSS selectors are applied to enable mode-specific overrides updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline updated `ThemeContext` to use a more generic `context` argument updated showcase “theming” page to use the new `@context` argument for the `ThemeContext` component finally defined proper typing for `ThemeContext` component refactored showcase code to remove handling of `[data-hds-theme]` CSS selectors for theming updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names refactored theme switching in showcase to use new CSS files updated theme switcher in showcase to allow toggling of the “advanced options” introduced a “carbonization” mixin for applying styles only for certain conditions/modes this is the first implementation, it may see further refinements later it will be used to differentiate styles for the Button component added subtle shadow to `ThemingBasicContainer` fixed small bug that would cause the showcase pages to crash if the value stored in local storage for the `shw-theming-current-stylesheet` value was not found small fix to the control logic for the `HdsThemeSwitcher` demo in showcase page fixed TypeScript issue fix small bug in the logic when the “apply” with “show advanced options” is `false` added `ShwBodyLinkToRoute` component replaced custom link in AdvancedTable showcase page with newly created `ShwBodyLinkToRoute` component reworked the demo frameless for application with theme switcher to avoid collisions between the main page and the frame replaced custom theme switcher with proper `HdsThemeSwitcher` in `AppFooter` demo some cleanup before code review changed how theming is applied to the showcase itself, to limit `prefers-color-scheme` application only to the explict `system` theme selection fixed wrong CSS selector, per code review suggestion prefixed `OnSetThemeCallback` with `Hds` per review suggestion Update packages/components/src/template-registry.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> converted `updatePageStylesheets` function to a private method per Copilot suggestion: #3240 (comment) small cleanup per code reviews suggestions small fixes per code review updated logic that reads the stored theming data for the `HdsThemingService` to make it more robust removed comment updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names basic implementation of `<ShwCarbonizationComparisonGrid>` refactored implementation of `<ShwCarbonizationComparisonGrid>` implemented “Carbonization” section for `Badge` page implemented “Carbonization” section for `BadgeCount` page implemented “Carbonization” section for `Button` page implemented “Carbonization” section for `Focus Ring` page implemented “Carbonization” section for `Typography` page implemented “Carbonization” section for (new) `Color` page added `@carbon/web-components` as devDependency to Showcase app added `@carbon/[themes|layout|grid|type]` + `@ibm/plex` as devDependencies to Showcase app refactored `ComparisonGrid` component to add themed background color to the cells/areas added temporary support for IBM Plex font-family refactored code to support theming for reference web components, based on Carbon implementation/specifications small refactoring small refactorings refactored content organization to have the carbonization pages as standalone pages added carbon web components for comparison on `BadgeCount` page added carbon web components for comparison on `Button` page more small fixes for cleanup and linting implemented “Carbonization” section for `Form::TextInput` page implemented “Carbonization” section for `SegmentedGroup` page removed link to “Foundations > Color” page Small update to an `rgba` color Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> moved theming class in ComparisonGrid from item to item content per code review suggestion improved how to apply themed foreground/background colors to content in the comparison grid installed `@carbon/styles` as devDependency to import CSS variables for Carbon theming fixed issue with text color in typography page reorganized carbonized pages so they all live under the `carbonized` folder/route will be used later to detect if we need to do something around theme switcher and CSS to load prepared the ground for controlling the ShwThemeSwitcher on carbonized pages fixed CSS for carbonization pages updated carbonized typography page to show equivalent/mapped Carbon typographic style updated `ShwComparisonGrid` to expose an alternative side-by-side layout updated some components to take into account the new `hideCarbonLabels` argument fixed typescript/glint issue updated a couple of typographic mappings added yielding of `theme` value in the named blocks of the `ComparisonGrid` introduced `ShwCarbonizationStylePreviewTypography` to facilitate comparison of typographic styles refactored `carbonization/foundations/color` page and `ShwCarbonizationTokenPreviewColor` to show actual color values in preview item updated comparison grid to use `default` for original HDS theming instead of `hds` small tweak to the `badge` carbonization page added logic to the application to lock theme switching when loading a “carbonized” page (and restore its previous state when returning to non-carbonized pages) replaced `theme` with `mode` in `ComparisonGrid` fixed issue with the “default” block of the carbonization grid was not rendered as “classic” HDS fixed issue in the carbonization page for colors some cleanup before code review Update showcase/app/components/shw/carbonization/token-preview/color.gts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> updated showcase page for Button carbonization implemented “Carbonization” page for `Modal` component added examples of components with focus state to the carbonization page for focus ring tweaks per code review suggestions implemented “Carbonization” page for `Form/RadioCard` component better visual grouping of carbonization pages links in homepage renamed the `page-carbonization` components files and declarations to add `Index` (for consistency, per review comment) added `disabled` state to `cds-radio-tile` avoid duplicate `name` attributes for different radio groups add missing `{{on "change" this.onChange}}` handled to the `RadioCard` elements when in a group updated logic that converts the Carbon duration value to the DTCG format to use always seconds updated logic that converts the Carbon `cubic-bezier` value to the expected DTCG format see: https://www.designtokens.org/tr/drafts/format/#cubic-bezier re-extracted carbon tokens turned on option to convert `font-size` from `rem` to `px` for extracted Carbon tokens re-extracted carbon tokens [06] [Project Solar / Phase 1 / Dry-run] Migration dry-run for foundations and components (#3332) [Project Solar / Phase 1 / Engineering Follow-ups] Add `localStorage` parsing validation (#3401) added `chalk` as devDependency updated `build.ts` script for design tokens, to have validation of expected `$modes` format improved logging messages for validation warnings/errors of `$modes` [Project Solar / Phase 1 / Engineering Follow-ups] Add tests for HDS theming service and components (#3428) Co-authored-by: Dylan Hyun <dylan.hyun@hashicorp.com> Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> re-generated CSS files in output after rebasing on `main` (new styles have been added to the common styles for HDS components) [HDS-5702] - Remove postbuild in favor of rollup copy (#3441) fixed TS issue fixed some linting warnings for `package.json` files post rebase (and conflicts fixing) enabled logging for StyleDictionary abstracted `getSourceFromFileWithRootSelector` implemented custom “CSS variables” format for theme tokens, with logic to handle aliasing (outputReferences) and files splitting (“common” vs “themed”) abstracted `DocsJson` custom format to its own file removed `attributes/themeable` custom transform (not needed anymore) added validation for generated themed tokens (as SD custom action) small tweakings, cleanups and fixes TEMP - Add `test` tokens (to be removed in a follow-up revert commit) Revert "TEMP - Add `test` tokens (to be removed in a follow-up revert commit)" This reverts commit 455d9ec. [Project Solar / Phase 1 / Engineering Follow-ups] Converted tests for `HdsThemeSwitcher` and `HdsThemeContext` to `.gts` format (#3447) Refactor `dist` CSS file checks into script (#3462) re-generated all the dist and public files after rebasing on `main` small cleanup of initial commits used to open the PR [07a] [Project Solar / Phase 1] Include IBM Plex fonts as part of the `@hashicorp/design-system-components` package (#3387) removed service which was not used [Project Solar / Phase 1 / Engineering Follow-ups] Remove local storage implementation from `HdsTheming` service and move it to the Showcase consuming app (#3540) Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> [Project Solar / Phase 1 / Engineering Follow-ups] Remove `globalOnSetTheme` callback from `HdsTheming` service (#3539) Use esm for `dist` file check (#3551) fixes that were missed after rebase on `main` (and conflict resolution) re-built tokens after rebase on `main` (all the `Hds::SideNav` tokens have been removed) fixed yielded component name [Project Solar / Phase 1 / Engineering Follow-ups] Update tokens pipeline to support structured values for the `$modes` entries (#3575) [Project Solar / Phase 1 / Follow-up] Fix small issue in tokens build pipeline (#3595) Reverted temporary commits from PR #3595 Revert "TEMP/REMOVE ME - Added `$modes` to `boundary-50` (referenced as alias by `boundary.surface` and `boundary-gradient-faint-stop`)" This reverts commit eeb1a0a. Revert "TEMP/REMOVE ME - re-generated tokens in output" This reverts commit 23c9bb0. [Project Solar / Phase 1] Align version of carbon web component imports (#3613) [Project Solar / Phase 1 / Components] Support multiple selectors in carbonization mixin (#3630) [Project Solar / Phase 1 / Foundations] Finalize design tokens for Core/Semantic Colors + Typography + Borders (#3572) [Project Solar / Phase 1 / Components] `Badge/BadgeCount` carbonization (#3592) [Project Solar / Phase 1 / Foundations] Flight icons &`Icon` carbonization (#3584) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> Project solar/icons commit icons (#3643) Small updates to the icons used in the showcase page for the `Icon` component (#3644) [Project Solar / Phase 1 / Components] `Separator` carbonization (HDS-6102) (#3674) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> [Project Solar / Phase 1 / Foundations] Update tokens with `$modes` for semantic products colors (#3680) [Project Solar / Phase 1 / Icons] Fix copy button showcase status icons (#3694) [Project Solar / Phase 1 / Components] `ApplicationState` carbonization (HDS-6075) (#3686) [Project Solar / Phase 1 / Foundations] Remove `$modes` from "core/palette" product colors (#3695) [Project solar / Phase 1 / Foundations] Elevation (#3693) [Project Solar / Phase 1 / Showcase] Add support for "column" layout to comparison grid and "no equivalent" block (#3682) linting [Project Solar / Phase 1 / Components] `IconTile` carbonization (HDS-6061) (#3588) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Foundations] Add `high-contrast` core semantic token for surface (#3701) [Project Solar / Phase 1 / Components] `TooltipButton` carbonization (#3622) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `RichTooltip` carbonization (#3641) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `DismissButton` carbonization (#3665) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed AppFooter example in “foundations/theming” showcase page [Project Solar / Phase 1 / Components] `AppFooter` carbonization (HDS-6072) (#3675) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed issue with themes being applied to the “carbonization” pages Remove prebuild script (#3715) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Allow overriding of IBM Plex fonts `/assets` path in Scss (#3736) [Project Solar / Phase 1 / Follow-up] Add watcher to tokens `build` script (#3757) [Project Solar / Phase 1 / Follow-up] Watch sass files for changes in `components` build (#3759) [Project Solar / Phase 1 / Components] `LinkInline` and `LinkStandalone` carbonization (#3587) [Project Solar / Phase 1 / Components] `RichTooltip` - Set text color (#3756) [Project Solar / Phase 1 / Components] `CopySnippet` carbonization (#3733) fixed carbonized focus ring showcase `AdvancedTableThSort` has been now merged with `AdvancedTableTh` to be a single subcomponent [Project Solar / Phase 1 / Components] `Breadcrumb` carbonization (#3652) [Project Solar / Phase 1 / Components] `DialogPrimitive/Modal/Flyout` carbonization (#3645) [Project Solar / Phase 1 / Components] `Pagination` carbonization (HDS-6035) (#3598) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `Card` carbonization (#3679) [Project Solar / Phase 1 / Components] `Tabs` carbonization (HDS-6106) (#3690) removed leftover generated files after removal of `devdot` and `marketing` as targets in `main` Fix: AppFooter carbonization page STATUSES import paths HDS-6166 Fix incorrect value for Tabs Tab horizontal padding token for large variant [Project Solar / Phase 1] Update `@carbon/***` dependencies (#3794) [Project Solar / Phase 1 / Tokens update] Update `transitions` tokens (#3798) [Project Solar / Phase 1 / Tokens update] Update `typography` tokens (#3799) [Project Solar / Phase 1 / Components] `Tag` carbonization (#3685) [Project Solar / Phase 1 / Tokens update] Update component-level color tokens - Part 1 (#3805) [Project Solar / Phase 1 / Follow-up] Re-sync extracted Carbon tokens (#3812) [Project Solar / Phase 1 / Components] `PageHeader` carbonization (HDS-6099) (#3802) [Project Solar / Phase 1 / Follow-up] Fix issue in extraction of Carbon tokens when color value is in "modern" `rgb()` format (#3813) [Project Solar / Phase 1 / Components] `Button` carbonization (#3611) [Project Solar / Phase 1 / Components] `CopyButton` carbonization (#3696) [Project Solar / Phase 1 / Components] `CodeBlock` carbonization (#3779) Fix: Carbonization showcase type linting errors [Project Solar / Phase 1 / Components] `CodeEditor` carbonization (#3785) [Project Solar / Phase 1 / Follow-up] Fix `DialogPrimitive` header spacing (#3833) small text alignment fix in `NoEquivalent` showcase component [Project Solar / Phase 1 / Follow-up] Fix `hds-apply-only-if-carbon` Sass mixin (#3838) [Project Solar / Phase 1 / Components] `Reveal` carbonization (HDS-6100) (#3706) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Convert `ThemeSwitcher` and `ThemeContext` components to `.gts` (#3846) Add tests for `hds-icon-registry` service (#3829) [Project Solar / Phase 1 / Follow-up] Update `focus` to `focus-ring` in "component-level" tokens (#3861) [Project Solar / Phase 1 / Components] `Alert` & `Toast` carbonization (#3809) [Project Solar / Phase 1 / Components] `AppSideNav` carbonization (#3801) [Project Solar / Phase 1 / Follow up] Add "column-stacked" layout to `ShwCarbonizationComparisonGrid` in showcase for carbonization pages (#3867) re-generated files in output after rebase on main rebuilt files in output after rebase on `main` Fix: Application template function call for page initialization [Project Solar / Phase 1 / Components] `Dropdown` carbonization (HDS-6083) (#3814) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Components] Update `body-100` Carbon font size and component tokens (#3862) [Project Solar / Phase 1 / Follow-up] Showcase improvements for the focus ring refactoring (#3896) [Project Solar / Phase 1 / Components] `Form` primitives (HDS-6086) (#3860) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Follow-up] Focus ring refactoring for all components (#3884) [Project Solar / Phase 1 / Components] `AppHeader` carbonization (#3819) [Project Solar / Phase 1 / Follow-up] Cleanup redundancies in source JSON files for tokens (#3913) [Project Solar / Phase 1 / Migration] AppSideNav list item active indicator token (#3916) [Project Solar / Phase 1 / Migration] Set LinkStandalone secondary hover state color (#3920) re-generated files in output (missed in #3920) added selector with higher specificity for focused `.hds-dismiss-button.hds-dialog-primitive__dismiss` re-generated files in output [Project Solar / Phase 1 / Components] Remove `button.border-color.{color}.focus` tokens (#3933) [Project Solar / Phase 1 / Showcase] Convert HdsIcon in Carbon Web Components to `cds-icon` (#3928) [Project Solar / Phase 1 / Follow-up] Add `token-css-color-transform-direction` token (#3936) [Project Solar / Phase 1 / Migration] `Accordion` "carbonization" (#3525) missed to commit generated file in output (#3525) copyright updates fixed a couple of typos removed unnecessary `mock-state` attributes `Tag` - fix `mock-state-value` not being dynamically set on showcase page [Project Solar / Phase 1 / Migration] Add `secondary-muted` button variant (#3930) added fix for padding of `<legend>` base form element re-generated files in output [Project Solar / Phase 1 / Follo-up] Fix tokens values comparison + other small bugs (#3941) [Project Solar / Phase 1 / Follow-up] Include declarations for CSS `color-scheme` properties in generated token files (#3943) fixed `start` command syntax to escape double quotes instead of using single quotes (consistent with other commands in other files) re-generated files in output
didoo
added a commit
that referenced
this pull request
Jun 30, 2026
…anch (at 30 Jun 2026) TODO - added temporary file to main feature branch for phase 1 added temporary changeset to feature branch for `$modes` support TEMP - added `$modes` entry to `color.palette.neutral-0` refactored logic used to provide SD configuration per target progress on logic for handling `$modes` - 1 TEMP - added `modes-testing` tokens TEMP - added `expected-CSS-output` files progress on logic for handling `$modes` - 2 added `attributes/themeable` transformation progress on logic for handling `$modes` - 3 progress on logic for handling `$modes` - 4 TEMP generated temporary dist files for testing TEMP - added examples of generated themed tokens added logic to generate theming CSS files REVERT - Removed `modes-testing` tokens removed `modes-testing` folder from compilation added `carbon-extracted` reference in the `source` definitions TEMP - added `$modes` entries for some color and typography tokens, with references to Carbon tokens, for testing changed `outputReferences` to `false` (temporary) to bypass issue with missing references when using Carbon tokens with theming logic added commented code to `build` to use for debugging issue with missing references and filtering when theming is applied added two new themed tokens generated files, for Scss mixins and for combined strategies fixed issue with `cds` naming missing the `g` fixed some issues with how the “extra” themed CSS files were generated TEMP - Re-generated tokens REVERT - added examples of generated themed tokens This reverts commit 194b9fb. REVERT - added `expected-CSS-output` files This reverts commit 7462def. fixed wrong check for existence of key in object (`0` values would trigger an error, but they’re valid) added `.hds-theme-light/dark` and `[data-hds-theme=“light/dark”]` to generated CSS selectors (later we may decide to remove them, but for the moment we need them for the showcase theming page to work in its current implementation) re-generated themed tokens updated generation of tokens’ CSS helpers to use CSS variables for `font-weight` helpers re-generated CSS helper files updated generation of extra CSS files to include `.hds-theme-hds/[data-hds-theme="hds"]` selectors for default (non-themed) HDS styling (later we will understand if we want to rename the `hds` theme to `default` to avoid this strange class name `hds-theme-hds`) updated design tokens pipeline to generate a `themed-tokens.json` file for documentation, including all the tokens for all the themes (it will be used in the showcase, and potentially the website) re-generated themed tokens updated “src” files to replace `hds` key with `default` in `$modes` definitions updated logic to replace `hds` key with `default` in `$modes` definitions re-generated tokens in `dist` folder tweaked logic for CSS selectors for `@media (prefers-color-scheme)` to use explicit selectors `.hds-theme-system`/`[data-hds-theme="system”]` to avoid specificity issues `:root:not([class*="hds-theme-"]):not([data-hds-theme])` has specificity 030 so when used inside `@media (prefers-color-scheme: light|dark)` it becomes the default compares to other selectors re-generated tokens in `dist` folder updated generation of extra theming CSS files to avoid CSS variables “staleness” updated generation of extra theming CSS files to differentiate between `theme` and `mode` CSS selectors re-generated tokens in `dist` folder removed `[data-hds-theme]` CSS selectors for simplicity asked feedback in Slack (https://ibm-hashicorp.slack.com/archives/C09KZL43EKU/p1762987902565479) and then discussed with Dylan/Kristin; we agreed they’re not really necessary/needed re-generated tokens in `dist` folder updated logic for generation of extra “themed” CSS files (removed `prefers-color-scheme`-only case, generalized `css-selectors`) re-generated tokens in `dist` folder small tweakings before code review renamed `generateExtra***` to `generate***` updated comment updated SCSS files organization for components (split common part) updated `includePaths` for design tokens in Showcase and Website `ember-cli-build.js` removed `rollup-plugin-scss` dev dependency (we use our own custom plugin for every Scss compilation) updated the `prePublish` script in `package.json` of `components` to validate that all the new CSS files are generated too simplified architecture of CSS compilation for HDS components (as agreed) fixed `prepublisOnly` script that was causing error in build (looking for old CSS files that don’t exist anymore) updated `cssFilePath` in blueprints to reflect new Scss file organization, per code review suggestion #3259 (comment) Apply suggestions from code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Update packages/components/src/styles/@hashicorp/design-system-components.scss Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> added `Hds::ThemeSwitcher` component added `Hds::Theming` service added theming to the Showcase itself (and replaced hardcoded values with `—shw` CSS variables) added `Shw::ThemeSwitcher` component for showcase updated `Mock::App` and added new yielded sub-components added `Shw:: ThemeSwitcher` to the Showcase page header added `foundations/theming` showcase page (and a frameless demo) refactored `hds-theming` service to align with the new themes/modes and be open to configurations added `hdsTheming` initialization to main showcase app removed compilation of components Scss and replaced it with static inclusion of pre-compiled (standard and themed) CSS The pre-compiled CSS files have been manually copied in the `public/assets` folder, while waiting to understand what is the best way to proceed to have them added at build time from the `@hashicorp/design-system-components` package added theming options via popover - part 1 added theming options via popover - part 2 added theming options via popover - part 3 added theming options via popover - part 4 added theming options via popover - part 5 big code refactoring for the theme selector, to streamline user selection and expand use cases we can cover updated logic that sets the theming for the showcase itself (without relying on HDS selectors) small fixes here and there for cleanup and linting fixed issue with `pnpm lint:format` (missing newline at the end of `package.json` solution: run `pnpm prettier . --cache --write` locally and then commit fixed accessibility issue in `advanced-table` page, due to changes to “themed” `—shw` colors fixed typescript error due to new mock page being added added fix for tests failing see #3298 started large refactoring/rewrite of the theming switcher and page in the showcase updated logic by creating a `shwTheming` service that extends `hdsTheming` moved theming logic from `ShwThemeSwitcher` component/subcomponents to `hdsTheming` service updated reference CSS files to follow new theming approach/logic further refactoring/rewriting of theming logic updated approach to `light/dark` styles in showcase by using the HDS CSS selectors migrated back the `Contextual` demo content to the index page added a `DebuggingPanel` to the `ShwThemeSwitcher` controls refactored/improved `DebuggingPanel` and added new preferences to advanced options small cleanups and refactorings fixed small issue with `ShwThemeSwitcher` selector removed some outdated comments small refactorings added local storage support for theming options big refactoring of the `hdsTheming` service to simplify logic and reduce redundant methods invocations cleanup of debugging comments and other stuff refactor and cleanup in preparation for PR review refactored code to fix logic flow for theming initialization fixed how the theming options were saved in local storage Apply suggestions from Copilot's code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> fixed issue with `setTheme` not being passed `options` by the `ShwThemeSwitcher` fix issue with the popover of the ShwThemeSwitcher component, where the states were potentially out of sync Update showcase/app/services/shw-theming.ts Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> small tweak to the typing of `HdsModes` per code review suggestion updated how the CSS files (tokens and components, with/without theming) are consumed by the showcase application updated logic for styleshet switching using the `disabled` attribute removed unused import removed `isInitialized` logic from the `hdeTheming` service to avoid bug Assertion Failed: You attempted to update _isInitialized on <HdsThemingService:ember77>, but it had already been used previously in the same computation. Attempting to update a value after using it in a computation can cause logical errors, infinite revalidation bugs, and performance issues, and is not supported. _isInitialized was first used: While rendering: {{outlet}} for -top-level -top-level {{outlet}} for application Application TEMP - added temporary `hds-theme-light/dark` selectors while we understand how to do nesting of theming TEMP - Added back custom token values for testing purpose fixed small issue with the `HdsThemeSwitcher` components used in the `Theming` showcase page context: #3240 (comment) added small comment updated `hdsTheming` service to support `default` theme / mode added support for `default` option to HDS ThemeSwitcher component Updated “foundations/theming” showcase page to include variants of HDS ThemeSwitcher with `default` option updated Showcase ThemeSwitcher to use ``default` as theme option updated logic for how CSS selectors are applied to the `html:root` element + scrappy implementation of `isComplex` (to be completed later) updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline added fake theming for display/text typography to `public/assets` themed tokens CSS files (for debugging purpose) updated “foundations/theming” showcase page to include `default` and `system` themes + improved contextual theming using custom typographic theming implemented `ThemeContex` component added demos of `ThemeContext` component to showcase “foundations/theming” page improved type definitions for ThemeContext and showcase “foundations/theming” page refactored how CSS selectors are applied to enable mode-specific overrides updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline updated `ThemeContext` to use a more generic `context` argument updated showcase “theming” page to use the new `@context` argument for the `ThemeContext` component finally defined proper typing for `ThemeContext` component refactored showcase code to remove handling of `[data-hds-theme]` CSS selectors for theming updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names refactored theme switching in showcase to use new CSS files updated theme switcher in showcase to allow toggling of the “advanced options” introduced a “carbonization” mixin for applying styles only for certain conditions/modes this is the first implementation, it may see further refinements later it will be used to differentiate styles for the Button component added subtle shadow to `ThemingBasicContainer` fixed small bug that would cause the showcase pages to crash if the value stored in local storage for the `shw-theming-current-stylesheet` value was not found small fix to the control logic for the `HdsThemeSwitcher` demo in showcase page fixed TypeScript issue fix small bug in the logic when the “apply” with “show advanced options” is `false` added `ShwBodyLinkToRoute` component replaced custom link in AdvancedTable showcase page with newly created `ShwBodyLinkToRoute` component reworked the demo frameless for application with theme switcher to avoid collisions between the main page and the frame replaced custom theme switcher with proper `HdsThemeSwitcher` in `AppFooter` demo some cleanup before code review changed how theming is applied to the showcase itself, to limit `prefers-color-scheme` application only to the explict `system` theme selection fixed wrong CSS selector, per code review suggestion prefixed `OnSetThemeCallback` with `Hds` per review suggestion Update packages/components/src/template-registry.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> converted `updatePageStylesheets` function to a private method per Copilot suggestion: #3240 (comment) small cleanup per code reviews suggestions small fixes per code review updated logic that reads the stored theming data for the `HdsThemingService` to make it more robust removed comment updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names basic implementation of `<ShwCarbonizationComparisonGrid>` refactored implementation of `<ShwCarbonizationComparisonGrid>` implemented “Carbonization” section for `Badge` page implemented “Carbonization” section for `BadgeCount` page implemented “Carbonization” section for `Button` page implemented “Carbonization” section for `Focus Ring` page implemented “Carbonization” section for `Typography` page implemented “Carbonization” section for (new) `Color` page added `@carbon/web-components` as devDependency to Showcase app added `@carbon/[themes|layout|grid|type]` + `@ibm/plex` as devDependencies to Showcase app refactored `ComparisonGrid` component to add themed background color to the cells/areas added temporary support for IBM Plex font-family refactored code to support theming for reference web components, based on Carbon implementation/specifications small refactoring small refactorings refactored content organization to have the carbonization pages as standalone pages added carbon web components for comparison on `BadgeCount` page added carbon web components for comparison on `Button` page more small fixes for cleanup and linting implemented “Carbonization” section for `Form::TextInput` page implemented “Carbonization” section for `SegmentedGroup` page removed link to “Foundations > Color” page Small update to an `rgba` color Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> moved theming class in ComparisonGrid from item to item content per code review suggestion improved how to apply themed foreground/background colors to content in the comparison grid installed `@carbon/styles` as devDependency to import CSS variables for Carbon theming fixed issue with text color in typography page reorganized carbonized pages so they all live under the `carbonized` folder/route will be used later to detect if we need to do something around theme switcher and CSS to load prepared the ground for controlling the ShwThemeSwitcher on carbonized pages fixed CSS for carbonization pages updated carbonized typography page to show equivalent/mapped Carbon typographic style updated `ShwComparisonGrid` to expose an alternative side-by-side layout updated some components to take into account the new `hideCarbonLabels` argument fixed typescript/glint issue updated a couple of typographic mappings added yielding of `theme` value in the named blocks of the `ComparisonGrid` introduced `ShwCarbonizationStylePreviewTypography` to facilitate comparison of typographic styles refactored `carbonization/foundations/color` page and `ShwCarbonizationTokenPreviewColor` to show actual color values in preview item updated comparison grid to use `default` for original HDS theming instead of `hds` small tweak to the `badge` carbonization page added logic to the application to lock theme switching when loading a “carbonized” page (and restore its previous state when returning to non-carbonized pages) replaced `theme` with `mode` in `ComparisonGrid` fixed issue with the “default” block of the carbonization grid was not rendered as “classic” HDS fixed issue in the carbonization page for colors some cleanup before code review Update showcase/app/components/shw/carbonization/token-preview/color.gts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> updated showcase page for Button carbonization implemented “Carbonization” page for `Modal` component added examples of components with focus state to the carbonization page for focus ring tweaks per code review suggestions implemented “Carbonization” page for `Form/RadioCard` component better visual grouping of carbonization pages links in homepage renamed the `page-carbonization` components files and declarations to add `Index` (for consistency, per review comment) added `disabled` state to `cds-radio-tile` avoid duplicate `name` attributes for different radio groups add missing `{{on "change" this.onChange}}` handled to the `RadioCard` elements when in a group updated logic that converts the Carbon duration value to the DTCG format to use always seconds updated logic that converts the Carbon `cubic-bezier` value to the expected DTCG format see: https://www.designtokens.org/tr/drafts/format/#cubic-bezier re-extracted carbon tokens turned on option to convert `font-size` from `rem` to `px` for extracted Carbon tokens re-extracted carbon tokens [06] [Project Solar / Phase 1 / Dry-run] Migration dry-run for foundations and components (#3332) [Project Solar / Phase 1 / Engineering Follow-ups] Add `localStorage` parsing validation (#3401) added `chalk` as devDependency updated `build.ts` script for design tokens, to have validation of expected `$modes` format improved logging messages for validation warnings/errors of `$modes` [Project Solar / Phase 1 / Engineering Follow-ups] Add tests for HDS theming service and components (#3428) Co-authored-by: Dylan Hyun <dylan.hyun@hashicorp.com> Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> re-generated CSS files in output after rebasing on `main` (new styles have been added to the common styles for HDS components) [HDS-5702] - Remove postbuild in favor of rollup copy (#3441) fixed TS issue fixed some linting warnings for `package.json` files post rebase (and conflicts fixing) enabled logging for StyleDictionary abstracted `getSourceFromFileWithRootSelector` implemented custom “CSS variables” format for theme tokens, with logic to handle aliasing (outputReferences) and files splitting (“common” vs “themed”) abstracted `DocsJson` custom format to its own file removed `attributes/themeable` custom transform (not needed anymore) added validation for generated themed tokens (as SD custom action) small tweakings, cleanups and fixes TEMP - Add `test` tokens (to be removed in a follow-up revert commit) Revert "TEMP - Add `test` tokens (to be removed in a follow-up revert commit)" This reverts commit 455d9ec. [Project Solar / Phase 1 / Engineering Follow-ups] Converted tests for `HdsThemeSwitcher` and `HdsThemeContext` to `.gts` format (#3447) Refactor `dist` CSS file checks into script (#3462) re-generated all the dist and public files after rebasing on `main` small cleanup of initial commits used to open the PR [07a] [Project Solar / Phase 1] Include IBM Plex fonts as part of the `@hashicorp/design-system-components` package (#3387) removed service which was not used [Project Solar / Phase 1 / Engineering Follow-ups] Remove local storage implementation from `HdsTheming` service and move it to the Showcase consuming app (#3540) Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> [Project Solar / Phase 1 / Engineering Follow-ups] Remove `globalOnSetTheme` callback from `HdsTheming` service (#3539) Use esm for `dist` file check (#3551) fixes that were missed after rebase on `main` (and conflict resolution) re-built tokens after rebase on `main` (all the `Hds::SideNav` tokens have been removed) fixed yielded component name [Project Solar / Phase 1 / Engineering Follow-ups] Update tokens pipeline to support structured values for the `$modes` entries (#3575) [Project Solar / Phase 1 / Follow-up] Fix small issue in tokens build pipeline (#3595) Reverted temporary commits from PR #3595 Revert "TEMP/REMOVE ME - Added `$modes` to `boundary-50` (referenced as alias by `boundary.surface` and `boundary-gradient-faint-stop`)" This reverts commit eeb1a0a. Revert "TEMP/REMOVE ME - re-generated tokens in output" This reverts commit 23c9bb0. [Project Solar / Phase 1] Align version of carbon web component imports (#3613) [Project Solar / Phase 1 / Components] Support multiple selectors in carbonization mixin (#3630) [Project Solar / Phase 1 / Foundations] Finalize design tokens for Core/Semantic Colors + Typography + Borders (#3572) [Project Solar / Phase 1 / Components] `Badge/BadgeCount` carbonization (#3592) [Project Solar / Phase 1 / Foundations] Flight icons &`Icon` carbonization (#3584) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> Project solar/icons commit icons (#3643) Small updates to the icons used in the showcase page for the `Icon` component (#3644) [Project Solar / Phase 1 / Components] `Separator` carbonization (HDS-6102) (#3674) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> [Project Solar / Phase 1 / Foundations] Update tokens with `$modes` for semantic products colors (#3680) [Project Solar / Phase 1 / Icons] Fix copy button showcase status icons (#3694) [Project Solar / Phase 1 / Components] `ApplicationState` carbonization (HDS-6075) (#3686) [Project Solar / Phase 1 / Foundations] Remove `$modes` from "core/palette" product colors (#3695) [Project solar / Phase 1 / Foundations] Elevation (#3693) [Project Solar / Phase 1 / Showcase] Add support for "column" layout to comparison grid and "no equivalent" block (#3682) linting [Project Solar / Phase 1 / Components] `IconTile` carbonization (HDS-6061) (#3588) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Foundations] Add `high-contrast` core semantic token for surface (#3701) [Project Solar / Phase 1 / Components] `TooltipButton` carbonization (#3622) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `RichTooltip` carbonization (#3641) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `DismissButton` carbonization (#3665) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed AppFooter example in “foundations/theming” showcase page [Project Solar / Phase 1 / Components] `AppFooter` carbonization (HDS-6072) (#3675) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed issue with themes being applied to the “carbonization” pages Remove prebuild script (#3715) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Allow overriding of IBM Plex fonts `/assets` path in Scss (#3736) [Project Solar / Phase 1 / Follow-up] Add watcher to tokens `build` script (#3757) [Project Solar / Phase 1 / Follow-up] Watch sass files for changes in `components` build (#3759) [Project Solar / Phase 1 / Components] `LinkInline` and `LinkStandalone` carbonization (#3587) [Project Solar / Phase 1 / Components] `RichTooltip` - Set text color (#3756) [Project Solar / Phase 1 / Components] `CopySnippet` carbonization (#3733) fixed carbonized focus ring showcase `AdvancedTableThSort` has been now merged with `AdvancedTableTh` to be a single subcomponent [Project Solar / Phase 1 / Components] `Breadcrumb` carbonization (#3652) [Project Solar / Phase 1 / Components] `DialogPrimitive/Modal/Flyout` carbonization (#3645) [Project Solar / Phase 1 / Components] `Pagination` carbonization (HDS-6035) (#3598) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `Card` carbonization (#3679) [Project Solar / Phase 1 / Components] `Tabs` carbonization (HDS-6106) (#3690) removed leftover generated files after removal of `devdot` and `marketing` as targets in `main` Fix: AppFooter carbonization page STATUSES import paths HDS-6166 Fix incorrect value for Tabs Tab horizontal padding token for large variant [Project Solar / Phase 1] Update `@carbon/***` dependencies (#3794) [Project Solar / Phase 1 / Tokens update] Update `transitions` tokens (#3798) [Project Solar / Phase 1 / Tokens update] Update `typography` tokens (#3799) [Project Solar / Phase 1 / Components] `Tag` carbonization (#3685) [Project Solar / Phase 1 / Tokens update] Update component-level color tokens - Part 1 (#3805) [Project Solar / Phase 1 / Follow-up] Re-sync extracted Carbon tokens (#3812) [Project Solar / Phase 1 / Components] `PageHeader` carbonization (HDS-6099) (#3802) [Project Solar / Phase 1 / Follow-up] Fix issue in extraction of Carbon tokens when color value is in "modern" `rgb()` format (#3813) [Project Solar / Phase 1 / Components] `Button` carbonization (#3611) [Project Solar / Phase 1 / Components] `CopyButton` carbonization (#3696) [Project Solar / Phase 1 / Components] `CodeBlock` carbonization (#3779) Fix: Carbonization showcase type linting errors [Project Solar / Phase 1 / Components] `CodeEditor` carbonization (#3785) [Project Solar / Phase 1 / Follow-up] Fix `DialogPrimitive` header spacing (#3833) small text alignment fix in `NoEquivalent` showcase component [Project Solar / Phase 1 / Follow-up] Fix `hds-apply-only-if-carbon` Sass mixin (#3838) [Project Solar / Phase 1 / Components] `Reveal` carbonization (HDS-6100) (#3706) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Convert `ThemeSwitcher` and `ThemeContext` components to `.gts` (#3846) Add tests for `hds-icon-registry` service (#3829) [Project Solar / Phase 1 / Follow-up] Update `focus` to `focus-ring` in "component-level" tokens (#3861) [Project Solar / Phase 1 / Components] `Alert` & `Toast` carbonization (#3809) [Project Solar / Phase 1 / Components] `AppSideNav` carbonization (#3801) [Project Solar / Phase 1 / Follow up] Add "column-stacked" layout to `ShwCarbonizationComparisonGrid` in showcase for carbonization pages (#3867) re-generated files in output after rebase on main rebuilt files in output after rebase on `main` Fix: Application template function call for page initialization [Project Solar / Phase 1 / Components] `Dropdown` carbonization (HDS-6083) (#3814) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Components] Update `body-100` Carbon font size and component tokens (#3862) [Project Solar / Phase 1 / Follow-up] Showcase improvements for the focus ring refactoring (#3896) [Project Solar / Phase 1 / Components] `Form` primitives (HDS-6086) (#3860) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Follow-up] Focus ring refactoring for all components (#3884) [Project Solar / Phase 1 / Components] `AppHeader` carbonization (#3819) [Project Solar / Phase 1 / Follow-up] Cleanup redundancies in source JSON files for tokens (#3913) [Project Solar / Phase 1 / Migration] AppSideNav list item active indicator token (#3916) [Project Solar / Phase 1 / Migration] Set LinkStandalone secondary hover state color (#3920) re-generated files in output (missed in #3920) added selector with higher specificity for focused `.hds-dismiss-button.hds-dialog-primitive__dismiss` re-generated files in output [Project Solar / Phase 1 / Components] Remove `button.border-color.{color}.focus` tokens (#3933) [Project Solar / Phase 1 / Showcase] Convert HdsIcon in Carbon Web Components to `cds-icon` (#3928) [Project Solar / Phase 1 / Follow-up] Add `token-css-color-transform-direction` token (#3936) [Project Solar / Phase 1 / Migration] `Accordion` "carbonization" (#3525) missed to commit generated file in output (#3525) copyright updates fixed a couple of typos removed unnecessary `mock-state` attributes `Tag` - fix `mock-state-value` not being dynamically set on showcase page [Project Solar / Phase 1 / Migration] Add `secondary-muted` button variant (#3930) added fix for padding of `<legend>` base form element re-generated files in output [Project Solar / Phase 1 / Follo-up] Fix tokens values comparison + other small bugs (#3941) [Project Solar / Phase 1 / Follow-up] Include declarations for CSS `color-scheme` properties in generated token files (#3943) fixed `start` command syntax to escape double quotes instead of using single quotes (consistent with other commands in other files) re-generated files in output removed classname not used anymore
didoo
added a commit
that referenced
this pull request
Jun 30, 2026
…anch (at 30 Jun 2026) TODO - added temporary file to main feature branch for phase 1 added temporary changeset to feature branch for `$modes` support TEMP - added `$modes` entry to `color.palette.neutral-0` refactored logic used to provide SD configuration per target progress on logic for handling `$modes` - 1 TEMP - added `modes-testing` tokens TEMP - added `expected-CSS-output` files progress on logic for handling `$modes` - 2 added `attributes/themeable` transformation progress on logic for handling `$modes` - 3 progress on logic for handling `$modes` - 4 TEMP generated temporary dist files for testing TEMP - added examples of generated themed tokens added logic to generate theming CSS files REVERT - Removed `modes-testing` tokens removed `modes-testing` folder from compilation added `carbon-extracted` reference in the `source` definitions TEMP - added `$modes` entries for some color and typography tokens, with references to Carbon tokens, for testing changed `outputReferences` to `false` (temporary) to bypass issue with missing references when using Carbon tokens with theming logic added commented code to `build` to use for debugging issue with missing references and filtering when theming is applied added two new themed tokens generated files, for Scss mixins and for combined strategies fixed issue with `cds` naming missing the `g` fixed some issues with how the “extra” themed CSS files were generated TEMP - Re-generated tokens REVERT - added examples of generated themed tokens This reverts commit 194b9fb. REVERT - added `expected-CSS-output` files This reverts commit 7462def. fixed wrong check for existence of key in object (`0` values would trigger an error, but they’re valid) added `.hds-theme-light/dark` and `[data-hds-theme=“light/dark”]` to generated CSS selectors (later we may decide to remove them, but for the moment we need them for the showcase theming page to work in its current implementation) re-generated themed tokens updated generation of tokens’ CSS helpers to use CSS variables for `font-weight` helpers re-generated CSS helper files updated generation of extra CSS files to include `.hds-theme-hds/[data-hds-theme="hds"]` selectors for default (non-themed) HDS styling (later we will understand if we want to rename the `hds` theme to `default` to avoid this strange class name `hds-theme-hds`) updated design tokens pipeline to generate a `themed-tokens.json` file for documentation, including all the tokens for all the themes (it will be used in the showcase, and potentially the website) re-generated themed tokens updated “src” files to replace `hds` key with `default` in `$modes` definitions updated logic to replace `hds` key with `default` in `$modes` definitions re-generated tokens in `dist` folder tweaked logic for CSS selectors for `@media (prefers-color-scheme)` to use explicit selectors `.hds-theme-system`/`[data-hds-theme="system”]` to avoid specificity issues `:root:not([class*="hds-theme-"]):not([data-hds-theme])` has specificity 030 so when used inside `@media (prefers-color-scheme: light|dark)` it becomes the default compares to other selectors re-generated tokens in `dist` folder updated generation of extra theming CSS files to avoid CSS variables “staleness” updated generation of extra theming CSS files to differentiate between `theme` and `mode` CSS selectors re-generated tokens in `dist` folder removed `[data-hds-theme]` CSS selectors for simplicity asked feedback in Slack (https://ibm-hashicorp.slack.com/archives/C09KZL43EKU/p1762987902565479) and then discussed with Dylan/Kristin; we agreed they’re not really necessary/needed re-generated tokens in `dist` folder updated logic for generation of extra “themed” CSS files (removed `prefers-color-scheme`-only case, generalized `css-selectors`) re-generated tokens in `dist` folder small tweakings before code review renamed `generateExtra***` to `generate***` updated comment updated SCSS files organization for components (split common part) updated `includePaths` for design tokens in Showcase and Website `ember-cli-build.js` removed `rollup-plugin-scss` dev dependency (we use our own custom plugin for every Scss compilation) updated the `prePublish` script in `package.json` of `components` to validate that all the new CSS files are generated too simplified architecture of CSS compilation for HDS components (as agreed) fixed `prepublisOnly` script that was causing error in build (looking for old CSS files that don’t exist anymore) updated `cssFilePath` in blueprints to reflect new Scss file organization, per code review suggestion #3259 (comment) Apply suggestions from code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Update packages/components/src/styles/@hashicorp/design-system-components.scss Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> added `Hds::ThemeSwitcher` component added `Hds::Theming` service added theming to the Showcase itself (and replaced hardcoded values with `—shw` CSS variables) added `Shw::ThemeSwitcher` component for showcase updated `Mock::App` and added new yielded sub-components added `Shw:: ThemeSwitcher` to the Showcase page header added `foundations/theming` showcase page (and a frameless demo) refactored `hds-theming` service to align with the new themes/modes and be open to configurations added `hdsTheming` initialization to main showcase app removed compilation of components Scss and replaced it with static inclusion of pre-compiled (standard and themed) CSS The pre-compiled CSS files have been manually copied in the `public/assets` folder, while waiting to understand what is the best way to proceed to have them added at build time from the `@hashicorp/design-system-components` package added theming options via popover - part 1 added theming options via popover - part 2 added theming options via popover - part 3 added theming options via popover - part 4 added theming options via popover - part 5 big code refactoring for the theme selector, to streamline user selection and expand use cases we can cover updated logic that sets the theming for the showcase itself (without relying on HDS selectors) small fixes here and there for cleanup and linting fixed issue with `pnpm lint:format` (missing newline at the end of `package.json` solution: run `pnpm prettier . --cache --write` locally and then commit fixed accessibility issue in `advanced-table` page, due to changes to “themed” `—shw` colors fixed typescript error due to new mock page being added added fix for tests failing see #3298 started large refactoring/rewrite of the theming switcher and page in the showcase updated logic by creating a `shwTheming` service that extends `hdsTheming` moved theming logic from `ShwThemeSwitcher` component/subcomponents to `hdsTheming` service updated reference CSS files to follow new theming approach/logic further refactoring/rewriting of theming logic updated approach to `light/dark` styles in showcase by using the HDS CSS selectors migrated back the `Contextual` demo content to the index page added a `DebuggingPanel` to the `ShwThemeSwitcher` controls refactored/improved `DebuggingPanel` and added new preferences to advanced options small cleanups and refactorings fixed small issue with `ShwThemeSwitcher` selector removed some outdated comments small refactorings added local storage support for theming options big refactoring of the `hdsTheming` service to simplify logic and reduce redundant methods invocations cleanup of debugging comments and other stuff refactor and cleanup in preparation for PR review refactored code to fix logic flow for theming initialization fixed how the theming options were saved in local storage Apply suggestions from Copilot's code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> fixed issue with `setTheme` not being passed `options` by the `ShwThemeSwitcher` fix issue with the popover of the ShwThemeSwitcher component, where the states were potentially out of sync Update showcase/app/services/shw-theming.ts Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> small tweak to the typing of `HdsModes` per code review suggestion updated how the CSS files (tokens and components, with/without theming) are consumed by the showcase application updated logic for styleshet switching using the `disabled` attribute removed unused import removed `isInitialized` logic from the `hdeTheming` service to avoid bug Assertion Failed: You attempted to update _isInitialized on <HdsThemingService:ember77>, but it had already been used previously in the same computation. Attempting to update a value after using it in a computation can cause logical errors, infinite revalidation bugs, and performance issues, and is not supported. _isInitialized was first used: While rendering: {{outlet}} for -top-level -top-level {{outlet}} for application Application TEMP - added temporary `hds-theme-light/dark` selectors while we understand how to do nesting of theming TEMP - Added back custom token values for testing purpose fixed small issue with the `HdsThemeSwitcher` components used in the `Theming` showcase page context: #3240 (comment) added small comment updated `hdsTheming` service to support `default` theme / mode added support for `default` option to HDS ThemeSwitcher component Updated “foundations/theming” showcase page to include variants of HDS ThemeSwitcher with `default` option updated Showcase ThemeSwitcher to use ``default` as theme option updated logic for how CSS selectors are applied to the `html:root` element + scrappy implementation of `isComplex` (to be completed later) updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline added fake theming for display/text typography to `public/assets` themed tokens CSS files (for debugging purpose) updated “foundations/theming” showcase page to include `default` and `system` themes + improved contextual theming using custom typographic theming implemented `ThemeContex` component added demos of `ThemeContext` component to showcase “foundations/theming” page improved type definitions for ThemeContext and showcase “foundations/theming” page refactored how CSS selectors are applied to enable mode-specific overrides updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline updated `ThemeContext` to use a more generic `context` argument updated showcase “theming” page to use the new `@context` argument for the `ThemeContext` component finally defined proper typing for `ThemeContext` component refactored showcase code to remove handling of `[data-hds-theme]` CSS selectors for theming updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names refactored theme switching in showcase to use new CSS files updated theme switcher in showcase to allow toggling of the “advanced options” introduced a “carbonization” mixin for applying styles only for certain conditions/modes this is the first implementation, it may see further refinements later it will be used to differentiate styles for the Button component added subtle shadow to `ThemingBasicContainer` fixed small bug that would cause the showcase pages to crash if the value stored in local storage for the `shw-theming-current-stylesheet` value was not found small fix to the control logic for the `HdsThemeSwitcher` demo in showcase page fixed TypeScript issue fix small bug in the logic when the “apply” with “show advanced options” is `false` added `ShwBodyLinkToRoute` component replaced custom link in AdvancedTable showcase page with newly created `ShwBodyLinkToRoute` component reworked the demo frameless for application with theme switcher to avoid collisions between the main page and the frame replaced custom theme switcher with proper `HdsThemeSwitcher` in `AppFooter` demo some cleanup before code review changed how theming is applied to the showcase itself, to limit `prefers-color-scheme` application only to the explict `system` theme selection fixed wrong CSS selector, per code review suggestion prefixed `OnSetThemeCallback` with `Hds` per review suggestion Update packages/components/src/template-registry.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> converted `updatePageStylesheets` function to a private method per Copilot suggestion: #3240 (comment) small cleanup per code reviews suggestions small fixes per code review updated logic that reads the stored theming data for the `HdsThemingService` to make it more robust removed comment updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names basic implementation of `<ShwCarbonizationComparisonGrid>` refactored implementation of `<ShwCarbonizationComparisonGrid>` implemented “Carbonization” section for `Badge` page implemented “Carbonization” section for `BadgeCount` page implemented “Carbonization” section for `Button` page implemented “Carbonization” section for `Focus Ring` page implemented “Carbonization” section for `Typography` page implemented “Carbonization” section for (new) `Color` page added `@carbon/web-components` as devDependency to Showcase app added `@carbon/[themes|layout|grid|type]` + `@ibm/plex` as devDependencies to Showcase app refactored `ComparisonGrid` component to add themed background color to the cells/areas added temporary support for IBM Plex font-family refactored code to support theming for reference web components, based on Carbon implementation/specifications small refactoring small refactorings refactored content organization to have the carbonization pages as standalone pages added carbon web components for comparison on `BadgeCount` page added carbon web components for comparison on `Button` page more small fixes for cleanup and linting implemented “Carbonization” section for `Form::TextInput` page implemented “Carbonization” section for `SegmentedGroup` page removed link to “Foundations > Color” page Small update to an `rgba` color Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> moved theming class in ComparisonGrid from item to item content per code review suggestion improved how to apply themed foreground/background colors to content in the comparison grid installed `@carbon/styles` as devDependency to import CSS variables for Carbon theming fixed issue with text color in typography page reorganized carbonized pages so they all live under the `carbonized` folder/route will be used later to detect if we need to do something around theme switcher and CSS to load prepared the ground for controlling the ShwThemeSwitcher on carbonized pages fixed CSS for carbonization pages updated carbonized typography page to show equivalent/mapped Carbon typographic style updated `ShwComparisonGrid` to expose an alternative side-by-side layout updated some components to take into account the new `hideCarbonLabels` argument fixed typescript/glint issue updated a couple of typographic mappings added yielding of `theme` value in the named blocks of the `ComparisonGrid` introduced `ShwCarbonizationStylePreviewTypography` to facilitate comparison of typographic styles refactored `carbonization/foundations/color` page and `ShwCarbonizationTokenPreviewColor` to show actual color values in preview item updated comparison grid to use `default` for original HDS theming instead of `hds` small tweak to the `badge` carbonization page added logic to the application to lock theme switching when loading a “carbonized” page (and restore its previous state when returning to non-carbonized pages) replaced `theme` with `mode` in `ComparisonGrid` fixed issue with the “default” block of the carbonization grid was not rendered as “classic” HDS fixed issue in the carbonization page for colors some cleanup before code review Update showcase/app/components/shw/carbonization/token-preview/color.gts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> updated showcase page for Button carbonization implemented “Carbonization” page for `Modal` component added examples of components with focus state to the carbonization page for focus ring tweaks per code review suggestions implemented “Carbonization” page for `Form/RadioCard` component better visual grouping of carbonization pages links in homepage renamed the `page-carbonization` components files and declarations to add `Index` (for consistency, per review comment) added `disabled` state to `cds-radio-tile` avoid duplicate `name` attributes for different radio groups add missing `{{on "change" this.onChange}}` handled to the `RadioCard` elements when in a group updated logic that converts the Carbon duration value to the DTCG format to use always seconds updated logic that converts the Carbon `cubic-bezier` value to the expected DTCG format see: https://www.designtokens.org/tr/drafts/format/#cubic-bezier re-extracted carbon tokens turned on option to convert `font-size` from `rem` to `px` for extracted Carbon tokens re-extracted carbon tokens [06] [Project Solar / Phase 1 / Dry-run] Migration dry-run for foundations and components (#3332) [Project Solar / Phase 1 / Engineering Follow-ups] Add `localStorage` parsing validation (#3401) added `chalk` as devDependency updated `build.ts` script for design tokens, to have validation of expected `$modes` format improved logging messages for validation warnings/errors of `$modes` [Project Solar / Phase 1 / Engineering Follow-ups] Add tests for HDS theming service and components (#3428) Co-authored-by: Dylan Hyun <dylan.hyun@hashicorp.com> Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> re-generated CSS files in output after rebasing on `main` (new styles have been added to the common styles for HDS components) [HDS-5702] - Remove postbuild in favor of rollup copy (#3441) fixed TS issue fixed some linting warnings for `package.json` files post rebase (and conflicts fixing) enabled logging for StyleDictionary abstracted `getSourceFromFileWithRootSelector` implemented custom “CSS variables” format for theme tokens, with logic to handle aliasing (outputReferences) and files splitting (“common” vs “themed”) abstracted `DocsJson` custom format to its own file removed `attributes/themeable` custom transform (not needed anymore) added validation for generated themed tokens (as SD custom action) small tweakings, cleanups and fixes TEMP - Add `test` tokens (to be removed in a follow-up revert commit) Revert "TEMP - Add `test` tokens (to be removed in a follow-up revert commit)" This reverts commit 455d9ec. [Project Solar / Phase 1 / Engineering Follow-ups] Converted tests for `HdsThemeSwitcher` and `HdsThemeContext` to `.gts` format (#3447) Refactor `dist` CSS file checks into script (#3462) re-generated all the dist and public files after rebasing on `main` small cleanup of initial commits used to open the PR [07a] [Project Solar / Phase 1] Include IBM Plex fonts as part of the `@hashicorp/design-system-components` package (#3387) removed service which was not used [Project Solar / Phase 1 / Engineering Follow-ups] Remove local storage implementation from `HdsTheming` service and move it to the Showcase consuming app (#3540) Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> [Project Solar / Phase 1 / Engineering Follow-ups] Remove `globalOnSetTheme` callback from `HdsTheming` service (#3539) Use esm for `dist` file check (#3551) fixes that were missed after rebase on `main` (and conflict resolution) re-built tokens after rebase on `main` (all the `Hds::SideNav` tokens have been removed) fixed yielded component name [Project Solar / Phase 1 / Engineering Follow-ups] Update tokens pipeline to support structured values for the `$modes` entries (#3575) [Project Solar / Phase 1 / Follow-up] Fix small issue in tokens build pipeline (#3595) Reverted temporary commits from PR #3595 Revert "TEMP/REMOVE ME - Added `$modes` to `boundary-50` (referenced as alias by `boundary.surface` and `boundary-gradient-faint-stop`)" This reverts commit eeb1a0a. Revert "TEMP/REMOVE ME - re-generated tokens in output" This reverts commit 23c9bb0. [Project Solar / Phase 1] Align version of carbon web component imports (#3613) [Project Solar / Phase 1 / Components] Support multiple selectors in carbonization mixin (#3630) [Project Solar / Phase 1 / Foundations] Finalize design tokens for Core/Semantic Colors + Typography + Borders (#3572) [Project Solar / Phase 1 / Components] `Badge/BadgeCount` carbonization (#3592) [Project Solar / Phase 1 / Foundations] Flight icons &`Icon` carbonization (#3584) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> Project solar/icons commit icons (#3643) Small updates to the icons used in the showcase page for the `Icon` component (#3644) [Project Solar / Phase 1 / Components] `Separator` carbonization (HDS-6102) (#3674) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> [Project Solar / Phase 1 / Foundations] Update tokens with `$modes` for semantic products colors (#3680) [Project Solar / Phase 1 / Icons] Fix copy button showcase status icons (#3694) [Project Solar / Phase 1 / Components] `ApplicationState` carbonization (HDS-6075) (#3686) [Project Solar / Phase 1 / Foundations] Remove `$modes` from "core/palette" product colors (#3695) [Project solar / Phase 1 / Foundations] Elevation (#3693) [Project Solar / Phase 1 / Showcase] Add support for "column" layout to comparison grid and "no equivalent" block (#3682) linting [Project Solar / Phase 1 / Components] `IconTile` carbonization (HDS-6061) (#3588) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Foundations] Add `high-contrast` core semantic token for surface (#3701) [Project Solar / Phase 1 / Components] `TooltipButton` carbonization (#3622) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `RichTooltip` carbonization (#3641) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `DismissButton` carbonization (#3665) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed AppFooter example in “foundations/theming” showcase page [Project Solar / Phase 1 / Components] `AppFooter` carbonization (HDS-6072) (#3675) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed issue with themes being applied to the “carbonization” pages Remove prebuild script (#3715) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Allow overriding of IBM Plex fonts `/assets` path in Scss (#3736) [Project Solar / Phase 1 / Follow-up] Add watcher to tokens `build` script (#3757) [Project Solar / Phase 1 / Follow-up] Watch sass files for changes in `components` build (#3759) [Project Solar / Phase 1 / Components] `LinkInline` and `LinkStandalone` carbonization (#3587) [Project Solar / Phase 1 / Components] `RichTooltip` - Set text color (#3756) [Project Solar / Phase 1 / Components] `CopySnippet` carbonization (#3733) fixed carbonized focus ring showcase `AdvancedTableThSort` has been now merged with `AdvancedTableTh` to be a single subcomponent [Project Solar / Phase 1 / Components] `Breadcrumb` carbonization (#3652) [Project Solar / Phase 1 / Components] `DialogPrimitive/Modal/Flyout` carbonization (#3645) [Project Solar / Phase 1 / Components] `Pagination` carbonization (HDS-6035) (#3598) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `Card` carbonization (#3679) [Project Solar / Phase 1 / Components] `Tabs` carbonization (HDS-6106) (#3690) removed leftover generated files after removal of `devdot` and `marketing` as targets in `main` Fix: AppFooter carbonization page STATUSES import paths HDS-6166 Fix incorrect value for Tabs Tab horizontal padding token for large variant [Project Solar / Phase 1] Update `@carbon/***` dependencies (#3794) [Project Solar / Phase 1 / Tokens update] Update `transitions` tokens (#3798) [Project Solar / Phase 1 / Tokens update] Update `typography` tokens (#3799) [Project Solar / Phase 1 / Components] `Tag` carbonization (#3685) [Project Solar / Phase 1 / Tokens update] Update component-level color tokens - Part 1 (#3805) [Project Solar / Phase 1 / Follow-up] Re-sync extracted Carbon tokens (#3812) [Project Solar / Phase 1 / Components] `PageHeader` carbonization (HDS-6099) (#3802) [Project Solar / Phase 1 / Follow-up] Fix issue in extraction of Carbon tokens when color value is in "modern" `rgb()` format (#3813) [Project Solar / Phase 1 / Components] `Button` carbonization (#3611) [Project Solar / Phase 1 / Components] `CopyButton` carbonization (#3696) [Project Solar / Phase 1 / Components] `CodeBlock` carbonization (#3779) Fix: Carbonization showcase type linting errors [Project Solar / Phase 1 / Components] `CodeEditor` carbonization (#3785) [Project Solar / Phase 1 / Follow-up] Fix `DialogPrimitive` header spacing (#3833) small text alignment fix in `NoEquivalent` showcase component [Project Solar / Phase 1 / Follow-up] Fix `hds-apply-only-if-carbon` Sass mixin (#3838) [Project Solar / Phase 1 / Components] `Reveal` carbonization (HDS-6100) (#3706) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Convert `ThemeSwitcher` and `ThemeContext` components to `.gts` (#3846) Add tests for `hds-icon-registry` service (#3829) [Project Solar / Phase 1 / Follow-up] Update `focus` to `focus-ring` in "component-level" tokens (#3861) [Project Solar / Phase 1 / Components] `Alert` & `Toast` carbonization (#3809) [Project Solar / Phase 1 / Components] `AppSideNav` carbonization (#3801) [Project Solar / Phase 1 / Follow up] Add "column-stacked" layout to `ShwCarbonizationComparisonGrid` in showcase for carbonization pages (#3867) re-generated files in output after rebase on main rebuilt files in output after rebase on `main` Fix: Application template function call for page initialization [Project Solar / Phase 1 / Components] `Dropdown` carbonization (HDS-6083) (#3814) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Components] Update `body-100` Carbon font size and component tokens (#3862) [Project Solar / Phase 1 / Follow-up] Showcase improvements for the focus ring refactoring (#3896) [Project Solar / Phase 1 / Components] `Form` primitives (HDS-6086) (#3860) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Follow-up] Focus ring refactoring for all components (#3884) [Project Solar / Phase 1 / Components] `AppHeader` carbonization (#3819) [Project Solar / Phase 1 / Follow-up] Cleanup redundancies in source JSON files for tokens (#3913) [Project Solar / Phase 1 / Migration] AppSideNav list item active indicator token (#3916) [Project Solar / Phase 1 / Migration] Set LinkStandalone secondary hover state color (#3920) re-generated files in output (missed in #3920) added selector with higher specificity for focused `.hds-dismiss-button.hds-dialog-primitive__dismiss` re-generated files in output [Project Solar / Phase 1 / Components] Remove `button.border-color.{color}.focus` tokens (#3933) [Project Solar / Phase 1 / Showcase] Convert HdsIcon in Carbon Web Components to `cds-icon` (#3928) [Project Solar / Phase 1 / Follow-up] Add `token-css-color-transform-direction` token (#3936) [Project Solar / Phase 1 / Migration] `Accordion` "carbonization" (#3525) missed to commit generated file in output (#3525) copyright updates fixed a couple of typos removed unnecessary `mock-state` attributes `Tag` - fix `mock-state-value` not being dynamically set on showcase page [Project Solar / Phase 1 / Migration] Add `secondary-muted` button variant (#3930) added fix for padding of `<legend>` base form element re-generated files in output [Project Solar / Phase 1 / Follo-up] Fix tokens values comparison + other small bugs (#3941) [Project Solar / Phase 1 / Follow-up] Include declarations for CSS `color-scheme` properties in generated token files (#3943) fixed `start` command syntax to escape double quotes instead of using single quotes (consistent with other commands in other files) re-generated files in output removed classname not used anymore
didoo
added a commit
that referenced
this pull request
Jun 30, 2026
…anch (at 30 Jun 2026) TODO - added temporary file to main feature branch for phase 1 added temporary changeset to feature branch for `$modes` support TEMP - added `$modes` entry to `color.palette.neutral-0` refactored logic used to provide SD configuration per target progress on logic for handling `$modes` - 1 TEMP - added `modes-testing` tokens TEMP - added `expected-CSS-output` files progress on logic for handling `$modes` - 2 added `attributes/themeable` transformation progress on logic for handling `$modes` - 3 progress on logic for handling `$modes` - 4 TEMP generated temporary dist files for testing TEMP - added examples of generated themed tokens added logic to generate theming CSS files REVERT - Removed `modes-testing` tokens removed `modes-testing` folder from compilation added `carbon-extracted` reference in the `source` definitions TEMP - added `$modes` entries for some color and typography tokens, with references to Carbon tokens, for testing changed `outputReferences` to `false` (temporary) to bypass issue with missing references when using Carbon tokens with theming logic added commented code to `build` to use for debugging issue with missing references and filtering when theming is applied added two new themed tokens generated files, for Scss mixins and for combined strategies fixed issue with `cds` naming missing the `g` fixed some issues with how the “extra” themed CSS files were generated TEMP - Re-generated tokens REVERT - added examples of generated themed tokens This reverts commit 194b9fb. REVERT - added `expected-CSS-output` files This reverts commit 7462def. fixed wrong check for existence of key in object (`0` values would trigger an error, but they’re valid) added `.hds-theme-light/dark` and `[data-hds-theme=“light/dark”]` to generated CSS selectors (later we may decide to remove them, but for the moment we need them for the showcase theming page to work in its current implementation) re-generated themed tokens updated generation of tokens’ CSS helpers to use CSS variables for `font-weight` helpers re-generated CSS helper files updated generation of extra CSS files to include `.hds-theme-hds/[data-hds-theme="hds"]` selectors for default (non-themed) HDS styling (later we will understand if we want to rename the `hds` theme to `default` to avoid this strange class name `hds-theme-hds`) updated design tokens pipeline to generate a `themed-tokens.json` file for documentation, including all the tokens for all the themes (it will be used in the showcase, and potentially the website) re-generated themed tokens updated “src” files to replace `hds` key with `default` in `$modes` definitions updated logic to replace `hds` key with `default` in `$modes` definitions re-generated tokens in `dist` folder tweaked logic for CSS selectors for `@media (prefers-color-scheme)` to use explicit selectors `.hds-theme-system`/`[data-hds-theme="system”]` to avoid specificity issues `:root:not([class*="hds-theme-"]):not([data-hds-theme])` has specificity 030 so when used inside `@media (prefers-color-scheme: light|dark)` it becomes the default compares to other selectors re-generated tokens in `dist` folder updated generation of extra theming CSS files to avoid CSS variables “staleness” updated generation of extra theming CSS files to differentiate between `theme` and `mode` CSS selectors re-generated tokens in `dist` folder removed `[data-hds-theme]` CSS selectors for simplicity asked feedback in Slack (https://ibm-hashicorp.slack.com/archives/C09KZL43EKU/p1762987902565479) and then discussed with Dylan/Kristin; we agreed they’re not really necessary/needed re-generated tokens in `dist` folder updated logic for generation of extra “themed” CSS files (removed `prefers-color-scheme`-only case, generalized `css-selectors`) re-generated tokens in `dist` folder small tweakings before code review renamed `generateExtra***` to `generate***` updated comment updated SCSS files organization for components (split common part) updated `includePaths` for design tokens in Showcase and Website `ember-cli-build.js` removed `rollup-plugin-scss` dev dependency (we use our own custom plugin for every Scss compilation) updated the `prePublish` script in `package.json` of `components` to validate that all the new CSS files are generated too simplified architecture of CSS compilation for HDS components (as agreed) fixed `prepublisOnly` script that was causing error in build (looking for old CSS files that don’t exist anymore) updated `cssFilePath` in blueprints to reflect new Scss file organization, per code review suggestion #3259 (comment) Apply suggestions from code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Update packages/components/src/styles/@hashicorp/design-system-components.scss Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> added `Hds::ThemeSwitcher` component added `Hds::Theming` service added theming to the Showcase itself (and replaced hardcoded values with `—shw` CSS variables) added `Shw::ThemeSwitcher` component for showcase updated `Mock::App` and added new yielded sub-components added `Shw:: ThemeSwitcher` to the Showcase page header added `foundations/theming` showcase page (and a frameless demo) refactored `hds-theming` service to align with the new themes/modes and be open to configurations added `hdsTheming` initialization to main showcase app removed compilation of components Scss and replaced it with static inclusion of pre-compiled (standard and themed) CSS The pre-compiled CSS files have been manually copied in the `public/assets` folder, while waiting to understand what is the best way to proceed to have them added at build time from the `@hashicorp/design-system-components` package added theming options via popover - part 1 added theming options via popover - part 2 added theming options via popover - part 3 added theming options via popover - part 4 added theming options via popover - part 5 big code refactoring for the theme selector, to streamline user selection and expand use cases we can cover updated logic that sets the theming for the showcase itself (without relying on HDS selectors) small fixes here and there for cleanup and linting fixed issue with `pnpm lint:format` (missing newline at the end of `package.json` solution: run `pnpm prettier . --cache --write` locally and then commit fixed accessibility issue in `advanced-table` page, due to changes to “themed” `—shw` colors fixed typescript error due to new mock page being added added fix for tests failing see #3298 started large refactoring/rewrite of the theming switcher and page in the showcase updated logic by creating a `shwTheming` service that extends `hdsTheming` moved theming logic from `ShwThemeSwitcher` component/subcomponents to `hdsTheming` service updated reference CSS files to follow new theming approach/logic further refactoring/rewriting of theming logic updated approach to `light/dark` styles in showcase by using the HDS CSS selectors migrated back the `Contextual` demo content to the index page added a `DebuggingPanel` to the `ShwThemeSwitcher` controls refactored/improved `DebuggingPanel` and added new preferences to advanced options small cleanups and refactorings fixed small issue with `ShwThemeSwitcher` selector removed some outdated comments small refactorings added local storage support for theming options big refactoring of the `hdsTheming` service to simplify logic and reduce redundant methods invocations cleanup of debugging comments and other stuff refactor and cleanup in preparation for PR review refactored code to fix logic flow for theming initialization fixed how the theming options were saved in local storage Apply suggestions from Copilot's code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> fixed issue with `setTheme` not being passed `options` by the `ShwThemeSwitcher` fix issue with the popover of the ShwThemeSwitcher component, where the states were potentially out of sync Update showcase/app/services/shw-theming.ts Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> small tweak to the typing of `HdsModes` per code review suggestion updated how the CSS files (tokens and components, with/without theming) are consumed by the showcase application updated logic for styleshet switching using the `disabled` attribute removed unused import removed `isInitialized` logic from the `hdeTheming` service to avoid bug Assertion Failed: You attempted to update _isInitialized on <HdsThemingService:ember77>, but it had already been used previously in the same computation. Attempting to update a value after using it in a computation can cause logical errors, infinite revalidation bugs, and performance issues, and is not supported. _isInitialized was first used: While rendering: {{outlet}} for -top-level -top-level {{outlet}} for application Application TEMP - added temporary `hds-theme-light/dark` selectors while we understand how to do nesting of theming TEMP - Added back custom token values for testing purpose fixed small issue with the `HdsThemeSwitcher` components used in the `Theming` showcase page context: #3240 (comment) added small comment updated `hdsTheming` service to support `default` theme / mode added support for `default` option to HDS ThemeSwitcher component Updated “foundations/theming” showcase page to include variants of HDS ThemeSwitcher with `default` option updated Showcase ThemeSwitcher to use ``default` as theme option updated logic for how CSS selectors are applied to the `html:root` element + scrappy implementation of `isComplex` (to be completed later) updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline added fake theming for display/text typography to `public/assets` themed tokens CSS files (for debugging purpose) updated “foundations/theming” showcase page to include `default` and `system` themes + improved contextual theming using custom typographic theming implemented `ThemeContex` component added demos of `ThemeContext` component to showcase “foundations/theming” page improved type definitions for ThemeContext and showcase “foundations/theming” page refactored how CSS selectors are applied to enable mode-specific overrides updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline updated `ThemeContext` to use a more generic `context` argument updated showcase “theming” page to use the new `@context` argument for the `ThemeContext` component finally defined proper typing for `ThemeContext` component refactored showcase code to remove handling of `[data-hds-theme]` CSS selectors for theming updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names refactored theme switching in showcase to use new CSS files updated theme switcher in showcase to allow toggling of the “advanced options” introduced a “carbonization” mixin for applying styles only for certain conditions/modes this is the first implementation, it may see further refinements later it will be used to differentiate styles for the Button component added subtle shadow to `ThemingBasicContainer` fixed small bug that would cause the showcase pages to crash if the value stored in local storage for the `shw-theming-current-stylesheet` value was not found small fix to the control logic for the `HdsThemeSwitcher` demo in showcase page fixed TypeScript issue fix small bug in the logic when the “apply” with “show advanced options” is `false` added `ShwBodyLinkToRoute` component replaced custom link in AdvancedTable showcase page with newly created `ShwBodyLinkToRoute` component reworked the demo frameless for application with theme switcher to avoid collisions between the main page and the frame replaced custom theme switcher with proper `HdsThemeSwitcher` in `AppFooter` demo some cleanup before code review changed how theming is applied to the showcase itself, to limit `prefers-color-scheme` application only to the explict `system` theme selection fixed wrong CSS selector, per code review suggestion prefixed `OnSetThemeCallback` with `Hds` per review suggestion Update packages/components/src/template-registry.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> converted `updatePageStylesheets` function to a private method per Copilot suggestion: #3240 (comment) small cleanup per code reviews suggestions small fixes per code review updated logic that reads the stored theming data for the `HdsThemingService` to make it more robust removed comment updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names basic implementation of `<ShwCarbonizationComparisonGrid>` refactored implementation of `<ShwCarbonizationComparisonGrid>` implemented “Carbonization” section for `Badge` page implemented “Carbonization” section for `BadgeCount` page implemented “Carbonization” section for `Button` page implemented “Carbonization” section for `Focus Ring` page implemented “Carbonization” section for `Typography` page implemented “Carbonization” section for (new) `Color` page added `@carbon/web-components` as devDependency to Showcase app added `@carbon/[themes|layout|grid|type]` + `@ibm/plex` as devDependencies to Showcase app refactored `ComparisonGrid` component to add themed background color to the cells/areas added temporary support for IBM Plex font-family refactored code to support theming for reference web components, based on Carbon implementation/specifications small refactoring small refactorings refactored content organization to have the carbonization pages as standalone pages added carbon web components for comparison on `BadgeCount` page added carbon web components for comparison on `Button` page more small fixes for cleanup and linting implemented “Carbonization” section for `Form::TextInput` page implemented “Carbonization” section for `SegmentedGroup` page removed link to “Foundations > Color” page Small update to an `rgba` color Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> moved theming class in ComparisonGrid from item to item content per code review suggestion improved how to apply themed foreground/background colors to content in the comparison grid installed `@carbon/styles` as devDependency to import CSS variables for Carbon theming fixed issue with text color in typography page reorganized carbonized pages so they all live under the `carbonized` folder/route will be used later to detect if we need to do something around theme switcher and CSS to load prepared the ground for controlling the ShwThemeSwitcher on carbonized pages fixed CSS for carbonization pages updated carbonized typography page to show equivalent/mapped Carbon typographic style updated `ShwComparisonGrid` to expose an alternative side-by-side layout updated some components to take into account the new `hideCarbonLabels` argument fixed typescript/glint issue updated a couple of typographic mappings added yielding of `theme` value in the named blocks of the `ComparisonGrid` introduced `ShwCarbonizationStylePreviewTypography` to facilitate comparison of typographic styles refactored `carbonization/foundations/color` page and `ShwCarbonizationTokenPreviewColor` to show actual color values in preview item updated comparison grid to use `default` for original HDS theming instead of `hds` small tweak to the `badge` carbonization page added logic to the application to lock theme switching when loading a “carbonized” page (and restore its previous state when returning to non-carbonized pages) replaced `theme` with `mode` in `ComparisonGrid` fixed issue with the “default” block of the carbonization grid was not rendered as “classic” HDS fixed issue in the carbonization page for colors some cleanup before code review Update showcase/app/components/shw/carbonization/token-preview/color.gts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> updated showcase page for Button carbonization implemented “Carbonization” page for `Modal` component added examples of components with focus state to the carbonization page for focus ring tweaks per code review suggestions implemented “Carbonization” page for `Form/RadioCard` component better visual grouping of carbonization pages links in homepage renamed the `page-carbonization` components files and declarations to add `Index` (for consistency, per review comment) added `disabled` state to `cds-radio-tile` avoid duplicate `name` attributes for different radio groups add missing `{{on "change" this.onChange}}` handled to the `RadioCard` elements when in a group updated logic that converts the Carbon duration value to the DTCG format to use always seconds updated logic that converts the Carbon `cubic-bezier` value to the expected DTCG format see: https://www.designtokens.org/tr/drafts/format/#cubic-bezier re-extracted carbon tokens turned on option to convert `font-size` from `rem` to `px` for extracted Carbon tokens re-extracted carbon tokens [06] [Project Solar / Phase 1 / Dry-run] Migration dry-run for foundations and components (#3332) [Project Solar / Phase 1 / Engineering Follow-ups] Add `localStorage` parsing validation (#3401) added `chalk` as devDependency updated `build.ts` script for design tokens, to have validation of expected `$modes` format improved logging messages for validation warnings/errors of `$modes` [Project Solar / Phase 1 / Engineering Follow-ups] Add tests for HDS theming service and components (#3428) Co-authored-by: Dylan Hyun <dylan.hyun@hashicorp.com> Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> re-generated CSS files in output after rebasing on `main` (new styles have been added to the common styles for HDS components) [HDS-5702] - Remove postbuild in favor of rollup copy (#3441) fixed TS issue fixed some linting warnings for `package.json` files post rebase (and conflicts fixing) enabled logging for StyleDictionary abstracted `getSourceFromFileWithRootSelector` implemented custom “CSS variables” format for theme tokens, with logic to handle aliasing (outputReferences) and files splitting (“common” vs “themed”) abstracted `DocsJson` custom format to its own file removed `attributes/themeable` custom transform (not needed anymore) added validation for generated themed tokens (as SD custom action) small tweakings, cleanups and fixes TEMP - Add `test` tokens (to be removed in a follow-up revert commit) Revert "TEMP - Add `test` tokens (to be removed in a follow-up revert commit)" This reverts commit 455d9ec. [Project Solar / Phase 1 / Engineering Follow-ups] Converted tests for `HdsThemeSwitcher` and `HdsThemeContext` to `.gts` format (#3447) Refactor `dist` CSS file checks into script (#3462) re-generated all the dist and public files after rebasing on `main` small cleanup of initial commits used to open the PR [07a] [Project Solar / Phase 1] Include IBM Plex fonts as part of the `@hashicorp/design-system-components` package (#3387) removed service which was not used [Project Solar / Phase 1 / Engineering Follow-ups] Remove local storage implementation from `HdsTheming` service and move it to the Showcase consuming app (#3540) Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> [Project Solar / Phase 1 / Engineering Follow-ups] Remove `globalOnSetTheme` callback from `HdsTheming` service (#3539) Use esm for `dist` file check (#3551) fixes that were missed after rebase on `main` (and conflict resolution) re-built tokens after rebase on `main` (all the `Hds::SideNav` tokens have been removed) fixed yielded component name [Project Solar / Phase 1 / Engineering Follow-ups] Update tokens pipeline to support structured values for the `$modes` entries (#3575) [Project Solar / Phase 1 / Follow-up] Fix small issue in tokens build pipeline (#3595) Reverted temporary commits from PR #3595 Revert "TEMP/REMOVE ME - Added `$modes` to `boundary-50` (referenced as alias by `boundary.surface` and `boundary-gradient-faint-stop`)" This reverts commit eeb1a0a. Revert "TEMP/REMOVE ME - re-generated tokens in output" This reverts commit 23c9bb0. [Project Solar / Phase 1] Align version of carbon web component imports (#3613) [Project Solar / Phase 1 / Components] Support multiple selectors in carbonization mixin (#3630) [Project Solar / Phase 1 / Foundations] Finalize design tokens for Core/Semantic Colors + Typography + Borders (#3572) [Project Solar / Phase 1 / Components] `Badge/BadgeCount` carbonization (#3592) [Project Solar / Phase 1 / Foundations] Flight icons &`Icon` carbonization (#3584) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> Project solar/icons commit icons (#3643) Small updates to the icons used in the showcase page for the `Icon` component (#3644) [Project Solar / Phase 1 / Components] `Separator` carbonization (HDS-6102) (#3674) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> [Project Solar / Phase 1 / Foundations] Update tokens with `$modes` for semantic products colors (#3680) [Project Solar / Phase 1 / Icons] Fix copy button showcase status icons (#3694) [Project Solar / Phase 1 / Components] `ApplicationState` carbonization (HDS-6075) (#3686) [Project Solar / Phase 1 / Foundations] Remove `$modes` from "core/palette" product colors (#3695) [Project solar / Phase 1 / Foundations] Elevation (#3693) [Project Solar / Phase 1 / Showcase] Add support for "column" layout to comparison grid and "no equivalent" block (#3682) linting [Project Solar / Phase 1 / Components] `IconTile` carbonization (HDS-6061) (#3588) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Foundations] Add `high-contrast` core semantic token for surface (#3701) [Project Solar / Phase 1 / Components] `TooltipButton` carbonization (#3622) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `RichTooltip` carbonization (#3641) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `DismissButton` carbonization (#3665) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed AppFooter example in “foundations/theming” showcase page [Project Solar / Phase 1 / Components] `AppFooter` carbonization (HDS-6072) (#3675) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed issue with themes being applied to the “carbonization” pages Remove prebuild script (#3715) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Allow overriding of IBM Plex fonts `/assets` path in Scss (#3736) [Project Solar / Phase 1 / Follow-up] Add watcher to tokens `build` script (#3757) [Project Solar / Phase 1 / Follow-up] Watch sass files for changes in `components` build (#3759) [Project Solar / Phase 1 / Components] `LinkInline` and `LinkStandalone` carbonization (#3587) [Project Solar / Phase 1 / Components] `RichTooltip` - Set text color (#3756) [Project Solar / Phase 1 / Components] `CopySnippet` carbonization (#3733) fixed carbonized focus ring showcase `AdvancedTableThSort` has been now merged with `AdvancedTableTh` to be a single subcomponent [Project Solar / Phase 1 / Components] `Breadcrumb` carbonization (#3652) [Project Solar / Phase 1 / Components] `DialogPrimitive/Modal/Flyout` carbonization (#3645) [Project Solar / Phase 1 / Components] `Pagination` carbonization (HDS-6035) (#3598) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `Card` carbonization (#3679) [Project Solar / Phase 1 / Components] `Tabs` carbonization (HDS-6106) (#3690) removed leftover generated files after removal of `devdot` and `marketing` as targets in `main` Fix: AppFooter carbonization page STATUSES import paths HDS-6166 Fix incorrect value for Tabs Tab horizontal padding token for large variant [Project Solar / Phase 1] Update `@carbon/***` dependencies (#3794) [Project Solar / Phase 1 / Tokens update] Update `transitions` tokens (#3798) [Project Solar / Phase 1 / Tokens update] Update `typography` tokens (#3799) [Project Solar / Phase 1 / Components] `Tag` carbonization (#3685) [Project Solar / Phase 1 / Tokens update] Update component-level color tokens - Part 1 (#3805) [Project Solar / Phase 1 / Follow-up] Re-sync extracted Carbon tokens (#3812) [Project Solar / Phase 1 / Components] `PageHeader` carbonization (HDS-6099) (#3802) [Project Solar / Phase 1 / Follow-up] Fix issue in extraction of Carbon tokens when color value is in "modern" `rgb()` format (#3813) [Project Solar / Phase 1 / Components] `Button` carbonization (#3611) [Project Solar / Phase 1 / Components] `CopyButton` carbonization (#3696) [Project Solar / Phase 1 / Components] `CodeBlock` carbonization (#3779) Fix: Carbonization showcase type linting errors [Project Solar / Phase 1 / Components] `CodeEditor` carbonization (#3785) [Project Solar / Phase 1 / Follow-up] Fix `DialogPrimitive` header spacing (#3833) small text alignment fix in `NoEquivalent` showcase component [Project Solar / Phase 1 / Follow-up] Fix `hds-apply-only-if-carbon` Sass mixin (#3838) [Project Solar / Phase 1 / Components] `Reveal` carbonization (HDS-6100) (#3706) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Convert `ThemeSwitcher` and `ThemeContext` components to `.gts` (#3846) Add tests for `hds-icon-registry` service (#3829) [Project Solar / Phase 1 / Follow-up] Update `focus` to `focus-ring` in "component-level" tokens (#3861) [Project Solar / Phase 1 / Components] `Alert` & `Toast` carbonization (#3809) [Project Solar / Phase 1 / Components] `AppSideNav` carbonization (#3801) [Project Solar / Phase 1 / Follow up] Add "column-stacked" layout to `ShwCarbonizationComparisonGrid` in showcase for carbonization pages (#3867) re-generated files in output after rebase on main rebuilt files in output after rebase on `main` Fix: Application template function call for page initialization [Project Solar / Phase 1 / Components] `Dropdown` carbonization (HDS-6083) (#3814) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Components] Update `body-100` Carbon font size and component tokens (#3862) [Project Solar / Phase 1 / Follow-up] Showcase improvements for the focus ring refactoring (#3896) [Project Solar / Phase 1 / Components] `Form` primitives (HDS-6086) (#3860) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Follow-up] Focus ring refactoring for all components (#3884) [Project Solar / Phase 1 / Components] `AppHeader` carbonization (#3819) [Project Solar / Phase 1 / Follow-up] Cleanup redundancies in source JSON files for tokens (#3913) [Project Solar / Phase 1 / Migration] AppSideNav list item active indicator token (#3916) [Project Solar / Phase 1 / Migration] Set LinkStandalone secondary hover state color (#3920) re-generated files in output (missed in #3920) added selector with higher specificity for focused `.hds-dismiss-button.hds-dialog-primitive__dismiss` re-generated files in output [Project Solar / Phase 1 / Components] Remove `button.border-color.{color}.focus` tokens (#3933) [Project Solar / Phase 1 / Showcase] Convert HdsIcon in Carbon Web Components to `cds-icon` (#3928) [Project Solar / Phase 1 / Follow-up] Add `token-css-color-transform-direction` token (#3936) [Project Solar / Phase 1 / Migration] `Accordion` "carbonization" (#3525) missed to commit generated file in output (#3525) copyright updates fixed a couple of typos removed unnecessary `mock-state` attributes `Tag` - fix `mock-state-value` not being dynamically set on showcase page [Project Solar / Phase 1 / Migration] Add `secondary-muted` button variant (#3930) added fix for padding of `<legend>` base form element re-generated files in output [Project Solar / Phase 1 / Follo-up] Fix tokens values comparison + other small bugs (#3941) [Project Solar / Phase 1 / Follow-up] Include declarations for CSS `color-scheme` properties in generated token files (#3943) fixed `start` command syntax to escape double quotes instead of using single quotes (consistent with other commands in other files) re-generated files in output removed classname not used anymore
didoo
added a commit
that referenced
this pull request
Jun 30, 2026
…anch (at 30 Jun 2026) TODO - added temporary file to main feature branch for phase 1 added temporary changeset to feature branch for `$modes` support TEMP - added `$modes` entry to `color.palette.neutral-0` refactored logic used to provide SD configuration per target progress on logic for handling `$modes` - 1 TEMP - added `modes-testing` tokens TEMP - added `expected-CSS-output` files progress on logic for handling `$modes` - 2 added `attributes/themeable` transformation progress on logic for handling `$modes` - 3 progress on logic for handling `$modes` - 4 TEMP generated temporary dist files for testing TEMP - added examples of generated themed tokens added logic to generate theming CSS files REVERT - Removed `modes-testing` tokens removed `modes-testing` folder from compilation added `carbon-extracted` reference in the `source` definitions TEMP - added `$modes` entries for some color and typography tokens, with references to Carbon tokens, for testing changed `outputReferences` to `false` (temporary) to bypass issue with missing references when using Carbon tokens with theming logic added commented code to `build` to use for debugging issue with missing references and filtering when theming is applied added two new themed tokens generated files, for Scss mixins and for combined strategies fixed issue with `cds` naming missing the `g` fixed some issues with how the “extra” themed CSS files were generated TEMP - Re-generated tokens REVERT - added examples of generated themed tokens This reverts commit 194b9fb. REVERT - added `expected-CSS-output` files This reverts commit 7462def. fixed wrong check for existence of key in object (`0` values would trigger an error, but they’re valid) added `.hds-theme-light/dark` and `[data-hds-theme=“light/dark”]` to generated CSS selectors (later we may decide to remove them, but for the moment we need them for the showcase theming page to work in its current implementation) re-generated themed tokens updated generation of tokens’ CSS helpers to use CSS variables for `font-weight` helpers re-generated CSS helper files updated generation of extra CSS files to include `.hds-theme-hds/[data-hds-theme="hds"]` selectors for default (non-themed) HDS styling (later we will understand if we want to rename the `hds` theme to `default` to avoid this strange class name `hds-theme-hds`) updated design tokens pipeline to generate a `themed-tokens.json` file for documentation, including all the tokens for all the themes (it will be used in the showcase, and potentially the website) re-generated themed tokens updated “src” files to replace `hds` key with `default` in `$modes` definitions updated logic to replace `hds` key with `default` in `$modes` definitions re-generated tokens in `dist` folder tweaked logic for CSS selectors for `@media (prefers-color-scheme)` to use explicit selectors `.hds-theme-system`/`[data-hds-theme="system”]` to avoid specificity issues `:root:not([class*="hds-theme-"]):not([data-hds-theme])` has specificity 030 so when used inside `@media (prefers-color-scheme: light|dark)` it becomes the default compares to other selectors re-generated tokens in `dist` folder updated generation of extra theming CSS files to avoid CSS variables “staleness” updated generation of extra theming CSS files to differentiate between `theme` and `mode` CSS selectors re-generated tokens in `dist` folder removed `[data-hds-theme]` CSS selectors for simplicity asked feedback in Slack (https://ibm-hashicorp.slack.com/archives/C09KZL43EKU/p1762987902565479) and then discussed with Dylan/Kristin; we agreed they’re not really necessary/needed re-generated tokens in `dist` folder updated logic for generation of extra “themed” CSS files (removed `prefers-color-scheme`-only case, generalized `css-selectors`) re-generated tokens in `dist` folder small tweakings before code review renamed `generateExtra***` to `generate***` updated comment updated SCSS files organization for components (split common part) updated `includePaths` for design tokens in Showcase and Website `ember-cli-build.js` removed `rollup-plugin-scss` dev dependency (we use our own custom plugin for every Scss compilation) updated the `prePublish` script in `package.json` of `components` to validate that all the new CSS files are generated too simplified architecture of CSS compilation for HDS components (as agreed) fixed `prepublisOnly` script that was causing error in build (looking for old CSS files that don’t exist anymore) updated `cssFilePath` in blueprints to reflect new Scss file organization, per code review suggestion #3259 (comment) Apply suggestions from code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Update packages/components/src/styles/@hashicorp/design-system-components.scss Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> added `Hds::ThemeSwitcher` component added `Hds::Theming` service added theming to the Showcase itself (and replaced hardcoded values with `—shw` CSS variables) added `Shw::ThemeSwitcher` component for showcase updated `Mock::App` and added new yielded sub-components added `Shw:: ThemeSwitcher` to the Showcase page header added `foundations/theming` showcase page (and a frameless demo) refactored `hds-theming` service to align with the new themes/modes and be open to configurations added `hdsTheming` initialization to main showcase app removed compilation of components Scss and replaced it with static inclusion of pre-compiled (standard and themed) CSS The pre-compiled CSS files have been manually copied in the `public/assets` folder, while waiting to understand what is the best way to proceed to have them added at build time from the `@hashicorp/design-system-components` package added theming options via popover - part 1 added theming options via popover - part 2 added theming options via popover - part 3 added theming options via popover - part 4 added theming options via popover - part 5 big code refactoring for the theme selector, to streamline user selection and expand use cases we can cover updated logic that sets the theming for the showcase itself (without relying on HDS selectors) small fixes here and there for cleanup and linting fixed issue with `pnpm lint:format` (missing newline at the end of `package.json` solution: run `pnpm prettier . --cache --write` locally and then commit fixed accessibility issue in `advanced-table` page, due to changes to “themed” `—shw` colors fixed typescript error due to new mock page being added added fix for tests failing see #3298 started large refactoring/rewrite of the theming switcher and page in the showcase updated logic by creating a `shwTheming` service that extends `hdsTheming` moved theming logic from `ShwThemeSwitcher` component/subcomponents to `hdsTheming` service updated reference CSS files to follow new theming approach/logic further refactoring/rewriting of theming logic updated approach to `light/dark` styles in showcase by using the HDS CSS selectors migrated back the `Contextual` demo content to the index page added a `DebuggingPanel` to the `ShwThemeSwitcher` controls refactored/improved `DebuggingPanel` and added new preferences to advanced options small cleanups and refactorings fixed small issue with `ShwThemeSwitcher` selector removed some outdated comments small refactorings added local storage support for theming options big refactoring of the `hdsTheming` service to simplify logic and reduce redundant methods invocations cleanup of debugging comments and other stuff refactor and cleanup in preparation for PR review refactored code to fix logic flow for theming initialization fixed how the theming options were saved in local storage Apply suggestions from Copilot's code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> fixed issue with `setTheme` not being passed `options` by the `ShwThemeSwitcher` fix issue with the popover of the ShwThemeSwitcher component, where the states were potentially out of sync Update showcase/app/services/shw-theming.ts Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> small tweak to the typing of `HdsModes` per code review suggestion updated how the CSS files (tokens and components, with/without theming) are consumed by the showcase application updated logic for styleshet switching using the `disabled` attribute removed unused import removed `isInitialized` logic from the `hdeTheming` service to avoid bug Assertion Failed: You attempted to update _isInitialized on <HdsThemingService:ember77>, but it had already been used previously in the same computation. Attempting to update a value after using it in a computation can cause logical errors, infinite revalidation bugs, and performance issues, and is not supported. _isInitialized was first used: While rendering: {{outlet}} for -top-level -top-level {{outlet}} for application Application TEMP - added temporary `hds-theme-light/dark` selectors while we understand how to do nesting of theming TEMP - Added back custom token values for testing purpose fixed small issue with the `HdsThemeSwitcher` components used in the `Theming` showcase page context: #3240 (comment) added small comment updated `hdsTheming` service to support `default` theme / mode added support for `default` option to HDS ThemeSwitcher component Updated “foundations/theming” showcase page to include variants of HDS ThemeSwitcher with `default` option updated Showcase ThemeSwitcher to use ``default` as theme option updated logic for how CSS selectors are applied to the `html:root` element + scrappy implementation of `isComplex` (to be completed later) updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline added fake theming for display/text typography to `public/assets` themed tokens CSS files (for debugging purpose) updated “foundations/theming” showcase page to include `default` and `system` themes + improved contextual theming using custom typographic theming implemented `ThemeContex` component added demos of `ThemeContext` component to showcase “foundations/theming” page improved type definitions for ThemeContext and showcase “foundations/theming” page refactored how CSS selectors are applied to enable mode-specific overrides updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline updated `ThemeContext` to use a more generic `context` argument updated showcase “theming” page to use the new `@context` argument for the `ThemeContext` component finally defined proper typing for `ThemeContext` component refactored showcase code to remove handling of `[data-hds-theme]` CSS selectors for theming updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names refactored theme switching in showcase to use new CSS files updated theme switcher in showcase to allow toggling of the “advanced options” introduced a “carbonization” mixin for applying styles only for certain conditions/modes this is the first implementation, it may see further refinements later it will be used to differentiate styles for the Button component added subtle shadow to `ThemingBasicContainer` fixed small bug that would cause the showcase pages to crash if the value stored in local storage for the `shw-theming-current-stylesheet` value was not found small fix to the control logic for the `HdsThemeSwitcher` demo in showcase page fixed TypeScript issue fix small bug in the logic when the “apply” with “show advanced options” is `false` added `ShwBodyLinkToRoute` component replaced custom link in AdvancedTable showcase page with newly created `ShwBodyLinkToRoute` component reworked the demo frameless for application with theme switcher to avoid collisions between the main page and the frame replaced custom theme switcher with proper `HdsThemeSwitcher` in `AppFooter` demo some cleanup before code review changed how theming is applied to the showcase itself, to limit `prefers-color-scheme` application only to the explict `system` theme selection fixed wrong CSS selector, per code review suggestion prefixed `OnSetThemeCallback` with `Hds` per review suggestion Update packages/components/src/template-registry.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> converted `updatePageStylesheets` function to a private method per Copilot suggestion: #3240 (comment) small cleanup per code reviews suggestions small fixes per code review updated logic that reads the stored theming data for the `HdsThemingService` to make it more robust removed comment updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names basic implementation of `<ShwCarbonizationComparisonGrid>` refactored implementation of `<ShwCarbonizationComparisonGrid>` implemented “Carbonization” section for `Badge` page implemented “Carbonization” section for `BadgeCount` page implemented “Carbonization” section for `Button` page implemented “Carbonization” section for `Focus Ring` page implemented “Carbonization” section for `Typography` page implemented “Carbonization” section for (new) `Color` page added `@carbon/web-components` as devDependency to Showcase app added `@carbon/[themes|layout|grid|type]` + `@ibm/plex` as devDependencies to Showcase app refactored `ComparisonGrid` component to add themed background color to the cells/areas added temporary support for IBM Plex font-family refactored code to support theming for reference web components, based on Carbon implementation/specifications small refactoring small refactorings refactored content organization to have the carbonization pages as standalone pages added carbon web components for comparison on `BadgeCount` page added carbon web components for comparison on `Button` page more small fixes for cleanup and linting implemented “Carbonization” section for `Form::TextInput` page implemented “Carbonization” section for `SegmentedGroup` page removed link to “Foundations > Color” page Small update to an `rgba` color Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> moved theming class in ComparisonGrid from item to item content per code review suggestion improved how to apply themed foreground/background colors to content in the comparison grid installed `@carbon/styles` as devDependency to import CSS variables for Carbon theming fixed issue with text color in typography page reorganized carbonized pages so they all live under the `carbonized` folder/route will be used later to detect if we need to do something around theme switcher and CSS to load prepared the ground for controlling the ShwThemeSwitcher on carbonized pages fixed CSS for carbonization pages updated carbonized typography page to show equivalent/mapped Carbon typographic style updated `ShwComparisonGrid` to expose an alternative side-by-side layout updated some components to take into account the new `hideCarbonLabels` argument fixed typescript/glint issue updated a couple of typographic mappings added yielding of `theme` value in the named blocks of the `ComparisonGrid` introduced `ShwCarbonizationStylePreviewTypography` to facilitate comparison of typographic styles refactored `carbonization/foundations/color` page and `ShwCarbonizationTokenPreviewColor` to show actual color values in preview item updated comparison grid to use `default` for original HDS theming instead of `hds` small tweak to the `badge` carbonization page added logic to the application to lock theme switching when loading a “carbonized” page (and restore its previous state when returning to non-carbonized pages) replaced `theme` with `mode` in `ComparisonGrid` fixed issue with the “default” block of the carbonization grid was not rendered as “classic” HDS fixed issue in the carbonization page for colors some cleanup before code review Update showcase/app/components/shw/carbonization/token-preview/color.gts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> updated showcase page for Button carbonization implemented “Carbonization” page for `Modal` component added examples of components with focus state to the carbonization page for focus ring tweaks per code review suggestions implemented “Carbonization” page for `Form/RadioCard` component better visual grouping of carbonization pages links in homepage renamed the `page-carbonization` components files and declarations to add `Index` (for consistency, per review comment) added `disabled` state to `cds-radio-tile` avoid duplicate `name` attributes for different radio groups add missing `{{on "change" this.onChange}}` handled to the `RadioCard` elements when in a group updated logic that converts the Carbon duration value to the DTCG format to use always seconds updated logic that converts the Carbon `cubic-bezier` value to the expected DTCG format see: https://www.designtokens.org/tr/drafts/format/#cubic-bezier re-extracted carbon tokens turned on option to convert `font-size` from `rem` to `px` for extracted Carbon tokens re-extracted carbon tokens [06] [Project Solar / Phase 1 / Dry-run] Migration dry-run for foundations and components (#3332) [Project Solar / Phase 1 / Engineering Follow-ups] Add `localStorage` parsing validation (#3401) added `chalk` as devDependency updated `build.ts` script for design tokens, to have validation of expected `$modes` format improved logging messages for validation warnings/errors of `$modes` [Project Solar / Phase 1 / Engineering Follow-ups] Add tests for HDS theming service and components (#3428) Co-authored-by: Dylan Hyun <dylan.hyun@hashicorp.com> Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> re-generated CSS files in output after rebasing on `main` (new styles have been added to the common styles for HDS components) [HDS-5702] - Remove postbuild in favor of rollup copy (#3441) fixed TS issue fixed some linting warnings for `package.json` files post rebase (and conflicts fixing) enabled logging for StyleDictionary abstracted `getSourceFromFileWithRootSelector` implemented custom “CSS variables” format for theme tokens, with logic to handle aliasing (outputReferences) and files splitting (“common” vs “themed”) abstracted `DocsJson` custom format to its own file removed `attributes/themeable` custom transform (not needed anymore) added validation for generated themed tokens (as SD custom action) small tweakings, cleanups and fixes TEMP - Add `test` tokens (to be removed in a follow-up revert commit) Revert "TEMP - Add `test` tokens (to be removed in a follow-up revert commit)" This reverts commit 455d9ec. [Project Solar / Phase 1 / Engineering Follow-ups] Converted tests for `HdsThemeSwitcher` and `HdsThemeContext` to `.gts` format (#3447) Refactor `dist` CSS file checks into script (#3462) re-generated all the dist and public files after rebasing on `main` small cleanup of initial commits used to open the PR [07a] [Project Solar / Phase 1] Include IBM Plex fonts as part of the `@hashicorp/design-system-components` package (#3387) removed service which was not used [Project Solar / Phase 1 / Engineering Follow-ups] Remove local storage implementation from `HdsTheming` service and move it to the Showcase consuming app (#3540) Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> [Project Solar / Phase 1 / Engineering Follow-ups] Remove `globalOnSetTheme` callback from `HdsTheming` service (#3539) Use esm for `dist` file check (#3551) fixes that were missed after rebase on `main` (and conflict resolution) re-built tokens after rebase on `main` (all the `Hds::SideNav` tokens have been removed) fixed yielded component name [Project Solar / Phase 1 / Engineering Follow-ups] Update tokens pipeline to support structured values for the `$modes` entries (#3575) [Project Solar / Phase 1 / Follow-up] Fix small issue in tokens build pipeline (#3595) Reverted temporary commits from PR #3595 Revert "TEMP/REMOVE ME - Added `$modes` to `boundary-50` (referenced as alias by `boundary.surface` and `boundary-gradient-faint-stop`)" This reverts commit eeb1a0a. Revert "TEMP/REMOVE ME - re-generated tokens in output" This reverts commit 23c9bb0. [Project Solar / Phase 1] Align version of carbon web component imports (#3613) [Project Solar / Phase 1 / Components] Support multiple selectors in carbonization mixin (#3630) [Project Solar / Phase 1 / Foundations] Finalize design tokens for Core/Semantic Colors + Typography + Borders (#3572) [Project Solar / Phase 1 / Components] `Badge/BadgeCount` carbonization (#3592) [Project Solar / Phase 1 / Foundations] Flight icons &`Icon` carbonization (#3584) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> Project solar/icons commit icons (#3643) Small updates to the icons used in the showcase page for the `Icon` component (#3644) [Project Solar / Phase 1 / Components] `Separator` carbonization (HDS-6102) (#3674) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> [Project Solar / Phase 1 / Foundations] Update tokens with `$modes` for semantic products colors (#3680) [Project Solar / Phase 1 / Icons] Fix copy button showcase status icons (#3694) [Project Solar / Phase 1 / Components] `ApplicationState` carbonization (HDS-6075) (#3686) [Project Solar / Phase 1 / Foundations] Remove `$modes` from "core/palette" product colors (#3695) [Project solar / Phase 1 / Foundations] Elevation (#3693) [Project Solar / Phase 1 / Showcase] Add support for "column" layout to comparison grid and "no equivalent" block (#3682) linting [Project Solar / Phase 1 / Components] `IconTile` carbonization (HDS-6061) (#3588) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Foundations] Add `high-contrast` core semantic token for surface (#3701) [Project Solar / Phase 1 / Components] `TooltipButton` carbonization (#3622) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `RichTooltip` carbonization (#3641) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `DismissButton` carbonization (#3665) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed AppFooter example in “foundations/theming” showcase page [Project Solar / Phase 1 / Components] `AppFooter` carbonization (HDS-6072) (#3675) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed issue with themes being applied to the “carbonization” pages Remove prebuild script (#3715) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Allow overriding of IBM Plex fonts `/assets` path in Scss (#3736) [Project Solar / Phase 1 / Follow-up] Add watcher to tokens `build` script (#3757) [Project Solar / Phase 1 / Follow-up] Watch sass files for changes in `components` build (#3759) [Project Solar / Phase 1 / Components] `LinkInline` and `LinkStandalone` carbonization (#3587) [Project Solar / Phase 1 / Components] `RichTooltip` - Set text color (#3756) [Project Solar / Phase 1 / Components] `CopySnippet` carbonization (#3733) fixed carbonized focus ring showcase `AdvancedTableThSort` has been now merged with `AdvancedTableTh` to be a single subcomponent [Project Solar / Phase 1 / Components] `Breadcrumb` carbonization (#3652) [Project Solar / Phase 1 / Components] `DialogPrimitive/Modal/Flyout` carbonization (#3645) [Project Solar / Phase 1 / Components] `Pagination` carbonization (HDS-6035) (#3598) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `Card` carbonization (#3679) [Project Solar / Phase 1 / Components] `Tabs` carbonization (HDS-6106) (#3690) removed leftover generated files after removal of `devdot` and `marketing` as targets in `main` Fix: AppFooter carbonization page STATUSES import paths HDS-6166 Fix incorrect value for Tabs Tab horizontal padding token for large variant [Project Solar / Phase 1] Update `@carbon/***` dependencies (#3794) [Project Solar / Phase 1 / Tokens update] Update `transitions` tokens (#3798) [Project Solar / Phase 1 / Tokens update] Update `typography` tokens (#3799) [Project Solar / Phase 1 / Components] `Tag` carbonization (#3685) [Project Solar / Phase 1 / Tokens update] Update component-level color tokens - Part 1 (#3805) [Project Solar / Phase 1 / Follow-up] Re-sync extracted Carbon tokens (#3812) [Project Solar / Phase 1 / Components] `PageHeader` carbonization (HDS-6099) (#3802) [Project Solar / Phase 1 / Follow-up] Fix issue in extraction of Carbon tokens when color value is in "modern" `rgb()` format (#3813) [Project Solar / Phase 1 / Components] `Button` carbonization (#3611) [Project Solar / Phase 1 / Components] `CopyButton` carbonization (#3696) [Project Solar / Phase 1 / Components] `CodeBlock` carbonization (#3779) Fix: Carbonization showcase type linting errors [Project Solar / Phase 1 / Components] `CodeEditor` carbonization (#3785) [Project Solar / Phase 1 / Follow-up] Fix `DialogPrimitive` header spacing (#3833) small text alignment fix in `NoEquivalent` showcase component [Project Solar / Phase 1 / Follow-up] Fix `hds-apply-only-if-carbon` Sass mixin (#3838) [Project Solar / Phase 1 / Components] `Reveal` carbonization (HDS-6100) (#3706) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Convert `ThemeSwitcher` and `ThemeContext` components to `.gts` (#3846) Add tests for `hds-icon-registry` service (#3829) [Project Solar / Phase 1 / Follow-up] Update `focus` to `focus-ring` in "component-level" tokens (#3861) [Project Solar / Phase 1 / Components] `Alert` & `Toast` carbonization (#3809) [Project Solar / Phase 1 / Components] `AppSideNav` carbonization (#3801) [Project Solar / Phase 1 / Follow up] Add "column-stacked" layout to `ShwCarbonizationComparisonGrid` in showcase for carbonization pages (#3867) re-generated files in output after rebase on main rebuilt files in output after rebase on `main` Fix: Application template function call for page initialization [Project Solar / Phase 1 / Components] `Dropdown` carbonization (HDS-6083) (#3814) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Components] Update `body-100` Carbon font size and component tokens (#3862) [Project Solar / Phase 1 / Follow-up] Showcase improvements for the focus ring refactoring (#3896) [Project Solar / Phase 1 / Components] `Form` primitives (HDS-6086) (#3860) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Follow-up] Focus ring refactoring for all components (#3884) [Project Solar / Phase 1 / Components] `AppHeader` carbonization (#3819) [Project Solar / Phase 1 / Follow-up] Cleanup redundancies in source JSON files for tokens (#3913) [Project Solar / Phase 1 / Migration] AppSideNav list item active indicator token (#3916) [Project Solar / Phase 1 / Migration] Set LinkStandalone secondary hover state color (#3920) re-generated files in output (missed in #3920) added selector with higher specificity for focused `.hds-dismiss-button.hds-dialog-primitive__dismiss` re-generated files in output [Project Solar / Phase 1 / Components] Remove `button.border-color.{color}.focus` tokens (#3933) [Project Solar / Phase 1 / Showcase] Convert HdsIcon in Carbon Web Components to `cds-icon` (#3928) [Project Solar / Phase 1 / Follow-up] Add `token-css-color-transform-direction` token (#3936) [Project Solar / Phase 1 / Migration] `Accordion` "carbonization" (#3525) missed to commit generated file in output (#3525) copyright updates fixed a couple of typos removed unnecessary `mock-state` attributes `Tag` - fix `mock-state-value` not being dynamically set on showcase page [Project Solar / Phase 1 / Migration] Add `secondary-muted` button variant (#3930) added fix for padding of `<legend>` base form element re-generated files in output [Project Solar / Phase 1 / Follo-up] Fix tokens values comparison + other small bugs (#3941) [Project Solar / Phase 1 / Follow-up] Include declarations for CSS `color-scheme` properties in generated token files (#3943) fixed `start` command syntax to escape double quotes instead of using single quotes (consistent with other commands in other files) re-generated files in output removed classname not used anymore
didoo
added a commit
that referenced
this pull request
Jul 2, 2026
…anch (at 30 Jun 2026) TODO - added temporary file to main feature branch for phase 1 added temporary changeset to feature branch for `$modes` support TEMP - added `$modes` entry to `color.palette.neutral-0` refactored logic used to provide SD configuration per target progress on logic for handling `$modes` - 1 TEMP - added `modes-testing` tokens TEMP - added `expected-CSS-output` files progress on logic for handling `$modes` - 2 added `attributes/themeable` transformation progress on logic for handling `$modes` - 3 progress on logic for handling `$modes` - 4 TEMP generated temporary dist files for testing TEMP - added examples of generated themed tokens added logic to generate theming CSS files REVERT - Removed `modes-testing` tokens removed `modes-testing` folder from compilation added `carbon-extracted` reference in the `source` definitions TEMP - added `$modes` entries for some color and typography tokens, with references to Carbon tokens, for testing changed `outputReferences` to `false` (temporary) to bypass issue with missing references when using Carbon tokens with theming logic added commented code to `build` to use for debugging issue with missing references and filtering when theming is applied added two new themed tokens generated files, for Scss mixins and for combined strategies fixed issue with `cds` naming missing the `g` fixed some issues with how the “extra” themed CSS files were generated TEMP - Re-generated tokens REVERT - added examples of generated themed tokens This reverts commit 194b9fb. REVERT - added `expected-CSS-output` files This reverts commit 7462def. fixed wrong check for existence of key in object (`0` values would trigger an error, but they’re valid) added `.hds-theme-light/dark` and `[data-hds-theme=“light/dark”]` to generated CSS selectors (later we may decide to remove them, but for the moment we need them for the showcase theming page to work in its current implementation) re-generated themed tokens updated generation of tokens’ CSS helpers to use CSS variables for `font-weight` helpers re-generated CSS helper files updated generation of extra CSS files to include `.hds-theme-hds/[data-hds-theme="hds"]` selectors for default (non-themed) HDS styling (later we will understand if we want to rename the `hds` theme to `default` to avoid this strange class name `hds-theme-hds`) updated design tokens pipeline to generate a `themed-tokens.json` file for documentation, including all the tokens for all the themes (it will be used in the showcase, and potentially the website) re-generated themed tokens updated “src” files to replace `hds` key with `default` in `$modes` definitions updated logic to replace `hds` key with `default` in `$modes` definitions re-generated tokens in `dist` folder tweaked logic for CSS selectors for `@media (prefers-color-scheme)` to use explicit selectors `.hds-theme-system`/`[data-hds-theme="system”]` to avoid specificity issues `:root:not([class*="hds-theme-"]):not([data-hds-theme])` has specificity 030 so when used inside `@media (prefers-color-scheme: light|dark)` it becomes the default compares to other selectors re-generated tokens in `dist` folder updated generation of extra theming CSS files to avoid CSS variables “staleness” updated generation of extra theming CSS files to differentiate between `theme` and `mode` CSS selectors re-generated tokens in `dist` folder removed `[data-hds-theme]` CSS selectors for simplicity asked feedback in Slack (https://ibm-hashicorp.slack.com/archives/C09KZL43EKU/p1762987902565479) and then discussed with Dylan/Kristin; we agreed they’re not really necessary/needed re-generated tokens in `dist` folder updated logic for generation of extra “themed” CSS files (removed `prefers-color-scheme`-only case, generalized `css-selectors`) re-generated tokens in `dist` folder small tweakings before code review renamed `generateExtra***` to `generate***` updated comment updated SCSS files organization for components (split common part) updated `includePaths` for design tokens in Showcase and Website `ember-cli-build.js` removed `rollup-plugin-scss` dev dependency (we use our own custom plugin for every Scss compilation) updated the `prePublish` script in `package.json` of `components` to validate that all the new CSS files are generated too simplified architecture of CSS compilation for HDS components (as agreed) fixed `prepublisOnly` script that was causing error in build (looking for old CSS files that don’t exist anymore) updated `cssFilePath` in blueprints to reflect new Scss file organization, per code review suggestion #3259 (comment) Apply suggestions from code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Update packages/components/src/styles/@hashicorp/design-system-components.scss Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> added `Hds::ThemeSwitcher` component added `Hds::Theming` service added theming to the Showcase itself (and replaced hardcoded values with `—shw` CSS variables) added `Shw::ThemeSwitcher` component for showcase updated `Mock::App` and added new yielded sub-components added `Shw:: ThemeSwitcher` to the Showcase page header added `foundations/theming` showcase page (and a frameless demo) refactored `hds-theming` service to align with the new themes/modes and be open to configurations added `hdsTheming` initialization to main showcase app removed compilation of components Scss and replaced it with static inclusion of pre-compiled (standard and themed) CSS The pre-compiled CSS files have been manually copied in the `public/assets` folder, while waiting to understand what is the best way to proceed to have them added at build time from the `@hashicorp/design-system-components` package added theming options via popover - part 1 added theming options via popover - part 2 added theming options via popover - part 3 added theming options via popover - part 4 added theming options via popover - part 5 big code refactoring for the theme selector, to streamline user selection and expand use cases we can cover updated logic that sets the theming for the showcase itself (without relying on HDS selectors) small fixes here and there for cleanup and linting fixed issue with `pnpm lint:format` (missing newline at the end of `package.json` solution: run `pnpm prettier . --cache --write` locally and then commit fixed accessibility issue in `advanced-table` page, due to changes to “themed” `—shw` colors fixed typescript error due to new mock page being added added fix for tests failing see #3298 started large refactoring/rewrite of the theming switcher and page in the showcase updated logic by creating a `shwTheming` service that extends `hdsTheming` moved theming logic from `ShwThemeSwitcher` component/subcomponents to `hdsTheming` service updated reference CSS files to follow new theming approach/logic further refactoring/rewriting of theming logic updated approach to `light/dark` styles in showcase by using the HDS CSS selectors migrated back the `Contextual` demo content to the index page added a `DebuggingPanel` to the `ShwThemeSwitcher` controls refactored/improved `DebuggingPanel` and added new preferences to advanced options small cleanups and refactorings fixed small issue with `ShwThemeSwitcher` selector removed some outdated comments small refactorings added local storage support for theming options big refactoring of the `hdsTheming` service to simplify logic and reduce redundant methods invocations cleanup of debugging comments and other stuff refactor and cleanup in preparation for PR review refactored code to fix logic flow for theming initialization fixed how the theming options were saved in local storage Apply suggestions from Copilot's code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> fixed issue with `setTheme` not being passed `options` by the `ShwThemeSwitcher` fix issue with the popover of the ShwThemeSwitcher component, where the states were potentially out of sync Update showcase/app/services/shw-theming.ts Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> small tweak to the typing of `HdsModes` per code review suggestion updated how the CSS files (tokens and components, with/without theming) are consumed by the showcase application updated logic for styleshet switching using the `disabled` attribute removed unused import removed `isInitialized` logic from the `hdeTheming` service to avoid bug Assertion Failed: You attempted to update _isInitialized on <HdsThemingService:ember77>, but it had already been used previously in the same computation. Attempting to update a value after using it in a computation can cause logical errors, infinite revalidation bugs, and performance issues, and is not supported. _isInitialized was first used: While rendering: {{outlet}} for -top-level -top-level {{outlet}} for application Application TEMP - added temporary `hds-theme-light/dark` selectors while we understand how to do nesting of theming TEMP - Added back custom token values for testing purpose fixed small issue with the `HdsThemeSwitcher` components used in the `Theming` showcase page context: #3240 (comment) added small comment updated `hdsTheming` service to support `default` theme / mode added support for `default` option to HDS ThemeSwitcher component Updated “foundations/theming” showcase page to include variants of HDS ThemeSwitcher with `default` option updated Showcase ThemeSwitcher to use ``default` as theme option updated logic for how CSS selectors are applied to the `html:root` element + scrappy implementation of `isComplex` (to be completed later) updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline added fake theming for display/text typography to `public/assets` themed tokens CSS files (for debugging purpose) updated “foundations/theming” showcase page to include `default` and `system` themes + improved contextual theming using custom typographic theming implemented `ThemeContex` component added demos of `ThemeContext` component to showcase “foundations/theming” page improved type definitions for ThemeContext and showcase “foundations/theming” page refactored how CSS selectors are applied to enable mode-specific overrides updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline updated `ThemeContext` to use a more generic `context` argument updated showcase “theming” page to use the new `@context` argument for the `ThemeContext` component finally defined proper typing for `ThemeContext` component refactored showcase code to remove handling of `[data-hds-theme]` CSS selectors for theming updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names refactored theme switching in showcase to use new CSS files updated theme switcher in showcase to allow toggling of the “advanced options” introduced a “carbonization” mixin for applying styles only for certain conditions/modes this is the first implementation, it may see further refinements later it will be used to differentiate styles for the Button component added subtle shadow to `ThemingBasicContainer` fixed small bug that would cause the showcase pages to crash if the value stored in local storage for the `shw-theming-current-stylesheet` value was not found small fix to the control logic for the `HdsThemeSwitcher` demo in showcase page fixed TypeScript issue fix small bug in the logic when the “apply” with “show advanced options” is `false` added `ShwBodyLinkToRoute` component replaced custom link in AdvancedTable showcase page with newly created `ShwBodyLinkToRoute` component reworked the demo frameless for application with theme switcher to avoid collisions between the main page and the frame replaced custom theme switcher with proper `HdsThemeSwitcher` in `AppFooter` demo some cleanup before code review changed how theming is applied to the showcase itself, to limit `prefers-color-scheme` application only to the explict `system` theme selection fixed wrong CSS selector, per code review suggestion prefixed `OnSetThemeCallback` with `Hds` per review suggestion Update packages/components/src/template-registry.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> converted `updatePageStylesheets` function to a private method per Copilot suggestion: #3240 (comment) small cleanup per code reviews suggestions small fixes per code review updated logic that reads the stored theming data for the `HdsThemingService` to make it more robust removed comment updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names basic implementation of `<ShwCarbonizationComparisonGrid>` refactored implementation of `<ShwCarbonizationComparisonGrid>` implemented “Carbonization” section for `Badge` page implemented “Carbonization” section for `BadgeCount` page implemented “Carbonization” section for `Button` page implemented “Carbonization” section for `Focus Ring` page implemented “Carbonization” section for `Typography` page implemented “Carbonization” section for (new) `Color` page added `@carbon/web-components` as devDependency to Showcase app added `@carbon/[themes|layout|grid|type]` + `@ibm/plex` as devDependencies to Showcase app refactored `ComparisonGrid` component to add themed background color to the cells/areas added temporary support for IBM Plex font-family refactored code to support theming for reference web components, based on Carbon implementation/specifications small refactoring small refactorings refactored content organization to have the carbonization pages as standalone pages added carbon web components for comparison on `BadgeCount` page added carbon web components for comparison on `Button` page more small fixes for cleanup and linting implemented “Carbonization” section for `Form::TextInput` page implemented “Carbonization” section for `SegmentedGroup` page removed link to “Foundations > Color” page Small update to an `rgba` color Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> moved theming class in ComparisonGrid from item to item content per code review suggestion improved how to apply themed foreground/background colors to content in the comparison grid installed `@carbon/styles` as devDependency to import CSS variables for Carbon theming fixed issue with text color in typography page reorganized carbonized pages so they all live under the `carbonized` folder/route will be used later to detect if we need to do something around theme switcher and CSS to load prepared the ground for controlling the ShwThemeSwitcher on carbonized pages fixed CSS for carbonization pages updated carbonized typography page to show equivalent/mapped Carbon typographic style updated `ShwComparisonGrid` to expose an alternative side-by-side layout updated some components to take into account the new `hideCarbonLabels` argument fixed typescript/glint issue updated a couple of typographic mappings added yielding of `theme` value in the named blocks of the `ComparisonGrid` introduced `ShwCarbonizationStylePreviewTypography` to facilitate comparison of typographic styles refactored `carbonization/foundations/color` page and `ShwCarbonizationTokenPreviewColor` to show actual color values in preview item updated comparison grid to use `default` for original HDS theming instead of `hds` small tweak to the `badge` carbonization page added logic to the application to lock theme switching when loading a “carbonized” page (and restore its previous state when returning to non-carbonized pages) replaced `theme` with `mode` in `ComparisonGrid` fixed issue with the “default” block of the carbonization grid was not rendered as “classic” HDS fixed issue in the carbonization page for colors some cleanup before code review Update showcase/app/components/shw/carbonization/token-preview/color.gts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> updated showcase page for Button carbonization implemented “Carbonization” page for `Modal` component added examples of components with focus state to the carbonization page for focus ring tweaks per code review suggestions implemented “Carbonization” page for `Form/RadioCard` component better visual grouping of carbonization pages links in homepage renamed the `page-carbonization` components files and declarations to add `Index` (for consistency, per review comment) added `disabled` state to `cds-radio-tile` avoid duplicate `name` attributes for different radio groups add missing `{{on "change" this.onChange}}` handled to the `RadioCard` elements when in a group updated logic that converts the Carbon duration value to the DTCG format to use always seconds updated logic that converts the Carbon `cubic-bezier` value to the expected DTCG format see: https://www.designtokens.org/tr/drafts/format/#cubic-bezier re-extracted carbon tokens turned on option to convert `font-size` from `rem` to `px` for extracted Carbon tokens re-extracted carbon tokens [06] [Project Solar / Phase 1 / Dry-run] Migration dry-run for foundations and components (#3332) [Project Solar / Phase 1 / Engineering Follow-ups] Add `localStorage` parsing validation (#3401) added `chalk` as devDependency updated `build.ts` script for design tokens, to have validation of expected `$modes` format improved logging messages for validation warnings/errors of `$modes` [Project Solar / Phase 1 / Engineering Follow-ups] Add tests for HDS theming service and components (#3428) Co-authored-by: Dylan Hyun <dylan.hyun@hashicorp.com> Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> re-generated CSS files in output after rebasing on `main` (new styles have been added to the common styles for HDS components) [HDS-5702] - Remove postbuild in favor of rollup copy (#3441) fixed TS issue fixed some linting warnings for `package.json` files post rebase (and conflicts fixing) enabled logging for StyleDictionary abstracted `getSourceFromFileWithRootSelector` implemented custom “CSS variables” format for theme tokens, with logic to handle aliasing (outputReferences) and files splitting (“common” vs “themed”) abstracted `DocsJson` custom format to its own file removed `attributes/themeable` custom transform (not needed anymore) added validation for generated themed tokens (as SD custom action) small tweakings, cleanups and fixes TEMP - Add `test` tokens (to be removed in a follow-up revert commit) Revert "TEMP - Add `test` tokens (to be removed in a follow-up revert commit)" This reverts commit 455d9ec. [Project Solar / Phase 1 / Engineering Follow-ups] Converted tests for `HdsThemeSwitcher` and `HdsThemeContext` to `.gts` format (#3447) Refactor `dist` CSS file checks into script (#3462) re-generated all the dist and public files after rebasing on `main` small cleanup of initial commits used to open the PR [07a] [Project Solar / Phase 1] Include IBM Plex fonts as part of the `@hashicorp/design-system-components` package (#3387) removed service which was not used [Project Solar / Phase 1 / Engineering Follow-ups] Remove local storage implementation from `HdsTheming` service and move it to the Showcase consuming app (#3540) Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> [Project Solar / Phase 1 / Engineering Follow-ups] Remove `globalOnSetTheme` callback from `HdsTheming` service (#3539) Use esm for `dist` file check (#3551) fixes that were missed after rebase on `main` (and conflict resolution) re-built tokens after rebase on `main` (all the `Hds::SideNav` tokens have been removed) fixed yielded component name [Project Solar / Phase 1 / Engineering Follow-ups] Update tokens pipeline to support structured values for the `$modes` entries (#3575) [Project Solar / Phase 1 / Follow-up] Fix small issue in tokens build pipeline (#3595) Reverted temporary commits from PR #3595 Revert "TEMP/REMOVE ME - Added `$modes` to `boundary-50` (referenced as alias by `boundary.surface` and `boundary-gradient-faint-stop`)" This reverts commit eeb1a0a. Revert "TEMP/REMOVE ME - re-generated tokens in output" This reverts commit 23c9bb0. [Project Solar / Phase 1] Align version of carbon web component imports (#3613) [Project Solar / Phase 1 / Components] Support multiple selectors in carbonization mixin (#3630) [Project Solar / Phase 1 / Foundations] Finalize design tokens for Core/Semantic Colors + Typography + Borders (#3572) [Project Solar / Phase 1 / Components] `Badge/BadgeCount` carbonization (#3592) [Project Solar / Phase 1 / Foundations] Flight icons &`Icon` carbonization (#3584) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> Project solar/icons commit icons (#3643) Small updates to the icons used in the showcase page for the `Icon` component (#3644) [Project Solar / Phase 1 / Components] `Separator` carbonization (HDS-6102) (#3674) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> [Project Solar / Phase 1 / Foundations] Update tokens with `$modes` for semantic products colors (#3680) [Project Solar / Phase 1 / Icons] Fix copy button showcase status icons (#3694) [Project Solar / Phase 1 / Components] `ApplicationState` carbonization (HDS-6075) (#3686) [Project Solar / Phase 1 / Foundations] Remove `$modes` from "core/palette" product colors (#3695) [Project solar / Phase 1 / Foundations] Elevation (#3693) [Project Solar / Phase 1 / Showcase] Add support for "column" layout to comparison grid and "no equivalent" block (#3682) linting [Project Solar / Phase 1 / Components] `IconTile` carbonization (HDS-6061) (#3588) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Foundations] Add `high-contrast` core semantic token for surface (#3701) [Project Solar / Phase 1 / Components] `TooltipButton` carbonization (#3622) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `RichTooltip` carbonization (#3641) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `DismissButton` carbonization (#3665) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed AppFooter example in “foundations/theming” showcase page [Project Solar / Phase 1 / Components] `AppFooter` carbonization (HDS-6072) (#3675) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed issue with themes being applied to the “carbonization” pages Remove prebuild script (#3715) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Allow overriding of IBM Plex fonts `/assets` path in Scss (#3736) [Project Solar / Phase 1 / Follow-up] Add watcher to tokens `build` script (#3757) [Project Solar / Phase 1 / Follow-up] Watch sass files for changes in `components` build (#3759) [Project Solar / Phase 1 / Components] `LinkInline` and `LinkStandalone` carbonization (#3587) [Project Solar / Phase 1 / Components] `RichTooltip` - Set text color (#3756) [Project Solar / Phase 1 / Components] `CopySnippet` carbonization (#3733) fixed carbonized focus ring showcase `AdvancedTableThSort` has been now merged with `AdvancedTableTh` to be a single subcomponent [Project Solar / Phase 1 / Components] `Breadcrumb` carbonization (#3652) [Project Solar / Phase 1 / Components] `DialogPrimitive/Modal/Flyout` carbonization (#3645) [Project Solar / Phase 1 / Components] `Pagination` carbonization (HDS-6035) (#3598) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `Card` carbonization (#3679) [Project Solar / Phase 1 / Components] `Tabs` carbonization (HDS-6106) (#3690) removed leftover generated files after removal of `devdot` and `marketing` as targets in `main` Fix: AppFooter carbonization page STATUSES import paths HDS-6166 Fix incorrect value for Tabs Tab horizontal padding token for large variant [Project Solar / Phase 1] Update `@carbon/***` dependencies (#3794) [Project Solar / Phase 1 / Tokens update] Update `transitions` tokens (#3798) [Project Solar / Phase 1 / Tokens update] Update `typography` tokens (#3799) [Project Solar / Phase 1 / Components] `Tag` carbonization (#3685) [Project Solar / Phase 1 / Tokens update] Update component-level color tokens - Part 1 (#3805) [Project Solar / Phase 1 / Follow-up] Re-sync extracted Carbon tokens (#3812) [Project Solar / Phase 1 / Components] `PageHeader` carbonization (HDS-6099) (#3802) [Project Solar / Phase 1 / Follow-up] Fix issue in extraction of Carbon tokens when color value is in "modern" `rgb()` format (#3813) [Project Solar / Phase 1 / Components] `Button` carbonization (#3611) [Project Solar / Phase 1 / Components] `CopyButton` carbonization (#3696) [Project Solar / Phase 1 / Components] `CodeBlock` carbonization (#3779) Fix: Carbonization showcase type linting errors [Project Solar / Phase 1 / Components] `CodeEditor` carbonization (#3785) [Project Solar / Phase 1 / Follow-up] Fix `DialogPrimitive` header spacing (#3833) small text alignment fix in `NoEquivalent` showcase component [Project Solar / Phase 1 / Follow-up] Fix `hds-apply-only-if-carbon` Sass mixin (#3838) [Project Solar / Phase 1 / Components] `Reveal` carbonization (HDS-6100) (#3706) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Convert `ThemeSwitcher` and `ThemeContext` components to `.gts` (#3846) Add tests for `hds-icon-registry` service (#3829) [Project Solar / Phase 1 / Follow-up] Update `focus` to `focus-ring` in "component-level" tokens (#3861) [Project Solar / Phase 1 / Components] `Alert` & `Toast` carbonization (#3809) [Project Solar / Phase 1 / Components] `AppSideNav` carbonization (#3801) [Project Solar / Phase 1 / Follow up] Add "column-stacked" layout to `ShwCarbonizationComparisonGrid` in showcase for carbonization pages (#3867) re-generated files in output after rebase on main rebuilt files in output after rebase on `main` Fix: Application template function call for page initialization [Project Solar / Phase 1 / Components] `Dropdown` carbonization (HDS-6083) (#3814) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Components] Update `body-100` Carbon font size and component tokens (#3862) [Project Solar / Phase 1 / Follow-up] Showcase improvements for the focus ring refactoring (#3896) [Project Solar / Phase 1 / Components] `Form` primitives (HDS-6086) (#3860) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Follow-up] Focus ring refactoring for all components (#3884) [Project Solar / Phase 1 / Components] `AppHeader` carbonization (#3819) [Project Solar / Phase 1 / Follow-up] Cleanup redundancies in source JSON files for tokens (#3913) [Project Solar / Phase 1 / Migration] AppSideNav list item active indicator token (#3916) [Project Solar / Phase 1 / Migration] Set LinkStandalone secondary hover state color (#3920) re-generated files in output (missed in #3920) added selector with higher specificity for focused `.hds-dismiss-button.hds-dialog-primitive__dismiss` re-generated files in output [Project Solar / Phase 1 / Components] Remove `button.border-color.{color}.focus` tokens (#3933) [Project Solar / Phase 1 / Showcase] Convert HdsIcon in Carbon Web Components to `cds-icon` (#3928) [Project Solar / Phase 1 / Follow-up] Add `token-css-color-transform-direction` token (#3936) [Project Solar / Phase 1 / Migration] `Accordion` "carbonization" (#3525) missed to commit generated file in output (#3525) copyright updates fixed a couple of typos removed unnecessary `mock-state` attributes `Tag` - fix `mock-state-value` not being dynamically set on showcase page [Project Solar / Phase 1 / Migration] Add `secondary-muted` button variant (#3930) added fix for padding of `<legend>` base form element re-generated files in output [Project Solar / Phase 1 / Follo-up] Fix tokens values comparison + other small bugs (#3941) [Project Solar / Phase 1 / Follow-up] Include declarations for CSS `color-scheme` properties in generated token files (#3943) fixed `start` command syntax to escape double quotes instead of using single quotes (consistent with other commands in other files) re-generated files in output removed classname not used anymore
didoo
added a commit
that referenced
this pull request
Jul 8, 2026
…anch (at 30 Jun 2026) TODO - added temporary file to main feature branch for phase 1 added temporary changeset to feature branch for `$modes` support TEMP - added `$modes` entry to `color.palette.neutral-0` refactored logic used to provide SD configuration per target progress on logic for handling `$modes` - 1 TEMP - added `modes-testing` tokens TEMP - added `expected-CSS-output` files progress on logic for handling `$modes` - 2 added `attributes/themeable` transformation progress on logic for handling `$modes` - 3 progress on logic for handling `$modes` - 4 TEMP generated temporary dist files for testing TEMP - added examples of generated themed tokens added logic to generate theming CSS files REVERT - Removed `modes-testing` tokens removed `modes-testing` folder from compilation added `carbon-extracted` reference in the `source` definitions TEMP - added `$modes` entries for some color and typography tokens, with references to Carbon tokens, for testing changed `outputReferences` to `false` (temporary) to bypass issue with missing references when using Carbon tokens with theming logic added commented code to `build` to use for debugging issue with missing references and filtering when theming is applied added two new themed tokens generated files, for Scss mixins and for combined strategies fixed issue with `cds` naming missing the `g` fixed some issues with how the “extra” themed CSS files were generated TEMP - Re-generated tokens REVERT - added examples of generated themed tokens This reverts commit 194b9fb. REVERT - added `expected-CSS-output` files This reverts commit 7462def. fixed wrong check for existence of key in object (`0` values would trigger an error, but they’re valid) added `.hds-theme-light/dark` and `[data-hds-theme=“light/dark”]` to generated CSS selectors (later we may decide to remove them, but for the moment we need them for the showcase theming page to work in its current implementation) re-generated themed tokens updated generation of tokens’ CSS helpers to use CSS variables for `font-weight` helpers re-generated CSS helper files updated generation of extra CSS files to include `.hds-theme-hds/[data-hds-theme="hds"]` selectors for default (non-themed) HDS styling (later we will understand if we want to rename the `hds` theme to `default` to avoid this strange class name `hds-theme-hds`) updated design tokens pipeline to generate a `themed-tokens.json` file for documentation, including all the tokens for all the themes (it will be used in the showcase, and potentially the website) re-generated themed tokens updated “src” files to replace `hds` key with `default` in `$modes` definitions updated logic to replace `hds` key with `default` in `$modes` definitions re-generated tokens in `dist` folder tweaked logic for CSS selectors for `@media (prefers-color-scheme)` to use explicit selectors `.hds-theme-system`/`[data-hds-theme="system”]` to avoid specificity issues `:root:not([class*="hds-theme-"]):not([data-hds-theme])` has specificity 030 so when used inside `@media (prefers-color-scheme: light|dark)` it becomes the default compares to other selectors re-generated tokens in `dist` folder updated generation of extra theming CSS files to avoid CSS variables “staleness” updated generation of extra theming CSS files to differentiate between `theme` and `mode` CSS selectors re-generated tokens in `dist` folder removed `[data-hds-theme]` CSS selectors for simplicity asked feedback in Slack (https://ibm-hashicorp.slack.com/archives/C09KZL43EKU/p1762987902565479) and then discussed with Dylan/Kristin; we agreed they’re not really necessary/needed re-generated tokens in `dist` folder updated logic for generation of extra “themed” CSS files (removed `prefers-color-scheme`-only case, generalized `css-selectors`) re-generated tokens in `dist` folder small tweakings before code review renamed `generateExtra***` to `generate***` updated comment updated SCSS files organization for components (split common part) updated `includePaths` for design tokens in Showcase and Website `ember-cli-build.js` removed `rollup-plugin-scss` dev dependency (we use our own custom plugin for every Scss compilation) updated the `prePublish` script in `package.json` of `components` to validate that all the new CSS files are generated too simplified architecture of CSS compilation for HDS components (as agreed) fixed `prepublisOnly` script that was causing error in build (looking for old CSS files that don’t exist anymore) updated `cssFilePath` in blueprints to reflect new Scss file organization, per code review suggestion #3259 (comment) Apply suggestions from code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Update packages/components/src/styles/@hashicorp/design-system-components.scss Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> added `Hds::ThemeSwitcher` component added `Hds::Theming` service added theming to the Showcase itself (and replaced hardcoded values with `—shw` CSS variables) added `Shw::ThemeSwitcher` component for showcase updated `Mock::App` and added new yielded sub-components added `Shw:: ThemeSwitcher` to the Showcase page header added `foundations/theming` showcase page (and a frameless demo) refactored `hds-theming` service to align with the new themes/modes and be open to configurations added `hdsTheming` initialization to main showcase app removed compilation of components Scss and replaced it with static inclusion of pre-compiled (standard and themed) CSS The pre-compiled CSS files have been manually copied in the `public/assets` folder, while waiting to understand what is the best way to proceed to have them added at build time from the `@hashicorp/design-system-components` package added theming options via popover - part 1 added theming options via popover - part 2 added theming options via popover - part 3 added theming options via popover - part 4 added theming options via popover - part 5 big code refactoring for the theme selector, to streamline user selection and expand use cases we can cover updated logic that sets the theming for the showcase itself (without relying on HDS selectors) small fixes here and there for cleanup and linting fixed issue with `pnpm lint:format` (missing newline at the end of `package.json` solution: run `pnpm prettier . --cache --write` locally and then commit fixed accessibility issue in `advanced-table` page, due to changes to “themed” `—shw` colors fixed typescript error due to new mock page being added added fix for tests failing see #3298 started large refactoring/rewrite of the theming switcher and page in the showcase updated logic by creating a `shwTheming` service that extends `hdsTheming` moved theming logic from `ShwThemeSwitcher` component/subcomponents to `hdsTheming` service updated reference CSS files to follow new theming approach/logic further refactoring/rewriting of theming logic updated approach to `light/dark` styles in showcase by using the HDS CSS selectors migrated back the `Contextual` demo content to the index page added a `DebuggingPanel` to the `ShwThemeSwitcher` controls refactored/improved `DebuggingPanel` and added new preferences to advanced options small cleanups and refactorings fixed small issue with `ShwThemeSwitcher` selector removed some outdated comments small refactorings added local storage support for theming options big refactoring of the `hdsTheming` service to simplify logic and reduce redundant methods invocations cleanup of debugging comments and other stuff refactor and cleanup in preparation for PR review refactored code to fix logic flow for theming initialization fixed how the theming options were saved in local storage Apply suggestions from Copilot's code review Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> fixed issue with `setTheme` not being passed `options` by the `ShwThemeSwitcher` fix issue with the popover of the ShwThemeSwitcher component, where the states were potentially out of sync Update showcase/app/services/shw-theming.ts Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> small tweak to the typing of `HdsModes` per code review suggestion updated how the CSS files (tokens and components, with/without theming) are consumed by the showcase application updated logic for styleshet switching using the `disabled` attribute removed unused import removed `isInitialized` logic from the `hdeTheming` service to avoid bug Assertion Failed: You attempted to update _isInitialized on <HdsThemingService:ember77>, but it had already been used previously in the same computation. Attempting to update a value after using it in a computation can cause logical errors, infinite revalidation bugs, and performance issues, and is not supported. _isInitialized was first used: While rendering: {{outlet}} for -top-level -top-level {{outlet}} for application Application TEMP - added temporary `hds-theme-light/dark` selectors while we understand how to do nesting of theming TEMP - Added back custom token values for testing purpose fixed small issue with the `HdsThemeSwitcher` components used in the `Theming` showcase page context: #3240 (comment) added small comment updated `hdsTheming` service to support `default` theme / mode added support for `default` option to HDS ThemeSwitcher component Updated “foundations/theming” showcase page to include variants of HDS ThemeSwitcher with `default` option updated Showcase ThemeSwitcher to use ``default` as theme option updated logic for how CSS selectors are applied to the `html:root` element + scrappy implementation of `isComplex` (to be completed later) updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline added fake theming for display/text typography to `public/assets` themed tokens CSS files (for debugging purpose) updated “foundations/theming” showcase page to include `default` and `system` themes + improved contextual theming using custom typographic theming implemented `ThemeContex` component added demos of `ThemeContext` component to showcase “foundations/theming” page improved type definitions for ThemeContext and showcase “foundations/theming” page refactored how CSS selectors are applied to enable mode-specific overrides updated CSS selectors for local `public/assets` themed tokens CSS files to be in sync with the ones generated by the tokens pipeline updated `ThemeContext` to use a more generic `context` argument updated showcase “theming” page to use the new `@context` argument for the `ThemeContext` component finally defined proper typing for `ThemeContext` component refactored showcase code to remove handling of `[data-hds-theme]` CSS selectors for theming updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names refactored theme switching in showcase to use new CSS files updated theme switcher in showcase to allow toggling of the “advanced options” introduced a “carbonization” mixin for applying styles only for certain conditions/modes this is the first implementation, it may see further refinements later it will be used to differentiate styles for the Button component added subtle shadow to `ThemingBasicContainer` fixed small bug that would cause the showcase pages to crash if the value stored in local storage for the `shw-theming-current-stylesheet` value was not found small fix to the control logic for the `HdsThemeSwitcher` demo in showcase page fixed TypeScript issue fix small bug in the logic when the “apply” with “show advanced options” is `false` added `ShwBodyLinkToRoute` component replaced custom link in AdvancedTable showcase page with newly created `ShwBodyLinkToRoute` component reworked the demo frameless for application with theme switcher to avoid collisions between the main page and the frame replaced custom theme switcher with proper `HdsThemeSwitcher` in `AppFooter` demo some cleanup before code review changed how theming is applied to the showcase itself, to limit `prefers-color-scheme` application only to the explict `system` theme selection fixed wrong CSS selector, per code review suggestion prefixed `OnSetThemeCallback` with `Hds` per review suggestion Update packages/components/src/template-registry.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> converted `updatePageStylesheets` function to a private method per Copilot suggestion: #3240 (comment) small cleanup per code reviews suggestions small fixes per code review updated logic that reads the stored theming data for the `HdsThemingService` to make it more robust removed comment updated CSS selectors for local `public/assets` themed tokens CSS files to use updated selectors and file names basic implementation of `<ShwCarbonizationComparisonGrid>` refactored implementation of `<ShwCarbonizationComparisonGrid>` implemented “Carbonization” section for `Badge` page implemented “Carbonization” section for `BadgeCount` page implemented “Carbonization” section for `Button` page implemented “Carbonization” section for `Focus Ring` page implemented “Carbonization” section for `Typography` page implemented “Carbonization” section for (new) `Color` page added `@carbon/web-components` as devDependency to Showcase app added `@carbon/[themes|layout|grid|type]` + `@ibm/plex` as devDependencies to Showcase app refactored `ComparisonGrid` component to add themed background color to the cells/areas added temporary support for IBM Plex font-family refactored code to support theming for reference web components, based on Carbon implementation/specifications small refactoring small refactorings refactored content organization to have the carbonization pages as standalone pages added carbon web components for comparison on `BadgeCount` page added carbon web components for comparison on `Button` page more small fixes for cleanup and linting implemented “Carbonization” section for `Form::TextInput` page implemented “Carbonization” section for `SegmentedGroup` page removed link to “Foundations > Color” page Small update to an `rgba` color Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> moved theming class in ComparisonGrid from item to item content per code review suggestion improved how to apply themed foreground/background colors to content in the comparison grid installed `@carbon/styles` as devDependency to import CSS variables for Carbon theming fixed issue with text color in typography page reorganized carbonized pages so they all live under the `carbonized` folder/route will be used later to detect if we need to do something around theme switcher and CSS to load prepared the ground for controlling the ShwThemeSwitcher on carbonized pages fixed CSS for carbonization pages updated carbonized typography page to show equivalent/mapped Carbon typographic style updated `ShwComparisonGrid` to expose an alternative side-by-side layout updated some components to take into account the new `hideCarbonLabels` argument fixed typescript/glint issue updated a couple of typographic mappings added yielding of `theme` value in the named blocks of the `ComparisonGrid` introduced `ShwCarbonizationStylePreviewTypography` to facilitate comparison of typographic styles refactored `carbonization/foundations/color` page and `ShwCarbonizationTokenPreviewColor` to show actual color values in preview item updated comparison grid to use `default` for original HDS theming instead of `hds` small tweak to the `badge` carbonization page added logic to the application to lock theme switching when loading a “carbonized” page (and restore its previous state when returning to non-carbonized pages) replaced `theme` with `mode` in `ComparisonGrid` fixed issue with the “default” block of the carbonization grid was not rendered as “classic” HDS fixed issue in the carbonization page for colors some cleanup before code review Update showcase/app/components/shw/carbonization/token-preview/color.gts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> updated showcase page for Button carbonization implemented “Carbonization” page for `Modal` component added examples of components with focus state to the carbonization page for focus ring tweaks per code review suggestions implemented “Carbonization” page for `Form/RadioCard` component better visual grouping of carbonization pages links in homepage renamed the `page-carbonization` components files and declarations to add `Index` (for consistency, per review comment) added `disabled` state to `cds-radio-tile` avoid duplicate `name` attributes for different radio groups add missing `{{on "change" this.onChange}}` handled to the `RadioCard` elements when in a group updated logic that converts the Carbon duration value to the DTCG format to use always seconds updated logic that converts the Carbon `cubic-bezier` value to the expected DTCG format see: https://www.designtokens.org/tr/drafts/format/#cubic-bezier re-extracted carbon tokens turned on option to convert `font-size` from `rem` to `px` for extracted Carbon tokens re-extracted carbon tokens [06] [Project Solar / Phase 1 / Dry-run] Migration dry-run for foundations and components (#3332) [Project Solar / Phase 1 / Engineering Follow-ups] Add `localStorage` parsing validation (#3401) added `chalk` as devDependency updated `build.ts` script for design tokens, to have validation of expected `$modes` format improved logging messages for validation warnings/errors of `$modes` [Project Solar / Phase 1 / Engineering Follow-ups] Add tests for HDS theming service and components (#3428) Co-authored-by: Dylan Hyun <dylan.hyun@hashicorp.com> Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> re-generated CSS files in output after rebasing on `main` (new styles have been added to the common styles for HDS components) [HDS-5702] - Remove postbuild in favor of rollup copy (#3441) fixed TS issue fixed some linting warnings for `package.json` files post rebase (and conflicts fixing) enabled logging for StyleDictionary abstracted `getSourceFromFileWithRootSelector` implemented custom “CSS variables” format for theme tokens, with logic to handle aliasing (outputReferences) and files splitting (“common” vs “themed”) abstracted `DocsJson` custom format to its own file removed `attributes/themeable` custom transform (not needed anymore) added validation for generated themed tokens (as SD custom action) small tweakings, cleanups and fixes TEMP - Add `test` tokens (to be removed in a follow-up revert commit) Revert "TEMP - Add `test` tokens (to be removed in a follow-up revert commit)" This reverts commit 455d9ec. [Project Solar / Phase 1 / Engineering Follow-ups] Converted tests for `HdsThemeSwitcher` and `HdsThemeContext` to `.gts` format (#3447) Refactor `dist` CSS file checks into script (#3462) re-generated all the dist and public files after rebasing on `main` small cleanup of initial commits used to open the PR [07a] [Project Solar / Phase 1] Include IBM Plex fonts as part of the `@hashicorp/design-system-components` package (#3387) removed service which was not used [Project Solar / Phase 1 / Engineering Follow-ups] Remove local storage implementation from `HdsTheming` service and move it to the Showcase consuming app (#3540) Co-authored-by: Kristin Bradley <kristin.bradley@hashicorp.com> [Project Solar / Phase 1 / Engineering Follow-ups] Remove `globalOnSetTheme` callback from `HdsTheming` service (#3539) Use esm for `dist` file check (#3551) fixes that were missed after rebase on `main` (and conflict resolution) re-built tokens after rebase on `main` (all the `Hds::SideNav` tokens have been removed) fixed yielded component name [Project Solar / Phase 1 / Engineering Follow-ups] Update tokens pipeline to support structured values for the `$modes` entries (#3575) [Project Solar / Phase 1 / Follow-up] Fix small issue in tokens build pipeline (#3595) Reverted temporary commits from PR #3595 Revert "TEMP/REMOVE ME - Added `$modes` to `boundary-50` (referenced as alias by `boundary.surface` and `boundary-gradient-faint-stop`)" This reverts commit eeb1a0a. Revert "TEMP/REMOVE ME - re-generated tokens in output" This reverts commit 23c9bb0. [Project Solar / Phase 1] Align version of carbon web component imports (#3613) [Project Solar / Phase 1 / Components] Support multiple selectors in carbonization mixin (#3630) [Project Solar / Phase 1 / Foundations] Finalize design tokens for Core/Semantic Colors + Typography + Borders (#3572) [Project Solar / Phase 1 / Components] `Badge/BadgeCount` carbonization (#3592) [Project Solar / Phase 1 / Foundations] Flight icons &`Icon` carbonization (#3584) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> Project solar/icons commit icons (#3643) Small updates to the icons used in the showcase page for the `Icon` component (#3644) [Project Solar / Phase 1 / Components] `Separator` carbonization (HDS-6102) (#3674) Co-authored-by: Cristiano Rastelli <cristiano.rastelli@hashicorp.com> [Project Solar / Phase 1 / Foundations] Update tokens with `$modes` for semantic products colors (#3680) [Project Solar / Phase 1 / Icons] Fix copy button showcase status icons (#3694) [Project Solar / Phase 1 / Components] `ApplicationState` carbonization (HDS-6075) (#3686) [Project Solar / Phase 1 / Foundations] Remove `$modes` from "core/palette" product colors (#3695) [Project solar / Phase 1 / Foundations] Elevation (#3693) [Project Solar / Phase 1 / Showcase] Add support for "column" layout to comparison grid and "no equivalent" block (#3682) linting [Project Solar / Phase 1 / Components] `IconTile` carbonization (HDS-6061) (#3588) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Foundations] Add `high-contrast` core semantic token for surface (#3701) [Project Solar / Phase 1 / Components] `TooltipButton` carbonization (#3622) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `RichTooltip` carbonization (#3641) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `DismissButton` carbonization (#3665) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed AppFooter example in “foundations/theming” showcase page [Project Solar / Phase 1 / Components] `AppFooter` carbonization (HDS-6072) (#3675) Co-authored-by: Cristiano Rastelli <public@didoo.net> fixed issue with themes being applied to the “carbonization” pages Remove prebuild script (#3715) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Allow overriding of IBM Plex fonts `/assets` path in Scss (#3736) [Project Solar / Phase 1 / Follow-up] Add watcher to tokens `build` script (#3757) [Project Solar / Phase 1 / Follow-up] Watch sass files for changes in `components` build (#3759) [Project Solar / Phase 1 / Components] `LinkInline` and `LinkStandalone` carbonization (#3587) [Project Solar / Phase 1 / Components] `RichTooltip` - Set text color (#3756) [Project Solar / Phase 1 / Components] `CopySnippet` carbonization (#3733) fixed carbonized focus ring showcase `AdvancedTableThSort` has been now merged with `AdvancedTableTh` to be a single subcomponent [Project Solar / Phase 1 / Components] `Breadcrumb` carbonization (#3652) [Project Solar / Phase 1 / Components] `DialogPrimitive/Modal/Flyout` carbonization (#3645) [Project Solar / Phase 1 / Components] `Pagination` carbonization (HDS-6035) (#3598) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Components] `Card` carbonization (#3679) [Project Solar / Phase 1 / Components] `Tabs` carbonization (HDS-6106) (#3690) removed leftover generated files after removal of `devdot` and `marketing` as targets in `main` Fix: AppFooter carbonization page STATUSES import paths HDS-6166 Fix incorrect value for Tabs Tab horizontal padding token for large variant [Project Solar / Phase 1] Update `@carbon/***` dependencies (#3794) [Project Solar / Phase 1 / Tokens update] Update `transitions` tokens (#3798) [Project Solar / Phase 1 / Tokens update] Update `typography` tokens (#3799) [Project Solar / Phase 1 / Components] `Tag` carbonization (#3685) [Project Solar / Phase 1 / Tokens update] Update component-level color tokens - Part 1 (#3805) [Project Solar / Phase 1 / Follow-up] Re-sync extracted Carbon tokens (#3812) [Project Solar / Phase 1 / Components] `PageHeader` carbonization (HDS-6099) (#3802) [Project Solar / Phase 1 / Follow-up] Fix issue in extraction of Carbon tokens when color value is in "modern" `rgb()` format (#3813) [Project Solar / Phase 1 / Components] `Button` carbonization (#3611) [Project Solar / Phase 1 / Components] `CopyButton` carbonization (#3696) [Project Solar / Phase 1 / Components] `CodeBlock` carbonization (#3779) Fix: Carbonization showcase type linting errors [Project Solar / Phase 1 / Components] `CodeEditor` carbonization (#3785) [Project Solar / Phase 1 / Follow-up] Fix `DialogPrimitive` header spacing (#3833) small text alignment fix in `NoEquivalent` showcase component [Project Solar / Phase 1 / Follow-up] Fix `hds-apply-only-if-carbon` Sass mixin (#3838) [Project Solar / Phase 1 / Components] `Reveal` carbonization (HDS-6100) (#3706) Co-authored-by: Cristiano Rastelli <public@didoo.net> [Project Solar / Phase 1 / Follow-up] Convert `ThemeSwitcher` and `ThemeContext` components to `.gts` (#3846) Add tests for `hds-icon-registry` service (#3829) [Project Solar / Phase 1 / Follow-up] Update `focus` to `focus-ring` in "component-level" tokens (#3861) [Project Solar / Phase 1 / Components] `Alert` & `Toast` carbonization (#3809) [Project Solar / Phase 1 / Components] `AppSideNav` carbonization (#3801) [Project Solar / Phase 1 / Follow up] Add "column-stacked" layout to `ShwCarbonizationComparisonGrid` in showcase for carbonization pages (#3867) re-generated files in output after rebase on main rebuilt files in output after rebase on `main` Fix: Application template function call for page initialization [Project Solar / Phase 1 / Components] `Dropdown` carbonization (HDS-6083) (#3814) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Components] Update `body-100` Carbon font size and component tokens (#3862) [Project Solar / Phase 1 / Follow-up] Showcase improvements for the focus ring refactoring (#3896) [Project Solar / Phase 1 / Components] `Form` primitives (HDS-6086) (#3860) Co-authored-by: Cristiano Rastelli <public@didoo.net> Co-authored-by: Dylan Hyun <dylan.hyun@ibm.com> [Project Solar / Phase 1 / Follow-up] Focus ring refactoring for all components (#3884) [Project Solar / Phase 1 / Components] `AppHeader` carbonization (#3819) [Project Solar / Phase 1 / Follow-up] Cleanup redundancies in source JSON files for tokens (#3913) [Project Solar / Phase 1 / Migration] AppSideNav list item active indicator token (#3916) [Project Solar / Phase 1 / Migration] Set LinkStandalone secondary hover state color (#3920) re-generated files in output (missed in #3920) added selector with higher specificity for focused `.hds-dismiss-button.hds-dialog-primitive__dismiss` re-generated files in output [Project Solar / Phase 1 / Components] Remove `button.border-color.{color}.focus` tokens (#3933) [Project Solar / Phase 1 / Showcase] Convert HdsIcon in Carbon Web Components to `cds-icon` (#3928) [Project Solar / Phase 1 / Follow-up] Add `token-css-color-transform-direction` token (#3936) [Project Solar / Phase 1 / Migration] `Accordion` "carbonization" (#3525) missed to commit generated file in output (#3525) copyright updates fixed a couple of typos removed unnecessary `mock-state` attributes `Tag` - fix `mock-state-value` not being dynamically set on showcase page [Project Solar / Phase 1 / Migration] Add `secondary-muted` button variant (#3930) added fix for padding of `<legend>` base form element re-generated files in output [Project Solar / Phase 1 / Follo-up] Fix tokens values comparison + other small bugs (#3941) [Project Solar / Phase 1 / Follow-up] Include declarations for CSS `color-scheme` properties in generated token files (#3943) fixed `start` command syntax to escape double quotes instead of using single quotes (consistent with other commands in other files) re-generated files in output removed classname not used anymore
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
📌 Summary
This PR started as a way to fix a simple issue with a comparison logic between
$valuesand$modes.default(see Jira ticket for details) but in the process uncovered a couple of other issues (one of which a bug) with the tokens pipeline.🛠️ Detailed description
In this PR I have:
$valuevs$modes.defaultwhen the values are objects/arraysdimension/unitcustom transform to handle new DTCG format for “dimension” values (eg."$value": { "value": 4, "unit": "px" })$modesvalues that are objects/array are not handled correctly (see regenerated files in output diff for how this bug was not generating the correct token values)Ignore the generated files under the
packages/tokens/dist/andshowcase/public/assets/styles/@hashicorp/themed-tokens/and focus only on the other changed files.🔗 External links
Jira ticket: https://hashicorp.atlassian.net/browse/HDS-6472
👀 Component checklist
💬 Please consider using conventional comments when reviewing this PR.
📋 PCI review checklist
Examples of changes to controls include access controls, encryption, logging, etc.
Examples include changes to operating systems, ports, protocols, services, cryptography-related components, PII processing code, etc.