@primer/primitives 7.11.14 → 7.11.15-rc.06a09d3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/primitives",
-  "version": "7.11.14",
+  "version": "7.11.15-rc.06a09d3",
   "description": "Typography, spacing, and color primitives for Primer design system",
   "files": [
     "dist",
@@ -36,8 +36,9 @@
     "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 ci --legacy-peer-deps --no-audit --no-fund",
-    "lint": "eslint '**/*.{js,ts,tsx,md,mdx}' --max-warnings=0 --config .eslintrc.js",
+    "lint": "eslint '**/*.{js,ts,tsx,md,mdx}' --max-warnings=0 --config .eslintrc.js && npm run lint:tokens",
     "lint:fix": "eslint '**/*.{js,ts,tsx,md,mdx}' --fix --max-warnings=0 --config .eslintrc.js",
+    "lint:tokens": "ts-node ./scripts/validateTokenJson.ts",
     "prebuild": "rm -rf dist",
     "prebuild:tokens": "rm -rf tokens-v2-private",
     "prebuild:next": "rm -rf tokens-next-private",
@@ -54,6 +55,7 @@
     "@changesets/changelog-github": "^0.4.8",
     "@changesets/cli": "^2.22.0",
     "@github/prettier-config": "^0.0.6",
+    "@playwright/test": "^1.35.1",
     "@types/flat": "^5.0.1",
     "@types/jest": "^29.5.2",
     "@types/lodash": "^4.14.195",
@@ -87,6 +89,8 @@
     "ts-jest": "^29.1.1",
     "ts-node": "^10.9.1",
     "tsconfig-paths": "^4.2.0",
-    "typescript": "^5.1.6"
+    "typescript": "^5.1.6",
+    "zod": "^3.21.4",
+    "zod-validation-error": "^1.3.1"
   }
 }

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

@@ -5,10 +5,10 @@
   --borderWidth-thin: max(1px, 0.0625rem);
   --borderWidth-thick: max(2px, 0.125rem);
   --borderWidth-thicker: max(4px, 0.25rem);
-  --borderRadius-small: 3px;
-  --borderRadius-medium: 6px;
-  --borderRadius-large: 12px;
-  --borderRadius-full: 9999px;
+  --borderRadius-small: 0.1875rem;
+  --borderRadius-medium: 0.375rem;
+  --borderRadius-large: 0.75rem;
+  --borderRadius-full: 624.9375rem;
   --outline-focus-offset: -0.125rem;
   --outline-focus-width: 0.125rem;
 }

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

@@ -3,33 +3,33 @@
   --control-minTarget-coarse: 2.75rem;
   --control-xsmall-size: 1.5rem;
   --control-xsmall-lineBoxHeight: 1.25rem;
-  --control-xsmall-paddingBlock: calc((1.5rem - 1.25rem) / 2);
+  --control-xsmall-paddingBlock: 0.125rem;
   --control-xsmall-paddingInline-condensed: 0.25rem;
   --control-xsmall-paddingInline-normal: 0.5rem;
   --control-xsmall-paddingInline-spacious: 0.75rem;
   --control-xsmall-gap: 0.25rem;
   --control-small-size: 1.75rem;
   --control-small-lineBoxHeight: 1.25rem;
-  --control-small-paddingBlock: calc((1.75rem - 1.25rem) / 2);
+  --control-small-paddingBlock: 0.25rem;
   --control-small-paddingInline-condensed: 0.5rem;
   --control-small-paddingInline-normal: 0.75rem;
   --control-small-gap: 0.25rem;
   --control-medium-size: 2rem;
   --control-medium-lineBoxHeight: 1.25rem;
-  --control-medium-paddingBlock: calc((2rem - 1.25rem) / 2);
+  --control-medium-paddingBlock: 0.375rem;
   --control-medium-paddingInline-condensed: 0.5rem;
   --control-medium-paddingInline-normal: 0.75rem;
   --control-medium-paddingInline-spacious: 1rem;
   --control-medium-gap: 0.5rem;
   --control-large-size: 2.5rem;
   --control-large-lineBoxHeight: 1.25rem;
