@primer/primitives 8.2.4-rc.fba4a4ab → 9.0.0-rc.02c27a21

package/dist/styleLint/functional/themes/light-tritanopia.json

@@ -1173,7 +1173,7 @@
     "attributes": {},
     "path": ["headerSearch", "borderColor"]
   },
-  "data-blue-color": {
+  "data-blue-color-emphasis": {
     "value": "#006edb",
     "$type": "color",
     "$extensions": {
@@ -1198,9 +1198,9 @@
         }
       }
     },
-    "name": "data-blue-color",
+    "name": "data-blue-color-emphasis",
     "attributes": {},
-    "path": ["data", "blue", "color", "@"]
+    "path": ["data", "blue", "color", "emphasis"]
   },
   "data-blue-color-muted": {
     "value": "#d1f0ff",
@@ -1231,7 +1231,7 @@
     "attributes": {},
     "path": ["data", "blue", "color", "muted"]
   },
-  "data-auburn-color": {
+  "data-auburn-color-emphasis": {
     "value": "#9d615c",
     "$type": "color",
     "$extensions": {
@@ -1256,9 +1256,9 @@
         }
       }
     },
-    "name": "data-auburn-color",
+    "name": "data-auburn-color-emphasis",
     "attributes": {},
-    "path": ["data", "auburn", "color", "@"]
+    "path": ["data", "auburn", "color", "emphasis"]
   },
   "data-auburn-color-muted": {
     "value": "#f2e9e9",
@@ -1289,7 +1289,7 @@
     "attributes": {},
     "path": ["data", "auburn", "color", "muted"]
   },
-  "data-orange-color": {
+  "data-orange-color-emphasis": {
     "value": "#eb670f",
     "$type": "color",
     "$extensions": {
@@ -1314,9 +1314,9 @@
         }
       }
     },
-    "name": "data-orange-color",
+    "name": "data-orange-color-emphasis",
     "attributes": {},
-    "path": ["data", "orange", "color", "@"]
+    "path": ["data", "orange", "color", "emphasis"]
   },
   "data-orange-color-muted": {
     "value": "#ffe7d1",
@@ -1347,7 +1347,7 @@
     "attributes": {},
     "path": ["data", "orange", "color", "muted"]
   },
-  "data-yellow-color": {
+  "data-yellow-color-emphasis": {
     "value": "#b88700",
     "$type": "color",
     "$extensions": {
@@ -1372,9 +1372,9 @@
         }
       }
     },
-    "name": "data-yellow-color",
+    "name": "data-yellow-color-emphasis",
     "attributes": {},
-    "path": ["data", "yellow", "color", "@"]
+    "path": ["data", "yellow", "color", "emphasis"]
   },
   "data-yellow-color-muted": {
     "value": "#ffec9e",
@@ -1405,7 +1405,7 @@
     "attributes": {},
     "path": ["data", "yellow", "color", "muted"]
   },
-  "data-green-color": {
+  "data-green-color-emphasis": {
     "value": "#30a147",
     "$type": "color",
     "$extensions": {
@@ -1430,9 +1430,9 @@
         }
       }
     },
-    "name": "data-green-color",
+    "name": "data-green-color-emphasis",
     "attributes": {},
-    "path": ["data", "green", "color", "@"]
+    "path": ["data", "green", "color", "emphasis"]
   },
   "data-green-color-muted": {
     "value": "#caf7ca",
@@ -1463,7 +1463,7 @@
     "attributes": {},
     "path": ["data", "green", "color", "muted"]
   },
-  "data-teal-color": {
+  "data-teal-color-emphasis": {
     "value": "#179b9b",
     "$type": "color",
     "$extensions": {
@@ -1488,9 +1488,9 @@
         }
       }
     },
-    "name": "data-teal-color",
+    "name": "data-teal-color-emphasis",
     "attributes": {},
-    "path": ["data", "teal", "color", "@"]
+    "path": ["data", "teal", "color", "emphasis"]
   },
   "data-teal-color-muted": {
     "value": "#c7f5ef",
@@ -1521,7 +1521,7 @@
     "attributes": {},
     "path": ["data", "teal", "color", "muted"]
   },
-  "data-purple-color": {
+  "data-purple-color-emphasis": {
     "value": "#894ceb",
     "$type": "color",
     "$extensions": {
@@ -1546,9 +1546,9 @@
         }
       }
     },
-    "name": "data-purple-color",
+    "name": "data-purple-color-emphasis",
     "attributes": {},
