@primer/primitives 7.17.0-rc.132f02a7 → 7.17.0-rc.34cd1021

package/src/tokens/functional/color/light/display-light.json5

@@ -1056,5 +1056,71 @@
         },
       },
     },
+    pink: {
+      bgColor: {
+        muted: {
+          $value: '{base.display.color.pink.0}',
+          $type: 'color',
+          $extensions: {
+            'org.primer.figma': {
+              collection: 'mode',
+              mode: 'light',
+              group: 'component (internal)',
+              scopes: ['bgColor'],
+            },
+          },
+        },
+        emphasis: {
+          $value: '{base.display.color.pink.5}',
+          $type: 'color',
+          $extensions: {
+            'org.primer.figma': {
+              collection: 'mode',
+              mode: 'light',
+              group: 'component (internal)',
+              scopes: ['bgColor'],
+            },
+          },
+        },
+      },
+      fgColor: {
+        $value: '{base.display.color.pink.6}',
+        $type: 'color',
+        $extensions: {
+          'org.primer.figma': {
+            collection: 'mode',
+            mode: 'light',
+            group: 'component (internal)',
+            scopes: ['fgColor'],
+          },
+        },
+      },
+      borderColor: {
+        muted: {
+          $value: '{base.display.color.pink.1}',
+          $type: 'color',
+          $extensions: {
+            'org.primer.figma': {
+              collection: 'mode',
+              mode: 'light',
+              group: 'component (internal)',
+              scopes: ['borderColor'],
+            },
+          },
+        },
+        emphasis: {
+          $value: '{base.display.color.pink.5}',
+          $type: 'color',
+          $extensions: {
+            'org.primer.figma': {
+              collection: 'mode',
+              mode: 'light',
+              group: 'component (internal)',
+              scopes: ['borderColor'],
+            },
+          },
+        },
+      },
+    },
   },
 }

package/src/tokens/functional/color/light/overrides/light.high-contrast.json5

