@primer/primitives 7.15.7-rc.cbe6238 → 7.15.7

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

@@ -1213,7 +1213,7 @@
     "path": ["avatar", "bgColor"]
   },
   "avatar-borderColor": {
-    "value": "#30363d80",
+    "value": "#30363db3",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -3622,7 +3622,7 @@
     "path": ["button", "primary", "shadow", "selected"]
   },
   "button-invisible-fgColor-rest": {
-    "value": "#2f81f7",
+    "value": "#4493f8",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -4086,7 +4086,7 @@
     "path": ["button", "outline", "fgColor", "active"]
   },
   "button-outline-fgColor-disabled": {
-    "value": "#2f81f780",
+    "value": "#4493f880",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -5028,7 +5028,7 @@
     "path": ["buttonCounter", "outline", "fgColor", "hover"]
   },
   "buttonCounter-outline-fgColor-disabled": {
-    "value": "#2f81f780",
+    "value": "#4493f880",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -5603,6 +5603,37 @@
     "attributes": {},
     "path": ["underlineNav", "iconColor", "rest"]
   },
+  "selection-bgColor": {
+    "value": "#4493f833",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "dark",
+        "group": "component",
+        "scopes": ["bgColor"]
+      }
+    },
+    "alpha": 0.2,
+    "filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
+    "isSource": true,
+    "original": {
+      "value": "{fgColor.link.@}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "dark",
+          "group": "component",
+          "scopes": ["bgColor"]
+        }
+      },
+      "alpha": 0.2
+    },
+    "name": "selection-bgColor",
+    "attributes": {},
+    "path": ["selection", "bgColor"]
+  },
   "fgColor-default": {
     "value": "#e6edf3",
     "$type": "color",
@@ -5754,7 +5785,7 @@
     "path": ["fgColor", "disabled"]
   },
   "fgColor-link": {
-    "value": "#2f81f7",
+    "value": "#4493f8",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -5818,7 +5849,7 @@
     "path": ["fgColor", "neutral", "@"]
   },
   "fgColor-accent": {
-    "value": "#2f81f7",
+    "value": "#4493f8",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -5838,7 +5869,7 @@
     "filePath": "src/tokens/functional/color/dark/primitives-dark.json5",
     "isSource": true,
     "original": {
-      "value": "{base.color.blue.4}",
+      "value": "{base.color.blue.3}",
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -7117,7 +7148,7 @@
     "path": ["borderColor", "default"]
   },
   "borderColor-muted": {
-    "value": "#30363d80",
+    "value": "#30363db3",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -7130,7 +7161,7 @@
         }
       }
     },
-    "alpha": 0.5,
+    "alpha": 0.7,
     "filePath": "src/tokens/functional/color/dark/primitives-dark.json5",
     "isSource": true,
     "original": {
@@ -7147,7 +7178,7 @@
           }
         }
       },
-      "alpha": 0.5
+      "alpha": 0.7
     },
     "name": "borderColor-muted",
     "attributes": {},

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

@@ -1213,7 +1213,7 @@
     "path": ["avatar", "bgColor"]
   },
   "avatar-borderColor": {
-    "value": "#30363d80",
+    "value": "#30363db3",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -3622,7 +3622,7 @@
     "path": ["button", "primary", "shadow", "selected"]
   },
   "button-invisible-fgColor-rest": {
-    "value": "#2f81f7",
+    "value": "#4493f8",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -4086,7 +4086,7 @@
     "path": ["button", "outline", "fgColor", "active"]
   },
   "button-outline-fgColor-disabled": {
-    "value": "#2f81f780",
+    "value": "#4493f880",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -5028,7 +5028,7 @@
     "path": ["buttonCounter", "outline", "fgColor", "hover"]
   },
   "buttonCounter-outline-fgColor-disabled": {
-    "value": "#2f81f780",
+    "value": "#4493f880",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -5603,6 +5603,37 @@
     "attributes": {},
     "path": ["underlineNav", "iconColor", "rest"]
   },
