@primer/primitives 7.13.0 → 7.13.1-rc.0fa7554

package/tokens-next-private/docs/functional/themes/light-tritanopia.json

@@ -3252,27 +3252,6 @@
     "attributes": {},
     "path": ["button", "default", "shadow", "resting"]
   },
-  "button-default-shadow-inset": {
-    "value": "inset 0px 1px 0px 0px #ffffff40",
-    "$type": "shadow",
-    "filePath": "src/tokens/functional/shadow/light.json5",
-    "isSource": true,
-    "original": {
-      "value": {
-        "color": "{base.color.white}",
-        "alpha": 0.25,
-        "offsetX": "0px",
-        "offsetY": "1px",
-        "blur": "0px",
-        "spread": "0px",
-        "inset": true
-      },
-      "$type": "shadow"
-    },
-    "name": "button-default-shadow-inset",
-    "attributes": {},
-    "path": ["button", "default", "shadow", "inset"]
-  },
   "button-primary-fgColor-rest": {
     "value": "#ffffff",
     "$type": "color",
@@ -3564,6 +3543,35 @@
     "attributes": {},
     "path": ["button", "primary", "borderColor", "hover"]
   },
+  "button-primary-borderColor-active": {
+    "value": "#1f232826",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "component",
+        "scopes": ["borderColor"]
+      }
+    },
+    "filePath": "src/tokens/functional/color/light/patterns-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{button.primary.borderColor.rest}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["borderColor"]
+        }
+      }
+    },
+    "name": "button-primary-borderColor-active",
+    "attributes": {},
+    "path": ["button", "primary", "borderColor", "active"]
+  },
   "button-primary-borderColor-disabled": {
     "value": "#92caff",
     "$type": "color",
@@ -3703,6 +3711,93 @@
     "attributes": {},
     "path": ["button", "invisible", "fgColor", "disabled"]
   },
+  "button-invisible-iconColor-rest": {
+    "value": "#636c76",
+    "$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.muted}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["fgColor"]
+        }
+      }
+    },
+    "name": "button-invisible-iconColor-rest",
+    "attributes": {},
+    "path": ["button", "invisible", "iconColor", "rest"]
+  },
+  "button-invisible-iconColor-hover": {
+    "value": "#636c76",
+    "$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.muted}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["fgColor"]
+        }
+      }
+    },
+    "name": "button-invisible-iconColor-hover",
+    "attributes": {},
+    "path": ["button", "invisible", "iconColor", "hover"]
+  },
+  "button-invisible-iconColor-disabled": {
+    "value": "#8c959f",
+    "$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": "{control.fgColor.disabled}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["fgColor"]
+        }
+      }
+    },
+    "name": "button-invisible-iconColor-disabled",
+    "attributes": {},
+    "path": ["button", "invisible", "iconColor", "disabled"]
+  },
   "button-invisible-bgColor-rest": {
     "value": "#ffffff00",
     "$type": "color",
@@ -4149,7 +4244,7 @@
     "path": ["button", "outline", "bgColor", "disabled"]
   },
   "button-outline-borderColor-hover": {
-    "value": "#d0d7de",
+    "value": "#1f232826",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -4159,10 +4254,11 @@
         "scopes": ["borderColor"]
       }
     },
+    "alpha": 0.15,
     "filePath": "src/tokens/functional/color/light/patterns-light.json5",
     "isSource": true,
     "original": {
-      "value": "{borderColor.default}",
+      "value": "{base.color.black}",
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -4171,14 +4267,15 @@
           "group": "component",
           "scopes": ["borderColor"]
         }
-      }
+      },
+      "alpha": 0.15
     },
     "name": "button-outline-borderColor-hover",
     "attributes": {},
     "path": ["button", "outline", "borderColor", "hover"]
   },
   "button-outline-borderColor-active": {
-    "value": "#d0d7de",
+    "value": "#1f232826",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -4191,7 +4288,7 @@
     "filePath": "src/tokens/functional/color/light/patterns-light.json5",
     "isSource": true,
     "original": {
-      "value": "{borderColor.default}",
+      "value": "{button.outline.borderColor.hover}",
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -4559,7 +4656,7 @@
     "path": ["button", "danger", "borderColor", "rest"]
   },
   "button-danger-borderColor-hover": {
-    "value": "#d0d7de",
+    "value": "#1f232826",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -4569,10 +4666,11 @@
         "scopes": ["borderColor"]
       }
     },
+    "alpha": 0.15,
     "filePath": "src/tokens/functional/color/light/patterns-light.json5",
     "isSource": true,
     "original": {
-      "value": "{borderColor.default}",
+      "value": "{base.color.black}",
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -4581,14 +4679,15 @@
           "group": "component",
           "scopes": ["borderColor"]
         }