-  --control-large-paddingBlock: calc((2.5rem - 1.25rem) / 2);
+  --control-large-paddingBlock: 0.625rem;
   --control-large-paddingInline-normal: 0.75rem;
   --control-large-paddingInline-spacious: 1rem;
   --control-large-gap: 0.5rem;
   --control-xlarge-size: 3rem;
   --control-xlarge-lineBoxHeight: 1.25rem;
-  --control-xlarge-paddingBlock: calc((3rem - 1.25rem) / 2);
+  --control-xlarge-paddingBlock: 0.875rem;
   --control-xlarge-paddingInline-normal: 0.75rem;
   --control-xlarge-paddingInline-spacious: 1rem;
   --control-xlarge-gap: 0.5rem;

package/tokens-next-private/css/functional/themes/dark-colorblind.css

@@ -180,7 +180,7 @@
   --selectMenu-bgColor-active: #0c2d6b;
   --sideNav-bgColor-selected: #21262d;
   --timelineBadge-bgColor: #21262d;
-  --treeViewItem-leadingVisual-bgColor-rest: #7d8590;
+  --treeViewItem-leadingVisual-iconColor-rest: #7d8590;
   --underlineNav-borderColor-active: #f78166;
   --underlineNav-borderColor-hover: #6e768166;
   --underlineNav-iconColor-rest: #7d8590;
@@ -581,7 +581,7 @@
     --selectMenu-bgColor-active: #0c2d6b;
     --sideNav-bgColor-selected: #21262d;
     --timelineBadge-bgColor: #21262d;
-    --treeViewItem-leadingVisual-bgColor-rest: #7d8590;
+    --treeViewItem-leadingVisual-iconColor-rest: #7d8590;
     --underlineNav-borderColor-active: #f78166;
     --underlineNav-borderColor-hover: #6e768166;
     --underlineNav-iconColor-rest: #7d8590;

package/tokens-next-private/css/functional/themes/dark-dimmed.css

@@ -180,7 +180,7 @@
   --selectMenu-bgColor-active: #143d79;
   --sideNav-bgColor-selected: #373e47;
   --timelineBadge-bgColor: #373e47;
-  --treeViewItem-leadingVisual-bgColor-rest: #6d7986;
+  --treeViewItem-leadingVisual-iconColor-rest: #6d7986;
   --underlineNav-borderColor-active: #ec775c;
   --underlineNav-borderColor-hover: #636e7b66;
   --underlineNav-iconColor-rest: #6d7986;
@@ -581,7 +581,7 @@
     --selectMenu-bgColor-active: #143d79;
     --sideNav-bgColor-selected: #373e47;
     --timelineBadge-bgColor: #373e47;
-    --treeViewItem-leadingVisual-bgColor-rest: #6d7986;
+    --treeViewItem-leadingVisual-iconColor-rest: #6d7986;
     --underlineNav-borderColor-active: #ec775c;
     --underlineNav-borderColor-hover: #636e7b66;
     --underlineNav-iconColor-rest: #6d7986;

package/tokens-next-private/css/functional/themes/dark-high-contrast.css

@@ -180,7 +180,7 @@
   --selectMenu-bgColor-active: #1e60d5;
   --sideNav-bgColor-selected: #272b33;
   --timelineBadge-bgColor: #272b33;
-  --treeViewItem-leadingVisual-bgColor-rest: #f0f3f6;
+  --treeViewItem-leadingVisual-iconColor-rest: #f0f3f6;
   --underlineNav-borderColor-active: #ff967d;
   --underlineNav-borderColor-hover: #bdc4cc;
   --underlineNav-iconColor-rest: #f0f3f6;
@@ -581,7 +581,7 @@
     --selectMenu-bgColor-active: #1e60d5;
     --sideNav-bgColor-selected: #272b33;
     --timelineBadge-bgColor: #272b33;
