Feat/migrate tag and selectlist css vars #381
Merged
Conversation
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
martimalek
requested review from
nlopin,
div-Leo and
jonotrujillo
as code owners
|
Those two components have semantic colors in the next branch (see Tag). In the main, error states were added. Have you used the same semantic values as in the next branch? That way, we can avoid conflicts |
nlopin
approved these changes
Sep 29, 2023
martimalek
force-pushed
the
main-into-next-conflicts
branch
from
9a64870 to
e3f889c
Compare
martimalek
force-pushed
the
feat/migrate-tag-and-selectlist-css-vars
branch
from
050f32d to
bd16c18
Compare
|
The force pushes that you see are because I corrected the git history of #380, when merging |
Yes, I've used the same semantic colors that were already in |
1 task
github-actions bot
pushed a commit
that referenced
this pull request
Sep 29, 2023
## [3.0.0-next.1](v2.1.0-next.2...v3.0.0-next.1) (2023-09-29) ### ⚠ BREAKING CHANGES * remove weak prop from Text and add codemod for it (#374) ### Features * **breadcrumbs:** use css variables for colors ([#382](#382)) ([f13658c](f13658c)) * migrate tag and selectlist variant colors to css vars ([#381](#381)) ([e11833c](e11833c)) * remove weak prop from Text and add codemod for it ([#374](#374)) ([df98bb9](df98bb9)) * replace fixed colors with semantic tokens ([204a71d](204a71d)) * tooltip placement codemod ([#377](#377)) ([258d8ed](258d8ed)) * **accordion:** migrate to semantic colors ([37c9df5](37c9df5)) * **banner:** migrate to semantic colors ([5c30334](5c30334)) * **buttons:** use css variables for colors ([1664f57](1664f57)) * **card:** migrate to semantic colors ([bc90913](bc90913)) * **checkbox:** migrate to semantic colors ([18bd927](18bd927)) * **datepicker, infobanner:** migrate to semantic colors ([98f3d53](98f3d53)) * **design-token:** start restructuring the design tokens ([f477ef9](f477ef9)) * **dimming:** migrate to semantic colors ([a47e1a7](a47e1a7)) * **divider:** migrate to semantic colors ([d0bc552](d0bc552)) * **filepicker:** migrate to semantic colors ([5b2e16c](5b2e16c)) * **filePicker:** add alwaysShowActionButton to mobile ([#303](#303)) ([5d46685](5d46685)) * **headline:** migrate to semantic colors ([f23e081](f23e081)) * **icon:** migrate to semantic colors ([e876e7a](e876e7a)) * **InfoBanner:** fix up the InfoBannerCard Link export ([f6dac56](f6dac56)) * **input:** migrate to semantic colors ([3268c02](3268c02)) * **label:** migrate to semantic colors ([fb6b7e1](fb6b7e1)) * **Link:** migrate to semantic colors ([d16e546](d16e546)) * **modal:** migrate to semantic colors ([90e37c5](90e37c5)) * **offcanvas:** migrate to semantic colors ([1a4a9fd](1a4a9fd)) * **pagination:** use css variables for colors ([f85b75b](f85b75b)) * **password:** migrate to semantic colors ([715f23b](715f23b)) * **popover:** migrate to semantic colors ([e8c66f7](e8c66f7)) * **radio:** migrate to semantic colors ([8aa03d7](8aa03d7)) * **search:** migrate to semantic colors ([0908aed](0908aed)) * **select:** migrate to semantic colors ([7ce9d99](7ce9d99)) * **selectlist:** migrate to semantic colors ([ef8426c](ef8426c)) * **skeleton:** migrate to semantic colors ([16211d9](16211d9)) * **spinner:** migrate to semantic colors ([ae68790](ae68790)) * **tabbar:** use css variables for colors ([4512994](4512994)) * **table:** add sortable table components and hook ([362dba5](362dba5)) * **tag:** use css variables for colors ([d71e73b](d71e73b)) * **text:** migrate to semantic colors ([9ad1848](9ad1848)) * **toggle:** migrate to semantic colors ([f81322e](f81322e)) * **tokens:** create color schemas ([6f1e40f](6f1e40f)) * **tooltip:** migrate to semantic colors ([f6d79f6](f6d79f6)) * add grid system components ([#198](#198)) ([c435683](c435683)), closes [#200](#200) * add InfoBanner component ([#225](#225)) ([e434f5a](e434f5a)) * add missing colors to match Figma file ([#289](#289)) ([b0ae302](b0ae302)) * Add Popover component to wave ([#230](#230)) ([0c49ab3](0c49ab3)) * add secondary variant for text component ([#170](#170)) ([f056fea](f056fea)) * added Accordion component ([#172](#172)) ([439b67c](439b67c)) * adds select page size component ([#201](#201)) ([068b958](068b958)) * implement compound component approach for InfoBanner ([#336](#336)) ([9f1982c](9f1982c)) * introduce `useToggle` hook ([#220](#220)) ([83cbad8](83cbad8)) * popover ([#234](#234)) ([8e4075b](8e4075b)) * remove brand colors from semantic colors object ([#208](#208)) ([1ccb794](1ccb794)) * remove nanoid ([#321](#321)) ([8e952a0](8e952a0)) * Tooltip with react-popper ([#267](#267)) ([6965ef4](6965ef4)) * update missing icons ([#228](#228)) ([2f840e5](2f840e5)) ### Bug Fixes * support children prop type in row component ([#347](#347)) ([4620776](4620776)) * **docs:** remove unused imports ([0c439a5](0c439a5)) * **popover:** add missing semantic color ([0936f95](0936f95)) * **tabbar:** set font-family -> was "Times" in storybook ([4846aa8](4846aa8)) * add support for children props for Label component ([#340](#340)) ([c840c88](c840c88)) * set focus on password input resolve [#124](#124) ([#328](#328)) ([5068920](5068920)) * **datepicker:** invoke `onClose` handler only once ([#300](#300)) ([9190e6c](9190e6c)) * **inline-spinner:** html and a11y ([#307](#307)) ([cb46551](cb46551)), closes [#306](#306) * **password:** use `flex-end` instead of `end` ([#291](#291)) ([debdb5a](debdb5a)), closes [#290](#290) * **tooltip:** type children prop ([#330](#330)) ([9bbdafe](9bbdafe)) * **tooltip:** use correct props with children type ([339fce2](339fce2)) * add layout props to TableHeaderCell and TableCell ([#185](#185)) ([0915c58](0915c58)) * adding layout to the compose styles ([#233](#233)) ([48af1d1](48af1d1)) * cleanup Modal timeout ([#193](#193)) ([fcb1341](fcb1341)) * display semantic colors in table and allow to filter them ([#258](#258)) ([2e83e76](2e83e76)) * export popover component in components index ([#246](#246)) ([0def6b8](0def6b8)) * expose padding prop and adjust z-index for Popover component ([#263](#263)) ([da0e80b](da0e80b)) * giving singlevalue full max width to override the selectlist styles ([#248](#248)) ([115ae70](115ae70)) * replace weak prop with secondary ([#206](#206)) ([37a7f4f](37a7f4f)) * spread Box props correctly ([9dac265](9dac265)), closes [#190](#190) * uncontrolled input's label position ([#297](#297)) ([fb6c009](fb6c009)) * window is undefined error in next.js projects ([b89bfc9](b89bfc9)), closes [#222](#222)
|
🎉 This PR is included in version 3.0.0-next.1 🎉 The release is available on: Your semantic-release bot 📦🚀 |
martimalek
added a commit
that referenced
this pull request
Oct 2, 2023
* feat(tag): use css variables in variants * feat(selectlist): use css variables in variants
martimalek
added a commit
that referenced
this pull request
Oct 2, 2023
* feat(tag): use css variables in variants * feat(selectlist): use css variables in variants
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.
What:
Migrate new variants of
TagandSelectListcomponents to use css vars for colors.
Why:
The
TagandSelectListcomponents have recently received some updates inmain, since inmainthe css variables are not yet available these updates were done using the "old" colors constants. We need to migrate to the new css vars here innext.
How:
I've migrated all color values in
TagandSelectListso they are usinggetSemanticValue. Please review the semantic values that I've chosen and let me know if you think that there are better alternatives, as far as I understand, we don't have a way to perfectly map the old semantic colors to the new ones, I've tried to keep them semantic.
Media:
TagSelectList(multi)Checklist:
Closes #373