-    "path": ["data", "purple", "color", "@"]
+    "path": ["data", "purple", "color", "emphasis"]
   },
   "data-purple-color-muted": {
     "value": "#f1e5ff",
@@ -1579,7 +1579,7 @@
     "attributes": {},
     "path": ["data", "purple", "color", "muted"]
   },
-  "data-pink-color": {
+  "data-pink-color-emphasis": {
     "value": "#ce2c85",
     "$type": "color",
     "$extensions": {
@@ -1604,9 +1604,9 @@
         }
       }
     },
-    "name": "data-pink-color",
+    "name": "data-pink-color-emphasis",
     "attributes": {},
-    "path": ["data", "pink", "color", "@"]
+    "path": ["data", "pink", "color", "emphasis"]
   },
   "data-pink-color-muted": {
     "value": "#ffe5f1",
@@ -1637,7 +1637,7 @@
     "attributes": {},
     "path": ["data", "pink", "color", "muted"]
   },
-  "data-red-color": {
+  "data-red-color-emphasis": {
     "value": "#df0c24",
     "$type": "color",
     "$extensions": {
@@ -1662,9 +1662,9 @@
         }
       }
     },
-    "name": "data-red-color",
+    "name": "data-red-color-emphasis",
     "attributes": {},
-    "path": ["data", "red", "color", "@"]
+    "path": ["data", "red", "color", "emphasis"]
   },
   "data-red-color-muted": {
     "value": "#ffe2e0",
@@ -1695,7 +1695,7 @@
     "attributes": {},
     "path": ["data", "red", "color", "muted"]
   },
-  "data-gray-color": {
+  "data-gray-color-emphasis": {
     "value": "#808fa3",
     "$type": "color",
     "$extensions": {
@@ -1720,9 +1720,9 @@
         }
       }
     },
-    "name": "data-gray-color",
+    "name": "data-gray-color-emphasis",
     "attributes": {},
-    "path": ["data", "gray", "color", "@"]
+    "path": ["data", "gray", "color", "emphasis"]
   },
   "data-gray-color-muted": {
     "value": "#e8ecf2",
@@ -12571,6 +12571,64 @@
     "attributes": {},
     "path": ["label", "coral", "fgColor", "active"]
   },
+  "tooltip-bgColor": {
+    "value": "#24292f",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "component",
+        "scopes": ["bgColor"]
+      }
+    },
+    "filePath": "src/tokens/functional/color/light/patterns-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{bgColor.emphasis}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["bgColor"]
+        }
+      }
+    },
+    "name": "tooltip-bgColor",
+    "attributes": {},
+    "path": ["tooltip", "bgColor"]
+  },
+  "tooltip-fgColor": {
+    "value": "#ffffff",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "component",
+        "scopes": ["fgColor"]
+      }
+    },
+    "filePath": "src/tokens/functional/color/light/patterns-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{fgColor.onEmphasis}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["fgColor"]
+        }
+      }
+    },
+    "name": "tooltip-fgColor",
+    "attributes": {},
+    "path": ["tooltip", "fgColor"]
+  },
   "fgColor-default": {
     "value": "#1f2328",
     "$type": "color",
@@ -12684,6 +12742,35 @@
     "attributes": {},
     "path": ["fgColor", "onEmphasis"]
   },
+  "fgColor-onInverse": {
+    "value": "#ffffff",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "semantic",
+        "scopes": ["fgColor"]
+      }
+    },
+    "filePath": "src/tokens/functional/color/light/primitives-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{base.color.white}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "semantic",
+          "scopes": ["fgColor"]
+        }
+      }
+    },
+    "name": "fgColor-onInverse",
+    "attributes": {},
+    "path": ["fgColor", "onInverse"]
+  },
   "fgColor-white": {
     "value": "#ffffff",
     "$type": "color",

package/dist/styleLint/functional/themes/light.json

@@ -1173,7 +1173,7 @@
     "attributes": {},
     "path": ["headerSearch", "borderColor"]
   },
-  "data-blue-color": {
+  "data-blue-color-emphasis": {
     "value": "#006edb",
     "$type": "color",
     "$extensions": {
@@ -1198,9 +1198,9 @@
         }
       }
     },
-    "name": "data-blue-color",
+    "name": "data-blue-color-emphasis",
     "attributes": {},