+  "selection-bgColor": {
+    "value": "#4493f833",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "dark",
+        "group": "component",
+        "scopes": ["bgColor"]
+      }
+    },
+    "alpha": 0.2,
+    "filePath": "src/tokens/functional/color/dark/patterns-dark.json5",
+    "isSource": true,
+    "original": {
+      "value": "{fgColor.link.@}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "dark",
+          "group": "component",
+          "scopes": ["bgColor"]
+        }
+      },
+      "alpha": 0.2
+    },
+    "name": "selection-bgColor",
+    "attributes": {},
+    "path": ["selection", "bgColor"]
+  },
   "fgColor-default": {
     "value": "#e6edf3",
     "$type": "color",
@@ -5754,7 +5785,7 @@
     "path": ["fgColor", "disabled"]
   },
   "fgColor-link": {
-    "value": "#2f81f7",
+    "value": "#4493f8",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -5818,7 +5849,7 @@
     "path": ["fgColor", "neutral", "@"]
   },
   "fgColor-accent": {
-    "value": "#2f81f7",
+    "value": "#4493f8",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -5838,7 +5869,7 @@
     "filePath": "src/tokens/functional/color/dark/primitives-dark.json5",
     "isSource": true,
     "original": {
-      "value": "{base.color.blue.4}",
+      "value": "{base.color.blue.3}",
       "$type": "color",
       "$extensions": {
         "org.primer.figma": {
@@ -7117,7 +7148,7 @@
     "path": ["borderColor", "default"]
   },
   "borderColor-muted": {
-    "value": "#30363d80",
+    "value": "#30363db3",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -7130,7 +7161,7 @@
         }
       }
     },
-    "alpha": 0.5,
+    "alpha": 0.7,
     "filePath": "src/tokens/functional/color/dark/primitives-dark.json5",
     "isSource": true,
     "original": {
@@ -7147,7 +7178,7 @@
           }
         }
       },
-      "alpha": 0.5
+      "alpha": 0.7
     },
     "name": "borderColor-muted",
     "attributes": {},

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

@@ -5614,6 +5614,37 @@
     "attributes": {},
     "path": ["underlineNav", "iconColor", "rest"]
   },
+  "selection-bgColor": {
+    "value": "#0969da1a",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "component",
+        "scopes": ["bgColor"]
+      }
+    },
+    "alpha": 0.1,
+    "filePath": "src/tokens/functional/color/light/patterns-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{fgColor.link.@}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["bgColor"]
+        }
+      },
+      "alpha": 0.1
+    },
+    "name": "selection-bgColor",
+    "attributes": {},
+    "path": ["selection", "bgColor"]
+  },
   "fgColor-default": {
     "value": "#1f2328",
     "$type": "color",
@@ -7114,7 +7145,7 @@
     "path": ["borderColor", "default"]
   },
   "borderColor-muted": {
-    "value": "#d0d7de80",
+    "value": "#d0d7deb3",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -7127,7 +7158,7 @@
         }
       }
     },
-    "alpha": 0.5,
+    "alpha": 0.7,
     "filePath": "src/tokens/functional/color/light/primitives-light.json5",
     "isSource": true,
     "original": {
@@ -7144,7 +7175,7 @@
           }
         }
       },
-      "alpha": 0.5
+      "alpha": 0.7
     },
     "name": "borderColor-muted",
     "attributes": {},

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

@@ -5634,6 +5634,37 @@
     "attributes": {},
     "path": ["underlineNav", "iconColor", "rest"]
   },
+  "selection-bgColor": {
+    "value": "#023b951a",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "component",
+        "scopes": ["bgColor"]
+      }
+    },
+    "alpha": 0.1,
+    "filePath": "src/tokens/functional/color/light/patterns-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{fgColor.link.@}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["bgColor"]
+        }
+      },
+      "alpha": 0.1
+    },
+    "name": "selection-bgColor",
+    "attributes": {},
+    "path": ["selection", "bgColor"]
+  },
   "fgColor-default": {
     "value": "#010409",
     "$type": "color",

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

@@ -5610,6 +5610,37 @@
     "attributes": {},
     "path": ["underlineNav", "iconColor", "rest"]
   },
+  "selection-bgColor": {
+    "value": "#0969da1a",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "component",
+        "scopes": ["bgColor"]
+      }
+    },
+    "alpha": 0.1,
+    "filePath": "src/tokens/functional/color/light/patterns-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{fgColor.link.@}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["bgColor"]
+        }
+      },
+      "alpha": 0.1
+    },
+    "name": "selection-bgColor",
+    "attributes": {},
+    "path": ["selection", "bgColor"]
+  },
   "fgColor-default": {
     "value": "#1f2328",
     "$type": "color",
@@ -7106,7 +7137,7 @@
     "path": ["borderColor", "default"]
   },
   "borderColor-muted": {
-    "value": "#d0d7de80",
+    "value": "#d0d7deb3",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -7119,7 +7150,7 @@
         }
       }
     },
