@primer/primitives 7.11.8-rc.f8fce74 → 7.11.8

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

@@ -181,8 +181,8 @@
       },
       "borderColor": {
         "rest": "#1f6feb",
-        "hover": "#00000000",
-        "active": "#00000000",
+        "hover": "#2a7aef",
+        "active": "#3685f3",
         "disabled": "#484f58"
       }
     }
@@ -254,9 +254,9 @@
         "disabled": "#46bf57"
       },
       "borderColor": {
-        "rest": "#30363dcc",
-        "hover": "#30363dcc",
-        "disabled": "#30363dcc"
+        "rest": "#f0f6fc1a",
+        "hover": "#f0f6fc1a",
+        "disabled": "#f0f6fc1a"
       },
       "shadow": {
         "selected": "0px 0px 0px 0px #000000"
@@ -265,6 +265,7 @@
     "invisible": {
       "fgColor": {
         "rest": "#2f81f7",
+        "hover": "#58a6ff",
         "disabled": "#484f58"
       },
       "bgColor": {
@@ -280,8 +281,8 @@
     },
     "outline": {
       "fgColor": {
-        "rest": "#2f81f7",
-        "hover": "#2f81f7",
+        "rest": "#388bfd",
+        "hover": "#58a6ff",
         "active": "#ffffff",
         "disabled": "#2f81f780"
       },
@@ -332,23 +333,38 @@
         "rest": "#30363d"
       }
     },
+    "invisible": {
+      "bgColor": {
+        "rest": "#30363d"
+      }
+    },
     "primary": {
       "bgColor": {
-        "rest": "#ffffff33"
+        "rest": "#04260f33"
       }
     },
     "outline": {
       "bgColor": {
-        "rest": "#1f6feb1a",
-        "hover": "#ffffff33",
+        "rest": "#051d4d33",
+        "hover": "#051d4d33",
         "disabled": "#1f6feb0d"
+      },
+      "fgColor": {
+        "rest": "#388bfd",
+        "hover": "#58a6ff",
+        "disabled": "#2f81f780"
       }
     },
     "danger": {
       "bgColor": {
         "hover": "#ffffff33",
         "disabled": "#da36330d",
-        "rest": "#da36331a"
+        "rest": "#49020233"
+      },
+      "fgColor": {
+        "rest": "#f85149",
+        "hover": "#ffffff",
+        "disabled": "#f8514980"
       }
     }
   },
@@ -402,11 +418,7 @@
     "onEmphasis": "#ffffff",
     "disabled": "#484f58",
     "link": {
-      "rest": "#2f81f7",
-      "inverse": {
-        "rest": "#1f6feb"
-      },
-      "control": "#636a75"
+      "rest": "#2f81f7"
     },
     "accent": "#2f81f7",
     "success": "#3fb950",

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

@@ -181,8 +181,8 @@
       },
       "borderColor": {
         "rest": "#0969da",
-        "hover": "#00000000",
-        "active": "#00000000",
+        "hover": "#0860ca",
+        "active": "#0757ba",
         "disabled": "#8c959f"
       }
     }
@@ -254,9 +254,9 @@
         "disabled": "#92caff"
       },
       "borderColor": {
-        "rest": "#d0d7decc",
-        "hover": "#d0d7decc",
-        "disabled": "#d0d7decc"
+        "rest": "#1f232826",
+        "hover": "#1f232826",
+        "disabled": "#1f232826"
       },
       "shadow": {
         "selected": "inset 0px 1px 0px 0px #0021554d"
@@ -265,6 +265,7 @@
     "invisible": {
       "fgColor": {
         "rest": "#0969da",
+        "hover": "#0969da",
         "disabled": "#8c959f"
       },
       "bgColor": {
@@ -329,12 +330,17 @@
   "buttonCounter": {
     "default": {
       "bgColor": {
-        "rest": "#eaeef280"
+        "rest": "#eaeef2"
+      }
+    },
+    "invisible": {
+      "bgColor": {
+        "rest": "#eaeef2"
       }
     },
     "primary": {
       "bgColor": {
-        "rest": "#ffffff33"
+        "rest": "#002d1133"
       }
     },
     "outline": {
@@ -342,6 +348,11 @@
         "rest": "#0969da1a",
         "hover": "#ffffff33",
         "disabled": "#0969da0d"
+      },
+      "fgColor": {
+        "rest": "#0550ae",
+        "hover": "#ffffff",
+        "disabled": "#0969da80"
       }
     },
     "danger": {
@@ -349,6 +360,11 @@
         "hover": "#ffffff33",
         "disabled": "#bc4c000d",
         "rest": "#bc4c001a"
+      },
+      "fgColor": {
+        "rest": "#c21c2c",
+        "hover": "#ffffff",
+        "disabled": "#be4e0280"
       }
     }
   },
@@ -403,11 +419,7 @@
     "onEmphasis": "#ffffff",
     "disabled": "#8c959f",
     "link": {
-      "rest": "#0969da",
-      "inverse": {
-        "rest": "#54aeff"
-      },
-      "control": "#868f99"
+      "rest": "#0969da"
     },
     "accent": "#0969da",
     "success": "#0969da",

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

@@ -181,8 +181,8 @@
       },
       "borderColor": {
         "rest": "#0349b4",
-        "hover": "#00000000",
-        "active": "#00000000",
+        "hover": "#0344a8",
+        "active": "#033f9d",
         "disabled": "#88929d"
       }
     }