-    --treeViewItem-leadingVisual-bgColor-rest: #f0f3f6;
+    --treeViewItem-leadingVisual-iconColor-rest: #f0f3f6;
     --underlineNav-borderColor-active: #ff967d;
     --underlineNav-borderColor-hover: #bdc4cc;
     --underlineNav-iconColor-rest: #f0f3f6;

package/tokens-next-private/css/functional/themes/dark-tritanopia.css

@@ -180,7 +180,7 @@
   --selectMenu-bgColor-active: #0c2d6b;
   --sideNav-bgColor-selected: #21262d;
   --timelineBadge-bgColor: #21262d;
-  --treeViewItem-leadingVisual-bgColor-rest: #7d8590;
+  --treeViewItem-leadingVisual-iconColor-rest: #7d8590;
   --underlineNav-borderColor-active: #f78166;
   --underlineNav-borderColor-hover: #6e768166;
   --underlineNav-iconColor-rest: #7d8590;
@@ -581,7 +581,7 @@
     --selectMenu-bgColor-active: #0c2d6b;
     --sideNav-bgColor-selected: #21262d;
     --timelineBadge-bgColor: #21262d;
-    --treeViewItem-leadingVisual-bgColor-rest: #7d8590;
+    --treeViewItem-leadingVisual-iconColor-rest: #7d8590;
     --underlineNav-borderColor-active: #f78166;
     --underlineNav-borderColor-hover: #6e768166;
     --underlineNav-iconColor-rest: #7d8590;

package/tokens-next-private/css/functional/themes/dark.css

@@ -180,7 +180,7 @@
   --selectMenu-bgColor-active: #0c2d6b;
   --sideNav-bgColor-selected: #21262d;
   --timelineBadge-bgColor: #21262d;
-  --treeViewItem-leadingVisual-bgColor-rest: #7d8590;
+  --treeViewItem-leadingVisual-iconColor-rest: #7d8590;
   --underlineNav-borderColor-active: #f78166;
   --underlineNav-borderColor-hover: #6e768166;
   --underlineNav-iconColor-rest: #7d8590;
@@ -581,7 +581,7 @@
     --selectMenu-bgColor-active: #0c2d6b;
     --sideNav-bgColor-selected: #21262d;
     --timelineBadge-bgColor: #21262d;
-    --treeViewItem-leadingVisual-bgColor-rest: #7d8590;
+    --treeViewItem-leadingVisual-iconColor-rest: #7d8590;
     --underlineNav-borderColor-active: #f78166;
     --underlineNav-borderColor-hover: #6e768166;
     --underlineNav-iconColor-rest: #7d8590;

package/tokens-next-private/css/functional/themes/light-colorblind.css

@@ -181,7 +181,7 @@
   --selectMenu-bgColor-active: #b6e3ff;
   --sideNav-bgColor-selected: #ffffff;
   --timelineBadge-bgColor: #eaeef2;
-  --treeViewItem-leadingVisual-bgColor-rest: #54aeff;
+  --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
   --underlineNav-borderColor-active: #fd8c73;
   --underlineNav-borderColor-hover: #afb8c133;
   --underlineNav-iconColor-rest: #636c76;
@@ -582,7 +582,7 @@
     --selectMenu-bgColor-active: #b6e3ff;
     --sideNav-bgColor-selected: #ffffff;
     --timelineBadge-bgColor: #eaeef2;
-    --treeViewItem-leadingVisual-bgColor-rest: #54aeff;
+    --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
     --underlineNav-borderColor-active: #fd8c73;
     --underlineNav-borderColor-hover: #afb8c133;
     --underlineNav-iconColor-rest: #636c76;

package/tokens-next-private/css/functional/themes/light-high-contrast.css

@@ -181,7 +181,7 @@
   --selectMenu-bgColor-active: #9cd7ff;
   --sideNav-bgColor-selected: #ffffff;
   --timelineBadge-bgColor: #e7ecf0;