-    "alpha": 0.5,
+    "alpha": 0.7,
     "filePath": "src/tokens/functional/color/light/primitives-light.json5",
     "isSource": true,
     "original": {
@@ -7136,7 +7167,7 @@
           }
         }
       },
-      "alpha": 0.5
+      "alpha": 0.7
     },
     "name": "borderColor-muted",
     "attributes": {},

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

@@ -5610,6 +5610,37 @@
     "attributes": {},
     "path": ["underlineNav", "iconColor", "rest"]
   },
+  "selection-bgColor": {
+    "value": "#0969da1a",
+    "$type": "color",
+    "$extensions": {
+      "org.primer.figma": {
+        "collection": "mode",
+        "mode": "light",
+        "group": "component",
+        "scopes": ["bgColor"]
+      }
+    },
+    "alpha": 0.1,
+    "filePath": "src/tokens/functional/color/light/patterns-light.json5",
+    "isSource": true,
+    "original": {
+      "value": "{fgColor.link.@}",
+      "$type": "color",
+      "$extensions": {
+        "org.primer.figma": {
+          "collection": "mode",
+          "mode": "light",
+          "group": "component",
+          "scopes": ["bgColor"]
+        }
+      },
+      "alpha": 0.1
+    },
+    "name": "selection-bgColor",
+    "attributes": {},
+    "path": ["selection", "bgColor"]
+  },
   "fgColor-default": {
     "value": "#1f2328",
     "$type": "color",
@@ -7106,7 +7137,7 @@
     "path": ["borderColor", "default"]
   },
   "borderColor-muted": {
-    "value": "#d0d7de80",
+    "value": "#d0d7deb3",
     "$type": "color",
     "$extensions": {
       "org.primer.figma": {
@@ -7119,7 +7150,7 @@
         }
       }
     },
-    "alpha": 0.5,
+    "alpha": 0.7,
     "filePath": "src/tokens/functional/color/light/primitives-light.json5",
     "isSource": true,
     "original": {
@@ -7136,7 +7167,7 @@
           }
         }
       },
-      "alpha": 0.5
+      "alpha": 0.7
     },
     "name": "borderColor-muted",
     "attributes": {},

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

@@ -69,5 +69,6 @@
   "--overlay-padding-condensed": "0.5rem",
   "--overlay-paddingBlock-condensed": "0.25rem",
   "--overlay-paddingBlock-normal": "0.75rem",
-  "--overlay-borderRadius": "0.375rem"
+  "--overlay-borderRadius": "0.375rem",
+  "--overlay-offset": "0.25rem"
 }

package/tokens-next-private/figma/dimension/dimension.json

@@ -52,6 +52,16 @@
       "web": "var(--borderRadius-small) /* utility class: .rounded-1 */"
     }
   },
