-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Update v12 color
token migration
#11029
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
Co-authored-by: Aaron Casanova <32409546+aaronccasanova@users.noreply.github.com>
/snapit |
🫰✨ Thanks @lgriffee! Your snapshots have been published to npm. Test the snapshots by updating your yarn add @shopify/polaris-migrator@0.0.0-snapshot-release-20231025162247 yarn add @shopify/polaris@0.0.0-snapshot-release-20231025162247 yarn add @shopify/polaris-tokens@0.0.0-snapshot-release-20231025162247 yarn add @shopify/stylelint-polaris@0.0.0-snapshot-release-20231025162247 |
/snapit |
🫰✨ Thanks @lgriffee! Your snapshots have been published to npm. Test the snapshots by updating your yarn add @shopify/polaris-migrator@0.0.0-snapshot-release-20231025210116 yarn add @shopify/polaris@0.0.0-snapshot-release-20231025210116 yarn add @shopify/polaris-tokens@0.0.0-snapshot-release-20231025210116 yarn add @shopify/stylelint-polaris@0.0.0-snapshot-release-20231025210116 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thank you @lgriffee!! 🙌🏽
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @shopify/polaris-migrator@0.26.2 ### Patch Changes - [#11029](#11029) [`ca67934e0`](ca67934) Thanks [@lgriffee](https://github.com/lgriffee)! - Update `v12-styles-replace-custom-property-color` migration with additional tokens - Updated dependencies \[[`73b1d5d2c`](73b1d5d)]: - @shopify/polaris-tokens@8.0.2 - @shopify/stylelint-polaris@15.0.2 ## @shopify/polaris@12.0.2 ### Patch Changes - [#11037](#11037) [`f81abddba`](f81abdd) Thanks [@chloerice](https://github.com/chloerice)! - Added tests for `buttonFrom` and `buttonsFrom` utility functions - [#11061](#11061) [`74fb5d5c6`](74fb5d5) Thanks [@laurkim](https://github.com/laurkim)! - Fixed border radius styling on `TextField.Spinner` component - [#11062](#11062) [`78ff4e665`](78ff4e6) Thanks [@chloerice](https://github.com/chloerice)! - Updated `ContextualSaveBar` icon to `RiskMajor` and updated logos in examples to Shopify logo - [#11052](#11052) [`27317aa4b`](27317aa) Thanks [@kyledurand](https://github.com/kyledurand)! - Fixed destructive states for PageActions and Page SecondaryActions - [#11053](#11053) [`caf553126`](caf5531) Thanks [@laurkim](https://github.com/laurkim)! - Removed `experimental` flag from Badge `tone` types - [#11049](#11049) [`7508e7014`](7508e70) Thanks [@sophschneider](https://github.com/sophschneider)! - Fixed Banner InlineIconBanner variant dismiss icon position when hideIcon is true - [#10808](#10808) [`b0d5750b0`](b0d5750) Thanks [@jesstelford](https://github.com/jesstelford)! - [IndexFilters] Loading spinner moved to be a suffix within the search box. - Updated dependencies \[[`73b1d5d2c`](73b1d5d)]: - @shopify/polaris-tokens@8.0.2 ## @shopify/polaris-tokens@8.0.2 ### Patch Changes - [#10602](#10602) [`73b1d5d2c`](73b1d5d) Thanks [@patrickDouglas](https://github.com/patrickDouglas)! - Export types missing for the Typescript Compiler (tsc) when using Node16/Bundler Module Resolution. ## @shopify/stylelint-polaris@15.0.2 ### Patch Changes - Updated dependencies \[[`73b1d5d2c`](73b1d5d)]: - @shopify/polaris-tokens@8.0.2 ## polaris.shopify.com@0.60.0 ### Minor Changes - [#11045](#11045) [`a1c13938f`](a1c1393) Thanks [@lgriffee](https://github.com/lgriffee)! - Add v12 polaris migrator documentation ### Patch Changes - [#10795](#10795) [`e78051a80`](e78051a) Thanks [@SMAKSS](https://github.com/SMAKSS)! - Fixed typos in `<Text />` variant tokens - [#11051](#11051) [`f2fabff25`](f2fabff) Thanks [@lgriffee](https://github.com/lgriffee)! - Alphabetize component list in v11 to v12 migration guide - [#11029](#11029) [`ca67934e0`](ca67934) Thanks [@lgriffee](https://github.com/lgriffee)! - Update `v12-styles-replace-custom-property-color` migration with additional tokens - Updated dependencies \[[`f81abddba`](f81abdd), [`74fb5d5c6`](74fb5d5), [`78ff4e665`](78ff4e6), [`27317aa4b`](27317aa), [`caf553126`](caf5531), [`7508e7014`](7508e70), [`73b1d5d2c`](73b1d5d), [`b0d5750b0`](b0d5750)]: - @shopify/polaris@12.0.2 - @shopify/polaris-tokens@8.0.2 Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
### WHY are these changes introduced? While working on `color` migrations in one of the web deps I came across some `color` tokens that were in [this spreadsheet](https://docs.google.com/spreadsheets/d/1Bm3-a-e5BRCelz1VmPJHmjrGrd-ZtFVH_b0_yFpzBHc/edit#gid=2044767004) but not in our current migrations and charts. ### WHAT is this pull request doing? Adds the following `color` token replacement maps to `v12-styles-replace-custom-property-color` migration and our v11 to v12 migration guide: | Deprecated Token | Replacement Value | | -------------------------------------------------------- | ------------------------------------------ | | `--p-color-bg-interactive-active` | `--p-color-bg-fill-brand-active` | | `--p-color-bg-interactive-disabled` | `--p-color-bg-surface-disabled` | | `--p-color-bg-interactive-hover` | `--p-color-bg-fill-brand-hover` | | `--p-color-bg-interactive-subdued` | `--p-color-bg-surface-brand` | |`--p-color-border-strong-hover` | `--p-color-border-tertiary` | --------- Co-authored-by: Aaron Casanova <32409546+aaronccasanova@users.noreply.github.com>
This PR was opened by the [Changesets release](https://github.com/changesets/action) GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated. # Releases ## @shopify/polaris-migrator@0.26.2 ### Patch Changes - [Shopify#11029](Shopify#11029) [`ca67934e0`](Shopify@cdfc606) Thanks [@lgriffee](https://github.com/lgriffee)! - Update `v12-styles-replace-custom-property-color` migration with additional tokens - Updated dependencies \[[`73b1d5d2c`](Shopify@8c8bdc0)]: - @shopify/polaris-tokens@8.0.2 - @shopify/stylelint-polaris@15.0.2 ## @shopify/polaris@12.0.2 ### Patch Changes - [Shopify#11037](Shopify#11037) [`f81abddba`](Shopify@2c8209b) Thanks [@chloerice](https://github.com/chloerice)! - Added tests for `buttonFrom` and `buttonsFrom` utility functions - [Shopify#11061](Shopify#11061) [`74fb5d5c6`](Shopify@46467a7) Thanks [@laurkim](https://github.com/laurkim)! - Fixed border radius styling on `TextField.Spinner` component - [Shopify#11062](Shopify#11062) [`78ff4e665`](Shopify@c8db6f6) Thanks [@chloerice](https://github.com/chloerice)! - Updated `ContextualSaveBar` icon to `RiskMajor` and updated logos in examples to Shopify logo - [Shopify#11052](Shopify#11052) [`27317aa4b`](Shopify@b7c8685) Thanks [@kyledurand](https://github.com/kyledurand)! - Fixed destructive states for PageActions and Page SecondaryActions - [Shopify#11053](Shopify#11053) [`caf553126`](Shopify@77e9c8b) Thanks [@laurkim](https://github.com/laurkim)! - Removed `experimental` flag from Badge `tone` types - [Shopify#11049](Shopify#11049) [`7508e7014`](Shopify@84aad13) Thanks [@sophschneider](https://github.com/sophschneider)! - Fixed Banner InlineIconBanner variant dismiss icon position when hideIcon is true - [Shopify#10808](Shopify#10808) [`b0d5750b0`](Shopify@f68d5bb) Thanks [@jesstelford](https://github.com/jesstelford)! - [IndexFilters] Loading spinner moved to be a suffix within the search box. - Updated dependencies \[[`73b1d5d2c`](Shopify@8c8bdc0)]: - @shopify/polaris-tokens@8.0.2 ## @shopify/polaris-tokens@8.0.2 ### Patch Changes - [Shopify#10602](Shopify#10602) [`73b1d5d2c`](Shopify@8c8bdc0) Thanks [@patrickDouglas](https://github.com/patrickDouglas)! - Export types missing for the Typescript Compiler (tsc) when using Node16/Bundler Module Resolution. ## @shopify/stylelint-polaris@15.0.2 ### Patch Changes - Updated dependencies \[[`73b1d5d2c`](Shopify@8c8bdc0)]: - @shopify/polaris-tokens@8.0.2 ## polaris.shopify.com@0.60.0 ### Minor Changes - [Shopify#11045](Shopify#11045) [`a1c13938f`](Shopify@3bcae1f) Thanks [@lgriffee](https://github.com/lgriffee)! - Add v12 polaris migrator documentation ### Patch Changes - [Shopify#10795](Shopify#10795) [`e78051a80`](Shopify@23f1840) Thanks [@SMAKSS](https://github.com/SMAKSS)! - Fixed typos in `<Text />` variant tokens - [Shopify#11051](Shopify#11051) [`f2fabff25`](Shopify@8aedb53) Thanks [@lgriffee](https://github.com/lgriffee)! - Alphabetize component list in v11 to v12 migration guide - [Shopify#11029](Shopify#11029) [`ca67934e0`](Shopify@cdfc606) Thanks [@lgriffee](https://github.com/lgriffee)! - Update `v12-styles-replace-custom-property-color` migration with additional tokens - Updated dependencies \[[`f81abddba`](Shopify@2c8209b), [`74fb5d5c6`](Shopify@46467a7), [`78ff4e665`](Shopify@c8db6f6), [`27317aa4b`](Shopify@b7c8685), [`caf553126`](Shopify@77e9c8b), [`7508e7014`](Shopify@84aad13), [`73b1d5d2c`](Shopify@8c8bdc0), [`b0d5750b0`](Shopify@f68d5bb)]: - @shopify/polaris@12.0.2 - @shopify/polaris-tokens@8.0.2 Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
WHY are these changes introduced?
While working on
color
migrations in one of the web deps I came across somecolor
tokens that were in this spreadsheet but not in our current migrations and charts.WHAT is this pull request doing?
Adds the following
color
token replacement maps tov12-styles-replace-custom-property-color
migration and our v11 to v12 migration guide:--p-color-bg-interactive-active
--p-color-bg-fill-brand-active
--p-color-bg-interactive-disabled
--p-color-bg-surface-disabled
--p-color-bg-interactive-hover
--p-color-bg-fill-brand-hover
--p-color-bg-interactive-subdued
--p-color-bg-surface-brand
--p-color-border-strong-hover
--p-color-border-tertiary