From ee0053eb990ca99b009967452c51ed44135a79fb Mon Sep 17 00:00:00 2001 From: Pavithra Kodmad Date: Mon, 22 Jan 2024 22:58:20 +1100 Subject: [PATCH 01/10] Tentative focus fix in action list item --- src/ActionList/Item.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/ActionList/Item.tsx b/src/ActionList/Item.tsx index a5736755e67..b574bef6a01 100644 --- a/src/ActionList/Item.tsx +++ b/src/ActionList/Item.tsx @@ -170,7 +170,7 @@ export const Item = React.forwardRef( color: getVariantStyles(variant, disabled, inactive).hoverColor, boxShadow: `inset 0 0 0 max(1px, 0.0625rem) ${theme?.colors.actionListItem.default.activeBorder}`, }, - '&:focus-visible, > a:focus-visible': { + '&:focus-visible, > a:focus-visible, &:focus.focus-visible': { outline: 'none', border: `2 solid`, boxShadow: `0 0 0 2px ${theme?.colors.accent.emphasis}`, From a2beb45d156cd6e6118f8a7160d96681b14467d1 Mon Sep 17 00:00:00 2001 From: Pavithra Kodmad Date: Thu, 25 Jan 2024 20:58:59 +1100 Subject: [PATCH 02/10] Update snapshots --- .../__snapshots__/NavList.test.tsx.snap | 24 ++++++++++++------- .../__snapshots__/Autocomplete.test.tsx.snap | 18 +++++++++----- 2 files changed, 28 insertions(+), 14 deletions(-) diff --git a/src/NavList/__snapshots__/NavList.test.tsx.snap b/src/NavList/__snapshots__/NavList.test.tsx.snap index c6a9f6aafbc..3de58f2004d 100644 --- a/src/NavList/__snapshots__/NavList.test.tsx.snap +++ b/src/NavList/__snapshots__/NavList.test.tsx.snap @@ -261,7 +261,8 @@ exports[`NavList renders a simple list 1`] = ` } .c2:focus-visible, - .c2 > a:focus-visible { + .c2 > a:focus-visible, + .c2:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -287,7 +288,8 @@ exports[`NavList renders a simple list 1`] = ` } .c7:focus-visible, - .c7 > a:focus-visible { + .c7 > a:focus-visible, + .c7:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -685,7 +687,8 @@ exports[`NavList renders with groups 1`] = ` } .c6:focus-visible, - .c6 > a:focus-visible { + .c6 > a:focus-visible, + .c6:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -711,7 +714,8 @@ exports[`NavList renders with groups 1`] = ` } .c11:focus-visible, - .c11 > a:focus-visible { + .c11 > a:focus-visible, + .c11:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -1150,7 +1154,8 @@ exports[`NavList.Item with NavList.SubNav does not have active styles if SubNav } .c11:focus-visible, - .c11 > a:focus-visible { + .c11 > a:focus-visible, + .c11:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -1176,7 +1181,8 @@ exports[`NavList.Item with NavList.SubNav does not have active styles if SubNav } .c4:focus-visible, - .c4 > a:focus-visible { + .c4 > a:focus-visible, + .c4:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -1629,7 +1635,8 @@ exports[`NavList.Item with NavList.SubNav has active styles if SubNav contains t } .c11:focus-visible, - .c11 > a:focus-visible { + .c11 > a:focus-visible, + .c11:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -1663,7 +1670,8 @@ exports[`NavList.Item with NavList.SubNav has active styles if SubNav contains t } .c4:focus-visible, - .c4 > a:focus-visible { + .c4 > a:focus-visible, + .c4:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; diff --git a/src/__tests__/__snapshots__/Autocomplete.test.tsx.snap b/src/__tests__/__snapshots__/Autocomplete.test.tsx.snap index c569d6033de..11335cb44b5 100644 --- a/src/__tests__/__snapshots__/Autocomplete.test.tsx.snap +++ b/src/__tests__/__snapshots__/Autocomplete.test.tsx.snap @@ -747,7 +747,8 @@ exports[`snapshots renders a menu that contains an item to add to the menu 1`] = } .c3:focus-visible, - .c3 > a:focus-visible { + .c3 > a:focus-visible, + .c3:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -1489,7 +1490,8 @@ exports[`snapshots renders a multiselect input 1`] = ` } .c3:focus-visible, - .c3 > a:focus-visible { + .c3 > a:focus-visible, + .c3:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -2290,7 +2292,8 @@ exports[`snapshots renders a multiselect input with selected menu items 1`] = ` } .c3:focus-visible, - .c3 > a:focus-visible { + .c3 > a:focus-visible, + .c3:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -2316,7 +2319,8 @@ exports[`snapshots renders a multiselect input with selected menu items 1`] = ` } .c8:focus-visible, - .c8 > a:focus-visible { + .c8 > a:focus-visible, + .c8:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -2955,7 +2959,8 @@ exports[`snapshots renders a single select input 1`] = ` } .c3:focus-visible, - .c3 > a:focus-visible { + .c3 > a:focus-visible, + .c3:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; @@ -3408,7 +3413,8 @@ exports[`snapshots renders with a custom text input component 1`] = ` } .c3:focus-visible, - .c3 > a:focus-visible { + .c3 > a:focus-visible, + .c3:focus.focus-visible { outline: none; border: 2 solid; box-shadow: 0 0 0 2px #0969da; From 4c061fd2f6505e0b76aaa2be672d19070f6eab0d Mon Sep 17 00:00:00 2001 From: Pavithra Kodmad Date: Thu, 25 Jan 2024 21:05:01 +1100 Subject: [PATCH 03/10] Create purple-bees-warn.md --- .changeset/purple-bees-warn.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/purple-bees-warn.md diff --git a/.changeset/purple-bees-warn.md b/.changeset/purple-bees-warn.md new file mode 100644 index 00000000000..1e55fd81730 --- /dev/null +++ b/.changeset/purple-bees-warn.md @@ -0,0 +1,5 @@ +--- +"@primer/react": patch +--- + +Fix focus styles in ActionList Item to support more than focus-visible From a653c2c384096fc43096c137056a3777ebe29fc6 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 29 Jan 2024 11:02:54 -0600 Subject: [PATCH 04/10] chore(deps-dev): bump @babel/cli from 7.22.10 to 7.23.9 (#4189) Bumps [@babel/cli](https://github.com/babel/babel/tree/HEAD/packages/babel-cli) from 7.22.10 to 7.23.9. - [Release notes](https://github.com/babel/babel/releases) - [Changelog](https://github.com/babel/babel/blob/main/CHANGELOG.md) - [Commits](https://github.com/babel/babel/commits/v7.23.9/packages/babel-cli) --- updated-dependencies: - dependency-name: "@babel/cli" dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package-lock.json | 20 +++++++++++++------- package.json | 2 +- 2 files changed, 14 insertions(+), 8 deletions(-) diff --git a/package-lock.json b/package-lock.json index 4dd94743758..01031cce9ce 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@primer/react", - "version": "36.5.0", + "version": "36.6.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@primer/react", - "version": "36.5.0", + "version": "36.6.0", "license": "MIT", "dependencies": { "@github/combobox-nav": "^2.1.5", @@ -41,7 +41,7 @@ }, "devDependencies": { "@actions/core": "1.10.1", - "@babel/cli": "7.22.10", + "@babel/cli": "7.23.9", "@babel/core": "7.23.7", "@babel/eslint-parser": "7.23.3", "@babel/parser": "7.23.6", @@ -270,14 +270,14 @@ } }, "node_modules/@babel/cli": { - "version": "7.22.10", - "resolved": "https://registry.npmjs.org/@babel/cli/-/cli-7.22.10.tgz", - "integrity": "sha512-rM9ZMmaII630zGvtMtQ3P4GyHs28CHLYE9apLG7L8TgaSqcfoIGrlLSLsh4Q8kDTdZQQEXZm1M0nQtOvU/2heg==", + "version": "7.23.9", + "resolved": "https://registry.npmjs.org/@babel/cli/-/cli-7.23.9.tgz", + "integrity": "sha512-vB1UXmGDNEhcf1jNAHKT9IlYk1R+hehVTLFlCLHBi8gfuHQGP6uRjgXVYU0EVlI/qwAWpstqkBdf2aez3/z/5Q==", "dev": true, "dependencies": { "@jridgewell/trace-mapping": "^0.3.17", "commander": "^4.0.1", - "convert-source-map": "^1.1.0", + "convert-source-map": "^2.0.0", "fs-readdir-recursive": "^1.1.0", "glob": "^7.2.0", "make-dir": "^2.1.0", @@ -298,6 +298,12 @@ "@babel/core": "^7.0.0-0" } }, + "node_modules/@babel/cli/node_modules/convert-source-map": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz", + "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==", + "dev": true + }, "node_modules/@babel/code-frame": { "version": "7.23.5", "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.23.5.tgz", diff --git a/package.json b/package.json index f1ac58bce5b..4756e4ef067 100644 --- a/package.json +++ b/package.json @@ -126,7 +126,7 @@ }, "devDependencies": { "@actions/core": "1.10.1", - "@babel/cli": "7.22.10", + "@babel/cli": "7.23.9", "@babel/core": "7.23.7", "@babel/eslint-parser": "7.23.3", "@babel/parser": "7.23.6", From 58e9deeb20540d6239d545ec32ae59ed1d22eeab Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 29 Jan 2024 11:03:18 -0600 Subject: [PATCH 05/10] chore(deps-dev): bump terser from 5.17.6 to 5.27.0 (#4187) Bumps [terser](https://github.com/terser/terser) from 5.17.6 to 5.27.0. - [Changelog](https://github.com/terser/terser/blob/master/CHANGELOG.md) - [Commits](https://github.com/terser/terser/compare/v5.17.6...v5.27.0) --- updated-dependencies: - dependency-name: terser dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package-lock.json | 24 ++++++++++++------------ package.json | 2 +- 2 files changed, 13 insertions(+), 13 deletions(-) diff --git a/package-lock.json b/package-lock.json index 01031cce9ce..dcac212ec51 100644 --- a/package-lock.json +++ b/package-lock.json @@ -171,7 +171,7 @@ "storybook": "7.6.2", "storybook-addon-turbo-build": "2.0.1", "styled-components": "5.3.11", - "terser": "5.17.6", + "terser": "5.27.0", "ts-toolbelt": "9.6.0", "tsx": "4.6.2", "typescript": "5.2.2", @@ -5449,9 +5449,9 @@ } }, "node_modules/@jridgewell/source-map": { - "version": "0.3.2", - "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.2.tgz", - "integrity": "sha512-m7O9o2uR8k2ObDysZYzdfhb08VuEml5oWGiosa1VdaPZ/A6QyPkAJuwN0Q1lhULOf6B7MtQmHENS743hWtCrgw==", + "version": "0.3.5", + "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.5.tgz", + "integrity": "sha512-UTYAUj/wviwdsMfzoSJspJxbkH5o1snzwX0//0ENX1u/55kkZZkcTZP6u9bwKGkv+dkk9at4m1Cpt0uY80kcpQ==", "dev": true, "dependencies": { "@jridgewell/gen-mapping": "^0.3.0", @@ -38293,13 +38293,13 @@ } }, "node_modules/terser": { - "version": "5.17.6", - "resolved": "https://registry.npmjs.org/terser/-/terser-5.17.6.tgz", - "integrity": "sha512-V8QHcs8YuyLkLHsJO5ucyff1ykrLVsR4dNnS//L5Y3NiSXpbK1J+WMVUs67eI0KTxs9JtHhgEQpXQVHlHI92DQ==", + "version": "5.27.0", + "resolved": "https://registry.npmjs.org/terser/-/terser-5.27.0.tgz", + "integrity": "sha512-bi1HRwVRskAjheeYl291n3JC4GgO/Ty4z1nVs5AAsmonJulGxpSektecnNedrwK9C7vpvVtcX3cw00VSLt7U2A==", "dev": true, "dependencies": { - "@jridgewell/source-map": "^0.3.2", - "acorn": "^8.5.0", + "@jridgewell/source-map": "^0.3.3", + "acorn": "^8.8.2", "commander": "^2.20.0", "source-map-support": "~0.5.20" }, @@ -38432,9 +38432,9 @@ } }, "node_modules/terser/node_modules/acorn": { - "version": "8.8.1", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.1.tgz", - "integrity": "sha512-7zFpHzhnqYKrkYdUjF1HI1bzd0VygEGX8lFk4k5zVMqHEoES+P+7TKI+EvLO9WVMJ8eekdO0aDEK044xTXwPPA==", + "version": "8.11.3", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz", + "integrity": "sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==", "dev": true, "bin": { "acorn": "bin/acorn" diff --git a/package.json b/package.json index 4756e4ef067..77e91f76caa 100644 --- a/package.json +++ b/package.json @@ -256,7 +256,7 @@ "storybook": "7.6.2", "storybook-addon-turbo-build": "2.0.1", "styled-components": "5.3.11", - "terser": "5.17.6", + "terser": "5.27.0", "ts-toolbelt": "9.6.0", "tsx": "4.6.2", "typescript": "5.2.2", From 262352d7e86b31af664f7950d4f2f5e307a01f3c Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 29 Jan 2024 11:03:39 -0600 Subject: [PATCH 06/10] chore(deps-dev): bump @storybook/source-loader from 7.6.7 to 7.6.10 (#4186) Bumps [@storybook/source-loader](https://github.com/storybookjs/storybook/tree/HEAD/code/lib/source-loader) from 7.6.7 to 7.6.10. - [Release notes](https://github.com/storybookjs/storybook/releases) - [Changelog](https://github.com/storybookjs/storybook/blob/next/CHANGELOG.md) - [Commits](https://github.com/storybookjs/storybook/commits/v7.6.10/code/lib/source-loader) --- updated-dependencies: - dependency-name: "@storybook/source-loader" dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> --- package-lock.json | 40 ++++++++++++++++++++-------------------- package.json | 2 +- 2 files changed, 21 insertions(+), 21 deletions(-) diff --git a/package-lock.json b/package-lock.json index dcac212ec51..710a898448b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -76,7 +76,7 @@ "@storybook/jest": "0.2.3", "@storybook/react": "7.6.2", "@storybook/react-webpack5": "7.6.2", - "@storybook/source-loader": "7.6.7", + "@storybook/source-loader": "7.6.10", "@storybook/test-runner": "0.16.0", "@storybook/testing-library": "0.2.2", "@storybook/theming": "7.6.4", @@ -13202,13 +13202,13 @@ } }, "node_modules/@storybook/source-loader": { - "version": "7.6.7", - "resolved": "https://registry.npmjs.org/@storybook/source-loader/-/source-loader-7.6.7.tgz", - "integrity": "sha512-11uWYZwHyOMtC1vTh9AHDTh1ab1uUTeg1ZuqWJVSNSIfKNzDzeiWeqoWluzv6v3nQ5zNoMLqy8QOxbKeLiBDVw==", + "version": "7.6.10", + "resolved": "https://registry.npmjs.org/@storybook/source-loader/-/source-loader-7.6.10.tgz", + "integrity": "sha512-S3nOWyj+sdpsqJqKGIN3DKE1q+Q0KYxEyPlPCawMFazozUH7tOodTIqmHBqJZCSNqdC4M1S/qcL8vpP4PfXhuA==", "dev": true, "dependencies": { "@storybook/csf": "^0.1.2", - "@storybook/types": "7.6.7", + "@storybook/types": "7.6.10", "estraverse": "^5.2.0", "lodash": "^4.17.21", "prettier": "^2.8.0" @@ -13219,13 +13219,13 @@ } }, "node_modules/@storybook/source-loader/node_modules/@storybook/channels": { - "version": "7.6.7", - "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-7.6.7.tgz", - "integrity": "sha512-u1hURhfQHHtZyRIDUENRCp+CRRm7IQfcjQaoWI06XCevQPuhVEtFUfXHjG+J74aA/JuuTLFUtqwNm1zGqbXTAQ==", + "version": "7.6.10", + "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-7.6.10.tgz", + "integrity": "sha512-ITCLhFuDBKgxetuKnWwYqMUWlU7zsfH3gEKZltTb+9/2OAWR7ez0iqU7H6bXP1ridm0DCKkt2UMWj2mmr9iQqg==", "dev": true, "dependencies": { - "@storybook/client-logger": "7.6.7", - "@storybook/core-events": "7.6.7", + "@storybook/client-logger": "7.6.10", + "@storybook/core-events": "7.6.10", "@storybook/global": "^5.0.0", "qs": "^6.10.0", "telejson": "^7.2.0", @@ -13237,9 +13237,9 @@ } }, "node_modules/@storybook/source-loader/node_modules/@storybook/client-logger": { - "version": "7.6.7", - "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-7.6.7.tgz", - "integrity": "sha512-A16zpWgsa0gSdXMR9P3bWVdC9u/1B1oG4H7Z1+JhNzgnL3CdyOYO0qFSiAtNBso4nOjIAJVb6/AoBzdRhmSVQg==", + "version": "7.6.10", + "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-7.6.10.tgz", + "integrity": "sha512-U7bbpu21ntgePMz/mKM18qvCSWCUGCUlYru8mgVlXLCKqFqfTeP887+CsPEQf29aoE3cLgDrxqbRJ1wxX9kL9A==", "dev": true, "dependencies": { "@storybook/global": "^5.0.0" @@ -13250,9 +13250,9 @@ } }, "node_modules/@storybook/source-loader/node_modules/@storybook/core-events": { - "version": "7.6.7", - "resolved": "https://registry.npmjs.org/@storybook/core-events/-/core-events-7.6.7.tgz", - "integrity": "sha512-KZ5d03c47pnr5/kY26pJtWq7WpmCPXLbgyjJZDSc+TTY153BdZksvlBXRHtqM1yj2UM6QsSyIuiJaADJNAbP2w==", + "version": "7.6.10", + "resolved": "https://registry.npmjs.org/@storybook/core-events/-/core-events-7.6.10.tgz", + "integrity": "sha512-yccDH67KoROrdZbRKwxgTswFMAco5nlCyxszCDASCLygGSV2Q2e+YuywrhchQl3U6joiWi3Ps1qWu56NeNafag==", "dev": true, "dependencies": { "ts-dedent": "^2.0.0" @@ -13263,12 +13263,12 @@ } }, "node_modules/@storybook/source-loader/node_modules/@storybook/types": { - "version": "7.6.7", - "resolved": "https://registry.npmjs.org/@storybook/types/-/types-7.6.7.tgz", - "integrity": "sha512-VcGwrI4AkBENxkoAUJ+Z7SyMK73hpoY0TTtw2J7tc05/xdiXhkQTX15Qa12IBWIkoXCyNrtaU+q7KR8Tjzi+uw==", + "version": "7.6.10", + "resolved": "https://registry.npmjs.org/@storybook/types/-/types-7.6.10.tgz", + "integrity": "sha512-hcS2HloJblaMpCAj2axgGV+53kgSRYPT0a1PG1IHsZaYQILfHSMmBqM8XzXXYTsgf9250kz3dqFX1l0n3EqMlQ==", "dev": true, "dependencies": { - "@storybook/channels": "7.6.7", + "@storybook/channels": "7.6.10", "@types/babel__core": "^7.0.0", "@types/express": "^4.7.0", "file-system-cache": "2.3.0" diff --git a/package.json b/package.json index 77e91f76caa..9f4f0736c6a 100644 --- a/package.json +++ b/package.json @@ -161,7 +161,7 @@ "@storybook/jest": "0.2.3", "@storybook/react": "7.6.2", "@storybook/react-webpack5": "7.6.2", - "@storybook/source-loader": "7.6.7", + "@storybook/source-loader": "7.6.10", "@storybook/test-runner": "0.16.0", "@storybook/testing-library": "0.2.2", "@storybook/theming": "7.6.4", From 5d47efb15de4053954ecfa14462fda7a89873f88 Mon Sep 17 00:00:00 2001 From: Owen Niblock Date: Mon, 29 Jan 2024 17:08:25 +0000 Subject: [PATCH 07/10] Improve aria-labels for example icon buttons and add guidance (#4191) * Improve aria-labels for example icon buttons and add guidance * test(vrt): update snapshots --------- Co-authored-by: joshblack --- ...utton-Playground-dark-colorblind-linux.png | Bin 5455 -> 6055 bytes ...conButton-Playground-dark-dimmed-linux.png | Bin 5470 -> 6015 bytes ...on-Playground-dark-high-contrast-linux.png | Bin 5503 -> 6021 bytes .../IconButton-Playground-dark-linux.png | Bin 5455 -> 6055 bytes ...utton-Playground-dark-tritanopia-linux.png | Bin 5455 -> 6055 bytes ...tton-Playground-light-colorblind-linux.png | Bin 5554 -> 6101 bytes ...n-Playground-light-high-contrast-linux.png | Bin 5579 -> 6157 bytes .../IconButton-Playground-light-linux.png | Bin 5554 -> 6105 bytes ...tton-Playground-light-tritanopia-linux.png | Bin 5554 -> 6101 bytes src/Button/IconButton.docs.json | 6 ++++++ src/Button/IconButton.features.stories.tsx | 14 +++++++------- src/Button/IconButton.stories.tsx | 6 +++--- 12 files changed, 16 insertions(+), 10 deletions(-) diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-colorblind-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-colorblind-linux.png index 678cdcf2d27be2171531d3edf68f675a2be5a059..8da124c94e26c0ab991c5287275ee095cc975938 100644 GIT binary patch delta 1553 zcmZuxc~BE~6sAf=hbh<*VX7Q!={m}@B~2vWV2BWV?|QtW^{(IN_sfL|j~c4X4YHFN z-e=2<ahI=B04Ga0GIb(xU4Ot zcX%h(A0|-9WDR#5u)n`QEjKrJWnM*OFhcblI+xql))uaIe{r8sTV=Zu@s#DSjJf0^ zWwBn5jELYkJ)IU66-8sS+3t7#%CG7`PR4)*Ag*0M<>gS(d8EX|0Z7|h_2@480U=NO zFg5KQw*`qWmalk%q*r|nWu-3XdPqB+c>ch^UP6I++Mt0i$}R7^qt8Kfq`$vOAZ^~- zQg^#;c{w#TRkg%^&%gG_zbi2{)aoanmqB_y9*vG) ztA(cJWUc_7nuDB$C?a4lmSMs~TzxGW3x!PDK4b8QfHe=0l1tRfP#;1)$dg+2R;MMT zp2LxL%<-*ijWoB^HWk9-a9}H1jN%sTCW)zkO`%9D{5=`tAQN%0v~=(==1aAW6;y5n ze1tbnA4jpqmWUZ`^R~+h#IC7=m=n43CO%*33XG3~mvuyV8-~Yg3bj>*+6NW-I~q%u zG1wP?Zwnm(Yu*u(oGz^Q1sSt!3BACTwmVi-cWYe+oacJEB}qZlSox|J`oi`uy2i=;a`*A*89PNm0SK^=|J%*XGEvVPRnqLSkl5eFJJ6YBL^nX<-K% zXI}7CULB#3v&H7-5xCQ7Twux5AY+@mkgm9BeXTNA^ZI2PLoi)}8rqo8exelZyWS<;D6miSH zRYR{r##d=s?rFG8G@Xe9=S9Y*B5-UR%O4U51W0#x_gO{WNw-sgornM3Qs?T@6yU}L z?{K*A!KEoVvxEw8F+rKJ(^S@5tEz>GxREOc6&@#9w129A!^HY=2&q?#Q-D*=rApgG?JSvl zayn2hF-)wiqjL*sf7{Pr68`!hgA6C)@&9j;H5*8vsK@xaPg{mPGd5R8diDnlxz@En WjE$|hrwt(Hk?`5+WBgApe)k6>5>G$? delta 940 zcmZ3ke_m^XLAofXr;B4q#hkZy59ZBD7j1ZGyfHR%o07kZQ;nGWvI}u6y4nk_ z3!mx@(V3igde#P&+_DnmIEzg})`yk2xVW}#wek6*b$;{TrSIpwT|M*vZ}IE-ccSGk#XWo2b%m0#w}pMU=4%a?1yR$JP| z<$lQls$LNpv%fIA_NMc?*xhFGbw9dq-u|87H*fBln>TN+xjx0_QPn+6bclXr%ELv;~)Vv@`*|Gljx4Dt$ljhl4-#p@H|LVbm0x}s`E5E%-`S#6j22ki)8WRJpz|RU-NIazx~|Xy`eMUeOo({Jwrh{a+rS zDL)dU`G3vazBuj-Gtj?BV>+YXU4LD^7pR9}%bv;cFYec**QMR7S`PF!M6G%9zq9*q zc2|M;FSkj30owI{|FJ)_-(UIv_hYj8U63*TH?l7L|2jMW*@F)W|2|y}&$s>k>0oo^ zrzatrWxNiMT+h0?VF?4ZbQg@{FoKD zr^1dsy60CjBw5MGbAx<)&tH0{$orR<-=`VAj+E0)&(DAV|C8U}q>VH7?%fL#FnnG4 z>&x!m^FXx?T}Qu4Z@)I%>dlJ`%hOMbzJ33m4g|r+&z)I)`a94u=^|UBex`!c(ml6k sP~hI+yT5R=AV)p_W(SVVjAAe1k2jq2>nOed${`MA?epnY%w9w5byrH=% zHsw!PvrV6b$2aNAopic9u}VTStEP{_Gu1cr6^Vc{L_e$%H#e*AHgr^EjgFWMg}cO} zWQa^A>(4ni2m}HuDoTYt)!F@lWkU7*$#_+7Z?QgQ8K7=|@&WIz6w8re8iRHV4LI58>dzrFIJqBRt*^$8jb^h(v5ML#aCcDQ;tCpJRghU)*?!)9h>XVb8Y zubCxV07fpP@6*I+hi_qRJ+hvUq_YL1W{_Gp`{@CkU#AUXLo0*;SdB{N~HZeNGyFWxBmhhFvybaLrRpyaa!33-gxl+vHCaZiU%=>(R;X1^{bf~!$KP$eJRXTu^K+9 zb1SBwdS1kjr)5*v{lvNIcywgsa((_f5ZQSqamva#K zc|4JhS^K&YfPLV;dX~bhg##L1m>kX7mfvx0x z>|*HnPUYFY`e4F!NF*OK9}(jK{2(FP2|d9G9^jOLSAm|Y=}o#TlJ z6{Vo5OfE_XoaP@x(KfTFmW0e@($2Ytr3q{<*C=;3M#fXQKowMCbi|)o)l(RF-xL~5 zH`Q(MzLZT1$h7jJ3u~fMh?rg5=;+Ugu4!pm)hP=Dq)pb-hz8R(Vott8HAuRJ`gB~0 zT)vyaeH-w+lc4eqO#robpfe0SOdmh0mbCbcR3_~O9lclA>f08q=|jcxpc9tom1-Dt zx+-=@Nnf1p#lXOTMFQ;q7P|}j*kO(Uvht`-`9`)tX!gmZyu2XSM=3@ANk{C@UrV}J z++eGYxLbi0;%$q$;J7Tled-PgUL2|;A!kP1R{d4(xL|?nrM4Yc)ePSM{}Xu4f3GO> zX`5SG`!{<-RXUw6*4hm%9A>+~+5%-|kD8QMl@F~D(7aPP-CKJ`uWNngifJz$M|Qsq zB1U5h{8i&ymzYPFG4jwqNzxA7fU;hOVhbo5v delta 944 zcmeybcTa1AL7u3Dr;B4q#hkZy&v)NRmp$+?z07Q8Z(_NaNVev}qut`aow=@7FP!0g z(SGYBXNM2`0Rl;H9lwY;c?64W+THd>#oAgfD@noh?54{n_q}{wTKnL4&ARtL>*lAc z+5f#+y_%7MfniC`-gh9nVYBdLL-x@6ZP$NpxV!h~joI(}Pj8-UIM?s`&lekG^o~D1 z`q9Fs!k~|j|Jtt{p!yY&-WT$7b9>G2?=sVioz;8v(Zz}%?-y^3T6^u|i*&WgCujIA zf81_gmHg)H_v3qammhoi@@3R_kVRcvYl{9qi@ts=B|F=urozO}&+nSt=j0xs)?+8@ zPoAv!@gc+K-*09npyHbNxz;brzdwuLKhxeW?zqkRl)@Stkaa*O9{a`uG_Cu|9moCV z_vO2fE-pP&qz0rmn%}?wV;@j+f#4kL7y9SRjuq{UIj)nw3FwQbH_sjW&I;1@;EtpH zT)+L3jX&Q{+Zwg@uUak0Qy&=ZfuSH?zo3`xZ_Pe?yFV|&|Cj$g++Sx|_ve_unS~%w zkx8z}i}ic|p8N4*a(w^m`Tw4^ZUvHMHGfW)I`RYM*C$j@o?ZL#=i0)zZ_AJEe*ZtI z$MD!$>HX5lHL{=I@B4r7$LsjKUVXd$TTe~|Dp$x{>}Y>X!aTpm?3l#)MRh$VH_xcA z-^B)$+H>bvb6t=4;o_D|OGDy6p8z^r7@89;1?f37?)c?CIA0M&1 z^6}=6SN~Q&Ui~{huSf-`s@~&P#s&Sp{{4o}=2zX60-0|w{$v`+>IXV3AahtatAHej z&=(*nQ1Wg;yx#O=qnT@xry0-mQA^$#lUEZDl-a>?PWDT``0-?`x$8huz$EeUQN`om zz^FaoTJUaxJupS3ZPtE0$RK}hV>gQBOtq{3jHO=Qo_bLXs{RjO{DJNM(0 zlSwkNaydEvAhSKL6=~iBrL0$9N@Dizvfj3RJ1{!GPCl8Elb_$eI=uWiP~y(+>h!lD zcRL*YW+hitRb}<=-cH-H@6VF+_t}@N`;+kY`K#%tpH}R#ko*7Zd2RkPU|#rfPaxX+ xf_-U8g~B!zC4#CL@Y}#V~8P6*|nsvo+w=d9822WQ%mvv4FO#t#u)VTlv diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-dark-high-contrast-linux.png index 4250d1c091ac2aadb49bf9bf5cfd3a555222d11d..a6ce76707cd78e8bd6a75df2dcb6712df4b39892 100644 GIT binary patch delta 1519 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 WjE$|hrwt(Hk?`5+WBgApe)k6>5>G$? delta 940 zcmZ3ke_m^XLAofXr;B4q#hkZy59ZBD7j1ZGyfHR%o07kZQ;nGWvI}u6y4nk_ z3!mx@(V3igde#P&+_DnmIEzg})`yk2xVW}#wek6*b$;{TrSIpwT|M*vZ}IE-ccSGk#XWo2b%m0#w}pMU=4%a?1yR$JP| z<$lQls$LNpv%fIA_NMc?*xhFGbw9dq-u|87H*fBln>TN+xjx0_QPn+6bclXr%ELv;~)Vv@`*|Gljx4Dt$ljhl4-#p@H|LVbm0x}s`E5E%-`S#6j22ki)8WRJpz|RU-NIazx~|Xy`eMUeOo({Jwrh{a+rS zDL)dU`G3vazBuj-Gtj?BV>+YXU4LD^7pR9}%bv;cFYec**QMR7S`PF!M6G%9zq9*q zc2|M;FSkj30owI{|FJ)_-(UIv_hYj8U63*TH?l7L|2jMW*@F)W|2|y}&$s>k>0oo^ zrzatrWxNiMT+h0?VF?4ZbQg@{FoKD zr^1dsy60CjBw5MGbAx<)&tH0{$orR<-=`VAj+E0)&(DAV|C8U}q>VH7?%fL#FnnG4 z>&x!m^FXx?T}Qu4Z@)I%>dlJ`%hOMbzJ33m4g|r+&z)I)`a94u=^|UBex`!c(ml6k sP~hI+yT5R=AV)p_W(SVVjAAe1k2jq2>!={m}@B~2vWV2BWV?|QtW^{(IN_sfL|j~c4X4YHFN z-e=2<ahI=B04Ga0GIb(xU4Ot zcX%h(A0|-9WDR#5u)n`QEjKrJWnM*OFhcblI+xql))uaIe{r8sTV=Zu@s#DSjJf0^ zWwBn5jELYkJ)IU66-8sS+3t7#%CG7`PR4)*Ag*0M<>gS(d8EX|0Z7|h_2@480U=NO zFg5KQw*`qWmalk%q*r|nWu-3XdPqB+c>ch^UP6I++Mt0i$}R7^qt8Kfq`$vOAZ^~- zQg^#;c{w#TRkg%^&%gG_zbi2{)aoanmqB_y9*vG) ztA(cJWUc_7nuDB$C?a4lmSMs~TzxGW3x!PDK4b8QfHe=0l1tRfP#;1)$dg+2R;MMT zp2LxL%<-*ijWoB^HWk9-a9}H1jN%sTCW)zkO`%9D{5=`tAQN%0v~=(==1aAW6;y5n ze1tbnA4jpqmWUZ`^R~+h#IC7=m=n43CO%*33XG3~mvuyV8-~Yg3bj>*+6NW-I~q%u zG1wP?Zwnm(Yu*u(oGz^Q1sSt!3BACTwmVi-cWYe+oacJEB}qZlSox|J`oi`uy2i=;a`*A*89PNm0SK^=|J%*XGEvVPRnqLSkl5eFJJ6YBL^nX<-K% zXI}7CULB#3v&H7-5xCQ7Twux5AY+@mkgm9BeXTNA^ZI2PLoi)}8rqo8exelZyWS<;D6miSH zRYR{r##d=s?rFG8G@Xe9=S9Y*B5-UR%O4U51W0#x_gO{WNw-sgornM3Qs?T@6yU}L z?{K*A!KEoVvxEw8F+rKJ(^S@5tEz>GxREOc6&@#9w129A!^HY=2&q?#Q-D*=rApgG?JSvl zayn2hF-)wiqjL*sf7{Pr68`!hgA6C)@&9j;H5*8vsK@xaPg{mPGd5R8diDnlxz@En WjE$|hrwt(Hk?`5+WBgApe)k6>5>G$? delta 940 zcmZ3ke_m^XLAofXr;B4q#hkZy59ZBD7j1ZGyfHR%o07kZQ;nGWvI}u6y4nk_ z3!mx@(V3igde#P&+_DnmIEzg})`yk2xVW}#wek6*b$;{TrSIpwT|M*vZ}IE-ccSGk#XWo2b%m0#w}pMU=4%a?1yR$JP| z<$lQls$LNpv%fIA_NMc?*xhFGbw9dq-u|87H*fBln>TN+xjx0_QPn+6bclXr%ELv;~)Vv@`*|Gljx4Dt$ljhl4-#p@H|LVbm0x}s`E5E%-`S#6j22ki)8WRJpz|RU-NIazx~|Xy`eMUeOo({Jwrh{a+rS zDL)dU`G3vazBuj-Gtj?BV>+YXU4LD^7pR9}%bv;cFYec**QMR7S`PF!M6G%9zq9*q zc2|M;FSkj30owI{|FJ)_-(UIv_hYj8U63*TH?l7L|2jMW*@F)W|2|y}&$s>k>0oo^ zrzatrWxNiMT+h0?VF?4ZbQg@{FoKD zr^1dsy60CjBw5MGbAx<)&tH0{$orR<-=`VAj+E0)&(DAV|C8U}q>VH7?%fL#FnnG4 z>&x!m^FXx?T}Qu4Z@)I%>dlJ`%hOMbzJ33m4g|r+&z)I)`a94u=^|UBex`!c(ml6k sP~hI+yT5R=AV)p_W(SVVjAAe1k2jq2>&P+~8blz`R%9^?2n7j}Cu_h29*~fom%jL?Kkhwu?)mO_&iU@S_i5O_ z+iq+J14`l!?mLlPIXiNs<{>BX#R4RXW=77^D!$QfI8nGiLHl(6_0PxC@P{{be%`YE z+7Fwv&Taa==s`wYVfnY?s}9}F(q=69pU=zt<@DZbTTbM8KYrCywy`!Q>fFP=ElSZF zLcLFQ{Y!@Za7^DZ+N7s6vYNF z*Ndt}SFt#CcejPAleK>3BwbABr>iRo#E#(L z3cb1`5mA*&M{*PvM>m7g6)2{lhl^ca=s2d#^TIN`g3OeZqV{CJb-T8A1XCI=M0+63 z6RlT~{*NDx?;BD=vIwDJVZ-|VkB=iHK4=gP=&fIGW*Lg8TG(0OG#bbUkUu{w1y(i^Oyi~t&*wGdXnsgvi>o!UX=6TzsS$(TA0x@YW4 zCUQ=m1@VDVv5(#nPsg)!4G9drx+7Z(}khVkO z{ySi*3Vxm$#GSZFC1s|PdCr@JUuW)dm$u1MgO)Y1dNyKN4L}M3pPXgANu|?u#x-b} z-!c2HBE=ybm4~kQJ#x?fSmG)aiMY-PwkQEI$?Y#B$dFR$dds4dV7?VbZ_Ql;Xh5NS zr-Ex@t2*3^_4@cEcUVQ+#!opq*wYkivqs~Kr@7B7HA>^VhLlUWa4y4*@PXb#SUm}r zFLj}J(rlR@^$dH5Mvx^PL>uMugP*|tZWux=>&ULfM=ri~F42Sx>+na8L=#V)5--|I z6t<43)u6QtRMBy0xLYx#Y25nVJ8=|OC(dO=HM2Ha`OeYUDenTm^no)d2l#JVIrXV{?aNGmRJ#F#_Md)3EYg#xmIV0#wH$yp8-e3 zw5mWhZ{&Yae4Dx3J_NFoqB!fCS#rx?P6RT*%X&~$!gtkA~@q+EYDcHg4WWi8ft1P%w3$ z6D)dC|2*|lj!6X!js#b=Cr23!hEK~19nVBVZoScmaCBr%i*2m-jHjP(mH8L7kMaC$ z4#fy%TTX9@xR1nn&$aSC93$_Fr*qpY$(gBh;D?vZ3&JG4!c+_mZSAzfkE6CGP3V3w81DS_x|fh{}&6~i8sf&Of!d2r9}u&^*G2+4=|FXx8j{1oUK zXG#f*s3dMiF-4H97L$m=w)q}f_Dk=;-DnqMw#ICl4k&7`sjE{LhRTVMQ`bevbeL;u zYuT>^$Ij4oF+`5>j!)z}Qm&P@t0il;yt=yDw+hV-vnKFsGt?xL#jsc`sa#GD%r+`N zeRHz(VN`H#nNWx~r=h?v{v7J@sDzQ_2Q*7Jc;|e1doT8>zk~fN@wXgY0aJ*&FmZ>D K9<1Ac_R4>N$yI~^ delta 1041 zcmW-fdraC_6vxpft^h%ovS-J-_v)tdOZAYZHhbFO?uA8;zw{BQ@gPfry|5d=|RTw6{lY>CF!7dVLQ zyk{IG>*|Q=*5}iqB|W4^j|hcASgVEXUaaW?!eBRkjn2-_rlh9o(fVS~ARSY4Es{8J z)geY=;3z*jvzIe14I3qM1Fu7-`dqkD@XM;h@zpRBk_wB1Ynto?fMcq&wgKkI2!q5h1o&FK@`{kzE?3hT-yJSdD zPsbzQCRt1?w>FrnteKga0$J?ewUdL_`EUhWITjRX8Jn+c>e;YnEFLI}G zm+TMsH6ytYFH#%b@{45AwUD>Fyj^t=P&u194ng>DohNMP(`Xc+1=iWZP=P&o_k}!Q?uDJcboq1a? ztDyqK`f=^@VISB`NDgiT^Xj_}(146nhJ6IWM+Q)7WhJPuc{;Pb1~#Mh$_0NFplC^@ zsoTjuN^D%HZR&SOBoenZ`UhqQZJ4MKv^eEj&dLkL{Cd*{=j7b_PL-O&vvc=4OS@!% zIy$m+?CkZOCseOrrkFnoH&Q)|OOqITFMPDJhn2VawtGD2^Lv<){2>I%qtSZ9;jr0a zarwMp!u$LC(aVUG1&irdLe*T`)pWD-W$>;?rZWZ{y^sP%$Jo$}7q~-Bx9E`%8TsC; zL&o|{7qeG)7s@AE1+2_-k5xtwc#*uO;TV+7eLnpI&yDz83*~N~*Si|>d$=yETEi&@ zS<4!8V@2tFW^$FZ1OGe;j!PIP!t#W=xMTwqC&5#?6!`ZxAQ4WNl%5zqe*W73gCZln diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-high-contrast-linux.png index 23381372f26b2faa7cc6fc7aa33197b093305f72..98b75993318ef4a9929458708e72b00ee5c826b1 100644 GIT binary patch delta 1668 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 ZqgPhOUow9QR6-){PEG%y?fvXi{{XE2YSsV% delta 1041 zcmW-fdraF^6vqooV2H6!Gl_MJQQ^&>}B^b^|)M{>T>7 zMdvz27#;MnEoLKBh}4GG?ze&l2=>?CuX7e!+F4*iOMy15(9*ZJ{Bd*cx!=z@_ug}k znKE|hW_Ihr=2ORymUj(qKK)oIX1zYKwf>Q%Vd^#Z=ew^kp`auZ>MfetydbBBs^IUd$AFDEf zKp>nnYvz-IC3KecOeTB^7ijf=&Q*-+15TxyAMTpf*|ViYs;xcZPD2J3<;09N|Z2_Hw4DV`F4);8n=fn5U?Me_3@nz8qmf54DY zV4+DKF*nE5LoX_!AluJF%Tr7YMST)KhFY)tQ_hBrMO(WS_E}Q8ZRIqeZ~pc~ zCKd6#qWksie}!;>)#s~?*l?h96URL=sk+!XRRlb%C}*oTXq3BlUWi3;==?j{9V~=e zJMO20gWa}5Vt`Q_nVa7zEe3wb-SNgY1TReyulpJ9f8aG8bNlD7V;}_xOy0(?yx>49 ze&kU^X^|8M(I+0qJt2Az78Z@^dI6T%pd{-!xA*Zqf4Nte1Q`o+C7u86%-i}Ymm*wW z9Tgzf59^l?`M_pEd|(@xm)~}P24tQz>?069Fn~%ct3Z9t(^;K$3NzZMT<})|ik4iK zww>am#Kwi%p?-@*B5~WJe_(ddhKWkJ%_-AzR-Vh}*IPC?C+607s?{8xox9gr+64pD z)s?Md=dABMrh5HS`TPk*Gu5-WG>NhI!pExmSoxc8x*r97eh)KJFpMDiG+KW+95!1l zE}s`n_~76mdJ&PZ6e9YiP%YPXIm7IH5xnbx>9heyYf{1J7@J!0LU*X;20ijVqriK4 z*w~omV)pB9K?OuB%*s0ZP-XOh7s=|HjzT%yXVc&F+=$P$P~rA@y{jR=hwHMcHJlQV zwY)hmR+R3iCRb@E@XwJHHT%CHDi#x`;!+GyoET5-k>lUlfJ8V|T6TQo*tskJ11MS~ A4gdfE diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-tritanopia-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Playground-light-tritanopia-linux.png index 8eb9badcadc8556fa9da54e213cb2f6247b2fa22..df8513d7dc90def31a88539ef21713517025e4a2 100644 GIT binary patch delta 1606 zcmYLJX;4#F6pn+KX(^&P+~8blz`R%9^?2n7j}Cu_h29*~fom%jL?Kkhwu?)mO_&iU@S_i5O_ z+iq+J14`l!?mLlPIXiNs<{>BX#R4RXW=77^D!$QfI8nGiLHl(6_0PxC@P{{be%`YE z+7Fwv&Taa==s`wYVfnY?s}9}F(q=69pU=zt<@DZbTTbM8KYrCywy`!Q>fFP=ElSZF zLcLFQ{Y!@Za7^DZ+N7s6vYNF z*Ndt}SFt#CcejPAleK>3BwbABr>iRo#E#(L z3cb1`5mA*&M{*PvM>m7g6)2{lhl^ca=s2d#^TIN`g3OeZqV{CJb-T8A1XCI=M0+63 z6RlT~{*NDx?;BD=vIwDJVZ-|VkB=iHK4=gP=&fIGW*Lg8TG(0OG#bbUkUu{w1y(i^Oyi~t&*wGdXnsgvi>o!UX=6TzsS$(TA0x@YW4 zCUQ=m1@VDVv5(#nPsg)!4G9drx+7Z(}khVkO z{ySi*3Vxm$#GSZFC1s|PdCr@JUuW)dm$u1MgO)Y1dNyKN4L}M3pPXgANu|?u#x-b} z-!c2HBE=ybm4~kQJ#x?fSmG)aiMY-PwkQEI$?Y#B$dFR$dds4dV7?VbZ_Ql;Xh5NS zr-Ex@t2*3^_4@cEcUVQ+#!opq*wYkivqs~Kr@7B7HA>^VhLlUWa4y4*@PXb#SUm}r zFLj}J(rlR@^$dH5Mvx^PL>uMugP*|tZWux=>&ULfM=ri~F42Sx>+na8L=#V)5--|I z6t<43)u6QtRMBy0xLYx#Y25nVJ8=|OC(dO=HM2Ha`OeYUDenTm^no)d2l#JVIrXV{?aNGmRJ#F#_Md)3EYg#xmIV0#wH$yp8-e3 zw5mWhZ{&Yae4Dx3J_NFoqB!fCS#rx?P6RT*%X&~$!gtkA~@q+EYDcHg4WWi8ft1P%w3$ z6D)dC|2*|lj!6X!js#b=Cr23!hEK~19nVBVZoScmaCBr%i*2m-jHjP(mH8L7kMaC$ z4#fy%TTX9@xR1nn&$aSC93$_Fr*qpY$(gBh;D?vZ3&JG4!c+_mZSAzfkE6CGP3V3w81DS_x|fh{}&6~i8sf&Of!d2r9}u&^*G2+4=|FXx8j{1oUK zXG#f*s3dMiF-4H97L$m=w)q}f_Dk=;-DnqMw#ICl4k&7`sjE{LhRTVMQ`bevbeL;u zYuT>^$Ij4oF+`5>j!)z}Qm&P@t0il;yt=yDw+hV-vnKFsGt?xL#jsc`sa#GD%r+`N zeRHz(VN`H#nNWx~r=h?v{v7J@sDzQ_2Q*7Jc;|e1doT8>zk~fN@wXgY0aJ*&FmZ>D K9<1Ac_R4>N$yI~^ delta 1041 zcmW-fdraC_6vxpft^h%ovS-J-_v)tdOZAYZHhbFO?uA8;zw{BQ@gPfry|5d=|RTw6{lY>CF!7dVLQ zyk{IG>*|Q=*5}iqB|W4^j|hcASgVEXUaaW?!eBRkjn2-_rlh9o(fVS~ARSY4Es{8J z)geY=;3z*jvzIe14I3qM1Fu7-`dqkD@XM;h@zpRBk_wB1Ynto?fMcq&wgKkI2!q5h1o&FK@`{kzE?3hT-yJSdD zPsbzQCRt1?w>FrnteKga0$J?ewUdL_`EUhWITjRX8Jn+c>e;YnEFLI}G zm+TMsH6ytYFH#%b@{45AwUD>Fyj^t=P&u194ng>DohNMP(`Xc+1=iWZP=P&o_k}!Q?uDJcboq1a? ztDyqK`f=^@VISB`NDgiT^Xj_}(146nhJ6IWM+Q)7WhJPuc{;Pb1~#Mh$_0NFplC^@ zsoTjuN^D%HZR&SOBoenZ`UhqQZJ4MKv^eEj&dLkL{Cd*{=j7b_PL-O&vvc=4OS@!% zIy$m+?CkZOCseOrrkFnoH&Q)|OOqITFMPDJhn2VawtGD2^Lv<){2>I%qtSZ9;jr0a zarwMp!u$LC(aVUG1&irdLe*T`)pWD-W$>;?rZWZ{y^sP%$Jo$}7q~-Bx9E`%8TsC; zL&o|{7qeG)7s@AE1+2_-k5xtwc#*uO;TV+7eLnpI&yDz83*~N~*Si|>d$=yETEi&@ zS<4!8V@2tFW^$FZ1OGe;j!PIP!t#W=xMTwqC&5#?6!`ZxAQ4WNl%5zqe*W73gCZln diff --git a/src/Button/IconButton.docs.json b/src/Button/IconButton.docs.json index ad1529202a8..9b8306fb460 100644 --- a/src/Button/IconButton.docs.json +++ b/src/Button/IconButton.docs.json @@ -35,6 +35,12 @@ "defaultValue": "", "description": "provide an octicon. It will be placed in the center of the button" }, + { + "name": "aria-label", + "type": "string", + "defaultValue": "", + "description": "Use an aria label to describe the functionality of the button. Please refer to [our guidance on alt text](https://primer.style/guides/accessibility/alternative-text-for-images) for tips on writing good alternative text." + }, { "name": "sx", "type": "SystemStyleObject" diff --git a/src/Button/IconButton.features.stories.tsx b/src/Button/IconButton.features.stories.tsx index 2f8b979aac3..0f27d91c397 100644 --- a/src/Button/IconButton.features.stories.tsx +++ b/src/Button/IconButton.features.stories.tsx @@ -6,16 +6,16 @@ export default { title: 'Components/IconButton/Features', } -export const Primary = () => +export const Primary = () => -export const Danger = () => +export const Danger = () => -export const Invisible = () => +export const Invisible = () => -export const Disabled = () => +export const Disabled = () => -export const Small = () => +export const Small = () => -export const Medium = () => +export const Medium = () => -export const Large = () => +export const Large = () => diff --git a/src/Button/IconButton.stories.tsx b/src/Button/IconButton.stories.tsx index a60e2fc9340..9422c85a01b 100644 --- a/src/Button/IconButton.stories.tsx +++ b/src/Button/IconButton.stories.tsx @@ -41,8 +41,8 @@ Playground.args = { disabled: false, inactive: false, variant: 'default', - 'aria-label': 'Icon button description', - icon: XIcon, + 'aria-label': 'Favorite', + icon: HeartIcon, } -export const Default = () => +export const Default = () => From 4384d73b07ba158d274852794a04f23555b3f01e Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Mon, 29 Jan 2024 17:29:38 +0000 Subject: [PATCH 08/10] chore(deps): bump @github/combobox-nav from 2.1.7 to 2.3.1 (#4185) * chore(deps): bump @github/combobox-nav from 2.1.7 to 2.3.1 Bumps [@github/combobox-nav](https://github.com/github/combobox-nav) from 2.1.7 to 2.3.1. - [Release notes](https://github.com/github/combobox-nav/releases) - [Commits](https://github.com/github/combobox-nav/compare/v2.1.7...v2.3.1) --- updated-dependencies: - dependency-name: "@github/combobox-nav" dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] * test: add fallback for Element#scrollIntoView * chore: fix eslint warning --------- Signed-off-by: dependabot[bot] Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Josh Black --- package-lock.json | 6 +++--- src/utils/test-helpers.tsx | 7 +++++++ 2 files changed, 10 insertions(+), 3 deletions(-) diff --git a/package-lock.json b/package-lock.json index 710a898448b..2179c30606c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4167,9 +4167,9 @@ "dev": true }, "node_modules/@github/combobox-nav": { - "version": "2.1.7", - "resolved": "https://registry.npmjs.org/@github/combobox-nav/-/combobox-nav-2.1.7.tgz", - "integrity": "sha512-Webx0W5iTpkk5Chy9dB/1BEUORQ0qrwui8HaaVBiy75W2VOJg96WTuKj1rXENAJ3XTMhdEF53bn0LYfvP0EKvg==" + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/@github/combobox-nav/-/combobox-nav-2.3.1.tgz", + "integrity": "sha512-gwxPzLw8XKecy1nP63i9lOBritS3bWmxl02UX6G0TwMQZbMem1BCS1tEZgYd3mkrkiDrUMWaX+DbFCuDFo3K+A==" }, "node_modules/@github/details-menu-element": { "version": "1.0.13", diff --git a/src/utils/test-helpers.tsx b/src/utils/test-helpers.tsx index 05b286d06b0..056c4c17e76 100644 --- a/src/utils/test-helpers.tsx +++ b/src/utils/test-helpers.tsx @@ -37,3 +37,10 @@ if (typeof document !== 'undefined') { this.open = false }) } + +// Add a fallback for scrollIntoView if it does not exist in the test +// environment. +// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition +if (global.Element.prototype.scrollIntoView === undefined) { + global.Element.prototype.scrollIntoView = jest.fn() +} From 0df998522d503be60abecf135051a4b3e20e4366 Mon Sep 17 00:00:00 2001 From: Katie Langerman <18661030+langermank@users.noreply.github.com> Date: Mon, 29 Jan 2024 13:47:36 -0800 Subject: [PATCH 09/10] Add missing CSS vars to legacy-theme (#4193) * oof * Create thirty-mirrors-switch.md * test(vrt): update snapshots * fix missing var * fix parens * test(vrt): update snapshots --------- Co-authored-by: langermank --- .changeset/thirty-mirrors-switch.md | 5 + ...ible-Variants-dark-high-contrast-linux.png | Bin 11587 -> 11570 bytes ...utton-Primary-dark-high-contrast-linux.png | Bin 5820 -> 5921 bytes ...-With-Actions-dark-high-contrast-linux.png | Bin 9319 -> 9310 bytes src/legacy-theme/ts/colors/dark.ts | 7 +- src/legacy-theme/ts/colors/dark_colorblind.ts | 24 +-- src/legacy-theme/ts/colors/dark_dimmed.ts | 8 +- .../ts/colors/dark_high_contrast.ts | 120 ++++++++------- src/legacy-theme/ts/colors/dark_tritanopia.ts | 24 +-- src/legacy-theme/ts/colors/light.ts | 2 +- .../ts/colors/light_colorblind.ts | 42 +++--- .../ts/colors/light_high_contrast.ts | 140 +++++++++--------- .../ts/colors/light_tritanopia.ts | 42 +++--- 13 files changed, 214 insertions(+), 200 deletions(-) create mode 100644 .changeset/thirty-mirrors-switch.md diff --git a/.changeset/thirty-mirrors-switch.md b/.changeset/thirty-mirrors-switch.md new file mode 100644 index 00000000000..2eb14f67731 --- /dev/null +++ b/.changeset/thirty-mirrors-switch.md @@ -0,0 +1,5 @@ +--- +"@primer/react": patch +--- + +Add missing CSS vars to legacy-theme diff --git a/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-Variants-dark-high-contrast-linux.png b/.playwright/snapshots/components/Button.test.ts-snapshots/Button-Invisible-Variants-dark-high-contrast-linux.png index 87c7eccada7ec1aba6b49d2ac2774ea13f0432d7..2e6c5bb9d0a45b85404fd5f63b6d2ad1e595cdfb 100644 GIT binary patch literal 11570 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 diff --git a/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-high-contrast-linux.png b/.playwright/snapshots/components/IconButton.test.ts-snapshots/IconButton-Primary-dark-high-contrast-linux.png index d7ad996b9312bb7fd5714910fe3af3f4b68928f1..2973acf8456e89308a04db9759c6e647165e3dca 100644 GIT binary patch delta 1416 zcmYLJdrVVz80|(F+1NlsGR!EHL?TPX5~$cAkIK|JrxvH%SRGg;+8R+hsq`U~i$g_3 z9*P1*q&PBN#-qBbP+mo?!t8Ae!hk|~)|P5%D=mHZ-n-jm%l`U($vNjc=lhcH*SqNs zzB&$=-n}F3J5HlsoiU{O;zX zO$7u7r|$A3r?f+jOO2vNb*d-`gTYjPl&3F=Knn~9sfi2t9%ydghiBR85%r#k z0?uQJ8N~K!CO6bIwbt2na-{HdKP(n1TB)2fEjfM|%r<#mo(JqMyNEB;X+(v{U)+3d z4ojHH&zTT1vQ=!XYN}y$uu7>)Oke<9b`xa0N9;~T-EN$U(&JpqgLHFCw9b`5RY~{G zjkuT&KyfX$KY#gi_kti(*qbcdMOMy`JShQ>qfwHY zoSUdOdoBiwn5WqxqTbk~3Dy!kh{rnnQS|4eE^YH%kyD}S%RBBvdou7!`+9m%Ar(ct z!qs`hICRDrjAF;(OrWobS9#h=cB9b#g~V0#Sresy4}*z3VTjy95%#9YLSmKPX%nao zBLoZTZP5zQ(!!oCM9kD%S{z=UT)@>y?@&mrbGjObB5%y`3EJXau02IRkwc`p#+ZcI zOuns@tW@)k)dDgN`VNNn(O5uz;yK7_6}PO%n(rc(IQF*k57Y=+8FqthvFMVPM|jweQAW2N*S_1VZY zN#ksTZFGtLI9O@%DCO>(GmJzU^wJa~ai~FlJ3n0@(7uM}guXfd2#V6vX|>EjZ1cS*b;f4|iFLj$-2__1 zb#!QOk0|pex)|sp5{oPye5!jmrc^RhvW)VJ5$kzx2hSx<5fwSdVgSn`Xyb=TJo7Om z&fAi8{wU>o>ixjK>q^O>cV#^hftxS+WWW3MT=JdvBsR^LG_4c6nh|T1Uu!QxwD3rK zyQ=3Qd*1Ut1~XusuPuS)bgEz!7_4Gs*E)`SoMkGW&gM54iYjvhP$>dQ2~3u1RvKfL ziJwhdA4S840S9VcJpE)-0Hm1f{el6!ktYIn^#&a`Jz^`{oQc#;EQJA{SLcl%qHQ{B zw6E>_{E)yb=W-Qj85tEZxoq^aXlniUvzVD`IAGL7>(phVOsJdziX^txuO l6)pHn*VG*Ofbl6DdOv&f(aR^VQcwu9dnb8E$CpQb`3FR34w(P| delta 1323 zcmYjQX;4#F6n+*eIy#L@TSkGT)|t|>m^!IM4J0mDidJZ+Ei{ToOPjPTModCL2(QXm zWT>J;2?he8r5y&LPKj6RMemwnrK zNFA7TnViN3mQ{ySJ79@q{MHHxYNm7YeD}I9U)a{`sHGk!B@j(2i)Bv5#3p_{++7`| z(bT_4saCaxOxmYX#O7Am!^}N~16l{iH!Owgy$`kM<25W}ru@k8r)Vo)NKQHmqY?ro zu;z0N1oflo>QYQVK|}pvahF(L6v13phP>bOx6jg_OQalFFN`ndy0@G>}?^O=La7f&Q$R z{*uiuT;jE@c(~J*>IK+m&m+%*uxi5+IM?00Re6}-SV1sI$?b=@3Qv8^mmvO$Sj6j& z@DS5R7F`rk2*rJxPUm;YKC)ZYBT8isonIxUJDg)wy_9SpYUAP7gBo(2DArpgcFF|k zP7}omm}e~ganYEh%bwxmaDk0bmjKI_7vN2ckGRwhW99;7cekH!e*GX zqrAwqKtSS5nyLe}&&;(@1I`si>Di8Q41?nujl*69`B3^z+g>?*)-xYRQw9ZXuIQI`uN zmPD!NO%A;MX7H;RrIUBrF;S;-#%YzMlB_=t?R5?5e zs1U0AxICEM&TJHH9`lX-{9v80Lfm80|5*}Y2nUp=FtF=lyg~RPg^2EvT3hf+ zm9aWOh6h+8rfJtySKw~C>E$^qN4Z$pTY9>rY(Z5`{2z?IP}4o5R?nU3e`c?l+k_Mz z9oq}DPWk7}|G5c{ZqJ^K=5ykf2IaxUj^InTwusFrEQFJQKVF$yuc==aZY!U(&j%V< zo-RFY_LXD0dzwXpU5;CsCS^l7-8Z(8^>T3Q?2$q`eNHDKlIke+v|fA7?S;GTxyK?v z#W~}fm(A5r-&uhL@%(c85TaPQXI;%-tER%6(NK0QKJuq)-6P;0N`F{aL C(7!4G diff --git a/.playwright/snapshots/components/PageHeader.test.ts-snapshots/PageHeader-With-Actions-dark-high-contrast-linux.png b/.playwright/snapshots/components/PageHeader.test.ts-snapshots/PageHeader-With-Actions-dark-high-contrast-linux.png index 807d9bd3efe7330c84d9f1bdefa8f7efaa38d833..34bd710b65dbd2d2b0b0ff9deebb49f7a21da3af 100644 GIT binary patch delta 4641 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 diff --git a/src/legacy-theme/ts/colors/dark.ts b/src/legacy-theme/ts/colors/dark.ts index 4dbfcd39283..b104c898a90 100644 --- a/src/legacy-theme/ts/colors/dark.ts +++ b/src/legacy-theme/ts/colors/dark.ts @@ -193,7 +193,7 @@ const colors = { }, control: { borderColor: { - emphasis: 'var(--color-control-border-color-emphasis, #606771)', + emphasis: 'var(--control-borderColor-emphasis, var(--color-control-border-color-emphasis, #606771))', }, }, avatar: { @@ -298,10 +298,9 @@ const colors = { hoverBg: 'var(--button-outline-bgColor-hover, var(--color-btn-outline-hover-bg, #30363d))', hoverBorder: 'var(--button-outline-borderColor-hover, var(--color-btn-outline-hover-border, rgba(240,246,252,0.1)))', - hoverShadow: - 'var(--shadow-resting-small, var(--color-btn-outline-hover-shadow, 0 1px 0 rgba(1,4,9,0.1)))// HI_KATIE: no matches', + hoverShadow: 'var(--shadow-resting-small, var(--color-btn-outline-hover-shadow, 0 1px 0 rgba(1,4,9,0.1)))', hoverInsetShadow: - 'var(--shadow-highlight, var(--color-btn-outline-hover-inset-shadow, inset 0 1px 0 rgba(255,255,255,0.03)))// HI_KATIE: no matches', + 'var(--shadow-highlight, var(--color-btn-outline-hover-inset-shadow, inset 0 1px 0 rgba(255,255,255,0.03)))', hoverCounterBg: 'var(--buttonCounter-outline-bgColor-hover, var(--color-btn-outline-hover-counter-bg, rgba(5,29,77,0.2)))', selectedText: 'var(--button-outline-fgColor-active, var(--color-btn-outline-selected-text, #ffffff))', diff --git a/src/legacy-theme/ts/colors/dark_colorblind.ts b/src/legacy-theme/ts/colors/dark_colorblind.ts index 0c337764a2e..500f26e01af 100644 --- a/src/legacy-theme/ts/colors/dark_colorblind.ts +++ b/src/legacy-theme/ts/colors/dark_colorblind.ts @@ -193,7 +193,7 @@ const colors = { }, control: { borderColor: { - emphasis: 'var(--color-control-border-color-emphasis, #606771)', + emphasis: 'var(--control-borderColor-emphasis, var(--color-control-border-color-emphasis, #606771))', }, }, avatar: { @@ -431,8 +431,8 @@ const colors = { }, }, fg: { - default: '#c9d1d9', - muted: '#8b949e', + default: 'var(--fgColor-default, var(--color-fg-default, #c9d1d9))', + muted: 'var(--fgColor-muted, var(--color-fg-muted, #8b949e))', subtle: 'var(--fgColor-muted, var(--color-fg-subtle, #6e7681))', onEmphasis: 'var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff))', }, @@ -460,7 +460,7 @@ const colors = { subtle: 'var(--bgColor-neutral-muted, var(--color-neutral-subtle, rgba(110,118,129,0.1)))', }, accent: { - fg: '#58a6ff', + fg: 'var(--fgColor-accent, var(--color-accent-fg, #58a6ff))', emphasis: 'var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #1f6feb))', muted: 'var(--borderColor-accent-muted, var(--color-accent-muted, rgba(56,139,253,0.4)))', subtle: 'var(--bgColor-accent-muted, var(--color-accent-subtle, rgba(56,139,253,0.1)))', @@ -490,16 +490,16 @@ const colors = { subtle: 'var(--bgColor-danger-muted, var(--color-danger-subtle, rgba(212,118,22,0.1)))', }, open: { - fg: '#ec8e2c', - emphasis: '#b76100', - muted: 'rgba(212,118,22,0.4)', - subtle: 'rgba(212,118,22,0.15)', + fg: 'var(--fgColor-open, var(--color-open-fg, #ec8e2c))', + emphasis: 'var(--borderColor-open-emphasis, var(--color-open-emphasis, #b76100))', + muted: 'var(--borderColor-open-muted, var(--color-open-muted, rgba(212,118,22,0.4)))', + subtle: 'var(--bgColor-open-muted, var(--color-open-subtle, rgba(212,118,22,0.15)))', }, closed: { - fg: '#8b949e', - emphasis: '#6e7681', - muted: 'rgba(110,118,129,0.4)', - subtle: 'rgba(110,118,129,0.1)', + fg: 'var(--fgColor-closed, var(--color-open-fg, #8b949e))', + emphasis: 'var(--borderColor-closed-emphasis, var(--color-closed-emphasis, #6e7681))', + muted: 'var(--borderColor-closed-muted, var(--color-closed-muted, rgba(110,118,129,0.4)))', + subtle: 'var(--bgColor-closed-muted, var(--color-closed-subtle, rgba(110,118,129,0.1)))', }, done: { fg: 'var(--fgColor-done, var(--color-done-fg, #a371f7))', diff --git a/src/legacy-theme/ts/colors/dark_dimmed.ts b/src/legacy-theme/ts/colors/dark_dimmed.ts index 8c3dc1fa397..10bdf26ed26 100644 --- a/src/legacy-theme/ts/colors/dark_dimmed.ts +++ b/src/legacy-theme/ts/colors/dark_dimmed.ts @@ -193,7 +193,7 @@ const colors = { }, control: { borderColor: { - emphasis: 'var(--color-control-border-color-emphasis, #606771)', + emphasis: 'var(--control-borderColor-emphasis, var(--color-control-border-color-emphasis, #606771))', }, }, avatar: { @@ -430,8 +430,8 @@ const colors = { }, }, fg: { - default: '#adbac7', - muted: '#768390', + default: 'var(--fgColor-default, var(--color-fg-default, #adbac7))', + muted: 'var(--fgColor-muted, var(--color-fg-muted, #768390))', subtle: 'var(--fgColor-muted, var(--color-fg-subtle, #636e7b))', onEmphasis: 'var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #cdd9e5))', }, @@ -459,7 +459,7 @@ const colors = { subtle: 'var(--bgColor-neutral-muted, var(--color-neutral-subtle, rgba(99,110,123,0.1)))', }, accent: { - fg: '#539bf5', + fg: 'var(--fgColor-acccent, var(--color-accent-fg, #539bf5))', emphasis: 'var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #316dca))', muted: 'var(--borderColor-accent-muted, var(--color-accent-muted, rgba(65,132,228,0.4)))', subtle: 'var(--bgColor-accent-muted, var(--color-accent-subtle, rgba(65,132,228,0.1)))', diff --git a/src/legacy-theme/ts/colors/dark_high_contrast.ts b/src/legacy-theme/ts/colors/dark_high_contrast.ts index 3f0ec11c061..3c549db1538 100644 --- a/src/legacy-theme/ts/colors/dark_high_contrast.ts +++ b/src/legacy-theme/ts/colors/dark_high_contrast.ts @@ -8,29 +8,29 @@ const colors = { diffBlob: { addition: { numText: 'var(--diffBlob-addition-fgColor-num, var(--color-diff-blob-addition-num-text, #f0f3f6))', - fg: '#0a0c10', + fg: 'var(--diffBlob-addition-fgColor-text, var(--color-diff-blob-addition-fg, #0a0c10))', numBg: 'var(--diffBlob-addition-bgColor-num, var(--color-diff-blob-addition-num-bg, rgba(38,205,77,0.3)))', lineBg: 'var(--diffBlob-addition-bgColor-line, var(--color-diff-blob-addition-line-bg, rgba(9,180,58,0.15)))', wordBg: 'var(--diffBlob-addition-bgColor-word, var(--color-diff-blob-addition-word-bg, #09b43a))', }, deletion: { numText: 'var(--diffBlob-deletion-fgColor-num, var(--color-diff-blob-deletion-num-text, #f0f3f6))', - fg: '#0a0c10', + fg: 'var(--diffBlob-deletion-fgColor-text, var(--color-diff-blob-deletion-fg, #0a0c10))', numBg: 'var(--diffBlob-deletion-bgColor-num, var(--color-diff-blob-deletion-num-bg, rgba(255,106,105,0.3)))', lineBg: 'var(--diffBlob-deletion-bgColor-line, var(--color-diff-blob-deletion-line-bg, rgba(255,106,105,0.1)))', wordBg: 'var(--diffBlob-deletion-bgColor-word, var(--color-diff-blob-deletion-word-bg, #ff6a69))', }, hunk: { - numBg: 'rgba(64,158,255,0.4)', + numBg: 'var(--diffBlob-hunk-bgColor-num, var(--color-diff-blob-hunk-num-bg, rgba(64,158,255,0.4)))', }, expander: { - icon: '#f0f3f6', + icon: 'var(--diffBlob-expander-iconColor, var(--color-diff-blob-expander-icon, #f0f3f6))', }, selectedLineHighlightMixBlendMode: 'var(--color-diff-blob-selected-line-highlight-mix-blend-mode, screen)', }, diffstat: { - deletionBorder: '#ffb1af', - additionBorder: '#4ae168', + deletionBorder: 'var(--color-diffstat-deletion-border, #ffb1af)', + additionBorder: 'var(--color-diffstat-addition-border, #4ae168)', additionBg: 'var(--diffStat-addition-bgColor, var(--color-diffstat-addition-bg, #26cd4d))', }, searchKeyword: { @@ -80,7 +80,7 @@ const colors = { 'var(--codeMirror-gutterMarker-fgColor-muted, var(--color-codemirror-guttermarker-subtle-text, #9ea7b3))', linenumberText: 'var(--codeMirror-lineNumber-fgColor, var(--color-codemirror-linenumber-text, #f0f3f6))', cursor: 'var(--codeMirror-cursor-fgColor, var(--color-codemirror-cursor, #f0f3f6))', - selectionBg: 'rgba(64,158,255,0.4)', + selectionBg: 'var(--codeMirror-selection-bgColor, var(--color-codemirror-selection-bg, rgba(64,158,255,0.4)))', activelineBg: 'var(--codeMirror-activeline-bgColor, var(--color-codemirror-activeline-bg, rgba(158,167,179,0.1)))', matchingbracketText: 'var(--codeMirror-matchingBracket-fgColor, var(--color-codemirror-matchingbracket-text, #f0f3f6))', @@ -193,18 +193,18 @@ const colors = { }, control: { borderColor: { - emphasis: '#9ea7b3', + emphasis: 'var(--control-borderColor-emphasis, var(--color-control-border-color-emphasis, #9ea7b3))', }, }, avatar: { bg: 'var(--avatar-bgColor, var(--color-avatar-bg, rgba(255,255,255,0.1)))', - border: 'rgba(255,255,255,0.9)', + border: 'var(--avatar-borderColor, var(--color-avatar-border, rgba(255,255,255,0.9)))', stackFade: 'var(--avatarStack-fade-bgColor-default, var(--color-avatar-stack-fade, #525964))', stackFadeMore: 'var(--avatarStack-fade-bgColor-muted, var(--color-avatar-stack-fade-more, #272b33))', childShadow: 'var(--avatar-shadow, var(--color-avatar-child-shadow, 0 0 0 2px #0a0c10))', }, topicTag: { - border: '#409eff', + border: 'var(--topicTag-borderColor, var(--color-topic-tag-border, #409eff))', }, counter: { border: 'var(--counter-borderColor, var(--color-counter-border, transparent))', @@ -270,24 +270,26 @@ const colors = { hoverBorder: 'var(--button-default-borderColor-hover, var(--color-btn-hover-border, #bdc4cc))', activeBg: 'var(--button-default-bgColor-active, var(--color-btn-active-bg, hsla(217,10%,33%,1)))', activeBorder: 'var(--button-default-borderColor-active, var(--color-btn-active-border, #9ea7b3))', - selectedBg: 'rgba(82,89,100,0.9)', + selectedBg: 'var(--button-default-bgColor-selected, var(--color-btn-selected-bg, rgba(82,89,100,0.9)))', counterBg: 'var(--buttonCounter-default-bgColor-rest, var(--color-btn-counter-bg, #525964))', primary: { - text: '#0a0c10', + text: 'var(--button-primary-fgColor-rest, var(--color-btn-primary-text, #0a0c10))', bg: 'var(--button-primary-bgColor-rest, var(--color-btn-primary-bg, #09b43a))', - border: '#4ae168', + border: 'var(--button-primary-borderColor-rest, var(--color-btn-primary-border, #4ae168))', shadow: 'var(--shadow-resting-small, var(--color-btn-primary-shadow, 0 0 transparent))', insetShadow: 'var(--shadow-highlight, var(--color-btn-primary-inset-shadow, 0 0 transparent))', - hoverBg: '#26cd4d', - hoverBorder: '#4ae168', + hoverBg: 'var(--button-primary-bgColor-hover, var(--color-btn-primary-hover-bg, #26cd4d))', + hoverBorder: 'var(--button-primary-borderColor-hover, var(--color-btn-primary-hover-border, #4ae168))', selectedBg: 'var(--button-primary-bgColor-active, var(--color-btn-primary-selected-bg, #09b43a))', selectedShadow: 'var(--button-primary-shadow-selected, var(--color-btn-primary-selected-shadow, 0 0 transparent))', - disabledText: 'rgba(10,12,16,0.5)', - disabledBg: 'rgba(9,180,58,0.6)', - disabledBorder: 'rgba(74,225,104,0.4)', - icon: '#0a0c10', - counterBg: 'rgba(1,4,9,0.15)', + disabledText: + 'var(--button-primary-fgColor-disabled, var(--color-btn-primary-disabled-text, rgba(10,12,16,0.5)))', + disabledBg: 'var(--button-primary-bgColor-disabled, var(--color-btn-primary-disabled-bg, rgba(9,180,58,0.6)))', + disabledBorder: + 'var(--button-primary-borderColor-disabled, var(--color-btn-primary-disabled-border, rgba(74,225,104,0.4)))', + icon: 'var(--button-primary-iconColor-rest, var(--color-btn-primary-icon, #0a0c10))', + counterBg: 'var(--buttonCounter-primary-bgColor-rest, var(--color-btn-primary-counter-bg, rgba(1,4,9,0.15)))', }, outline: { text: 'var(--button-outline-fgColor-rest, var(--color-btn-outline-text, #409eff))', @@ -324,7 +326,8 @@ const colors = { hoverShadow: 'var(--shadow-resting-small, var(--color-btn-danger-hover-shadow, 0 0 transparent))', hoverInsetShadow: 'var(--shadow-highlight, var(--color-btn-danger-hover-inset-shadow, 0 0 transparent))', hoverIcon: 'var(--button-danger-iconColor-hover, var(--color-btn-danger-hover-icon, #0a0c10))', - hoverCounterBg: 'rgba(1,4,9,0.15)', + hoverCounterBg: + 'var(--buttonCounter-danger-bgColor-hover, var(--color-btn-danger-hover-counter-bg, rgba(1,4,9,0.15)))', selectedText: 'var(--button-danger-fgColor-active, var(--color-btn-danger-selected-text, #ffffff))', selectedBg: 'var(--button-danger-bgColor-active, var(--color-btn-danger-selected-bg, #ff4445))', selectedBorder: 'var(--button-danger-borderColor-active, var(--color-btn-danger-selected-border, #ff9492))', @@ -334,7 +337,7 @@ const colors = { disabledBg: 'var(--button-danger-bgColor-disabled, var(--color-btn-danger-disabled-bg, #0a0c10))', disabledCounterBg: 'var(--buttonCounter-danger-bgColor-disabled, var(--color-btn-danger-disabled-counter-bg, rgba(255,106,105,0.05)))', - counterBg: 'rgba(1,4,9,0.15)', + counterBg: 'var(--buttonCounter-danger-bgColor-rest, var(--color-btn-danger-counter-bg, rgba(1,4,9,0.15)))', icon: 'var(--button-danger-iconColor-rest, var(--color-btn-danger-icon, #ff6a69))', counterFg: 'var(--buttonCounter-danger-fgColor-rest, var(--color-btn-danger-counter-fg, #ff6a69))', disabledCounterFg: @@ -347,34 +350,37 @@ const colors = { }, }, underlinenav: { - icon: '#f0f3f6', - borderHover: '#bdc4cc', + icon: 'var(--underlineNav-iconColor-rest, var(--color-underlinenav-icon, #f0f3f6))', + borderHover: 'var(--underlineNav-borderColor-hover, var(--color-underlinenav-border-hover, #bdc4cc))', }, actionListItem: { - inlineDivider: '#7a828e', + inlineDivider: 'var(--borderColor-muted, var(--color-action-list-item-inline-divider, #7a828e))', default: { - hoverBg: '#272b33', - hoverBorder: '#7a828e', - activeBg: '#525964', - activeBorder: '#9ea7b3', - selectedBg: '#525964', + hoverBg: 'var(--control-transparent-bgColor-hover, var(--color-action-list-item-default-hover-bg, #272b33))', + hoverBorder: + 'var(--control-transparent-borderColor-hover, var(--color-action-list-item-default-hover-border, #7a828e))', + activeBg: 'var(--control-transparent-bgColor-active, var(--color-action-list-item-default-active-bg, #525964))', + activeBorder: + 'var(--control-transparent-borderColor-active, var(--color-action-list-item-default-active-border, #9ea7b3))', + selectedBg: + 'var(--control-transparent-bgColor-selected, var(--color-action-list-item-default-selected-bg, #525964))', }, danger: { - hoverBg: '#ff6a69', - activeBg: '#ff4445', - hoverText: '#0a0c10', + hoverBg: 'var(--control-danger-bgColor-hover, var(--color-action-list-item-danger-hover-bg, #ff6a69))', + activeBg: 'var(--control-danger-bgColor-active, var(--color-action-list-item-danger-active-bg, #ff4445))', + hoverText: 'var(--control-danger-fgColor-hover, var(--color-action-list-item-danger-hover-text, #0a0c10))', }, }, switchTrack: { - bg: '#9ea7b3', - hoverBg: 'hsla(214,12%,61%,1)', - activeBg: 'hsla(214,12%,58%,1)', + bg: 'var(--controlTrack-bgColor-rest, var(--color-switch-track-bg, #9ea7b3))', + hoverBg: 'var(--controlTrack-bgColor-hover, var(--color-switch-track-hover-bg, hsla(214,12%,61%,1)))', + activeBg: 'var(--controlTrack-bgColor-active, var(--color-switch-track-active-bg, hsla(214,12%,58%,1)))', disabledBg: 'var(--controlTrack-bgColor-disabled, var(--color-switch-track-disabled-bg, #272b33))', - fg: '#0a0c10', + fg: 'var(--controlTrack-fgColor-rest, var(--color-switch-track-fg, #0a0c10))', disabledFg: 'var(--controlTrack-fgColor-disabled, var(--color-switch-track-disabled-fg, #010409))', border: 'var(--controlTrack-borderColor-rest, var(--color-switch-track-border, transparent))', checked: { - bg: '#409eff', + bg: 'var(--control-checked-bgColor-rest, var(--color-switch-track-checked-bg, #409eff))', hoverBg: 'var(--control-checked-bgColor-hover, var(--color-switch-track-checked-hover-bg, rgba(64,158,255,0.5)))', activeBg: 'var(--control-checked-bgColor-active, var(--color-switch-track-checked-active-bg, rgba(64,158,255,0.65)))', @@ -385,12 +391,12 @@ const colors = { }, switchKnob: { bg: 'var(--controlKnob-bgColor-rest, var(--color-switch-knob-bg, #0a0c10))', - border: '#9ea7b3', + border: 'var(--controlKnob-borderColor-rest, var(--color-switch-knob-border, #9ea7b3))', disabledBg: 'var(--controlKnob-bgColor-disabled, var(--color-switch-knob-disabled-bg, #272b33))', checked: { bg: 'var(--controlKnob-bgColor-checked, var(--color-switch-knob-checked-bg, #0a0c10))', disabledBg: 'var(--controlKnob-bgColor-disabled, var(--color-switch-knob-checked-disabled-bg, #272b33))', - border: '#409eff', + border: 'var(--controlKnob-borderColor-checked, var(--color-switch-knob-checked-border, #409eff))', }, }, segmentedControl: { @@ -410,17 +416,17 @@ const colors = { }, treeViewItem: { chevron: { - hoverBg: '#525964', + hoverBg: 'var(--control-transparent-bgColor-hover, var(--color-tree-view-item-chevron-hover-bg, #525964))', }, directory: { fill: 'var(--treeViewItem-leadingVisual-bgColor-rest, var(--color-tree-view-item-directory-fill, #f0f3f6))', }, }, fg: { - default: '#f0f3f6', - muted: '#f0f3f6', + default: 'var(--fgColor-default, var(--color-fg-default, #f0f3f6))', + muted: 'var(--fgColor-muted, var(--color-fg-muted, #f0f3f6))', subtle: 'var(--fgColor-muted, var(--color-fg-subtle, #9ea7b3))', - onEmphasis: '#0a0c10', + onEmphasis: 'var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #0a0c10))', }, canvas: { default: 'var(--bgColor-default, var(--color-canvas-default, #0a0c10))', @@ -429,9 +435,9 @@ const colors = { subtle: 'var(--bgColor-muted, var(--color-canvas-subtle, #272b33))', }, border: { - default: '#7a828e', - muted: '#7a828e', - subtle: '#7a828e', + default: 'var(--borderColor-default, var(--color-border-default, #7a828e))', + muted: 'var(--borderColor-muted, var(--color-border-muted, #7a828e))', + subtle: 'var(--borderColor-muted, var(--color-border-subtle, #7a828e))', }, shadow: { small: 'var(--shadow-resting-small, var(--color-shadow-small, 0 0 transparent))', @@ -440,39 +446,39 @@ const colors = { extraLarge: 'var(--shadow-floating-xlarge, var(--color-shadow-extra-large, 0 12px 48px #010409))', }, neutral: { - emphasisPlus: '#ffffff', - emphasis: '#9ea7b3', + emphasisPlus: 'var(--bgColor-emphasis, var(--color-neutral-emphasis-plus, #ffffff))', + emphasis: 'var(--bgColor-neutral-emphasis, var(--color-neutral-emphasis, #9ea7b3))', muted: 'var(--borderColor-neutral-muted, var(--color-neutral-muted, rgba(158,167,179,0.4)))', subtle: 'var(--bgColor-neutral-muted, var(--color-neutral-subtle, rgba(158,167,179,0.1)))', }, accent: { - fg: '#71b7ff', + fg: 'var(--fgColor-accent, var(--color-accent-fg, #71b7ff))', emphasis: 'var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #409eff))', - muted: '#409eff', + muted: 'var(--borderColor-accent-muted, var(--color-accent-muted, #409eff))', subtle: 'var(--bgColor-accent-muted, var(--color-accent-subtle, rgba(64,158,255,0.1)))', }, success: { fg: 'var(--fgColor-success, var(--color-success-fg, #26cd4d))', emphasis: 'var(--bgColor-success-emphasis, var(--color-success-emphasis, #09b43a))', - muted: '#09b43a', + muted: 'var(--borderColor-success-muted, var(--color-success-muted, #09b43a))', subtle: 'var(--bgColor-success-muted, var(--color-success-subtle, rgba(9,180,58,0.15)))', }, attention: { fg: 'var(--fgColor-attention, var(--color-attention-fg, #f0b72f))', emphasis: 'var(--bgColor-attention-emphasis, var(--color-attention-emphasis, #e09b13))', - muted: '#e09b13', + muted: 'var(--borderColor-attention-muted, var(--color-attention-muted, #e09b13))', subtle: 'var(--bgColor-attention-muted, var(--color-attention-subtle, rgba(224,155,19,0.15)))', }, severe: { fg: 'var(--fgColor-severe, var(--color-severe-fg, #e7811d))', emphasis: 'var(--bgColor-severe-emphasis, var(--color-severe-emphasis, #e7811d))', - muted: '#e7811d', + muted: 'var(--borderColor-severe-muted, var(--color-severe-muted, #e7811d))', subtle: 'var(--bgColor-severe-muted, var(--color-severe-subtle, rgba(231,129,29,0.1)))', }, danger: { fg: 'var(--fgColor-danger, var(--color-danger-fg, #ff6a69))', emphasis: 'var(--borderColor-danger-emphasis, var(--color-danger-emphasis, #ff6a69))', - muted: '#ff6a69', + muted: 'var(--borderColor-danger-muted, var(--color-danger-muted, #ff6a69))', subtle: 'var(--bgColor-danger-muted, var(--color-danger-subtle, rgba(255,106,105,0.1)))', }, open: { @@ -490,13 +496,13 @@ const colors = { done: { fg: 'var(--fgColor-done, var(--color-done-fg, #b780ff))', emphasis: 'var(--bgColor-done-emphasis, var(--color-done-emphasis, #b87fff))', - muted: '#b780ff', + muted: 'var(--borderColor-done-muted, var(--color-done-muted, #b780ff))', subtle: 'var(--bgColor-done-muted, var(--color-done-subtle, rgba(183,128,255,0.1)))', }, sponsors: { fg: 'var(--fgColor-sponsors, var(--color-sponsors-fg, #ef6eb1))', emphasis: 'var(--bgColor-sponsors-emphasis, var(--color-sponsors-emphasis, #ef6eb1))', - muted: '#ef6eb1', + muted: 'var(--borderColor-sponsors-muted, var(--color-sponsors-muted, #ef6eb1))', subtle: 'var(--bgColor-sponsors-muted, var(--color-sponsors-subtle, rgba(239,110,177,0.1)))', }, primer: { diff --git a/src/legacy-theme/ts/colors/dark_tritanopia.ts b/src/legacy-theme/ts/colors/dark_tritanopia.ts index 6d6eac50e8c..674898fdfaf 100644 --- a/src/legacy-theme/ts/colors/dark_tritanopia.ts +++ b/src/legacy-theme/ts/colors/dark_tritanopia.ts @@ -193,7 +193,7 @@ const colors = { }, control: { borderColor: { - emphasis: 'var(--color-control-border-color-emphasis, #606771)', + emphasis: 'var(--control-borderColor-emphasis, var(--color-control-border-color-emphasis, #606771))', }, }, avatar: { @@ -430,8 +430,8 @@ const colors = { }, }, fg: { - default: '#c9d1d9', - muted: '#8b949e', + default: 'var(--fgColor-default, var(--color-fg-default, #c9d1d9))', + muted: 'var(--fgColor-muted, var(--color-fg-muted, #8b949e))', subtle: 'var(--fgColor-muted, var(--color-fg-subtle, #6e7681))', onEmphasis: 'var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff))', }, @@ -459,7 +459,7 @@ const colors = { subtle: 'var(--bgColor-neutral-muted, var(--color-neutral-subtle, rgba(110,118,129,0.1)))', }, accent: { - fg: '#58a6ff', + fg: 'var(--fgColor-accent, var(--color-accent-fg, #58a6ff))', emphasis: 'var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #1f6feb))', muted: 'var(--borderColor-accent-muted, var(--color-accent-muted, rgba(56,139,253,0.4)))', subtle: 'var(--bgColor-accent-muted, var(--color-accent-subtle, rgba(56,139,253,0.1)))', @@ -489,16 +489,16 @@ const colors = { subtle: 'var(--bgColor-danger-muted, var(--color-danger-subtle, rgba(248,81,73,0.1)))', }, open: { - fg: '#ff7b72', - emphasis: '#da3633', - muted: 'rgba(248,81,73,0.4)', - subtle: 'rgba(248,81,73,0.15)', + fg: 'var(--fgColor-open, var(--color-open-fg, #ff7b72))', + emphasis: 'var(--bgColor-open-emphasis, var(--color-open-emphasis, #da3633))', + muted: 'var(--borderColor-open-muted, var(--color-open-muted, rgba(248,81,73,0.4)))', + subtle: 'var(--bgColor-open-muted, var(--color-open-subtle, rgba(248,81,73,0.15)))', }, closed: { - fg: '#8b949e', - emphasis: '#6e7681', - muted: 'rgba(110,118,129,0.4)', - subtle: 'rgba(110,118,129,0.1)', + fg: 'var(--fgColor-closed, var(--color-closed-fg, #8b949e))', + emphasis: 'var(--bgColor-closed-emphasis, var(--color-closed-emphasis, #6e7681))', + muted: 'var(--borderColor-closed-muted, var(--color-closed-muted, rgba(110,118,129,0.4)))', + subtle: 'var(--bgColor-closed-muted, var(--color-closed-subtle, rgba(110,118,129,0.1)))', }, done: { fg: 'var(--fgColor-done, var(--color-done-fg, #a371f7))', diff --git a/src/legacy-theme/ts/colors/light.ts b/src/legacy-theme/ts/colors/light.ts index 7823f0efa4b..7d0686b5bbf 100644 --- a/src/legacy-theme/ts/colors/light.ts +++ b/src/legacy-theme/ts/colors/light.ts @@ -193,7 +193,7 @@ const colors = { }, control: { borderColor: { - emphasis: 'var(var(--color-control-border-color-emphasis, #858F99)', + emphasis: 'var(--control-borderColor-emphasis, var(--color-control-border-color-emphasis, #858F99))', }, }, avatar: { diff --git a/src/legacy-theme/ts/colors/light_colorblind.ts b/src/legacy-theme/ts/colors/light_colorblind.ts index c04aee97f46..7f9e48dc22f 100644 --- a/src/legacy-theme/ts/colors/light_colorblind.ts +++ b/src/legacy-theme/ts/colors/light_colorblind.ts @@ -9,16 +9,16 @@ const colors = { addition: { numText: 'var(--diffBlob-addition-fgColor-num, var(--color-diff-blob-addition-num-text, #24292f))', fg: 'var(--diffBlob-addition-fgColor-text, var(--color-diff-blob-addition-fg, #24292f))', - numBg: 'rgba(84,174,255,0.4)', - lineBg: 'rgba(221,244,255,0.5)', - wordBg: 'rgba(84,174,255,0.4)', + numBg: 'var(--diffBlob-addition-bgColor-num, var(--color-diff-blob-addition-num-bg, rgba(84,174,255,0.4)))', + lineBg: 'var(--diffBlob-addition-bgColor-line, var(--color-diff-blob-addition-line-bg, rgba(221,244,255,0.5)))', + wordBg: 'var(--diffBlob-addition-bgColor-word, var(--color-diff-blob-addition-word-bg, rgba(84,174,255,0.4)))', }, deletion: { numText: 'var(--diffBlob-deletion-fgColor-num, var(--color-diff-blob-deletion-num-text, #24292f))', fg: 'var(--diffBlob-deletion-fgColor-text, var(--color-diff-blob-deletion-fg, #24292f))', - numBg: 'rgba(247,153,57,0.4)', - lineBg: 'rgba(255,245,232,0.5)', - wordBg: 'rgba(255,188,109,0.5)', + numBg: 'var(--diffBlob-deletion-bgColor-num, var(--color-diff-blob-deletion-num-bg, rgba(247,153,57,0.4)))', + lineBg: 'var(--diffBlob-deletion-bgColor-line, var(--color-diff-blob-deletion-line-bg, rgba(255,245,232,0.5)))', + wordBg: 'var(--diffBlob-deletion-bgColor-word, var(--color-diff-blob-deletion-word-bg, rgba(255,188,109,0.5)))', }, hunk: { numBg: 'var(--diffBlob-hunk-bgColor-num, var(--color-diff-blob-hunk-num-bg, rgba(84,174,255,0.4)))', @@ -193,7 +193,7 @@ const colors = { }, control: { borderColor: { - emphasis: 'var(var(--color-control-border-color-emphasis, #858F99)', + emphasis: 'var(--control-borderColor-emphasis, var(--color-control-border-color-emphasis, #858F99))', }, }, avatar: { @@ -280,7 +280,7 @@ const colors = { shadow: 'var(--shadow-resting-small, var(--color-btn-primary-shadow, 0 1px 0 rgba(27,31,36,0.1)))', insetShadow: 'var(--shadow-highlight, var(--color-btn-primary-inset-shadow, inset 0 1px 0 rgba(255,255,255,0.03)))', - hoverBg: '#0969da', + hoverBg: 'var(--button-primary-bgColor-hover, var(--color-btn-primary-hover-bg, #0969da))', hoverBorder: 'var(--button-primary-borderColor-hover, var(--color-btn-primary-hover-border, rgba(27,31,36,0.15)))', selectedBg: 'var(--button-primary-bgColor-active, var(--color-btn-primary-selected-bg, hsla(212,92%,43%,1)))', @@ -288,7 +288,7 @@ const colors = { 'var(--button-primary-shadow-selected, var(--color-btn-primary-selected-shadow, inset 0 1px 0 rgba(0,33,85,0.2)))', disabledText: 'var(--button-primary-fgColor-disabled, var(--color-btn-primary-disabled-text, rgba(255,255,255,0.8)))', - disabledBg: '#80ccff', + disabledBg: 'var(--button-primary-bgColor-disabled, var(--color-btn-primary-disabled-bg, #80ccff))', disabledBorder: 'var(--button-primary-borderColor-disabled, var(--color-btn-primary-disabled-border, rgba(27,31,36,0.15)))', icon: 'var(--button-primary-iconColor-rest, var(--color-btn-primary-icon, rgba(255,255,255,0.8)))', @@ -434,8 +434,8 @@ const colors = { }, }, fg: { - default: '#24292f', - muted: '#57606a', + default: 'var(--fgColor-default, var(--color-fg-default, #24292f))', + muted: 'var(--fgColor-muted, var(--color-fg-muted, #57606a))', subtle: 'var(--fgColor-muted, var(--color-fg-subtle, #6e7781))', onEmphasis: 'var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff))', }, @@ -470,7 +470,7 @@ const colors = { }, success: { fg: 'var(--fgColor-success, var(--color-success-fg, #0969da))', - emphasis: '#0969da', + emphasis: 'var(--bgColor-success-emphasis, var(--color-success-emphasis, #0969da))', muted: 'var(--borderColor-success-muted, var(--color-success-muted, rgba(84,174,255,0.4)))', subtle: 'var(--bgColor-success-muted, var(--color-success-subtle, #ddf4ff))', }, @@ -487,22 +487,22 @@ const colors = { subtle: 'var(--bgColor-severe-muted, var(--color-severe-subtle, #fff5e8))', }, danger: { - fg: '#b35900', + fg: 'var(--fgColor-danger, var(--color-danger-fg, #b35900))', emphasis: 'var(--borderColor-danger-emphasis, var(--color-danger-emphasis, #b35900))', muted: 'var(--borderColor-danger-muted, var(--color-danger-muted, rgba(247,153,57,0.4)))', subtle: 'var(--bgColor-danger-muted, var(--color-danger-subtle, #fff5e8))', }, open: { - fg: '#b35900', - emphasis: '#dd7815', - muted: 'rgba(247,153,57,0.4)', - subtle: '#fff5e8', + fg: 'var(--fgColor-open, var(--color-open-fg, #b35900))', + emphasis: 'var(--bgColor-open-emphasis, var(--color-open-emphasis, #dd7815))', + muted: 'var(--borderColor-open-muted, var(--color-open-muted, rgba(247,153,57,0.4)))', + subtle: 'var(--bgColor-open-muted, var(--color-open-subtle, #fff5e8))', }, closed: { - fg: '#6e7781', - emphasis: '#6e7781', - muted: 'rgba(175,184,193,0.4)', - subtle: '#f6f8fa', + fg: 'var(--fgColor-closed, var(--color-closed-fg, #6e7781))', + emphasis: 'var(--bgColor-closed-emphasis, var(--color-closed-emphasis, #6e7781))', + muted: 'var(--borderColor-closed-muted, var(--color-closed-muted, rgba(175,184,193,0.4)))', + subtle: 'var(--bgColor-closed-muted, var(--color-closed-subtle, #f6f8fa))', }, done: { fg: 'var(--fgColor-done, var(--color-done-fg, #8250df))', diff --git a/src/legacy-theme/ts/colors/light_high_contrast.ts b/src/legacy-theme/ts/colors/light_high_contrast.ts index 600a2ad3d23..86603404174 100644 --- a/src/legacy-theme/ts/colors/light_high_contrast.ts +++ b/src/legacy-theme/ts/colors/light_high_contrast.ts @@ -1,6 +1,6 @@ const colors = { canvasDefaultTransparent: 'var(--bgColor-transparent, var(--color-canvas-default-transparent, rgba(255,255,255,0)))', - pageHeaderBg: '#ffffff', + pageHeaderBg: 'var(--page-header-bgColor, var(--color-page-header-bg, #ffffff))', marketingIcon: { primary: 'var(--color-marketing-icon-primary, #1168e3)', secondary: 'var(--color-marketing-icon-secondary, #368cf9)', @@ -8,20 +8,20 @@ const colors = { diffBlob: { addition: { numText: 'var(--diffBlob-addition-fgColor-num, var(--color-diff-blob-addition-num-text, #0e1116))', - fg: '#ffffff', + fg: 'var(--diffBlob-addition-fgColor-text, var(--color-diff-blob-addition-fg, #ffffff))', numBg: 'var(--diffBlob-addition-bgColor-num, var(--color-diff-blob-addition-num-bg, #ccffd8))', lineBg: 'var(--diffBlob-addition-bgColor-line, var(--color-diff-blob-addition-line-bg, #e6ffec))', - wordBg: '#055d20', + wordBg: 'var(--diffBlob-addition-bgColor-word, var(--color-diff-blob-addition-word-bg, #055d20))', }, deletion: { numText: 'var(--diffBlob-deletion-fgColor-num, var(--color-diff-blob-deletion-num-text, #0e1116))', - fg: '#ffffff', + fg: 'var(--diffBlob-deletion-fgColor-text, var(--color-diff-blob-deletion-fg, #ffffff))', numBg: 'var(--diffBlob-deletion-bgColor-num, var(--color-diff-blob-deletion-num-bg, #ffd7d5))', lineBg: 'var(--diffBlob-deletion-bgColor-line, var(--color-diff-blob-deletion-line-bg, #fff0ee))', - wordBg: '#a0111f', + wordBg: 'var(--diffBlob-deletion-bgColor-word, var(--color-diff-blob-deletion-word-bg, #a0111f))', }, hunk: { - numBg: '#9cd7ff', + numBg: 'var(--diffBlob-hunk-bgColor-num, var(--color-diff-blob-hunk-num-bg, #9cd7ff))', }, expander: { icon: 'var(--diffBlob-expander-iconColor, var(--color-diff-blob-expander-icon, #0e1116))', @@ -193,7 +193,7 @@ const colors = { }, control: { borderColor: { - emphasis: '#20252c', + emphasis: 'var(--control-borderColor-emphasis, var(--color-control-border-color-emphasis, #20252c))', }, }, avatar: { @@ -204,10 +204,10 @@ const colors = { childShadow: 'var(--avatar-shadow, var(--color-avatar-child-shadow, 0 0 0 2px rgba(255,255,255,0.8)))', }, topicTag: { - border: '#0349b4', + border: 'var(--topicTag-borderColor, var(--color-topic-tag-border, #0349b4))', }, counter: { - border: '#20252c', + border: 'var(--counter-borderColor, var(--color-counter-border, #20252c))', }, selectMenu: { backdropBorder: 'var(--selectMenu-borderColor, var(--color-select-menu-backdrop-border, transparent))', @@ -222,7 +222,7 @@ const colors = { header: { text: 'var(--header-fgColor-default, var(--color-header-text, rgba(255,255,255,0.7)))', bg: 'var(--header-bgColor, var(--color-header-bg, #0e1116))', - divider: '#acb6c0', + divider: 'var(--header-borderColor-divider, var(--color-header-divider, #acb6c0))', logo: 'var(--header-fgColor-logo, var(--color-header-logo, #ffffff))', }, headerSearch: { @@ -262,26 +262,26 @@ const colors = { }, btn: { text: 'var(--button-default-fgColor-rest, var(--color-btn-text, #0e1116))', - bg: '#e7ecf0', - border: 'rgba(1,4,9,0.8)', + bg: 'var(--button-default-bgColor-rest, var(--color-btn-bg, #e7ecf0))', + border: 'var(--button-default-borderColor-rest, var(--color-btn-border, rgba(1,4,9,0.8)))', shadow: 'var(--button-default-shadow-resting, var(--color-btn-shadow, 0 1px 0 rgba(1,4,9,0.04)))', insetShadow: 'var(--button-default-shadow-inset, var(--color-btn-inset-shadow, inset 0 1px 0 rgba(255,255,255,0.25)))', - hoverBg: '#ced5dc', + hoverBg: 'var(--button-default-bgColor-hover, var(--color-btn-hover-bg, #ced5dc))', hoverBorder: 'var(--button-default-borderColor-hover, var(--color-btn-hover-border, rgba(1,4,9,0.8)))', - activeBg: '#acb6c0', + activeBg: 'var(--button-default-bgColor-active, var(--color-btn-active-bg, #acb6c0))', activeBorder: 'var(--button-default-borderColor-active, var(--color-btn-active-border, rgba(1,4,9,0.8)))', - selectedBg: '#acb6c0', + selectedBg: 'var(--button-default-bgColor-selected, var(--color-btn-selected-bg, #acb6c0))', counterBg: 'var(--buttonCounter-default-bgColor-rest, var(--color-btn-counter-bg, rgba(1,4,9,0.08)))', primary: { text: 'var(--button-primary-fgColor-rest, var(--color-btn-primary-text, #ffffff))', - bg: '#055d20', - border: '#013d14', + bg: 'var(--button-primary-bgColor-rest, var(--color-btn-primary-bg, #055d20))', + border: 'var(--button-primary-borderColor-rest, var(--color-btn-primary-border, #013d14))', shadow: 'var(--shadow-resting-small, var(--color-btn-primary-shadow, 0 1px 0 rgba(1,4,9,0.1)))', insetShadow: 'var(--shadow-highlight, var(--color-btn-primary-inset-shadow, inset 0 1px 0 rgba(255,255,255,0.03)))', - hoverBg: '#024c1a', - hoverBorder: '#013d14', + hoverBg: 'var(--button-primary-bgColor-hover, var(--color-btn-primary-hover-bg, #024c1a))', + hoverBorder: 'var(--button-primary-borderColor-hover, var(--color-btn-primary-hover-border, #013d14))', selectedBg: 'var(--button-primary-bgColor-active, var(--color-btn-primary-selected-bg, hsla(139,95%,13%,1)))', selectedShadow: 'var(--button-primary-shadow-selected, var(--color-btn-primary-selected-shadow, inset 0 1px 0 rgba(0,35,11,0.2)))', @@ -294,22 +294,23 @@ const colors = { counterBg: 'var(--buttonCounter-primary-bgColor-rest, var(--color-btn-primary-counter-bg, rgba(0,35,11,0.2)))', }, outline: { - text: '#023b95', + text: 'var(--button-outline-fgColor-rest, var(--color-btn-outline-text, #023b95))', hoverText: 'var(--button-outline-fgColor-hover, var(--color-btn-outline-hover-text, #ffffff))', - hoverBg: '#0349b4', - hoverBorder: '#022f7a', + hoverBg: 'var(--button-outline-bgColor-hover, var(--color-btn-outline-hover-bg, #0349b4))', + hoverBorder: 'var(--button-outline-borderColor-hover, var(--color-btn-outline-hover-border, #022f7a))', hoverShadow: 'var(--shadow-resting-small, var(--color-btn-outline-hover-shadow, 0 1px 0 rgba(1,4,9,0.1)))', hoverInsetShadow: 'var(--shadow-highlight, var(--color-btn-outline-hover-inset-shadow, inset 0 1px 0 rgba(255,255,255,0.03)))', hoverCounterBg: 'var(--buttonCounter-outline-bgColor-hover, var(--color-btn-outline-hover-counter-bg, rgba(255,255,255,0.2)))', selectedText: 'var(--button-outline-fgColor-active, var(--color-btn-outline-selected-text, #ffffff))', - selectedBg: '#022f7a', - selectedBorder: '#022f7a', + selectedBg: 'var(--button-outline-bgColor-active, var(--color-btn-outline-selected-bg, #022f7a))', + selectedBorder: 'var(--button-outline-borderColor-active, var(--color-btn-outline-selected-border, #022f7a))', selectedShadow: 'var(--button-outline-shadow-selected, var(--color-btn-outline-selected-shadow, inset 0 1px 0 rgba(2,26,74,0.2)))', - disabledText: 'rgba(3,73,180,0.5)', - disabledBg: '#e7ecf0', + disabledText: + 'var(--button-outline-fgColor-disabled, var(--color-btn-outline-disabled-text, rgba(3,73,180,0.5)))', + disabledBg: 'var(--button-outline-bgColor-disabled, var(--color-btn-outline-disabled-bg, #e7ecf0))', disabledCounterBg: 'var(--buttonCounter-outline-bgColor-disabled, var(--color-btn-outline-disabled-counter-bg, rgba(3,73,180,0.05)))', counterBg: 'var(--buttonCounter-outline-bgColor-rest, var(--color-btn-outline-counter-bg, #0969da1a))', @@ -319,26 +320,26 @@ const colors = { 'var(--buttonCounter-outline-fgColor-disabled, var(--color-btn-outline-disabled-counter-fg, rgba(3,73,180,0.5)))', }, danger: { - text: '#86061d', + text: 'var(--button-danger-fgColor-rest, var(--color-btn-danger-text, #86061d))', hoverText: 'var(--button-danger-fgColor-hover, var(--color-btn-danger-hover-text, #ffffff))', - hoverBg: '#a0111f', - hoverBorder: '#6e011a', + hoverBg: 'var(--button-danger-bgColor-hover, var(--color-btn-danger-hover-bg, #a0111f))', + hoverBorder: 'var(--button-danger-borderColor-hover, var(--color-btn-danger-hover-border, #6e011a))', hoverShadow: 'var(--shadow-resting-small, var(--color-btn-danger-hover-shadow, 0 1px 0 rgba(1,4,9,0.1)))', hoverInsetShadow: 'var(--shadow-highlight, var(--color-btn-danger-hover-inset-shadow, inset 0 1px 0 rgba(255,255,255,0.03)))', hoverCounterBg: 'var(--buttonCounter-danger-bgColor-hover, var(--color-btn-danger-hover-counter-bg, rgba(255,255,255,0.2)))', selectedText: 'var(--button-danger-fgColor-active, var(--color-btn-danger-selected-text, #ffffff))', - selectedBg: '#6e011a', - selectedBorder: '#6e011a', + selectedBg: 'var(--button-danger-bgColor-active, var(--color-btn-danger-selected-bg, #6e011a))', + selectedBorder: 'var(--button-danger-borderColor-active, var(--color-btn-danger-selected-border, #6e011a))', selectedShadow: 'var(--button-danger-shadow-selected, var(--color-btn-danger-selected-shadow, inset 0 1px 0 rgba(67,0,17,0.2)))', disabledText: 'var(--button-danger-fgColor-disabled, var(--color-btn-danger-disabled-text, rgba(160,17,31,0.5)))', - disabledBg: '#e7ecf0', + disabledBg: 'var(--button-danger-bgColor-disabled, var(--color-btn-danger-disabled-bg, #e7ecf0))', disabledCounterBg: 'var(--buttonCounter-danger-bgColor-disabled, var(--color-btn-danger-disabled-counter-bg, rgba(160,17,31,0.05)))', counterBg: 'var(--buttonCounter-danger-bgColor-rest, var(--color-btn-danger-counter-bg, rgba(160,17,31,0.1)))', - icon: '#86061d', + icon: 'var(--button-danger-iconColor-rest, var(--color-btn-danger-icon, #86061d))', hoverIcon: 'var(--button-danger-iconColor-hover, var(--color-btn-danger-hover-icon, #ffffff))', counterFg: 'var(--buttonCounter-danger-fgColor-rest, var(--color-btn-danger-counter-fg, #86061d))', hoverCounterFg: 'var(--buttonCounter-danger-fgColor-hover, var(--color-btn-danger-hover-counter-fg, #ffffff))', @@ -355,33 +356,36 @@ const colors = { borderHover: 'var(--underlineNav-borderColor-hover, var(--color-underlinenav-border-hover, rgba(172,182,192,0.2)))', }, actionListItem: { - inlineDivider: '#88929d', + inlineDivider: 'var(--borderColor-muted, var(--color-action-list-item-inline-divider, #88929d))', default: { - hoverBg: '#e7ecf0', - hoverBorder: '#88929d', - activeBg: '#ced5dc', - activeBorder: '#20252c', - selectedBg: '#ced5dc', + hoverBg: 'var(--control-transparent-bgColor-hover, var(--color-action-list-item-default-hover-bg, #e7ecf0))', + hoverBorder: + 'var(--control-transparent-borderColor-hover, var(--color-action-list-item-default-hover-border, #88929d))', + activeBg: 'var(--control-transparent-bgColor-active, var(--color-action-list-item-default-active-bg, #ced5dc))', + activeBorder: + 'var(--control-transparent-borderColor-active, var(--color-action-list-item-default-active-border, #20252c))', + selectedBg: + 'var(--control-transparent-bgColor-selected, var(--color-action-list-item-default-selected-bg, #ced5dc))', }, danger: { - hoverBg: '#a0111f', - activeBg: '#6e011a', - hoverText: '#ffffff', + hoverBg: 'var(--control-danger-bgColor-hover, var(--color-action-list-item-danger-hover-bg, #a0111f))', + activeBg: 'var(--control-danger-bgColor-active, var(--color-action-list-item-danger-active-bg, #6e011a))', + hoverText: 'var(--control-danger-fgColor-hover, var(--color-action-list-item-danger-hover-text, #ffffff))', }, }, switchTrack: { - bg: '#66707b', - hoverBg: 'hsla(211,9%,47%,1)', - activeBg: 'hsla(211,9%,49%,1)', + bg: 'var(--controlTrack-bgColor-rest, var(--color-switch-track-bg, #66707b))', + hoverBg: 'var(--controlTrack-bgColor-hover, var(--color-switch-track-hover-bg, hsla(211,9%,47%,1)))', + activeBg: 'var(--controlTrack-bgColor-active, var(--color-switch-track-active-bg, hsla(211,9%,49%,1)))', disabledBg: 'var(--controlTrack-bgColor-disabled, var(--color-switch-track-disabled-bg, #88929d))', - fg: '#ffffff', - disabledFg: '#ffffff', + fg: 'var(--controlTrack-fgColor-rest, var(--color-switch-track-fg, #ffffff))', + disabledFg: 'var(--controlTrack-fgColor-disabled, var(--color-switch-track-disabled-fg, #ffffff))', border: 'var(--controlTrack-borderColor-rest, var(--color-switch-track-border, transparent))', checked: { bg: 'var(--control-checked-bgColor-rest, var(--color-switch-track-checked-bg, #0349b4))', hoverBg: 'var(--control-checked-bgColor-hover, var(--color-switch-track-checked-hover-bg, #0860CA))', activeBg: 'var(--control-checked-bgColor-active, var(--color-switch-track-checked-active-bg, #0757BA))', - fg: '#ffffff', + fg: 'var(--control-checked-fgColor-rest, var(--color-switch-track-checked-fg, #ffffff))', disabledFg: 'var(--control-checked-fgColor-disabled, var(--color-switch-track-checked-disabled-fg, #ffffff))', border: 'var(--borderColor-transparent, var(--color-switch-track-checked-border, transparent))', }, @@ -389,11 +393,11 @@ const colors = { switchKnob: { bg: 'var(--controlKnob-bgColor-rest, var(--color-switch-knob-bg, #ffffff))', disabledBg: 'var(--controlKnob-bgColor-disabled, var(--color-switch-knob-disabled-bg, #e7ecf0))', - border: '#20252c', + border: 'var(--controlKnob-borderColor-rest, var(--color-switch-knob-border, #20252c))', checked: { bg: 'var(--controlKnob-bgColor-checked, var(--color-switch-knob-checked-bg, #ffffff))', disabledBg: 'var(--controlKnob-bgColor-disabled, var(--color-switch-knob-checked-disabled-bg, #e7ecf0))', - border: '#0349b4', + border: 'var(--controlKnob-borderColor-checked, var(--color-switch-knob-checked-border, #0349b4))', }, }, segmentedControl: { @@ -414,28 +418,28 @@ const colors = { }, treeViewItem: { chevron: { - hoverBg: '#ced5dc', + hoverBg: 'var(--control-transparent-bgColor-hover, var(--color-tree-view-item-chevron-hover-bg, #ced5dc))', }, directory: { fill: 'var(--treeViewItem-leadingVisual-bgColor-rest, var(--color-tree-view-item-chevron-directory-fill, #368cf9))', }, }, fg: { - default: '#0e1116', - muted: '#0e1116', + default: 'var(--fgColor-default, var(--color-fg-default, #0e1116))', + muted: 'var(--fgColor-muted, var(--color-fg-muted, #0e1116))', subtle: 'var(--fgColor-muted, var(--color-fg-subtle, #66707b))', onEmphasis: 'var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff))', }, canvas: { default: 'var(--bgColor-default, var(--color-canvas-default, #ffffff))', overlay: 'var(--overlay-bgColor, var(--color-canvas-overlay, #ffffff))', - inset: '#ffffff', - subtle: '#e7ecf0', + inset: 'var(--bgColor-inset, var(--color-canvas-inset, #ffffff))', + subtle: 'var(--bgColor-muted, var(--color-canvas-subtle, #e7ecf0))', }, border: { - default: '#20252c', - muted: '#88929d', - subtle: 'rgba(1,4,9,0.8)', + default: 'var(--borderColor-default, var(--color-border-default, #20252c))', + muted: 'var(--borderColor-muted, var(--color-border-muted, #88929d))', + subtle: 'var(--borderColor-muted, var(--color-border-subtle, rgba(1,4,9,0.8)))', }, shadow: { small: 'var(--shadow-resting-small, var(--color-shadow-small, 0 1px 0 rgba(1,4,9,0.04)))', @@ -447,36 +451,36 @@ const colors = { emphasisPlus: 'var(--bgColor-emphasis, var(--color-neutral-emphasis-plus, #0e1116))', emphasis: 'var(--bgColor-neutral-emphasis, var(--color-neutral-emphasis, #66707b))', muted: 'var(--borderColor-neutral-muted, var(--color-neutral-muted, rgba(172,182,192,0.2)))', - subtle: '#e7ecf0', + subtle: 'var(--bgColor-neutral-muted, var(--color-neutral-subtle, #e7ecf0))', }, accent: { fg: 'var(--fgColor-accent, var(--color-accent-fg, #0349b4))', emphasis: 'var(--bgColor-accent-emphasis, var(--color-accent-emphasis, #0349b4))', - muted: '#368cf9', + muted: 'var(--borderColor-accent-muted, var(--color-accent-muted, #368cf9))', subtle: 'var(--bgColor-accent-muted, var(--color-accent-subtle, #dff7ff))', }, success: { fg: 'var(--fgColor-success, var(--color-success-fg, #055d20))', - emphasis: '#055d20', - muted: '#26a148', + emphasis: 'var(--bgColor-success-emphasis, var(--color-success-emphasis, #055d20))', + muted: 'var(--borderColor-success-muted, var(--color-success-muted, #26a148))', subtle: 'var(--bgColor-success-muted, var(--color-success-subtle, #d2fedb))', }, attention: { fg: 'var(--fgColor-attention, var(--color-attention-fg, #744500))', - emphasis: '#744500', - muted: '#b58407', + emphasis: 'var(--bgColor-attention-emphasis, var(--color-attention-emphasis, #744500))', + muted: 'var(--borderColor-attention-muted, var(--color-attention-muted, #b58407))', subtle: 'var(--bgColor-attention-muted, var(--color-attention-subtle, #fcf7be))', }, severe: { fg: 'var(--fgColor-severe, var(--color-severe-fg, #873800))', emphasis: 'var(--bgColor-severe-emphasis, var(--color-severe-emphasis, #873800))', - muted: '#dc6d1a', + muted: 'var(--borderColor-severe-muted, var(--color-severe-muted, #dc6d1a))', subtle: 'var(--bgColor-severe-muted, var(--color-severe-subtle, #fff2d5))', }, danger: { fg: 'var(--fgColor-danger, var(--color-danger-fg, #d1242f))', emphasis: 'var(--borderColor-danger-emphasis, var(--color-danger-emphasis, #a0111f))', - muted: '#ee5a5d', + muted: 'var(--borderColor-danger-muted, var(--color-danger-muted, #ee5a5d))', subtle: 'var(--bgColor-danger-muted, var(--color-danger-subtle, #fff0ee))', }, open: { @@ -494,13 +498,13 @@ const colors = { done: { fg: 'var(--fgColor-done, var(--color-done-fg, #622cbc))', emphasis: 'var(--bgColor-done-emphasis, var(--color-done-emphasis, #622cbc))', - muted: '#a371f7', + muted: 'var(--borderColor-done-muted, var(--color-done-muted, #a371f7))', subtle: 'var(--bgColor-done-muted, var(--color-done-subtle, #faf0fe))', }, sponsors: { fg: 'var(--fgColor-sponsors, var(--color-sponsors-fg, #971368))', emphasis: 'var(--bgColor-sponsors-emphasis, var(--color-sponsors-emphasis, #971368))', - muted: '#ed4baf', + muted: 'var(--borderColor-sponsors-muted, var(--color-sponsors-muted, #ed4baf))', subtle: 'var(--bgColor-sponsors-muted, var(--color-sponsors-subtle, #feeff7))', }, primer: { diff --git a/src/legacy-theme/ts/colors/light_tritanopia.ts b/src/legacy-theme/ts/colors/light_tritanopia.ts index ab7fc7ecb2d..6174f94224d 100644 --- a/src/legacy-theme/ts/colors/light_tritanopia.ts +++ b/src/legacy-theme/ts/colors/light_tritanopia.ts @@ -9,16 +9,16 @@ const colors = { addition: { numText: 'var(--diffBlob-addition-fgColor-num, var(--color-diff-blob-addition-num-text, #24292f))', fg: 'var(--diffBlob-addition-fgColor-text, var(--color-diff-blob-addition-fg, #24292f))', - numBg: 'rgba(84,174,255,0.4)', - lineBg: 'rgba(221,244,255,0.5)', - wordBg: 'rgba(84,174,255,0.4)', + numBg: 'var(--diffBlob-addition-bgColor-num, var(--color-diff-blob-addition-num-bg, rgba(84,174,255,0.4)))', + lineBg: 'var(--diffBlob-addition-bgColor-line, var(--color-diff-blob-addition-line-bg, rgba(221,244,255,0.5)))', + wordBg: 'var(--diffBlob-addition-bgColor-word, var(--color-diff-blob-addition-word-bg, rgba(84,174,255,0.4)))', }, deletion: { numText: 'var(--diffBlob-deletion-fgColor-num, var(--color-diff-blob-deletion-num-text, #24292f))', fg: 'var(--diffBlob-deletion-fgColor-text, var(--color-diff-blob-deletion-fg, #24292f))', - numBg: 'rgba(255,129,130,0.4)', - lineBg: 'rgba(255,235,233,0.5)', - wordBg: 'rgba(255,171,168,0.5)', + numBg: 'var(--diffBlob-deletion-bgColor-num, var(--color-diff-blob-deletion-num-bg, rgba(255,129,130,0.4)))', + lineBg: 'var(--diffBlob-deletion-bgColor-line, var(--color-diff-blob-deletion-line-bg, rgba(255,235,233,0.5)))', + wordBg: 'var(--diffBlob-deletion-bgColor-word, var(--color-diff-blob-deletion-word-bg, rgba(255,171,168,0.5)))', }, hunk: { numBg: 'var(--diffBlob-hunk-bgColor-num, var(--color-diff-blob-hunk-num-bg, rgba(84,174,255,0.4)))', @@ -193,7 +193,7 @@ const colors = { }, control: { borderColor: { - emphasis: 'var(var(--color-control-border-color-emphasis, #858F99)', + emphasis: 'var(--control-borderColor-emphasis, var(--color-control-border-color-emphasis, #858F99))', }, }, avatar: { @@ -280,7 +280,7 @@ const colors = { shadow: 'var(--shadow-resting-small, var(--color-btn-primary-shadow, 0 1px 0 rgba(27,31,36,0.1)))', insetShadow: 'var(--shadow-highlight, var(--color-btn-primary-inset-shadow, inset 0 1px 0 rgba(255,255,255,0.03)))', - hoverBg: '#0969da', + hoverBg: 'var(--button-primary-bgColor-hover, var(--color-btn-primary-hover-bg, #0969da))', hoverBorder: 'var(--button-primary-borderColor-hover, var(--color-btn-primary-hover-border, rgba(27,31,36,0.15)))', selectedBg: 'var(--button-primary-bgColor-active, var(--color-btn-primary-selected-bg, hsla(212,92%,43%,1)))', @@ -288,7 +288,7 @@ const colors = { 'var(--button-primary-shadow-selected, var(--color-btn-primary-selected-shadow, inset 0 1px 0 rgba(0,33,85,0.2)))', disabledText: 'var(--button-primary-fgColor-disabled, var(--color-btn-primary-disabled-text, rgba(255,255,255,0.8)))', - disabledBg: '#80ccff', + disabledBg: 'var(--button-primary-bgColor-disabled, var(--color-btn-primary-disabled-bg, #80ccff))', disabledBorder: 'var(--button-primary-borderColor-disabled, var(--color-btn-primary-disabled-border, rgba(27,31,36,0.15)))', icon: 'var(--button-primary-iconColor-rest, var(--color-btn-primary-icon, rgba(255,255,255,0.8)))', @@ -434,8 +434,8 @@ const colors = { }, }, fg: { - default: '#24292f', - muted: '#57606a', + default: 'var(--fgColor-default, var(--color-fg-default, #24292f))', + muted: 'var(--fgColor-muted, var(--color-fg-muted, #57606a))', subtle: 'var(--fgColor-muted, var(--color-fg-subtle, #6e7781))', onEmphasis: 'var(--fgColor-onEmphasis, var(--color-fg-on-emphasis, #ffffff))', }, @@ -470,7 +470,7 @@ const colors = { }, success: { fg: 'var(--fgColor-success, var(--color-success-fg, #0969da))', - emphasis: '#0969da', + emphasis: 'var(--bgColor-success-emphasis, var(--color-success-emphasis, #0969da))', muted: 'var(--borderColor-success-muted, var(--color-success-muted, rgba(84,174,255,0.4)))', subtle: 'var(--bgColor-success-muted, var(--color-success-subtle, #ddf4ff))', }, @@ -487,22 +487,22 @@ const colors = { subtle: 'var(--bgColor-severe-muted, var(--color-severe-subtle, #ffebe9))', }, danger: { - fg: '#cf222e', + fg: 'var(--fgColor-danger, var(--color-danger-fg, #cf222e))', emphasis: 'var(--borderColor-danger-emphasis, var(--color-danger-emphasis, #cf222e))', muted: 'var(--borderColor-danger-muted, var(--color-danger-muted, rgba(255,129,130,0.4)))', subtle: 'var(--bgColor-danger-muted, var(--color-danger-subtle, #ffebe9))', }, open: { - fg: '#cf222e', - emphasis: '#fa4549', - muted: 'rgba(255,129,130,0.4)', - subtle: '#ffebe9', + fg: 'var(--fgColor-open, var(--color-open-fg, #cf222e))', + emphasis: 'var(--bgColor-open-emphasis, var(--color-open-emphasis, #fa4549))', + muted: 'var(--borderColor-open-muted, var(--color-open-muted, rgba(255,129,130,0.4)))', + subtle: 'var(--bgColor-open-muted, var(--color-open-subtle, #ffebe9))', }, closed: { - fg: '#6e7781', - emphasis: '#6e7781', - muted: 'rgba(175,184,193,0.4)', - subtle: '#f6f8fa', + fg: 'var(--fgColor-closed, var(--color-closed-fg, #6e7781))', + emphasis: 'var(--bgColor-closed-emphasis, var(--color-closed-emphasis, #6e7781))', + muted: 'var(--borderColor-closed-muted, var(--color-closed-muted, rgba(175,184,193,0.4)))', + subtle: 'var(--bgColor-closed-muted, var(--color-closed-subtle, #f6f8fa))', }, done: { fg: 'var(--fgColor-done, var(--color-done-fg, #8250df))', From be64070a9f52eb0cc5ccc3fd8ee4302e25e15519 Mon Sep 17 00:00:00 2001 From: "primer[bot]" <119360173+primer[bot]@users.noreply.github.com> Date: Mon, 29 Jan 2024 14:06:15 -0800 Subject: [PATCH 10/10] Version Packages (#4183) Co-authored-by: github-actions[bot] --- .changeset/afraid-teachers-do.md | 6 ------ .changeset/thirty-mirrors-switch.md | 5 ----- CHANGELOG.md | 11 +++++++++++ package.json | 2 +- 4 files changed, 12 insertions(+), 12 deletions(-) delete mode 100644 .changeset/afraid-teachers-do.md delete mode 100644 .changeset/thirty-mirrors-switch.md diff --git a/.changeset/afraid-teachers-do.md b/.changeset/afraid-teachers-do.md deleted file mode 100644 index 5212dfc34f7..00000000000 --- a/.changeset/afraid-teachers-do.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -"@primer/react": minor ---- - -- Adds CSS variable color values to the legacy Primitive design tokens. -- Three values include: the new v8 color CSS variable, a fallback of the old color CSS variable, and the raw value. diff --git a/.changeset/thirty-mirrors-switch.md b/.changeset/thirty-mirrors-switch.md deleted file mode 100644 index 2eb14f67731..00000000000 --- a/.changeset/thirty-mirrors-switch.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@primer/react": patch ---- - -Add missing CSS vars to legacy-theme diff --git a/CHANGELOG.md b/CHANGELOG.md index b6dfa5fd350..e26ab97ab3c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,16 @@ # @primer/components +## 36.7.0 + +### Minor Changes + +- [#4157](https://github.com/primer/react/pull/4157) [`aafa257e1`](https://github.com/primer/react/commit/aafa257e1df4e0d73bb328edbfca2f23976d4756) Thanks [@langermank](https://github.com/langermank)! - - Adds CSS variable color values to the legacy Primitive design tokens. + - Three values include: the new v8 color CSS variable, a fallback of the old color CSS variable, and the raw value. + +### Patch Changes + +- [#4193](https://github.com/primer/react/pull/4193) [`c4193d680`](https://github.com/primer/react/commit/c4193d680b9b392bd1e60b1db1dd3efe0119af2d) Thanks [@langermank](https://github.com/langermank)! - Add missing CSS vars to legacy-theme + ## 36.6.0 ### Minor Changes diff --git a/package.json b/package.json index 9f4f0736c6a..d0ba99584b5 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@primer/react", - "version": "36.6.0", + "version": "36.7.0", "description": "An implementation of GitHub's Primer Design System using React", "main": "lib/index.js", "module": "lib-esm/index.js",