-    "path": ["data", "blue", "color", "@"]
+    "path": ["data", "blue", "color", "emphasis"]
   },
   "data-blue-color-muted": {
     "value": "#d1f0ff",
@@ -1231,7 +1231,7 @@
     "attributes": {},
     "path": ["data", "blue", "color", "muted"]
   },
-  "data-auburn-color": {
+  "data-auburn-color-emphasis": {
     "value": "#9d615c",
     "$type": "color",
     "$extensions": {
@@ -1256,9 +1256,9 @@
         }
       }
     },
-    "name": "data-auburn-color",
+    "name": "data-auburn-color-emphasis",
     "attributes": {},
-    "path": ["data", "auburn", "color", "@"]
+    "path": ["data", "auburn", "color", "emphasis"]
   },
   "data-auburn-color-muted": {
     "value": "#f2e9e9",
@@ -1289,7 +1289,7 @@
     "attributes": {},
     "path": ["data", "auburn", "color", "muted"]
   },
-  "data-orange-color": {
+  "data-orange-color-emphasis": {
     "value": "#eb670f",
     "$type": "color",
     "$extensions": {
@@ -1314,9 +1314,9 @@
         }
       }
     },
-    "name": "data-orange-color",
+    "name": "data-orange-color-emphasis",
     "attributes": {},
-    "path": ["data", "orange", "color", "@"]
+    "path": ["data", "orange", "color", "emphasis"]
   },
   "data-orange-color-muted": {
     "value": "#ffe7d1",
@@ -1347,7 +1347,7 @@
     "attributes": {},
     "path": ["data", "orange", "color", "muted"]
   },
-  "data-yellow-color": {
+  "data-yellow-color-emphasis": {
     "value": "#b88700",
     "$type": "color",
     "$extensions": {
@@ -1372,9 +1372,9 @@
         }
       }
     },
-    "name": "data-yellow-color",
+    "name": "data-yellow-color-emphasis",
     "attributes": {},
-    "path": ["data", "yellow", "color", "@"]
+    "path": ["data", "yellow", "color", "emphasis"]
   },
   "data-yellow-color-muted": {
     "value": "#ffec9e",
@@ -1405,7 +1405,7 @@
     "attributes": {},
     "path": ["data", "yellow", "color", "muted"]
   },
-  "data-green-color": {
+  "data-green-color-emphasis": {
     "value": "#30a147",
     "$type": "color",
     "$extensions": {
@@ -1430,9 +1430,9 @@
         }
       }
     },
-    "name": "data-green-color",
+    "name": "data-green-color-emphasis",
     "attributes": {},
-    "path": ["data", "green", "color", "@"]
+    "path": ["data", "green", "color", "emphasis"]
   },
   "data-green-color-muted": {
     "value": "#caf7ca",
@@ -1463,7 +1463,7 @@
     "attributes": {},
     "path": ["data", "green", "color", "muted"]
   },
-  "data-teal-color": {
+  "data-teal-color-emphasis": {
     "value": "#179b9b",
     "$type": "color",
     "$extensions": {
@@ -1488,9 +1488,9 @@
         }
       }
     },
-    "name": "data-teal-color",
+    "name": "data-teal-color-emphasis",
     "attributes": {},
-    "path": ["data", "teal", "color", "@"]
+    "path": ["data", "teal", "color", "emphasis"]
   },
   "data-teal-color-muted": {
     "value": "#c7f5ef",
@@ -1521,7 +1521,7 @@
     "attributes": {},
     "path": ["data", "teal", "color", "muted"]
   },
-  "data-purple-color": {
+  "data-purple-color-emphasis": {
     "value": "#894ceb",
     "$type": "color",
     "$extensions": {
@@ -1546,9 +1546,9 @@
         }
       }
     },
-    "name": "data-purple-color",
+    "name": "data-purple-color-emphasis",
     "attributes": {},
-    "path": ["data", "purple", "color", "@"]
+    "path": ["data", "purple", "color", "emphasis"]
   },
   "data-purple-color-muted": {
     "value": "#f1e5ff",
@@ -1579,7 +1579,7 @@
     "attributes": {},
     "path": ["data", "purple", "color", "muted"]
   },
-  "data-pink-color": {
+  "data-pink-color-emphasis": {
     "value": "#ce2c85",
     "$type": "color",
     "$extensions": {
@@ -1604,9 +1604,9 @@
         }
       }
     },
-    "name": "data-pink-color",
+    "name": "data-pink-color-emphasis",
     "attributes": {},
