@primer/primitives 10.3.0-rc.37645a3a → 10.3.0-rc.4c6f46ed

package/dist/build/platforms/figma.js

@@ -24,40 +24,44 @@ const validFigmaToken = (token, options) => __awaiter(void 0, void 0, void 0, fu
     // is a color or dimension type
     return validTypes.includes(token.$type);
 });
-export const figma = (outputFile, prefix, buildPath, options) => ({
-    prefix,
-    buildPath,
-    preprocessors: ['themeOverrides'],
-    transforms: [
-        'color/rgbaFloat',
-        'fontFamily/figma',
-        'float/pixelUnitless',
-        'dimension/pixelUnitless',
-        // 'border/figma',
-        // 'typography/figma',
-        'fontWeight/number',
-        'figma/attributes',
-        'name/pathToFigma',
-    ],
-    options: Object.assign(Object.assign({ basePxFontSize: 16, fontFamilies: {
-            'fontStack/system': 'SF Pro Text',
-            'fontStack/sansSerif': 'SF Pro Text',
-            'fontStack/sansSerifDisplay': 'SF Pro Display',
-            'fontStack/monospace': 'SF Mono',
-        } }, options), { theme: options === null || options === void 0 ? void 0 : options.theme[0].replaceAll('-', ' '), themeOverrides: {
-            theme: options === null || options === void 0 ? void 0 : options.theme,
-        } }),
-    files: [
-        {
-            destination: outputFile,
-            filter: (token, config) => {
-                return validFigmaToken(token, config);
+export const figma = (outputFile, prefix, buildPath, options = {}) => {
+    const { theme } = options;
+    const figmaTheme = ((theme === null || theme === void 0 ? void 0 : theme[0]) || '').replaceAll('-', ' ');
+    return {
+        prefix,
+        buildPath,
+        preprocessors: ['themeOverrides'],
+        transforms: [
+            'color/rgbaFloat',
+            'fontFamily/figma',
+            'float/pixelUnitless',
+            'dimension/pixelUnitless',
+            // 'border/figma',
+            // 'typography/figma',
+            'fontWeight/number',
+            'figma/attributes',
+            'name/pathToFigma',
+        ],
+        options: Object.assign(Object.assign({ basePxFontSize: 16, fontFamilies: {
+                'fontStack/system': 'SF Pro Text',
+                'fontStack/sansSerif': 'SF Pro Text',
+                'fontStack/sansSerifDisplay': 'SF Pro Display',
+                'fontStack/monospace': 'SF Mono',
+            } }, options), { theme: figmaTheme, themeOverrides: {
+                theme: options.theme,
+            } }),
+        files: [
+            {
+                destination: outputFile,
+                filter: (token, config) => {
+                    return validFigmaToken(token, config);
+                },
+                format: `json/figma`,
+                options: {
+                    outputReferences: true,
+                    theme: figmaTheme,
+                },
             },
-            format: `json/figma`,
-            options: {
-                outputReferences: true,
-                theme: options === null || options === void 0 ? void 0 : options.theme[0].replaceAll('-', ' '),
-            },
-        },
-    ],
-});
+        ],
+    };
+};

package/dist/css/functional/themes/dark-high-contrast.css

@@ -412,7 +412,6 @@
   --sideNav-bgColor-selected: #212830;
   --skeletonLoader-bgColor: #2a313c;
   --timelineBadge-bgColor: #212830;
-  --topicTag-borderColor: #00000000;
   --underlineNav-borderColor-active: #ff967d;
   --avatar-bgColor: #ffffff1a;
   --avatar-borderColor: #ffffffe6;
@@ -534,6 +533,7 @@
   --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
   --shadow-resting-small: 0px 1px 0px 0px #01040966;
   --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
+  --topicTag-borderColor: var(--borderColor-accent-emphasis);
   --treeViewItem-leadingVisual-iconColor-rest: var(--fgColor-muted);
   --underlineNav-iconColor-rest: var(--fgColor-muted);
   --border-closed-emphasis: var(--border-danger-emphasis);
@@ -1018,7 +1018,6 @@
     --sideNav-bgColor-selected: #212830;
     --skeletonLoader-bgColor: #2a313c;
     --timelineBadge-bgColor: #212830;
-    --topicTag-borderColor: #00000000;
     --underlineNav-borderColor-active: #ff967d;
     --avatar-bgColor: #ffffff1a;
     --avatar-borderColor: #ffffffe6;
@@ -1140,6 +1139,7 @@
     --shadow-resting-medium: 0px 3px 6px 0px #010409cc;
     --shadow-resting-small: 0px 1px 0px 0px #01040966;
     --shadow-resting-xsmall: 0px 1px 0px 0px #010409cc;
+    --topicTag-borderColor: var(--borderColor-accent-emphasis);
     --treeViewItem-leadingVisual-iconColor-rest: var(--fgColor-muted);
     --underlineNav-iconColor-rest: var(--fgColor-muted);
     --border-closed-emphasis: var(--border-danger-emphasis);

package/dist/css/functional/themes/light-high-contrast.css

@@ -398,7 +398,6 @@
   --shadow-floating-legacy: 0px 6px 12px -3px #25292e0a, 0px 6px 18px 0px #25292e1f;
   --shadow-resting-medium: 0px 3px 6px 0px #25292e1f;
   --skeletonLoader-bgColor: #dae0e7;
-  --topicTag-borderColor: #ffffff00;
   --treeViewItem-leadingVisual-iconColor-rest: #368cf9;
   --underlineNav-borderColor-active: #cd3425;
   --avatar-bgColor: #ffffff;
@@ -540,6 +539,7 @@
   --sideNav-bgColor-selected: #ffffff;
   --timelineBadge-bgColor: var(--bgColor-muted);
   --tooltip-bgColor: var(--bgColor-emphasis);
+  --topicTag-borderColor: var(--borderColor-accent-emphasis);
   --underlineNav-iconColor-rest: var(--fgColor-muted);
   --border-closed-emphasis: var(--border-danger-emphasis);
   --border-closed-muted: var(--border-danger-muted);
@@ -1004,7 +1004,6 @@
     --shadow-floating-legacy: 0px 6px 12px -3px #25292e0a, 0px 6px 18px 0px #25292e1f;
     --shadow-resting-medium: 0px 3px 6px 0px #25292e1f;
     --skeletonLoader-bgColor: #dae0e7;
-    --topicTag-borderColor: #ffffff00;
     --treeViewItem-leadingVisual-iconColor-rest: #368cf9;
     --underlineNav-borderColor-active: #cd3425;
     --avatar-bgColor: #ffffff;
@@ -1146,6 +1145,7 @@
     --sideNav-bgColor-selected: #ffffff;
     --timelineBadge-bgColor: var(--bgColor-muted);
     --tooltip-bgColor: var(--bgColor-emphasis);
+    --topicTag-borderColor: var(--borderColor-accent-emphasis);
     --underlineNav-iconColor-rest: var(--fgColor-muted);
     --border-closed-emphasis: var(--border-danger-emphasis);
     --border-closed-muted: var(--border-danger-muted);

package/dist/docs/functional/themes/dark-colorblind.json

@@ -8215,12 +8215,60 @@
     "type": "color"
   },
   "diffBlob-additionNum-bgColor": {
-    "alpha": 0.3,
-    "filePath": "src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component",
+        "scopes": ["bgColor"]
+      },
+      "org.primer.overrides": {
+        "dark": {
+          "$value": "#3fb950",
+          "alpha": 0.3,
+          "filePath": "src/tokens/component/diffBlob.json5",
+          "isSource": true,
+          "$type": "color"
+        },
+        "light-protanopia-deuteranopia": "#a5d6ff",
+        "dark-protanopia-deuteranopia": {
+          "$value": "#58a6ff",
+          "alpha": 0.3,
+          "filePath": "src/tokens/component/diffBlob.json5",
+          "isSource": true,
+          "$type": "color"
+        }
+      }
+    },
+    "filePath": "src/tokens/component/diffBlob.json5",
     "isSource": true,
