From b32cee5463528a6f6c2da0edca56271bdd0033c8 Mon Sep 17 00:00:00 2001 From: TJ Egan Date: Thu, 2 Mar 2023 12:32:00 -0500 Subject: [PATCH] feat(theme): add $icon-interactive token (#13219) * feat(theme): add $icon-interactive token * Update packages/themes/src/tokens/v11TokenGroup.js Co-authored-by: Alison Joseph * Update packages/themes/src/tokens/__tests__/metadata-test.js Co-authored-by: Alison Joseph * Update packages/themes/src/tokens/__tests__/__snapshots__/v11-test.js.snap * Update packages/themes/src/tokens/__tests__/__snapshots__/v11-test.js.snap * chore(snapshot): update snapshots --------- Co-authored-by: Alison Joseph Co-authored-by: Francine Lucca <40550942+francinelucca@users.noreply.github.com> --- .../src/__tests__/__snapshots__/PublicAPI-test.js.snap | 1 + packages/styles/scss/__tests__/theme-test.js | 1 + packages/themes/src/g10.js | 1 + packages/themes/src/g100.js | 1 + packages/themes/src/g90.js | 1 + .../src/tokens/__tests__/__snapshots__/v11-test.js.snap | 2 ++ packages/themes/src/tokens/__tests__/metadata-test.js | 4 ++++ packages/themes/src/tokens/v11TokenGroup.js | 1 + packages/themes/src/white.js | 1 + 9 files changed, 13 insertions(+) diff --git a/packages/elements/src/__tests__/__snapshots__/PublicAPI-test.js.snap b/packages/elements/src/__tests__/__snapshots__/PublicAPI-test.js.snap index eae2258db781..1a1dd1143eb8 100644 --- a/packages/elements/src/__tests__/__snapshots__/PublicAPI-test.js.snap +++ b/packages/elements/src/__tests__/__snapshots__/PublicAPI-test.js.snap @@ -149,6 +149,7 @@ Array [ "helperText02", "highlight", "iconDisabled", + "iconInteractive", "iconInverse", "iconOnColor", "iconOnColorDisabled", diff --git a/packages/styles/scss/__tests__/theme-test.js b/packages/styles/scss/__tests__/theme-test.js index 724ed875a35e..8fc597209eaf 100644 --- a/packages/styles/scss/__tests__/theme-test.js +++ b/packages/styles/scss/__tests__/theme-test.js @@ -115,6 +115,7 @@ describe('@carbon/styles/scss/theme', () => { "icon-on-color", "icon-on-color-disabled", "icon-disabled", + "icon-interactive", "support-error", "support-success", "support-warning", diff --git a/packages/themes/src/g10.js b/packages/themes/src/g10.js index 35da32978806..93c14bfa1239 100644 --- a/packages/themes/src/g10.js +++ b/packages/themes/src/g10.js @@ -169,6 +169,7 @@ export const iconInverse = white; export const iconOnColor = white; export const iconOnColorDisabled = gray50; export const iconDisabled = adjustAlpha(iconPrimary, 0.25); +export const iconInteractive = blue60; // Support export const supportError = red60; diff --git a/packages/themes/src/g100.js b/packages/themes/src/g100.js index fa7f77599c0a..96a9f70cd719 100644 --- a/packages/themes/src/g100.js +++ b/packages/themes/src/g100.js @@ -176,6 +176,7 @@ export const iconInverse = gray100; export const iconOnColor = white; export const iconOnColorDisabled = adjustAlpha(iconOnColor, 0.25); export const iconDisabled = adjustAlpha(iconPrimary, 0.25); +export const iconInteractive = white; // Support export const supportError = red50; diff --git a/packages/themes/src/g90.js b/packages/themes/src/g90.js index aaa5af948900..b0472f43f155 100644 --- a/packages/themes/src/g90.js +++ b/packages/themes/src/g90.js @@ -176,6 +176,7 @@ export const iconInverse = gray100; export const iconOnColor = white; export const iconOnColorDisabled = adjustAlpha(iconOnColor, 0.25); export const iconDisabled = adjustAlpha(iconPrimary, 0.25); +export const iconInteractive = white; // Support export const supportError = red40; diff --git a/packages/themes/src/tokens/__tests__/__snapshots__/v11-test.js.snap b/packages/themes/src/tokens/__tests__/__snapshots__/v11-test.js.snap index 29a684729e30..0a0e4b075078 100644 --- a/packages/themes/src/tokens/__tests__/__snapshots__/v11-test.js.snap +++ b/packages/themes/src/tokens/__tests__/__snapshots__/v11-test.js.snap @@ -61,6 +61,7 @@ Array [ "icon-on-color", "icon-on-color-disabled", "icon-disabled", + "icon-interactive", ] `; @@ -225,6 +226,7 @@ Array [ "icon-on-color", "icon-on-color-disabled", "icon-disabled", + "icon-interactive", "support-error", "support-success", "support-warning", diff --git a/packages/themes/src/tokens/__tests__/metadata-test.js b/packages/themes/src/tokens/__tests__/metadata-test.js index e5ffc0214d7e..cd5790f3602b 100644 --- a/packages/themes/src/tokens/__tests__/metadata-test.js +++ b/packages/themes/src/tokens/__tests__/metadata-test.js @@ -877,6 +877,10 @@ test('metadata', () => { "name": "icon-disabled", "type": "color", }, + Object { + "name": "icon-interactive", + "type": "color", + }, Object { "name": "support-error", "type": "color", diff --git a/packages/themes/src/tokens/v11TokenGroup.js b/packages/themes/src/tokens/v11TokenGroup.js index f10f0ae15b81..1793c14eb4bf 100644 --- a/packages/themes/src/tokens/v11TokenGroup.js +++ b/packages/themes/src/tokens/v11TokenGroup.js @@ -286,6 +286,7 @@ export const icon = TokenGroup.create({ state: 'disabled', name: 'icon-disabled', }, + 'icon-interactive', ], }); diff --git a/packages/themes/src/white.js b/packages/themes/src/white.js index 24aecd2be9c6..292600da28b5 100644 --- a/packages/themes/src/white.js +++ b/packages/themes/src/white.js @@ -169,6 +169,7 @@ export const iconInverse = white; export const iconOnColor = white; export const iconOnColorDisabled = gray50; export const iconDisabled = adjustAlpha(iconPrimary, 0.25); +export const iconInteractive = blue60; // Support export const supportError = red60;