-  --treeViewItem-leadingVisual-bgColor-rest: #368cf9;
+  --treeViewItem-leadingVisual-iconColor-rest: #368cf9;
   --underlineNav-borderColor-active: #cd3425;
   --underlineNav-borderColor-hover: #88929d;
   --underlineNav-iconColor-rest: #0e1116;
@@ -582,7 +582,7 @@
     --selectMenu-bgColor-active: #9cd7ff;
     --sideNav-bgColor-selected: #ffffff;
     --timelineBadge-bgColor: #e7ecf0;
-    --treeViewItem-leadingVisual-bgColor-rest: #368cf9;
+    --treeViewItem-leadingVisual-iconColor-rest: #368cf9;
     --underlineNav-borderColor-active: #cd3425;
     --underlineNav-borderColor-hover: #88929d;
     --underlineNav-iconColor-rest: #0e1116;

package/tokens-next-private/css/functional/themes/light-tritanopia.css

@@ -181,7 +181,7 @@
   --selectMenu-bgColor-active: #b6e3ff;
   --sideNav-bgColor-selected: #ffffff;
   --timelineBadge-bgColor: #eaeef2;
-  --treeViewItem-leadingVisual-bgColor-rest: #54aeff;
+  --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
   --underlineNav-borderColor-active: #fd8c73;
   --underlineNav-borderColor-hover: #afb8c133;
   --underlineNav-iconColor-rest: #636c76;
@@ -582,7 +582,7 @@
     --selectMenu-bgColor-active: #b6e3ff;
     --sideNav-bgColor-selected: #ffffff;
     --timelineBadge-bgColor: #eaeef2;
-    --treeViewItem-leadingVisual-bgColor-rest: #54aeff;
+    --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
     --underlineNav-borderColor-active: #fd8c73;
     --underlineNav-borderColor-hover: #afb8c133;
     --underlineNav-iconColor-rest: #636c76;

package/tokens-next-private/css/functional/themes/light.css

@@ -181,7 +181,7 @@
   --selectMenu-bgColor-active: #b6e3ff;
   --sideNav-bgColor-selected: #ffffff;
   --timelineBadge-bgColor: #eaeef2;
-  --treeViewItem-leadingVisual-bgColor-rest: #54aeff;
+  --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
   --underlineNav-borderColor-active: #fd8c73;
   --underlineNav-borderColor-hover: #afb8c133;
   --underlineNav-iconColor-rest: #636c76;
@@ -582,7 +582,7 @@
     --selectMenu-bgColor-active: #b6e3ff;
     --sideNav-bgColor-selected: #ffffff;
     --timelineBadge-bgColor: #eaeef2;
-    --treeViewItem-leadingVisual-bgColor-rest: #54aeff;
+    --treeViewItem-leadingVisual-iconColor-rest: #54aeff;
     --underlineNav-borderColor-active: #fd8c73;
     --underlineNav-borderColor-hover: #afb8c133;
     --underlineNav-iconColor-rest: #636c76;

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

