Merge pull request #1398 from primer/colors-v2

Add experimental color variables

Author: colebemis

.changeset/cyan-vans-shake.md

@@ -0,0 +1,5 @@
+---
+"@primer/css": patch
+---
+
+Add experimental color variables. **Warning: Do not use these color variables**

package.json

@@ -30,7 +30,7 @@
     "release": "changeset publish"
   },
   "dependencies": {
-    "@primer/primitives": "4.3.0"
+    "@primer/primitives": "4.3.1"
   },
   "devDependencies": {
     "@changesets/changelog-github": "0.4.0",

src/base/modes-v2.scss

@@ -0,0 +1,22 @@
+// EXPERIMENTAL. DO NOT USE.
+
+@import "../support/mixins/color-modes.scss";
+
+@import "@primer/primitives/dist/scss/colors_v2/_light.scss";
+@import "@primer/primitives/dist/scss/colors_v2/_dark.scss";
+@import "@primer/primitives/dist/scss/colors_v2/_dark_dimmed.scss";
+
+// Outputs the CSS variables
+// Use :root (html element) to define a default
+
+@include color-mode-theme(light, true) {
+  @include primer-colors-light;
+}
+
+@include color-mode-theme(dark) {
+  @include primer-colors-dark;
+}
+
+@include color-mode-theme(dark_dimmed) {
+  @include primer-colors-dark_dimmed;
+}

yarn.lock

@@ -760,10 +760,10 @@
     "@nodelib/fs.scandir" "2.1.4"
     fastq "^1.6.0"
 
-"@primer/[email protected].0":
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/@primer/primitives/-/primitives-4.3.0.tgz#446e868cd1c48437cbc3340c52b159ec2e015b78"
-  integrity sha512-djXxll2yVTufmhnHA1H9bMT8I3S0ID6GlSewAJvKHlv80I+5AoZASVBF+WedtH/SyloLM5wyk+Tqj1ZNmy2+RQ==
+"@primer/[email protected].1":
+  version "4.3.1"
+  resolved "https://registry.yarnpkg.com/@primer/primitives/-/primitives-4.3.1.tgz#34ca84cddc03daff72764cae4d509679df763aae"
+  integrity sha512-o9UFxVhKKZ+ryFx7H45xNC8rw98OPDsF2Lq5LNg+87yTKDu0Wc2qmhFRMrvMsFXCYMOJxkbgbhzVt/GG4CMqsA==
 
 "@sinonjs/commons@^1.7.0":
   version "1.8.2"