-      }
+      },
+      "alpha": 0.15
     },
     "name": "button-danger-borderColor-hover",
     "attributes": {},
     "path": ["button", "danger", "borderColor", "hover"]
   },
   "button-danger-borderColor-active": {
-    "value": "#d0d7de",
+    "value": "#1f232826",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -4601,7 +4700,7 @@
     "filePath": "src/tokens/functional/color/light/patterns-light.json5",
     "isSource": true,
     "original": {
-      "value": "{borderColor.default}",
+      "value": "{button.danger.borderColor.hover}",
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -10501,27 +10600,6 @@
     "attributes": {},
     "path": ["shadow", "inset"]
   },
-  "shadow-highlight": {
-    "value": "inset 0px 1px 0px 0px #ffffff3d",
-    "$type": "shadow",
-    "filePath": "src/tokens/functional/shadow/light.json5",
-    "isSource": true,
-    "original": {
-      "value": {
-        "color": "{base.color.white}",
-        "alpha": 0.24,
-        "offsetX": "0px",
-        "offsetY": "1px",
-        "blur": "0px",
-        "spread": "0px",
-        "inset": true
-      },
-      "$type": "shadow"
-    },
-    "name": "shadow-highlight",
-    "attributes": {},
-    "path": ["shadow", "highlight"]
-  },
   "shadow-resting-xsmall": {
     "value": "0px 1px 0px 0px #1f23281a",
     "$type": "shadow",

package/tokens-next-private/docs/functional/themes/light.json

@@ -3252,27 +3252,6 @@
     "attributes": {},
     "path": ["button", "default", "shadow", "resting"]
   },
-  "button-default-shadow-inset": {
-    "value": "inset 0px 1px 0px 0px #ffffff40",
-    "$type": "shadow",
-    "filePath": "src/tokens/functional/shadow/light.json5",
-    "isSource": true,
-    "original": {
-      "value": {
-        "color": "{base.color.white}",
-        "alpha": 0.25,
-        "offsetX": "0px",
-        "offsetY": "1px",
-        "blur": "0px",
-        "spread": "0px",
-        "inset": true
-      },
-      "$type": "shadow"
-    },
-    "name": "button-default-shadow-inset",
-    "attributes": {},
-    "path": ["button", "default", "shadow", "inset"]
-  },
   "button-primary-fgColor-rest": {
     "value": "#ffffff",
     "$type": "color",
@@ -3564,6 +3543,35 @@
     "attributes": {},
     "path": ["button", "primary", "borderColor", "hover"]
   },
+  "button-primary-borderColor-active": {
+    "value": "#1f232826",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "component",
+        "scopes": ["borderColor"]
+      }
+    },
+    "filePath": "src/tokens/functional/color/light/patterns-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{button.primary.borderColor.rest}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["borderColor"]
+        }
+      }
+    },
+    "name": "button-primary-borderColor-active",
+    "attributes": {},
+    "path": ["button", "primary", "borderColor", "active"]
+  },
   "button-primary-borderColor-disabled": {
     "value": "#95d8a6",
     "$type": "color",
@@ -3703,6 +3711,93 @@
     "attributes": {},
     "path": ["button", "invisible", "fgColor", "disabled"]
   },
+  "button-invisible-iconColor-rest": {
+    "value": "#636c76",
+    "$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.muted}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["fgColor"]
+        }
+      }
+    },
+    "name": "button-invisible-iconColor-rest",
+    "attributes": {},
+    "path": ["button", "invisible", "iconColor", "rest"]
+  },
+  "button-invisible-iconColor-hover": {
+    "value": "#636c76",
+    "$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.muted}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["fgColor"]
+        }
+      }
+    },
+    "name": "button-invisible-iconColor-hover",
+    "attributes": {},
+    "path": ["button", "invisible", "iconColor", "hover"]
+  },
+  "button-invisible-iconColor-disabled": {
+    "value": "#8c959f",
+    "$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": "{control.fgColor.disabled}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["fgColor"]
+        }
+      }
+    },
+    "name": "button-invisible-iconColor-disabled",
+    "attributes": {},
+    "path": ["button", "invisible", "iconColor", "disabled"]
+  },
   "button-invisible-bgColor-rest": {
     "value": "#ffffff00",
     "$type": "color",
@@ -4149,7 +4244,7 @@
     "path": ["button", "outline", "bgColor", "disabled"]
   },
   "button-outline-borderColor-hover": {
-    "value": "#d0d7de",
+    "value": "#1f232826",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -4159,10 +4254,11 @@
         "scopes": ["borderColor"]
       }
     },
+    "alpha": 0.15,
     "filePath": "src/tokens/functional/color/light/patterns-light.json5",
     "isSource": true,
     "original": {
-      "value": "{borderColor.default}",
+      "value": "{base.color.black}",
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -4171,14 +4267,15 @@
           "group": "component",
           "scopes": ["borderColor"]
         }