+    "alpha": 0.3,
     "original": {
       "$value": "{base.color.blue.3}",
       "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component",
+          "scopes": ["bgColor"]
+        },
+        "org.primer.overrides": {
+          "dark": {
+            "$value": "{base.color.green.3}",
+            "alpha": 0.3,
+            "filePath": "src/tokens/component/diffBlob.json5",
+            "isSource": true,
+            "$type": "color"
+          },
+          "light-protanopia-deuteranopia": "{base.color.blue.1}",
+          "dark-protanopia-deuteranopia": {
+            "$value": "{base.color.blue.3}",
+            "alpha": 0.3,
+            "filePath": "src/tokens/component/diffBlob.json5",
+            "isSource": true,
+            "$type": "color"
+          }
+        }
+      },
       "alpha": 0.3
     },
     "name": "diffBlob-additionNum-bgColor",
@@ -8259,12 +8307,60 @@
     "type": "color"
   },
   "diffBlob-additionWord-bgColor": {
-    "alpha": 0.4,
-    "filePath": "src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component",
+        "scopes": ["bgColor"]
+      },
+      "org.primer.overrides": {
+        "dark": {
+          "$value": "#2ea043",
+          "alpha": 0.4,
+          "filePath": "src/tokens/component/diffBlob.json5",
+          "isSource": true,
+          "$type": "color"
+        },
+        "light-protanopia-deuteranopia": "#a5d6ff",
+        "dark-protanopia-deuteranopia": {
+          "$value": "#388bfd",
+          "alpha": 0.4,
+          "filePath": "src/tokens/component/diffBlob.json5",
+          "isSource": true,
+          "$type": "color"
+        }
+      }
+    },
+    "filePath": "src/tokens/component/diffBlob.json5",
     "isSource": true,
