diff --git a/.changeset/quick-camels-promise.md b/.changeset/quick-camels-promise.md new file mode 100644 index 000000000..848b32775 --- /dev/null +++ b/.changeset/quick-camels-promise.md @@ -0,0 +1,8 @@ +--- +"@primer/primitives": patch +--- + +- Minor changes to prepare for adding more borders to high contrast themes +- Adds tooltip pattern to allow for an inverse style in dark high contrast + + diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-colorblind-fgColor-onInverse-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-colorblind-fgColor-onInverse-linux.png new file mode 100644 index 000000000..c891d74a3 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-colorblind-fgColor-onInverse-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-colorblind-tooltip-bgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-colorblind-tooltip-bgColor-linux.png new file mode 100644 index 000000000..a90e0cb8d Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-colorblind-tooltip-bgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-colorblind-tooltip-fgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-colorblind-tooltip-fgColor-linux.png new file mode 100644 index 000000000..43f24b870 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-colorblind-tooltip-fgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-fgColor-onInverse-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-fgColor-onInverse-linux.png new file mode 100644 index 000000000..c891d74a3 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-fgColor-onInverse-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-controlTrack-borderColor-rest-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-controlTrack-borderColor-rest-linux.png index 190b0a621..42c2f04c0 100644 Binary files a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-controlTrack-borderColor-rest-linux.png and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-controlTrack-borderColor-rest-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-fgColor-onInverse-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-fgColor-onInverse-linux.png new file mode 100644 index 000000000..8b3404f1b Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-fgColor-onInverse-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-tooltip-bgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-tooltip-bgColor-linux.png new file mode 100644 index 000000000..10f7d8529 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-tooltip-bgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-tooltip-fgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-tooltip-fgColor-linux.png new file mode 100644 index 000000000..8b3404f1b Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-high-contrast-tooltip-fgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tooltip-bgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tooltip-bgColor-linux.png new file mode 100644 index 000000000..a90e0cb8d Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tooltip-bgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tooltip-fgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tooltip-fgColor-linux.png new file mode 100644 index 000000000..43f24b870 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tooltip-fgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tritanopia-fgColor-onInverse-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tritanopia-fgColor-onInverse-linux.png new file mode 100644 index 000000000..c891d74a3 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tritanopia-fgColor-onInverse-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tritanopia-tooltip-bgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tritanopia-tooltip-bgColor-linux.png new file mode 100644 index 000000000..a90e0cb8d Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tritanopia-tooltip-bgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tritanopia-tooltip-fgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tritanopia-tooltip-fgColor-linux.png new file mode 100644 index 000000000..43f24b870 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-dark-tritanopia-tooltip-fgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-colorblind-fgColor-onInverse-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-colorblind-fgColor-onInverse-linux.png new file mode 100644 index 000000000..7bc68449b Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-colorblind-fgColor-onInverse-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-colorblind-tooltip-bgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-colorblind-tooltip-bgColor-linux.png new file mode 100644 index 000000000..842dfb3f5 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-colorblind-tooltip-bgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-colorblind-tooltip-fgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-colorblind-tooltip-fgColor-linux.png new file mode 100644 index 000000000..7bc68449b Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-colorblind-tooltip-fgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-fgColor-onInverse-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-fgColor-onInverse-linux.png new file mode 100644 index 000000000..7bc68449b Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-fgColor-onInverse-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-controlTrack-borderColor-rest-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-controlTrack-borderColor-rest-linux.png index 924f8dc08..2671828d6 100644 Binary files a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-controlTrack-borderColor-rest-linux.png and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-controlTrack-borderColor-rest-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-fgColor-onInverse-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-fgColor-onInverse-linux.png new file mode 100644 index 000000000..7bc68449b Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-fgColor-onInverse-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-tooltip-bgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-tooltip-bgColor-linux.png new file mode 100644 index 000000000..3a21e2a39 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-tooltip-bgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-tooltip-fgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-tooltip-fgColor-linux.png new file mode 100644 index 000000000..7bc68449b Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-high-contrast-tooltip-fgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tooltip-bgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tooltip-bgColor-linux.png new file mode 100644 index 000000000..842dfb3f5 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tooltip-bgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tooltip-fgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tooltip-fgColor-linux.png new file mode 100644 index 000000000..7bc68449b Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tooltip-fgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tritanopia-fgColor-onInverse-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tritanopia-fgColor-onInverse-linux.png new file mode 100644 index 000000000..7bc68449b Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tritanopia-fgColor-onInverse-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tritanopia-tooltip-bgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tritanopia-tooltip-bgColor-linux.png new file mode 100644 index 000000000..842dfb3f5 Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tritanopia-tooltip-bgColor-linux.png differ diff --git a/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tritanopia-tooltip-fgColor-linux.png b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tritanopia-tooltip-fgColor-linux.png new file mode 100644 index 000000000..7bc68449b Binary files /dev/null and b/.playwright/snapshots/storybook.test.ts-snapshots/storybook-all-color-swatches-light-tritanopia-tooltip-fgColor-linux.png differ diff --git a/blob-report/report.zip b/blob-report/report.zip index 4e6daf0d8..ca94215ae 100644 Binary files a/blob-report/report.zip and b/blob-report/report.zip differ diff --git a/docs/storybook/stories/Color/Patterns/AllPatterns.stories.tsx b/docs/storybook/stories/Color/Patterns/AllPatterns.stories.tsx index e2539cd79..5e75d782d 100644 --- a/docs/storybook/stories/Color/Patterns/AllPatterns.stories.tsx +++ b/docs/storybook/stories/Color/Patterns/AllPatterns.stories.tsx @@ -725,3 +725,56 @@ export const Selection = () => { ) } + +export const Tooltip = () => { + const data = getTokensByName(colorTokens, 'tooltip').map(token => { + return { + id: token.name, + ...token, + } + }) + return ( +
{row.value}
+ }, + }, + ]} + /> +