-      }
+      },
+      "alpha": 0.15
     },
     "name": "button-outline-borderColor-hover",
     "attributes": {},
     "path": ["button", "outline", "borderColor", "hover"]
   },
   "button-outline-borderColor-active": {
-    "value": "#d0d7de",
+    "value": "#1f232826",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -4191,7 +4288,7 @@
     "filePath": "src/tokens/functional/color/light/patterns-light.json5",
     "isSource": true,
     "original": {
-      "value": "{borderColor.default}",
+      "value": "{button.outline.borderColor.hover}",
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -4559,7 +4656,7 @@
     "path": ["button", "danger", "borderColor", "rest"]
   },
   "button-danger-borderColor-hover": {
-    "value": "#d0d7de",
+    "value": "#1f232826",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -4569,10 +4666,11 @@
         "scopes": ["borderColor"]
       }
     },
+    "alpha": 0.15,
     "filePath": "src/tokens/functional/color/light/patterns-light.json5",
     "isSource": true,
     "original": {
-      "value": "{borderColor.default}",
+      "value": "{base.color.black}",
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -4581,14 +4679,15 @@
           "group": "component",
           "scopes": ["borderColor"]
         }
-      }
+      },
+      "alpha": 0.15
     },
     "name": "button-danger-borderColor-hover",
     "attributes": {},
     "path": ["button", "danger", "borderColor", "hover"]
   },
   "button-danger-borderColor-active": {
-    "value": "#d0d7de",
+    "value": "#1f232826",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -4601,7 +4700,7 @@
     "filePath": "src/tokens/functional/color/light/patterns-light.json5",
     "isSource": true,
     "original": {
-      "value": "{borderColor.default}",
+      "value": "{button.danger.borderColor.hover}",
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -10499,27 +10598,6 @@
     "attributes": {},
     "path": ["shadow", "inset"]
   },
-  "shadow-highlight": {
-    "value": "inset 0px 1px 0px 0px #ffffff3d",
-    "$type": "shadow",
-    "filePath": "src/tokens/functional/shadow/light.json5",
-    "isSource": true,
-    "original": {
-      "value": {
-        "color": "{base.color.white}",
-        "alpha": 0.24,
-        "offsetX": "0px",
-        "offsetY": "1px",
-        "blur": "0px",
-        "spread": "0px",
-        "inset": true
-      },
-      "$type": "shadow"
-    },
-    "name": "shadow-highlight",
-    "attributes": {},
-    "path": ["shadow", "highlight"]
-  },
   "shadow-resting-xsmall": {
     "value": "0px 1px 0px 0px #1f23281a",
     "$type": "shadow",

package/tokens-next-private/fallbacks/color-fallbacks.json

@@ -103,9 +103,11 @@
   "--button-default-bgColor-hover": "var(--color-btn-hover-bg)",
   "--button-default-bgColor-active": "var(--color-btn-active-bg)",
   "--button-default-bgColor-selected": "var(--color-btn-selected-bg)",
+  "--button-default-bgColor-disabled": "var(--color-btn-bg)",
   "--button-default-borderColor-rest": "var(--color-btn-border)",
   "--button-default-borderColor-hover": "var(--color-btn-hover-border)",
   "--button-default-borderColor-active": "var(--color-btn-active-border)",
+  "--button-default-borderColor-disabled": "var(--color-btn-border)",
   "--button-default-shadow-resting": "var(--color-btn-shadow)",
   "--button-default-shadow-inset": "var(--color-btn-inset-shadow)",
   "--button-primary-fgColor-rest": "var(--color-btn-primary-text)",
@@ -128,6 +130,7 @@
   "--button-invisible-bgColor-disabled": "var(--color-action-list-item-default-selected-bg)",
   "--button-invisible-borderColor-rest": "transparent",
   "--button-invisible-borderColor-hover": "transparent",
+  "--button-invisible-borderColor-disabled": "var(--color-action-list-item-default-selected-bg)",
   "--button-outline-fgColor-rest": "var(--color-btn-outline-text)",
   "--button-outline-fgColor-hover": "var(--color-btn-outline-hover-text)",
   "--button-outline-fgColor-active": "var(--color-btn-outline-selected-text)",
@@ -152,6 +155,7 @@
   "--button-danger-borderColor-rest": "var(--color-btn-border)",
   "--button-danger-borderColor-hover": "var(--color-btn-danger-hover-border)",
   "--button-danger-borderColor-active": "var(--color-btn-danger-selected-border)",
+  "--button-danger-borderColor-disabled": "var(--color-action-list-item-default-selected-bg)",
   "--button-danger-shadow-selected": "var(--color-btn-danger-selected-shadow)",
   "--buttonCounter-default-bgColor-rest": "var(--color-btn-counter-bg)",
   "--buttonCounter-primary-bgColor-rest": "var(--color-btn-primary-counter-bg)",
@@ -250,7 +254,6 @@
   "--shadow-floating-medium": "",
   "--shadow-floating-large": "var(--color-shadow-large)",
   "--shadow-floating-xlarge": "var(--color-shadow-extra-large)",
-  "--shadow-highlight": "var(--color-primer-shadow-highlight)",
   "--shadow-inset": "var(--color-primer-shadow-inset)",
   "--borderColor-transparent": "transparent",
   "--bgColor-transparent": "transparent"