+    "alpha": 0.4,
     "original": {
       "$value": "{base.color.blue.4}",
       "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component",
+          "scopes": ["bgColor"]
+        },
+        "org.primer.overrides": {
+          "dark": {
+            "$value": "{base.color.green.4}",
+            "alpha": 0.4,
+            "filePath": "src/tokens/component/diffBlob.json5",
+            "isSource": true,
+            "$type": "color"
+          },
+          "light-protanopia-deuteranopia": "{base.color.blue.1}",
+          "dark-protanopia-deuteranopia": {
+            "$value": "{base.color.blue.4}",
+            "alpha": 0.4,
+            "filePath": "src/tokens/component/diffBlob.json5",
+            "isSource": true,
+            "$type": "color"
+          }
+        }
+      },
       "alpha": 0.4
     },
     "name": "diffBlob-additionWord-bgColor",
@@ -8303,12 +8399,44 @@
     "type": "color"
   },
   "diffBlob-deletionLine-bgColor": {
-    "alpha": 0.15,
-    "filePath": "src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component",
+        "scopes": ["bgColor"]
+      },
+      "org.primer.overrides": {
+        "dark-protanopia-deuteranopia": {
+          "$value": "#db6d28",
+          "alpha": 0.15,
+          "filePath": "src/tokens/component/diffBlob.json5",
+          "isSource": true,
+          "$type": "color"
+        }
+      }
+    },
+    "filePath": "src/tokens/component/diffBlob.json5",
     "isSource": true,
+    "alpha": 0.15,
     "original": {
       "$value": "{base.color.orange.4}",
       "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component",
+          "scopes": ["bgColor"]
+        },
+        "org.primer.overrides": {
+          "dark-protanopia-deuteranopia": {
+            "$value": "{base.color.orange.4}",
+            "alpha": 0.15,
+            "filePath": "src/tokens/component/diffBlob.json5",
+            "isSource": true,
+            "$type": "color"
+          }
+        }
+      },
       "alpha": 0.15
     },
     "name": "diffBlob-deletionLine-bgColor",
@@ -8347,12 +8475,60 @@
     "type": "color"
   },
   "diffBlob-deletionNum-bgColor": {
-    "alpha": 0.3,
-    "filePath": "src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component",
+        "scopes": ["bgColor"]
+      },
+      "org.primer.overrides": {
+        "dark": {
+          "$value": "#f85149",
+          "alpha": 0.3,
+          "filePath": "src/tokens/component/diffBlob.json5",
+          "isSource": true,
+          "$type": "color"
+        },
+        "light-protanopia-deuteranopia": "#ffc680",
+        "dark-protanopia-deuteranopia": {
+          "$value": "#db6d28",
+          "alpha": 0.3,
+          "filePath": "src/tokens/component/diffBlob.json5",
+          "isSource": true,
+          "$type": "color"
+        }
+      }
+    },
+    "filePath": "src/tokens/component/diffBlob.json5",
     "isSource": true,
+    "alpha": 0.3,
     "original": {
       "$value": "{base.color.orange.4}",
       "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component",
+          "scopes": ["bgColor"]
+        },
+        "org.primer.overrides": {
+          "dark": {
+            "$value": "{base.color.red.4}",
+            "alpha": 0.3,
+            "filePath": "src/tokens/component/diffBlob.json5",
+            "isSource": true,
+            "$type": "color"
+          },
+          "light-protanopia-deuteranopia": "{base.color.orange.1}",
+          "dark-protanopia-deuteranopia": {
+            "$value": "{base.color.orange.4}",
+            "alpha": 0.3,
+            "filePath": "src/tokens/component/diffBlob.json5",
+            "isSource": true,
+            "$type": "color"
+          }
+        }
+      },
       "alpha": 0.3
     },
     "name": "diffBlob-deletionNum-bgColor",
@@ -8391,12 +8567,60 @@
     "type": "color"
   },
   "diffBlob-deletionWord-bgColor": {
-    "alpha": 0.4,
-    "filePath": "src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component",
+        "scopes": ["bgColor"]
+      },
+      "org.primer.overrides": {
+        "dark": {
+          "$value": "#f85149",
+          "alpha": 0.4,
+          "filePath": "src/tokens/component/diffBlob.json5",
+          "isSource": true,
+          "$type": "color"
+        },
+        "light-protanopia-deuteranopia": "#ffc680",
+        "dark-protanopia-deuteranopia": {
+          "$value": "#db6d28",
+          "alpha": 0.4,
+          "filePath": "src/tokens/component/diffBlob.json5",
+          "isSource": true,
+          "$type": "color"
+        }
+      }
+    },
+    "filePath": "src/tokens/component/diffBlob.json5",
     "isSource": true,