@@ -1,24 +1,24 @@
 :root {
   --text-codeInline-size: 0.9285em;
-  --text-codeBlock-lineHeight: calc(20/13);
+  --text-codeBlock-lineHeight: 1.5385;
   --text-codeBlock-size: 0.8125rem;
-  --text-caption-lineHeight: calc(16/12);
+  --text-caption-lineHeight: 1.3333;
   --text-caption-size: 0.75rem;
-  --text-body-lineHeight-small: calc(20/12);
-  --text-body-lineHeight-medium: calc(20/14);
-  --text-body-lineHeight-large: calc(24/16);
+  --text-body-lineHeight-small: 1.6666;
+  --text-body-lineHeight-medium: 1.4285;
+  --text-body-lineHeight-large: 1.5;
   --text-body-size-small: 0.75rem;
   --text-body-size-medium: 0.875rem;
   --text-body-size-large: 1rem;
-  --text-subtitle-lineHeight: calc(32/20);
+  --text-subtitle-lineHeight: 1.6;
   --text-subtitle-size: 1.25rem;
-  --text-title-lineHeight-small: calc(24/16);
-  --text-title-lineHeight-medium: calc(32/20);
-  --text-title-lineHeight-large: calc(48/32);
+  --text-title-lineHeight-small: 1.5;
+  --text-title-lineHeight-medium: 1.6;
+  --text-title-lineHeight-large: 1.5;
   --text-title-size-small: 1rem;
   --text-title-size-medium: 1.25rem;
   --text-title-size-large: 2rem;
-  --text-display-lineHeight: calc(56/40);
+  --text-display-lineHeight: 1.4;
   --text-display-size: 2.5rem;
   --text-display-lineBoxHeight: 3.5rem;
   --fontStack-monospace: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;

package/tokens-next-private/docs/base/typography/typography.json

@@ -1,12 +1,12 @@
 {
   "base-text-weight-light": {
-    "value": 300,
     "$type": "fontWeight",
+    "value": 300,
     "filePath": "src/tokens/base/typography/typography.json",
     "isSource": true,
     "original": {
-      "value": 300,
-      "$type": "fontWeight"
+      "$type": "fontWeight",
+      "value": 300
     },
     "name": "base-text-weight-light",
     "attributes": {},

package/tokens-next-private/docs/functional/size/border.json

@@ -2,11 +2,13 @@
   "boxShadow-thin": {
     "value": "inset 0 0 0 max(1px, 0.0625rem)",
     "comment": "Thin shadow for borders",
+    "$type": "string",
     "filePath": "src/tokens/functional/size/border.json",
     "isSource": true,
     "original": {
       "value": "inset 0 0 0 {borderWidth.thin}",
-      "comment": "Thin shadow for borders"
+      "comment": "Thin shadow for borders",
+      "$type": "string"
     },
     "name": "boxShadow-thin",
     "attributes": {},
@@ -14,10 +16,12 @@
   },
   "boxShadow-thick": {
     "value": "inset 0 0 0 max(2px, 0.125rem)",
+    "$type": "string",
     "filePath": "src/tokens/functional/size/border.json",
     "isSource": true,
     "original": {
-      "value": "inset 0 0 0 {borderWidth.thick}"
+      "value": "inset 0 0 0 {borderWidth.thick}",
+      "$type": "string"
     },
     "name": "boxShadow-thick",
     "attributes": {},
@@ -25,10 +29,12 @@
   },
   "boxShadow-thicker": {
     "value": "inset 0 0 0 max(4px, 0.25rem)",
+    "$type": "string",
     "filePath": "src/tokens/functional/size/border.json",
     "isSource": true,
     "original": {
-      "value": "inset 0 0 0 {borderWidth.thicker}"
+      "value": "inset 0 0 0 {borderWidth.thicker}",
+      "$type": "string"
     },
     "name": "boxShadow-thicker",
     "attributes": {},
@@ -36,10 +42,12 @@
   },
   "borderWidth-thin": {
     "value": "max(1px, 0.0625rem)",
+    "$type": "string",
     "filePath": "src/tokens/functional/size/border.json",
     "isSource": true,
     "original": {
-      "value": "max(1px, 0.0625rem)"
+      "value": "max(1px, 0.0625rem)",
+      "$type": "string"
     },
     "name": "borderWidth-thin",
     "attributes": {},
@@ -47,10 +55,12 @@
   },
   "borderWidth-thick": {
     "value": "max(2px, 0.125rem)",
+    "$type": "string",
     "filePath": "src/tokens/functional/size/border.json",
     "isSource": true,
     "original": {
-      "value": "max(2px, 0.125rem)"
+      "value": "max(2px, 0.125rem)",
+      "$type": "string"
     },
     "name": "borderWidth-thick",
     "attributes": {},
@@ -58,54 +68,64 @@
   },
   "borderWidth-thicker": {
     "value": "max(4px, 0.25rem)",
+    "$type": "string",
     "filePath": "src/tokens/functional/size/border.json",
     "isSource": true,
     "original": {
-      "value": "max(4px, 0.25rem)"
+      "value": "max(4px, 0.25rem)",
+      "$type": "string"
     },
     "name": "borderWidth-thicker",
     "attributes": {},
     "path": ["borderWidth", "thicker"]
   },
   "borderRadius-small": {
-    "value": "3px",
+    "value": "0.1875rem",
+    "$type": "dimension",
     "filePath": "src/tokens/functional/size/border.json",
     "isSource": true,
     "original": {
-      "value": "3px"
+      "value": "3px",
+      "$type": "dimension"
     },
     "name": "borderRadius-small",
     "attributes": {},
     "path": ["borderRadius", "small"]
   },
   "borderRadius-medium": {
-    "value": "6px",
+    "value": "0.375rem",
+    "$type": "dimension",
     "filePath": "src/tokens/functional/size/border.json",
     "isSource": true,
     "original": {
-      "value": "6px"
+      "value": "6px",
+      "$type": "dimension"
     },
     "name": "borderRadius-medium",
     "attributes": {},
     "path": ["borderRadius", "medium"]
   },
   "borderRadius-large": {
-    "value": "12px",
+    "value": "0.75rem",
+    "$type": "dimension",
     "filePath": "src/tokens/functional/size/border.json",
     "isSource": true,
     "original": {
-      "value": "12px"
+      "value": "12px",
+      "$type": "dimension"
     },
     "name": "borderRadius-large",
     "attributes": {},
     "path": ["borderRadius", "large"]
   },
   "borderRadius-full": {
-    "value": "9999px",
+    "value": "624.9375rem",
+    "$type": "dimension",
     "filePath": "src/tokens/functional/size/border.json",
     "isSource": true,
     "original": {
-      "value": "9999px"
+      "value": "9999px",
+      "$type": "dimension"
     },
     "name": "borderRadius-full",
     "attributes": {},

package/tokens-next-private/docs/functional/size/size.json

@@ -52,11 +52,13 @@
     "path": ["control", "xsmall", "lineBoxHeight"]
   },
   "control-xsmall-paddingBlock": {
-    "value": "calc((1.5rem - 1.25rem) / 2)",
+    "value": "0.125rem",
+    "$type": "dimension",
     "filePath": "src/tokens/functional/size/size.json",
     "isSource": true,
     "original": {
-      "value": "calc(({control.xsmall.size} - {control.xsmall.lineBoxHeight}) / 2)"
+      "value": "2px",
+      "$type": "dimension"
     },
     "name": "control-xsmall-paddingBlock",
     "attributes": {},
@@ -141,11 +143,13 @@
     "path": ["control", "small", "lineBoxHeight"]
   },
   "control-small-paddingBlock": {
-    "value": "calc((1.75rem - 1.25rem) / 2)",
+    "value": "0.25rem",
+    "$type": "dimension",
     "filePath": "src/tokens/functional/size/size.json",
     "isSource": true,
     "original": {
-      "value": "calc(({control.small.size} - {control.small.lineBoxHeight}) / 2)"
+      "value": "{base.size.4}",
+      "$type": "dimension"
     },
     "name": "control-small-paddingBlock",
     "attributes": {},
@@ -217,11 +221,13 @@
     "path": ["control", "medium", "lineBoxHeight"]
   },
   "control-medium-paddingBlock": {
-    "value": "calc((2rem - 1.25rem) / 2)",
+    "value": "0.375rem",
+    "$type": "dimension",
     "filePath": "src/tokens/functional/size/size.json",
     "isSource": true,
     "original": {
-      "value": "calc(({control.medium.size} - {control.medium.lineBoxHeight}) / 2)"
+      "value": "6px",
+      "$type": "dimension"
     },
     "name": "control-medium-paddingBlock",
     "attributes": {},
@@ -306,11 +312,13 @@
     "path": ["control", "large", "lineBoxHeight"]
   },
   "control-large-paddingBlock": {
-    "value": "calc((2.5rem - 1.25rem) / 2)",
+    "value": "0.625rem",
+    "$type": "dimension",
     "filePath": "src/tokens/functional/size/size.json",
     "isSource": true,
     "original": {
-      "value": "calc(({control.large.size} - {control.large.lineBoxHeight}) / 2)"
+      "value": "10px",
+      "$type": "dimension"
     },
     "name": "control-large-paddingBlock",
     "attributes": {},
@@ -382,11 +390,13 @@
     "path": ["control", "xlarge", "lineBoxHeight"]
   },
   "control-xlarge-paddingBlock": {
-    "value": "calc((3rem - 1.25rem) / 2)",
+    "value": "0.875rem",
+    "$type": "dimension",
     "filePath": "src/tokens/functional/size/size.json",
     "isSource": true,
     "original": {
-      "value": "calc(({control.xlarge.size} - {control.xlarge.lineBoxHeight}) / 2)"
+      "value": "14px",
+      "$type": "dimension"
     },
     "name": "control-xlarge-paddingBlock",
     "attributes": {},

package/tokens-next-private/docs/functional/themes/dark-colorblind.json

@@ -1537,7 +1537,7 @@
     "original": {
       "value": [
         {
-          "color": "transparent",
+          "color": "{base.color.transparent}",
           "alpha": 0,
           "offsetX": "0px",
           "offsetY": "0px",
@@ -1559,7 +1559,7 @@
     "isSource": true,
     "original": {
       "value": {
-        "color": "transparent",
+        "color": "{base.color.transparent}",
         "alpha": 0,
         "offsetX": "0px",
         "offsetY": "0px",
@@ -1733,7 +1733,7 @@
     "original": {
       "value": [
         {
-          "color": "transparent",
+          "color": "{base.color.transparent}",
           "alpha": 0,
           "offsetX": "0px",
           "offsetY": "0px",
@@ -2018,7 +2018,7 @@
     "original": {
       "value": [
         {
-          "color": "transparent",
+          "color": "{base.color.transparent}",
           "alpha": 0,
           "offsetX": "0px",
           "offsetY": "0px",
@@ -2220,7 +2220,7 @@
     "original": {
       "value": [
         {
-          "color": "transparent",
+          "color": "{base.color.transparent}",
           "alpha": 0,
           "offsetX": "0px",
           "offsetY": "0px",
@@ -2556,7 +2556,7 @@
     "attributes": {},
     "path": ["timelineBadge", "bgColor"]
   },
-  "treeViewItem-leadingVisual-bgColor-rest": {
+  "treeViewItem-leadingVisual-iconColor-rest": {
     "value": "#7d8590",
     "$type": "color",
     "filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
@@ -2565,9 +2565,9 @@
       "value": "{fgColor.muted}",
       "$type": "color"
     },
-    "name": "treeViewItem-leadingVisual-bgColor-rest",
+    "name": "treeViewItem-leadingVisual-iconColor-rest",
     "attributes": {},
-    "path": ["treeViewItem", "leadingVisual", "bgColor", "rest"]
+    "path": ["treeViewItem", "leadingVisual", "iconColor", "rest"]
   },
   "underlineNav-borderColor-active": {
     "value": "#f78166",
@@ -5520,7 +5520,7 @@
     "original": {
       "value": [
         {
-          "color": "transparent",
+          "color": "{base.color.transparent}",
           "alpha": 0,
           "offsetX": "0px",
           "offsetY": "0px",
@@ -5542,7 +5542,7 @@
     "isSource": true,
     "original": {
       "value": {
-        "color": "transparent",
+        "color": "{base.color.transparent}",
         "alpha": 0,
         "offsetX": "0px",
         "offsetY": "0px",
@@ -5587,7 +5587,7 @@
     "original": {
       "value": [
         {
-          "color": "transparent",
+          "color": "{base.color.transparent}",
           "alpha": 0,
           "offsetX": "0px",
           "offsetY": "0px",