@@ -256,7 +256,7 @@
       "borderColor": {
         "rest": "#013d14",
         "hover": "#013d14",
-        "disabled": "#88929dcc"
+        "disabled": "#013d14"
       },
       "shadow": {
         "selected": "inset 0px 1px 0px 0px #00230b4d"
@@ -265,6 +265,7 @@
     "invisible": {
       "fgColor": {
         "rest": "#023b95",
+        "hover": "#023b95",
         "disabled": "#88929d"
       },
       "bgColor": {
@@ -329,12 +330,17 @@
   "buttonCounter": {
     "default": {
       "bgColor": {
-        "rest": "#e7ecf0"
+        "rest": "#66707b33"
+      }
+    },
+    "invisible": {
+      "bgColor": {
+        "rest": "#66707b33"
       }
     },
     "primary": {
       "bgColor": {
-        "rest": "#ffffff33"
+        "rest": "#00230b33"
       }
     },
     "outline": {
@@ -342,6 +348,11 @@
         "rest": "#0349b41a",
         "hover": "#ffffff33",
         "disabled": "#0349b40d"
+      },
+      "fgColor": {
+        "rest": "#023b95",
+        "hover": "#ffffff",
+        "disabled": "#023b9580"
       }
     },
     "danger": {
@@ -349,6 +360,11 @@
         "hover": "#ffffff33",
         "disabled": "#a0111f0d",
         "rest": "#a0111f1a"
+      },
+      "fgColor": {
+        "rest": "#980e1e",
+        "hover": "#ffffff",
+        "disabled": "#8a071e80"
       }
     }
   },
@@ -391,7 +407,7 @@
   "underlineNav": {
     "borderColor": {
       "active": "#cd3425",
-      "hover": "#acb6c033"
+      "hover": "#88929d"
     },
     "iconColor": {
       "rest": "#0e1116"
@@ -403,11 +419,7 @@
     "onEmphasis": "#ffffff",
     "disabled": "#88929d",
     "link": {
-      "rest": "#023b95",
-      "inverse": {
-        "rest": "#368cf9"
-      },
-      "control": "#818b96"
+      "rest": "#023b95"
     },
     "accent": "#023b95",
     "success": "#055d20",
@@ -471,7 +483,7 @@
     "emphasis": "#66707b",
     "disabled": "#20252c",
     "neutral": {
-      "muted": "#acb6c033",
+      "muted": "#88929d",
       "emphasis": "#66707b"
     },
     "accent": {

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

@@ -181,8 +181,8 @@
       },
       "borderColor": {
         "rest": "#0969da",
-        "hover": "#00000000",
-        "active": "#00000000",
+        "hover": "#0860ca",
+        "active": "#0757ba",
         "disabled": "#8c959f"
       }
     }
@@ -254,9 +254,9 @@
         "disabled": "#92caff"
       },
       "borderColor": {
-        "rest": "#d0d7decc",
-        "hover": "#d0d7decc",
-        "disabled": "#d0d7decc"
+        "rest": "#1f232826",
+        "hover": "#1f232826",
+        "disabled": "#1f232826"
       },
       "shadow": {
         "selected": "inset 0px 1px 0px 0px #0021554d"
@@ -265,6 +265,7 @@
     "invisible": {
       "fgColor": {
         "rest": "#0969da",
+        "hover": "#0969da",
         "disabled": "#8c959f"
       },
       "bgColor": {
@@ -329,12 +330,17 @@
   "buttonCounter": {
     "default": {
       "bgColor": {
-        "rest": "#eaeef280"
+        "rest": "#eaeef2"
+      }
+    },
+    "invisible": {
+      "bgColor": {
+        "rest": "#eaeef2"
       }
     },
     "primary": {
       "bgColor": {
-        "rest": "#ffffff33"
+        "rest": "#002d1133"
       }
     },
     "outline": {
@@ -342,6 +348,11 @@
         "rest": "#0969da1a",
         "hover": "#ffffff33",
         "disabled": "#0969da0d"
+      },
+      "fgColor": {
+        "rest": "#0550ae",
+        "hover": "#ffffff",
+        "disabled": "#0969da80"
       }
     },
     "danger": {
@@ -349,6 +360,11 @@
         "hover": "#ffffff33",
         "disabled": "#cf222e0d",
         "rest": "#cf222e1a"
+      },
+      "fgColor": {
+        "rest": "#c21c2c",
+        "hover": "#ffffff",
+        "disabled": "#d1242f80"
       }
     }
   },
@@ -403,19 +419,15 @@
     "onEmphasis": "#ffffff",
     "disabled": "#8c959f",
     "link": {
-      "rest": "#0969da",
-      "inverse": {
-        "rest": "#54aeff"
-      },
-      "control": "#868f99"
+      "rest": "#0969da"
     },
     "accent": "#0969da",
     "success": "#0969da",
     "attention": "#9a6700",
     "severe": "#cf222e",
     "danger": "#d1242f",
-    "open": "#0969da",
-    "closed": "#d1242f",
+    "open": "#cf222e",
+    "closed": "#6e7781",
     "done": "#8250df",
     "sponsors": "#bf3989"
   },
@@ -449,13 +461,13 @@
       "emphasis": "#cf222e"
     },
     "open": {
-      "muted": "#ddf4ff",
-      "emphasis": "#0f72e3"
-    },
-    "closed": {
       "muted": "#ffebe9",
       "emphasis": "#cf222e"
     },