+    "alpha": 0.4,
     "original": {
       "$value": "{base.color.orange.4}",
       "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component",
+          "scopes": ["bgColor"]
+        },
+        "org.primer.overrides": {
+          "dark": {
+            "$value": "{base.color.red.4}",
+            "alpha": 0.4,
+            "filePath": "src/tokens/component/diffBlob.json5",
+            "isSource": true,
+            "$type": "color"
+          },
+          "light-protanopia-deuteranopia": "{base.color.orange.1}",
+          "dark-protanopia-deuteranopia": {
+            "$value": "{base.color.orange.4}",
+            "alpha": 0.4,
+            "filePath": "src/tokens/component/diffBlob.json5",
+            "isSource": true,
+            "$type": "color"
+          }
+        }
+      },
       "alpha": 0.4
     },
     "name": "diffBlob-deletionWord-bgColor",
@@ -8519,13 +8743,33 @@
     "type": "color"
   },
   "diffBlob-hunkLine-bgColor": {
-    "alpha": 1,
-    "filePath": "src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component",
+        "scopes": ["bgColor"]
+      },
+      "org.primer.overrides": {
+        "light-protanopia-deuteranopia": "#0d1117",
+        "dark-protanopia-deuteranopia": "#212830"
+      }
+    },
+    "filePath": "src/tokens/component/diffBlob.json5",
     "isSource": true,
     "original": {
       "$value": "{base.color.neutral.3}",
       "$type": "color",
-      "alpha": 1
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component",
+          "scopes": ["bgColor"]
+        },
+        "org.primer.overrides": {
+          "light-protanopia-deuteranopia": "{base.color.neutral.1}",
+          "dark-protanopia-deuteranopia": "{base.color.neutral.3}"
+        }
+      }
     },
     "name": "diffBlob-hunkLine-bgColor",
     "attributes": {},
@@ -8563,13 +8807,33 @@
     "type": "color"
   },
   "diffBlob-hunkNum-bgColor-hover": {
-    "alpha": 1,
-    "filePath": "src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component",
+        "scopes": ["bgColor"]
+      },
+      "org.primer.overrides": {
+        "light-protanopia-deuteranopia": "#3d444d",
+        "dark-protanopia-deuteranopia": "#656c76"
+      }
+    },
+    "filePath": "src/tokens/component/diffBlob.json5",
     "isSource": true,
     "original": {
       "$value": "{base.color.neutral.8}",
       "$type": "color",
-      "alpha": 1
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component",
+          "scopes": ["bgColor"]
+        },
+        "org.primer.overrides": {
+          "light-protanopia-deuteranopia": "{base.color.neutral.7}",
+          "dark-protanopia-deuteranopia": "{base.color.neutral.8}"
+        }
+      }
     },
     "name": "diffBlob-hunkNum-bgColor-hover",
     "attributes": {},
@@ -8579,13 +8843,35 @@
     "type": "color"
   },
   "diffBlob-hunkNum-bgColor-rest": {
-    "alpha": 1,
-    "filePath": "src/tokens/functional/color/dark/overrides/dark.protanopia-deuteranopia.json5",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "group": "component",
+        "scopes": ["bgColor"]
+      },
+      "org.primer.overrides": {
+        "dark": "#0c2d6b",
+        "light-protanopia-deuteranopia": "#212830",
+        "dark-protanopia-deuteranopia": "#2f3742"
+      }
+    },
+    "filePath": "src/tokens/component/diffBlob.json5",
     "isSource": true,
     "original": {
       "$value": "{base.color.neutral.6}",
       "$type": "color",
-      "alpha": 1
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "group": "component",
+          "scopes": ["bgColor"]
+        },
+        "org.primer.overrides": {
+          "dark": "{base.color.blue.8}",
+          "light-protanopia-deuteranopia": "{base.color.neutral.3}",
+          "dark-protanopia-deuteranopia": "{base.color.neutral.6}"
+        }
+      }
     },
     "name": "diffBlob-hunkNum-bgColor-rest",
     "attributes": {},
@@ -8600,6 +8886,9 @@
         "collection": "mode",
         "group": "component",
         "scopes": ["fgColor"]
+      },
+      "org.primer.overrides": {
+        "light-protanopia-deuteranopia": "#f0f6fc"
       }
     },
     "filePath": "src/tokens/component/diffBlob.json5",
@@ -8612,6 +8901,9 @@
           "collection": "mode",
           "group": "component",
           "scopes": ["fgColor"]
+        },
+        "org.primer.overrides": {
+          "light-protanopia-deuteranopia": "{fgColor.default}"
         }
       }
     },