+  {
+    "name": "overlay/offset",
+    "value": 4,
+    "type": "FLOAT",
+    "refId": "pattern/size/overlay/offset",
+    "collection": "pattern/size",
+    "mode": "default",
+    "group": "pattern/size",
+    "scopes": ["WIDTH_HEIGHT"]
+  },
   {
     "name": "overlay/height/xlarge",
     "value": 600,

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

@@ -1753,15 +1753,15 @@
   {
     "name": "fgColor/accent",
     "value": {
-      "r": 0.1843137254901961,
-      "g": 0.5058823529411764,
-      "b": 0.9686274509803922,
+      "r": 0.26666666666666666,
+      "g": 0.5764705882352941,
+      "b": 0.9725490196078431,
       "a": 1
     },
     "type": "COLOR",
     "isMix": true,
     "refId": "mode/fgColor/accent",
-    "reference": "base/color/dark/base/color/blue/4",
+    "reference": "base/color/dark/base/color/blue/3",
     "collection": "mode",
     "mode": "dark",
     "group": "semantic",
@@ -3392,10 +3392,10 @@
       "r": 0.18823529411764706,
       "g": 0.21176470588235294,
       "b": 0.23921568627450981,
-      "a": 0.5
+      "a": 0.7
     },
     "type": "COLOR",
-    "alpha": 0.5,
+    "alpha": 0.7,
     "refId": "mode/borderColor/muted",
     "reference": "mode/borderColor/default",
     "collection": "mode",
@@ -3467,9 +3467,9 @@
   {
     "name": "fgColor/link",
     "value": {
-      "r": 0.1843137254901961,
-      "g": 0.5058823529411764,
-      "b": 0.9686274509803922,
+      "r": 0.26666666666666666,
+      "g": 0.5764705882352941,
+      "b": 0.9725490196078431,
       "a": 1
     },
     "type": "COLOR",
@@ -3600,9 +3600,9 @@
   {
     "name": "buttonCounter/outline/fgColor/disabled",
     "value": {
-      "r": 0.1843137254901961,
-      "g": 0.5058823529411764,
-      "b": 0.9686274509803922,
+      "r": 0.26666666666666666,
+      "g": 0.5764705882352941,
+      "b": 0.9725490196078431,
       "a": 0.5
     },
     "type": "COLOR",
@@ -3747,9 +3747,9 @@
   {
     "name": "button/outline/fgColor/disabled",
     "value": {
-      "r": 0.1843137254901961,
-      "g": 0.5058823529411764,
-      "b": 0.9686274509803922,
+      "r": 0.26666666666666666,
+      "g": 0.5764705882352941,
+      "b": 0.9725490196078431,
       "a": 0.5
     },
     "type": "COLOR",
@@ -3892,9 +3892,9 @@
   {
     "name": "button/invisible/fgColor/rest",
     "value": {
-      "r": 0.1843137254901961,
-      "g": 0.5058823529411764,
-      "b": 0.9686274509803922,
+      "r": 0.26666666666666666,
+      "g": 0.5764705882352941,
+      "b": 0.9725490196078431,
       "a": 1
     },
     "type": "COLOR",
@@ -4776,6 +4776,23 @@
     "group": "component",
     "scopes": ["FRAME_FILL", "SHAPE_FILL"]
   },
+  {
+    "name": "selection/bgColor",
+    "value": {
+      "r": 0.26666666666666666,
+      "g": 0.5764705882352941,
+      "b": 0.9725490196078431,
+      "a": 0.2
+    },
+    "type": "COLOR",
+    "alpha": 0.2,
+    "refId": "mode/selection/bgColor",
+    "reference": "mode/fgColor/link",
+    "collection": "mode",
+    "mode": "dark",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
   {
     "name": "button/danger/bgColor/disabled",
     "value": {
@@ -4942,7 +4959,7 @@
       "r": 0.18823529411764706,
       "g": 0.21176470588235294,
       "b": 0.23921568627450981,
-      "a": 0.5
+      "a": 0.7
     },
     "type": "COLOR",
     "refId": "mode/avatar/borderColor",

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

@@ -3230,10 +3230,10 @@
       "r": 0.8156862745098039,
       "g": 0.8431372549019608,
       "b": 0.8705882352941177,
-      "a": 0.5
+      "a": 0.7
     },
     "type": "COLOR",
-    "alpha": 0.5,
+    "alpha": 0.7,
     "refId": "mode/borderColor/muted",
     "reference": "mode/borderColor/default",
     "collection": "mode",
@@ -4811,6 +4811,23 @@
     "group": "component",
     "scopes": ["FRAME_FILL", "SHAPE_FILL"]
   },
+  {
+    "name": "selection/bgColor",
+    "value": {
+      "r": 0.03529411764705882,
+      "g": 0.4117647058823529,
+      "b": 0.8549019607843137,
+      "a": 0.1
+    },
+    "type": "COLOR",
+    "alpha": 0.1,
+    "refId": "mode/selection/bgColor",
+    "reference": "mode/fgColor/link",
+    "collection": "mode",
+    "mode": "light",
+    "group": "component",
+    "scopes": ["FRAME_FILL", "SHAPE_FILL"]
+  },
   {
     "name": "button/danger/bgColor/disabled",
     "value": {

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

@@ -69,3 +69,4 @@ $overlay-padding-condensed: 0.5rem;
 $overlay-paddingBlock-condensed: 0.25rem;
 $overlay-paddingBlock-normal: 0.75rem;
 $overlay-borderRadius: 0.375rem;
+$overlay-offset: 0.25rem;