@primer/primitives 7.11.0-rc.f7ccc99 → 7.11.1-rc.5dc24db

package/dist/ts/colors/light_high_contrast.ts

@@ -187,6 +187,11 @@ export default {
       }
     }
   },
+  "control": {
+    "borderColor": {
+      "emphasis": "#20252c"
+    }
+  },
   "avatar": {
     "bg": "#ffffff",
     "border": "rgba(1,4,9,0.8)",
@@ -334,24 +339,36 @@ export default {
     }
   },
   "switchTrack": {
-    "bg": "#ffffff",
-    "border": "#20252c",
+    "bg": "#66707b",
+    "hoverBg": "hsla(211,9%,47%,1)",
+    "activeBg": "hsla(211,9%,49%,1)",
+    "disabledBg": "#88929d",
+    "fg": "#ffffff",
+    "disabledFg": "#ffffff",
+    "border": "rgba(0,0,0,0)",
     "checked": {
-      "bg": "#dff7ff",
-      "hoverBg": "#9cd7ff",
-      "activeBg": "#67b3fd",
-      "border": "#0349b4"
+      "bg": "#0349b4",
+      "hoverBg": "#0860CA",
+      "activeBg": "#0757BA",
+      "fg": "#ffffff",
+      "disabledFg": "#ffffff",
+      "border": "rgba(0,0,0,0)"
     }
   },
   "switchKnob": {
+    "bg": "#ffffff",
+    "disabledBg": "#e7ecf0",
+    "border": "#20252c",
     "checked": {
-      "bg": "#0349b4",
-      "disabledBg": "#66707b"
+      "bg": "#ffffff",
+      "disabledBg": "#e7ecf0",
+      "border": "#0349b4"
     }
   },
   "segmentedControl": {
     "bg": "#e7ecf0",
     "button": {
+      "bg": "#ffffff",
       "hover": {
         "bg": "rgba(172,182,192,0.2)"
       },
@@ -359,7 +376,7 @@ export default {
         "bg": "rgba(172,182,192,0.4)"
       },
       "selected": {
-        "border": "#66707b"
+        "border": "#88929d"
       }
     }
   },

package/dist/ts/colors/light_tritanopia.ts

@@ -187,6 +187,11 @@ export default {
       }
     }
   },