+    "closed": {
+      "muted": "#f6f8fa",
+      "emphasis": "#6e7781"
+    },
     "done": {
       "muted": "#fbefff",
       "emphasis": "#8250df"
@@ -495,13 +507,13 @@
       "emphasis": "#cf222e"
     },
     "open": {
-      "muted": "#54aeff66",
-      "emphasis": "#218bff"
-    },
-    "closed": {
       "muted": "#ff818266",
       "emphasis": "#cf222e"
     },
+    "closed": {
+      "muted": "#afb8c166",
+      "emphasis": "#6e7781"
+    },
     "done": {
       "muted": "#c297ff66",
       "emphasis": "#8250df"

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

@@ -181,8 +181,8 @@
       },
       "borderColor": {
         "rest": "#0969da",
-        "hover": "#00000000",
-        "active": "#00000000",
+        "hover": "#0860ca",
+        "active": "#0757ba",
         "disabled": "#8c959f"
       }
     }
@@ -254,9 +254,9 @@
         "disabled": "#95d8a6"
       },
       "borderColor": {
-        "rest": "#d0d7decc",
-        "hover": "#d0d7decc",
-        "disabled": "#d0d7decc"
+        "rest": "#1f232826",
+        "hover": "#1f232826",
+        "disabled": "#1f232826"
       },
       "shadow": {
         "selected": "inset 0px 1px 0px 0px #002d114d"
@@ -265,6 +265,7 @@
     "invisible": {
       "fgColor": {
         "rest": "#0969da",
+        "hover": "#0969da",
         "disabled": "#8c959f"
       },
       "bgColor": {
@@ -329,12 +330,17 @@
   "buttonCounter": {
     "default": {
       "bgColor": {
-        "rest": "#eaeef280"
+        "rest": "#eaeef2"
+      }
+    },
+    "invisible": {
+      "bgColor": {
+        "rest": "#eaeef2"
       }
     },
     "primary": {
       "bgColor": {
-        "rest": "#ffffff33"
+        "rest": "#002d1133"
       }
     },
     "outline": {
@@ -342,6 +348,11 @@
         "rest": "#0969da1a",
         "hover": "#ffffff33",
         "disabled": "#0969da0d"
+      },
+      "fgColor": {
+        "rest": "#0550ae",
+        "hover": "#ffffff",
+        "disabled": "#0969da80"
       }
     },
     "danger": {
@@ -349,6 +360,11 @@
         "hover": "#ffffff33",
         "disabled": "#cf222e0d",
         "rest": "#cf222e1a"
+      },
+      "fgColor": {
+        "rest": "#c21c2c",
+        "hover": "#ffffff",
+        "disabled": "#d1242f80"
       }
     }
   },
@@ -403,11 +419,7 @@
     "onEmphasis": "#ffffff",
     "disabled": "#8c959f",
     "link": {
-      "rest": "#0969da",
-      "inverse": {
-        "rest": "#54aeff"
-      },
-      "control": "#868f99"
+      "rest": "#0969da"
     },
     "accent": "#0969da",
     "success": "#1a7f37",

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

@@ -81,8 +81,8 @@
     --control-checked-fgColor-rest: #ffffff;
     --control-checked-fgColor-disabled: #010409;
     --control-checked-borderColor-rest: #1f6feb;
-    --control-checked-borderColor-hover: #00000000;
-    --control-checked-borderColor-active: #00000000;
+    --control-checked-borderColor-hover: #2a7aef;
+    --control-checked-borderColor-active: #3685f3;
     --control-checked-borderColor-disabled: #484f58;
     --controlTrack-bgColor-rest: #21262d;
     --controlTrack-bgColor-hover: #292e36;
@@ -116,11 +116,12 @@
     --button-primary-bgColor-hover: #2a7aef;
     --button-primary-bgColor-active: #3685f3;
     --button-primary-bgColor-disabled: #1158c7;
-    --button-primary-borderColor-rest: #30363dcc;
-    --button-primary-borderColor-hover: #30363dcc;
-    --button-primary-borderColor-disabled: #30363dcc;
+    --button-primary-borderColor-rest: #f0f6fc1a;
+    --button-primary-borderColor-hover: #f0f6fc1a;
+    --button-primary-borderColor-disabled: #f0f6fc1a;
     --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
     --button-invisible-fgColor-rest: #2f81f7;
+    --button-invisible-fgColor-hover: #58a6ff;
     --button-invisible-fgColor-disabled: #484f58;
     --button-invisible-bgColor-rest: #00000000;
     --button-invisible-bgColor-hover: #b1bac41f;
@@ -128,8 +129,8 @@
     --button-invisible-bgColor-disabled: #00000000;
     --button-invisible-borderColor-rest: #00000000;
     --button-invisible-borderColor-hover: #00000000;
-    --button-outline-fgColor-rest: #2f81f7;
-    --button-outline-fgColor-hover: #2f81f7;
+    --button-outline-fgColor-rest: #388bfd;
+    --button-outline-fgColor-hover: #58a6ff;
     --button-outline-fgColor-active: #ffffff;
     --button-outline-fgColor-disabled: #2f81f780;
     --button-outline-bgColor-rest: #f0f6fc;
@@ -154,13 +155,20 @@
     --button-danger-borderColor-active: #b5531d;
     --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
     --buttonCounter-default-bgColor-rest: #30363d;
-    --buttonCounter-primary-bgColor-rest: #ffffff33;
-    --buttonCounter-outline-bgColor-rest: #1f6feb1a;
-    --buttonCounter-outline-bgColor-hover: #ffffff33;
+    --buttonCounter-invisible-bgColor-rest: #30363d;
+    --buttonCounter-primary-bgColor-rest: #04260f33;
+    --buttonCounter-outline-bgColor-rest: #051d4d33;
+    --buttonCounter-outline-bgColor-hover: #051d4d33;
     --buttonCounter-outline-bgColor-disabled: #1f6feb0d;
+    --buttonCounter-outline-fgColor-rest: #388bfd;
+    --buttonCounter-outline-fgColor-hover: #58a6ff;
+    --buttonCounter-outline-fgColor-disabled: #2f81f780;
     --buttonCounter-danger-bgColor-hover: #ffffff33;
     --buttonCounter-danger-bgColor-disabled: #bd561d0d;
-    --buttonCounter-danger-bgColor-rest: #bd561d1a;
+    --buttonCounter-danger-bgColor-rest: #49020233;
+    --buttonCounter-danger-fgColor-rest: #db6d28;
+    --buttonCounter-danger-fgColor-hover: #ffffff;
+    --buttonCounter-danger-fgColor-disabled: #db6d2880;
     --focus-outlineColor: #1f6feb;
     --menu-bgColor-active: #161b22;
     --overlay-bgColor: #161b22;
@@ -178,8 +186,6 @@
     --fgColor-onEmphasis: #ffffff;
     --fgColor-disabled: #484f58;
     --fgColor-link-rest: #2f81f7;
-    --fgColor-link-inverse-rest: #1f6feb;
-    --fgColor-link-control: #636a75;
     --fgColor-accent: #2f81f7;
     --fgColor-success: #58a6ff;
     --fgColor-attention: #d29922;

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

@@ -81,8 +81,8 @@
     --control-checked-fgColor-rest: #cdd9e5;
     --control-checked-fgColor-disabled: #1c2128;
     --control-checked-borderColor-rest: #316dca;
-    --control-checked-borderColor-hover: #00000000;
-    --control-checked-borderColor-active: #00000000;
+    --control-checked-borderColor-hover: #3876d3;
+    --control-checked-borderColor-active: #3f7fdb;
     --control-checked-borderColor-disabled: #545d68;
     --controlTrack-bgColor-rest: #373e47;
     --controlTrack-bgColor-hover: #3d444e;
@@ -116,11 +116,12 @@
     --button-primary-bgColor-hover: #3b8640;
     --button-primary-bgColor-active: #428f46;
     --button-primary-bgColor-disabled: #50a254;
-    --button-primary-borderColor-rest: #444c56cc;
-    --button-primary-borderColor-hover: #444c56cc;
-    --button-primary-borderColor-disabled: #444c56cc;
+    --button-primary-borderColor-rest: #cdd9e51a;
+    --button-primary-borderColor-hover: #cdd9e51a;
+    --button-primary-borderColor-disabled: #cdd9e51a;
     --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
     --button-invisible-fgColor-rest: #3b7cdb;
+    --button-invisible-fgColor-hover: #539bf5;
     --button-invisible-fgColor-disabled: #545d68;
     --button-invisible-bgColor-rest: #00000000;
     --button-invisible-bgColor-hover: #909dab1f;
@@ -128,8 +129,8 @@
     --button-invisible-bgColor-disabled: #00000000;
     --button-invisible-borderColor-rest: #00000000;
     --button-invisible-borderColor-hover: #00000000;
-    --button-outline-fgColor-rest: #3b7cdb;
-    --button-outline-fgColor-hover: #3b7cdb;
+    --button-outline-fgColor-rest: #4184e4;
+    --button-outline-fgColor-hover: #539bf5;
     --button-outline-fgColor-active: #cdd9e5;
     --button-outline-fgColor-disabled: #3b7cdb80;
     --button-outline-bgColor-rest: #cdd9e5;
@@ -154,13 +155,20 @@
     --button-danger-borderColor-active: #c33d38;
     --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
     --buttonCounter-default-bgColor-rest: #444c56;
-    --buttonCounter-primary-bgColor-rest: #cdd9e533;
-    --buttonCounter-outline-bgColor-rest: #316dca1a;
-    --buttonCounter-outline-bgColor-hover: #cdd9e533;
+    --buttonCounter-invisible-bgColor-rest: #444c56;
+    --buttonCounter-primary-bgColor-rest: #11341733;
+    --buttonCounter-outline-bgColor-rest: #0f2d5c33;
+    --buttonCounter-outline-bgColor-hover: #0f2d5c33;
     --buttonCounter-outline-bgColor-disabled: #316dca0d;
+    --buttonCounter-outline-fgColor-rest: #4184e4;
+    --buttonCounter-outline-fgColor-hover: #539bf5;
+    --buttonCounter-outline-fgColor-disabled: #3b7cdb80;
     --buttonCounter-danger-bgColor-hover: #cdd9e533;
     --buttonCounter-danger-bgColor-disabled: #c93c370d;
-    --buttonCounter-danger-bgColor-rest: #c93c371a;
+    --buttonCounter-danger-bgColor-rest: #5d0f1233;
+    --buttonCounter-danger-fgColor-rest: #e5534b;
+    --buttonCounter-danger-fgColor-hover: #cdd9e5;
+    --buttonCounter-danger-fgColor-disabled: #e5534b80;
     --focus-outlineColor: #316dca;
     --menu-bgColor-active: #2d333b;
     --overlay-bgColor: #2d333b;
@@ -178,8 +186,6 @@
     --fgColor-onEmphasis: #cdd9e5;
     --fgColor-disabled: #545d68;
     --fgColor-link-rest: #3b7cdb;
-    --fgColor-link-inverse-rest: #316dca;
-    --fgColor-link-control: #5e6975;
     --fgColor-accent: #3b7cdb;
     --fgColor-success: #57ab5a;
     --fgColor-attention: #c69026;