@@ -6,12 +6,12 @@
 {
   fgColor: {
     muted: {
-      $value: '{base.color.gray.9}',
+      $value: '{base.color.neutral.9}',
       $type: 'color',
       mix: null,
     },
     disabled: {
-      $value: '{base.color.gray.5}',
+      $value: '{base.color.neutral.5}',
       $type: 'color',
     },
     danger: {
@@ -29,7 +29,7 @@
   },
   bgColor: {
     muted: {
-      $value: '{base.color.gray.1}',
+      $value: '{base.color.neutral.1}',
       $type: 'color',
     },
     inset: {
@@ -38,13 +38,13 @@
     },
     neutral: {
       muted: {
-        $value: '{base.color.gray.1}',
+        $value: '{base.color.neutral.1}',
         $type: 'color',
         alpha: 1,
       },
     },
     disabled: {
-      $value: '{base.color.gray.2}',
+      $value: '{base.color.neutral.2}',
       $type: 'color',
     },
     success: {
@@ -63,17 +63,17 @@
   },
   borderColor: {
     default: {
-      $value: '{base.color.gray.8}',
+      $value: '{base.color.neutral.8}',
       $type: 'color',
     },
     muted: {
-      $value: '{base.color.gray.4}',
+      $value: '{base.color.neutral.4}',
       $type: 'color',
       alpha: 1,
     },
     neutral: {
       muted: {
-        $value: '{base.color.gray.4}',
+        $value: '{base.color.neutral.4}',
         $type: 'color',
         alpha: 1,
       },
@@ -159,27 +159,27 @@
   control: {
     bgColor: {
       rest: {
-        $value: '{base.color.gray.1}',
+        $value: '{base.color.neutral.1}',
         $type: 'color',
       },
       hover: {
-        $value: '{base.color.gray.1}',
+        $value: '{base.color.neutral.1}',
         $type: 'color',
         mix: {
-          color: '{base.color.gray.3}',
+          color: '{base.color.neutral.3}',
           weight: 0.2,
         },
       },
       active: {
-        $value: '{base.color.gray.1}',
+        $value: '{base.color.neutral.1}',
         $type: 'color',
         mix: {
-          color: '{base.color.gray.3}',
+          color: '{base.color.neutral.3}',
           weight: 0.4,
         },
       },
       selected: {
-        $value: '{base.color.gray.3}',
+        $value: '{base.color.neutral.3}',
         $type: 'color',
       },
     },
@@ -193,19 +193,19 @@
     transparent: {
       bgColor: {
         hover: {
-          $value: '{base.color.gray.1}',
+          $value: '{base.color.neutral.1}',
           $type: 'color',
           alpha: null,
           mix: null,
         },
         active: {
-          $value: '{base.color.gray.2}',
+          $value: '{base.color.neutral.2}',
           $type: 'color',
           alpha: null,
           mix: null,
         },
         selected: {
-          $value: '{base.color.gray.2}',
+          $value: '{base.color.neutral.2}',
           $type: 'color',
         },
       },
@@ -245,22 +245,22 @@
   controlTrack: {
     bgColor: {
       rest: {
-        $value: '{base.color.gray.3}',
+        $value: '{base.color.neutral.3}',
         $type: 'color',
       },
       hover: {
-        $value: '{base.color.gray.3}',
+        $value: '{base.color.neutral.3}',
         $type: 'color',
         mix: {
-          color: '{base.color.gray.5}',
+          color: '{base.color.neutral.5}',
           weight: 0.2,
         },
       },
       active: {
-        $value: '{base.color.gray.3}',
+        $value: '{base.color.neutral.3}',
         $type: 'color',
         mix: {
-          color: '{base.color.gray.5}',
+          color: '{base.color.neutral.5}',
           weight: 0.4,
         },
       },
@@ -349,12 +349,12 @@
       },
       bgColor: {
         hover: {
-          $value: '{base.color.gray.8}',
+          $value: '{base.color.neutral.8}',
           $type: 'color',
           alpha: 1,
         },
         active: {
-          $value: '{base.color.gray.6}',
+          $value: '{base.color.neutral.6}',
           $type: 'color',
           alpha: 1,
         },
@@ -425,7 +425,7 @@
   header: {
     borderColor: {
       divider: {
-        $value: '{base.color.gray.3}',
+        $value: '{base.color.neutral.3}',
         $type: 'color',
       },
     },

package/src/tokens/functional/color/light/overrides/light.protanopia-deuteranopia.json5

@@ -19,7 +19,7 @@
     },
     closed: {
       '@': {
-        $value: '{base.color.gray.5}',
+        $value: '{base.color.neutral.5}',
         $type: 'color',
       },
     },
@@ -72,12 +72,12 @@
     },
     closed: {
       muted: {
-        $value: '{base.color.gray.3}',
+        $value: '{base.color.neutral.3}',
         $type: 'color',
         alpha: 0.4,
       },
       emphasis: {
-        $value: '{base.color.gray.5}',
+        $value: '{base.color.neutral.5}',
         $type: 'color',
       },
     },
@@ -96,12 +96,12 @@
     },
     closed: {
       muted: {
-        $value: '{base.color.gray.3}',
+        $value: '{base.color.neutral.3}',
         $type: 'color',
         alpha: 0.4,
       },
       emphasis: {
-        $value: '{base.color.gray.5}',
+        $value: '{base.color.neutral.5}',
         $type: 'color',
       },
     },

package/src/tokens/functional/color/light/overrides/light.tritanopia.json5

@@ -25,7 +25,7 @@
     },
     closed: {
       '@': {
-        $value: '{base.color.gray.5}',
+        $value: '{base.color.neutral.5}',
         $type: 'color',
       },
     },
@@ -67,11 +67,11 @@
     },
     closed: {
       muted: {
-        $value: '{base.color.gray.0}',
+        $value: '{base.color.neutral.0}',
         $type: 'color',
       },
       emphasis: {
-        $value: '{base.color.gray.5}',
+        $value: '{base.color.neutral.5}',
         $type: 'color',
       },
     },
@@ -112,12 +112,12 @@
     },
     closed: {
       muted: {
-        $value: '{base.color.gray.3}',
+        $value: '{base.color.neutral.3}',
         $type: 'color',
         alpha: 0.4,
       },
       emphasis: {
-        $value: '{base.color.gray.5}',
+        $value: '{base.color.neutral.5}',
         $type: 'color',
       },
     },

package/src/tokens/functional/color/light/patterns-light.json5

@@ -30,7 +30,7 @@
     fade: {
       bgColor: {
         default: {
-          $value: '{base.color.gray.3}',
+          $value: '{base.color.neutral.3}',
           $type: 'color',
           $extensions: {
             'org.primer.figma': {
@@ -42,7 +42,7 @@
           },
         },
         muted: {
-          $value: '{base.color.gray.2}',
+          $value: '{base.color.neutral.2}',
           $type: 'color',
           $extensions: {
             'org.primer.figma': {
@@ -59,7 +59,7 @@
   control: {
     bgColor: {
       rest: {
-        $value: '{base.color.gray.0}',
+        $value: '{base.color.neutral.0}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -71,7 +71,7 @@
         },
       },
       hover: {
-        $value: '{base.color.gray.0}',
+        $value: '{base.color.neutral.0}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -82,12 +82,12 @@
           },
         },
         mix: {
-          color: '{base.color.gray.2}',
+          color: '{base.color.neutral.2}',
           weight: 0.2,
         },
       },
       active: {
-        $value: '{base.color.gray.0}',
+        $value: '{base.color.neutral.0}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -98,7 +98,7 @@
           },
         },
         mix: {
-          color: '{base.color.gray.2}',
+          color: '{base.color.neutral.2}',
           weight: 0.4,
         },
       },
@@ -115,7 +115,7 @@
         },
       },
       selected: {
-        $value: '{base.color.gray.0}',
+        $value: '{base.color.neutral.0}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -129,7 +129,7 @@
     },
     fgColor: {
       rest: {
-        $value: '{base.color.gray.9}',
+        $value: '{base.color.neutral.9}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -141,7 +141,7 @@
         },
       },
       placeholder: {
-        $value: '{base.color.gray.5}',
+        $value: '{base.color.neutral.5}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -179,7 +179,7 @@
         },
       },
       emphasis: {
-        $value: '{base.color.gray.4}',
+        $value: '{base.color.neutral.4}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -190,7 +190,7 @@
           },
         },
         mix: {
-          color: '{base.color.gray.5}',
+          color: '{base.color.neutral.5}',
           weight: 0.2,
         },
       },
@@ -207,7 +207,7 @@
         },
       },
       selected: {
-        $value: '{base.color.gray.0}',
+        $value: '{base.color.neutral.0}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -284,7 +284,7 @@
           },
         },
         hover: {
-          $value: '{base.color.gray.2}',
+          $value: '{base.color.neutral.2}',
           $type: 'color',
           $extensions: {
             'org.primer.figma': {
@@ -297,7 +297,7 @@
           alpha: 0.2,
         },
         active: {
-          $value: '{base.color.gray.2}',
+          $value: '{base.color.neutral.2}',
           $type: 'color',
           $extensions: {
             'org.primer.figma': {
@@ -322,7 +322,7 @@
           },
         },
         selected: {
-          $value: '{base.color.gray.2}',
+          $value: '{base.color.neutral.2}',
           $type: 'color',
           $extensions: {
             'org.primer.figma': {
@@ -577,7 +577,7 @@
   controlTrack: {
     bgColor: {
       rest: {
-        $value: '{base.color.gray.1}',
+        $value: '{base.color.neutral.1}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -589,7 +589,7 @@
         },
       },
       hover: {
-        $value: '{base.color.gray.1}',
+        $value: '{base.color.neutral.1}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -600,12 +600,12 @@
           },
         },
         mix: {
-          color: '{base.color.gray.3}',
+          color: '{base.color.neutral.3}',
           weight: 0.2,
         },
       },
       active: {
-        $value: '{base.color.gray.1}',
+        $value: '{base.color.neutral.1}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -616,7 +616,7 @@
           },
         },
         mix: {
-          color: '{base.color.gray.3}',
+          color: '{base.color.neutral.3}',
           weight: 0.4,
         },
       },
@@ -1316,7 +1316,7 @@
           },
         },
         disabled: {
-          $value: '{base.color.gray.0}',
+          $value: '{base.color.neutral.0}',
           $type: 'color',
           $extensions: {
             'org.primer.figma': {
@@ -1530,7 +1530,7 @@
     },
     inactive: {
       fgColor: {
-        $value: '{base.color.gray.6}',
+        $value: '{base.color.neutral.6}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -1542,7 +1542,7 @@
         },
       },
       bgColor: {
-        $value: '{base.color.gray.1}',
+        $value: '{base.color.neutral.1}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -1864,7 +1864,7 @@
   },
   header: {
     bgColor: {
-      $value: '{base.color.gray.9}',
+      $value: '{base.color.neutral.9}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -1904,7 +1904,7 @@
     },
     borderColor: {
       divider: {
-        $value: '{base.color.gray.6}',
+        $value: '{base.color.neutral.6}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -1919,7 +1919,7 @@
   },
   headerSearch: {
     bgColor: {
-      $value: '{base.color.gray.9}',
+      $value: '{base.color.neutral.9}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -1931,7 +1931,7 @@
       },
     },
     borderColor: {
-      $value: '{base.color.gray.6}',
+      $value: '{base.color.neutral.6}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -1986,7 +1986,7 @@
     },
     backdrop: {
       bgColor: {
-        $value: '{base.color.gray.4}',
+        $value: '{base.color.neutral.4}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -2052,7 +2052,7 @@
   },
   timelineBadge: {
     bgColor: {
-      $value: '{base.color.gray.1}',
+      $value: '{base.color.neutral.1}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {

package/src/tokens/functional/color/light/primitives-light.json5

@@ -16,7 +16,7 @@
       },
     },
     muted: {
-      $value: '{base.color.gray.6}',
+      $value: '{base.color.neutral.6}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -30,7 +30,7 @@
         },
       },
       mix: {
-        color: '{base.color.gray.5}',
+        color: '{base.color.neutral.5}',
         weight: 0.5,
       },
     },
@@ -74,7 +74,7 @@
       },
     },
     disabled: {
-      $value: '{base.color.gray.4}',
+      $value: '{base.color.neutral.4}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -104,7 +104,7 @@
     },
     neutral: {
       '@': {
-        $value: '{base.color.gray.5}',
+        $value: '{base.color.neutral.5}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -308,7 +308,7 @@
       },
     },
     muted: {
-      $value: '{base.color.gray.0}',
+      $value: '{base.color.neutral.0}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -323,7 +323,7 @@
       },
     },
     inset: {
-      $value: '{base.color.gray.0}',
+      $value: '{base.color.neutral.0}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -338,7 +338,7 @@
       },
     },
     emphasis: {
-      $value: '{base.color.gray.9}',
+      $value: '{base.color.neutral.9}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -353,7 +353,7 @@
       },
     },
     inverse: {
-      $value: '{base.color.gray.9}',
+      $value: '{base.color.neutral.9}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -389,7 +389,7 @@
       },
     },
     disabled: {
-      $value: '{base.color.gray.1}',
+      $value: '{base.color.neutral.1}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -418,7 +418,7 @@
     },
     neutral: {
       muted: {
-        $value: '{base.color.gray.3}',
+        $value: '{base.color.neutral.3}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -431,7 +431,7 @@
         alpha: 0.2,
       },
       emphasis: {
-        $value: '{base.color.gray.5}',
+        $value: '{base.color.neutral.5}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -770,7 +770,7 @@
   },
   borderColor: {
     default: {
-      $value: '{base.color.gray.2}',
+      $value: '{base.color.neutral.2}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -801,7 +801,7 @@
       alpha: 0.7,
     },
     emphasis: {
-      $value: '{base.color.gray.5}',
+      $value: '{base.color.neutral.5}',
       $type: 'color',
       $extensions: {
         'org.primer.figma': {
@@ -838,7 +838,7 @@
     },
     neutral: {
       muted: {
-        $value: '{base.color.gray.3}',
+        $value: '{base.color.neutral.3}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {
@@ -851,7 +851,7 @@
         alpha: 0.2,
       },
       emphasis: {
-        $value: '{base.color.gray.5}',
+        $value: '{base.color.neutral.5}',
         $type: 'color',
         $extensions: {
           'org.primer.figma': {