-    "path": ["data", "pink", "color", "@"]
+    "path": ["data", "pink", "color", "emphasis"]
   },
   "data-pink-color-muted": {
     "value": "#ffe5f1",
@@ -1637,7 +1637,7 @@
     "attributes": {},
     "path": ["data", "pink", "color", "muted"]
   },
-  "data-red-color": {
+  "data-red-color-emphasis": {
     "value": "#df0c24",
     "$type": "color",
     "$extensions": {
@@ -1662,9 +1662,9 @@
         }
       }
     },
-    "name": "data-red-color",
+    "name": "data-red-color-emphasis",
     "attributes": {},
-    "path": ["data", "red", "color", "@"]
+    "path": ["data", "red", "color", "emphasis"]
   },
   "data-red-color-muted": {
     "value": "#ffe2e0",
@@ -1695,7 +1695,7 @@
     "attributes": {},
     "path": ["data", "red", "color", "muted"]
   },
-  "data-gray-color": {
+  "data-gray-color-emphasis": {
     "value": "#808fa3",
     "$type": "color",
     "$extensions": {
@@ -1720,9 +1720,9 @@
         }
       }
     },
-    "name": "data-gray-color",
+    "name": "data-gray-color-emphasis",
     "attributes": {},
-    "path": ["data", "gray", "color", "@"]
+    "path": ["data", "gray", "color", "emphasis"]
   },
   "data-gray-color-muted": {
     "value": "#e8ecf2",
@@ -12571,6 +12571,64 @@
     "attributes": {},
     "path": ["label", "coral", "fgColor", "active"]
   },
+  "tooltip-bgColor": {
+    "value": "#24292f",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "component",
+        "scopes": ["bgColor"]
+      }
+    },
+    "filePath": "src/tokens/functional/color/light/patterns-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{bgColor.emphasis}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["bgColor"]
+        }
+      }
+    },
+    "name": "tooltip-bgColor",
+    "attributes": {},
+    "path": ["tooltip", "bgColor"]
+  },
+  "tooltip-fgColor": {
+    "value": "#ffffff",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "component",
+        "scopes": ["fgColor"]
+      }
+    },
+    "filePath": "src/tokens/functional/color/light/patterns-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{fgColor.onEmphasis}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["fgColor"]
+        }
+      }
+    },
+    "name": "tooltip-fgColor",
+    "attributes": {},
+    "path": ["tooltip", "fgColor"]
+  },
   "fgColor-default": {
     "value": "#1f2328",
     "$type": "color",
@@ -12684,6 +12742,35 @@
     "attributes": {},
     "path": ["fgColor", "onEmphasis"]
   },
+  "fgColor-onInverse": {
+    "value": "#ffffff",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "semantic",
+        "scopes": ["fgColor"]
+      }
+    },
+    "filePath": "src/tokens/functional/color/light/primitives-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{base.color.white}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "semantic",
+          "scopes": ["fgColor"]
+        }
+      }
+    },
+    "name": "fgColor-onInverse",
+    "attributes": {},
+    "path": ["fgColor", "onInverse"]
+  },
   "fgColor-white": {
     "value": "#ffffff",
     "$type": "color",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/primitives",
-  "version": "8.2.4-rc.fba4a4ab",
+  "version": "9.0.0-rc.02c27a21",
   "description": "Typography, spacing, and color primitives for Primer design system",
   "engines": {
     "node": ">=18.18.0 <18.19.0"

package/src/tokens/fallback/color-fallbacks.json

@@ -256,5 +256,15 @@
   "--shadow-floating-xlarge": "var(--color-shadow-extra-large)",
   "--shadow-inset": "var(--color-primer-shadow-inset)",
   "--borderColor-transparent": "transparent",
-  "--bgColor-transparent": "transparent"
+  "--bgColor-transparent": "transparent",
+  "--data-blue-color": "var(--data-blue-color-emphasis)",
+  "--data-auburn-color": "var(--data-auburn-color-emphasis)",
+  "--data-orange-color": "var(--data-orange-color-emphasis)",
+  "--data-yellow-color": "var(--data-yellow-color-emphasis)",
+  "--data-green-color": "var(--data-green-color-emphasis)",
+  "--data-teal-color": "var(--data-teal-color-emphasis)",
+  "--data-purple-color": "var(--data-purple-color-emphasis)",
+  "--data-pink-color": "var(--data-pink-color-emphasis)",
+  "--data-red-color": "var(--data-red-color-emphasis)",
+  "--data-gray-color": "var(--data-gray-color-emphasis)"
 }