+  "control": {
+    "borderColor": {
+      "emphasis": "#858F99"
+    }
+  },
   "avatar": {
     "bg": "#ffffff",
     "border": "rgba(27,31,36,0.15)",
@@ -335,23 +340,35 @@ export default {
   },
   "switchTrack": {
     "bg": "#eaeef2",
-    "border": "#afb8c1",
+    "hoverBg": "hsla(210,24%,90%,1)",
+    "activeBg": "hsla(210,24%,88%,1)",
+    "disabledBg": "#8c959f",
+    "fg": "#57606a",
+    "disabledFg": "#ffffff",
+    "border": "rgba(0,0,0,0)",
     "checked": {
-      "bg": "#ddf4ff",
-      "hoverBg": "#b6e3ff",
-      "activeBg": "#80ccff",
-      "border": "#54aeff"
+      "bg": "#0969da",
+      "hoverBg": "#0860CA",
+      "activeBg": "#0757BA",
+      "fg": "#ffffff",
+      "disabledFg": "#ffffff",
+      "border": "rgba(0,0,0,0)"
     }
   },
   "switchKnob": {
+    "bg": "#ffffff",
+    "disabledBg": "#f6f8fa",
+    "border": "#858F99",
     "checked": {
-      "bg": "#0969da",
-      "disabledBg": "#6e7781"
+      "bg": "#ffffff",
+      "disabledBg": "#f6f8fa",
+      "border": "#0969da"
     }
   },
   "segmentedControl": {
     "bg": "#eaeef2",
     "button": {
+      "bg": "#ffffff",
       "hover": {
         "bg": "rgba(175,184,193,0.2)"
       },
@@ -359,7 +376,7 @@ export default {
         "bg": "rgba(175,184,193,0.4)"
       },
       "selected": {
-        "border": "#6e7781"
+        "border": "#8c959f"
       }
     }
   },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/primitives",
-  "version": "7.11.0-rc.f7ccc99",
+  "version": "7.11.1-rc.5dc24db",
   "description": "Typography, spacing, and color primitives for Primer design system",
   "files": [
     "dist",
@@ -26,32 +26,33 @@
   },
   "homepage": "https://github.com/primer/primitives#readme",
   "scripts": {
-    "build": "ts-node ./script/build.ts && tsc --project tsconfig.build.json",
-    "build:color-tokens": "ts-node -r tsconfig-paths/register ./script/tempColorTokenBuild.ts",
+    "build": "ts-node ./scripts/build.ts && tsc --project tsconfig.build.json",
+    "build:v3": "ts-node -r tsconfig-paths/register ./scripts/buildV3.ts",
     "build:tokens": "node -e \"require('./build')._init()\"",
-    "build:new-tokens": "npm run build:tokens && npm run build:color-tokens",
+    "build:new-tokens": "npm run build:tokens && npm run build:v3",
+    "contrast-check": "npx ts-node ./scripts/color-contrast.ts",
     "format": "prettier --write  '**/*.{js,jsx,ts,tsx,md,mdx,css}'",
     "format:check": "prettier --check '**/*.{js,jsx,ts,tsx,md,mdx,css}'",
-    "install:storybook": "cd docs/storybook && npm install",
+    "install:docs": "cd docs && npm ci --legacy-peer-deps --no-audit --no-fund --include=dev",
+    "install:storybook": "cd docs/storybook && npm ci --legacy-peer-deps --no-audit --no-fund",
     "lint": "eslint '**/*.{js,ts,tsx,md,mdx}' --max-warnings=0 --config .eslintrc.js",
     "lint:fix": "eslint '**/*.{js,ts,tsx,md,mdx}' --fix --max-warnings=0 --config .eslintrc.js",
-    "postbuild": "ts-node ./script/color-contrast.ts",
+    "postbuild": "ts-node ./scripts/color-contrast.ts",
     "prebuild": "rm -rf dist",
     "prebuild:tokens": "rm -rf tokens-v2-private",
-    "prebuild:color-tokens": "rm -rf tokens-v2-private/**/**/color",
-    "prepack": "yarn build && yarn build:tokens",
-    "prepare": "husky install && npm run install:storybook",
+    "prebuild:v3": "rm -rf tokens-v3-private",
+    "prepack": "npm run build && npm run build:tokens",
+    "prepare": "husky install && npm run install:docs && npm run install:storybook",
     "release": "changeset publish",
-    "start:storybook": "npm run build:color-tokens && cd docs/storybook && npm run storybook",
+    "start:storybook": "npm run build:v3 && cd docs/storybook && npm run storybook",
     "test": "jest --verbose --coverage",
-    "watch": "ls data/**/*.scss script/**/*.ts | entr -s 'yarn build'"
+    "watch": "ls data/**/*.scss scripts/**/*.ts | entr -s 'npm run build'"
   },
   "prettier": "@github/prettier-config",
   "devDependencies": {
     "@changesets/changelog-github": "^0.3.0",
     "@changesets/cli": "^2.22.0",
     "@github/prettier-config": "^0.0.6",
-    "@types/chalk": "^2.2.0",
     "@types/flat": "^5.0.1",
     "@types/fs-extra": "^9.0.13",
     "@types/jest": "^29.1.2",
@@ -61,12 +62,12 @@
     "@typescript-eslint/eslint-plugin": "^5.45.0",
     "@typescript-eslint/parser": "^5.45.0",
     "camelcase-keys": "^6.2.2",
-    "chalk": "^4.1.0",
     "color-blend": "^4.0.0",
     "color2k": "^2.0.0",
     "console-table-printer": "^2.11.1",
     "deepmerge": "^4.2.2",
     "eslint": "^8.12.0",
+    "eslint-config-prettier": "^8.6.0",
     "eslint-import-resolver-typescript": "^2.7.0",
     "eslint-plugin-github": "^4.3.6",
     "eslint-plugin-jsx-a11y": "^6.5.1",
@@ -80,9 +81,9 @@
     "jest": "29.3",
     "json5": "^2.2.1",
     "lodash": "^4.17.20",
-    "mkdirp": "^1.0.4",
+    "mkdirp": "^2.1.1",
     "prettier": "^2.7.1",
-    "style-dictionary": "3.7.1",
+    "style-dictionary": "^3.7.2",
     "ts-jest": "^29.0.3",
     "ts-node": "^10.9.1",
     "tsconfig-paths": "^4.1.0",

package/tokens-v2-private/css/tokens/base/size/size.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 :root {

package/tokens-v2-private/css/tokens/base/typography/typography.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 :root {

package/tokens-v2-private/css/tokens/functional/size/border.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 :root {

package/tokens-v2-private/css/tokens/functional/size/breakpoints.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 :root {

package/tokens-v2-private/css/tokens/functional/size/size-coarse.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/css/tokens/functional/size/size-fine.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/css/tokens/functional/size/size.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 :root {

package/tokens-v2-private/css/tokens/functional/typography/typography.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 :root {

package/tokens-v2-private/js/module/tokens/base/size/size.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 module.exports = {

package/tokens-v2-private/js/module/tokens/base/typography/typography.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 module.exports = {

package/tokens-v2-private/js/module/tokens/functional/size/border.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 module.exports = {

package/tokens-v2-private/js/module/tokens/functional/size/breakpoints.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 module.exports = {

package/tokens-v2-private/js/module/tokens/functional/size/size-coarse.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 module.exports = {

package/tokens-v2-private/js/module/tokens/functional/size/size-fine.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 module.exports = {

package/tokens-v2-private/js/module/tokens/functional/size/size.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 module.exports = {

package/tokens-v2-private/js/module/tokens/functional/size/viewport.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 module.exports = {

package/tokens-v2-private/js/module/tokens/functional/typography/typography.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 module.exports = {

package/tokens-v2-private/js/tokens/base/size/size.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 export const BaseSize4 = "0.25rem";

package/tokens-v2-private/js/tokens/base/typography/typography.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 export const BaseTextWeightLight = "300";

package/tokens-v2-private/js/tokens/functional/size/border.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 export const PrimerBorderInsetThin = "inset 0 0 0 max(1px, 0.0625rem)";

package/tokens-v2-private/js/tokens/functional/size/breakpoints.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 export const PrimerBreakpointXsmall = "20rem";

package/tokens-v2-private/js/tokens/functional/size/size-coarse.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 export const PrimerControlMinTargetAuto = "2.75rem";

package/tokens-v2-private/js/tokens/functional/size/size-fine.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 export const PrimerControlMinTargetAuto = "1rem";

package/tokens-v2-private/js/tokens/functional/size/size.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 export const PrimerControlMinTargetFine = "1rem";

package/tokens-v2-private/js/tokens/functional/size/viewport.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 export const PrimerViewportRangeNarrow = "(max-width: calc(48rem - 0.02px))";

package/tokens-v2-private/js/tokens/functional/typography/typography.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 export const PrimerFontStackSystem = "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji'";

package/tokens-v2-private/scss/tokens/base/size/size.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Tue, 06 Dec 2022 13:48:57 GMT
+// Generated on Fri, 10 Feb 2023 19:30:57 GMT
 
 $base-size-128: 8rem;
 $base-size-112: 7rem;

package/tokens-v2-private/scss/tokens/base/typography/typography.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Tue, 06 Dec 2022 13:48:57 GMT
+// Generated on Fri, 10 Feb 2023 19:30:57 GMT
 
 $base-text-weight-semibold: 600;
 $base-text-weight-medium: 500;

package/tokens-v2-private/scss/tokens/functional/size/border.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Tue, 06 Dec 2022 13:48:57 GMT
+// Generated on Fri, 10 Feb 2023 19:30:57 GMT
 
 $primer-borderRadius-full: 100vh;
 $primer-borderRadius-large: 0.75rem;

package/tokens-v2-private/scss/tokens/functional/size/breakpoints.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Tue, 06 Dec 2022 13:48:57 GMT
+// Generated on Fri, 10 Feb 2023 19:30:57 GMT
 
 $primer-breakpoint-xxlarge: 90rem;
 $primer-breakpoint-xlarge: 80rem;

package/tokens-v2-private/scss/tokens/functional/size/size-coarse.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Tue, 06 Dec 2022 13:48:57 GMT
+// Generated on Fri, 10 Feb 2023 19:30:57 GMT
 
 $primer-controlStack-medium-gap-auto: $base-size-12;
 $primer-controlStack-small-gap-auto: $base-size-16;

package/tokens-v2-private/scss/tokens/functional/size/size-fine.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Tue, 06 Dec 2022 13:48:57 GMT
+// Generated on Fri, 10 Feb 2023 19:30:57 GMT
 
 $primer-controlStack-medium-gap-auto: $base-size-8;
 $primer-controlStack-small-gap-auto: $base-size-8;

package/tokens-v2-private/scss/tokens/functional/size/size.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Tue, 06 Dec 2022 13:48:57 GMT
+// Generated on Fri, 10 Feb 2023 19:30:57 GMT
 
 $primer-controlStack-large-gap-spacious: $base-size-12;
 $primer-controlStack-large-gap-condensed: $base-size-8;

package/tokens-v2-private/scss/tokens/functional/size/viewport.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Tue, 06 Dec 2022 13:48:57 GMT
+// Generated on Fri, 10 Feb 2023 19:30:57 GMT
 
 $primer-viewportRange-landscape: (orientation: landscape);
 $primer-viewportRange-portrait: (orientation: portrait);

package/tokens-v2-private/scss/tokens/functional/typography/typography.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Tue, 06 Dec 2022 13:48:57 GMT
+// Generated on Fri, 10 Feb 2023 19:30:57 GMT
 
 $primer-text-codeInline-size: 0.9285em;
 $primer-text-codeBlock-lineHeight: calc(20/13);

package/tokens-v2-private/ts/tokens/base/size/size.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/ts/tokens/base/size/size.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/ts/tokens/base/typography/typography.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/ts/tokens/base/typography/typography.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/ts/tokens/functional/size/border.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/ts/tokens/functional/size/border.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/ts/tokens/functional/size/breakpoints.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/ts/tokens/functional/size/breakpoints.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/ts/tokens/functional/size/size-coarse.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/ts/tokens/functional/size/size-coarse.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */
 
 

package/tokens-v2-private/ts/tokens/functional/size/size-fine.d.ts

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 06 Dec 2022 13:48:57 GMT
+ * Generated on Fri, 10 Feb 2023 19:30:57 GMT
  */