@primer/primitives 10.4.0-rc.e41ed5ed → 10.4.0-rc.eab36abe

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

@@ -1,581 +0,0 @@
-/**
- * Light high contrast
- * @extends all functional tokens
- * @description All overwrites for functional color tokens for light high contrast color mode are in this file
- */
-{
-  control: {
-    fgColor: {
-      placeholder: {
-        $value: '{base.color.neutral.10}',
-        $type: 'color',
-      },
-    },
-    bgColor: {
-      rest: {
-        $value: '{base.color.neutral.4}',
-        $type: 'color',
-      },
-      hover: {
-        $value: '{base.color.neutral.5}',
-        $type: 'color',
-      },
-      active: {
-        $value: '{base.color.neutral.6}',
-        $type: 'color',
-      },
-    },
-    transparent: {
-      bgColor: {
-        hover: {
-          $value: '{base.color.neutral.5}',
-          $type: 'color',
-          alpha: 1,
-        },
-        active: {
-          $value: '{base.color.neutral.6}',
-          $type: 'color',
-          alpha: 1,
-        },
-        selected: {
-          $value: '{base.color.neutral.5}',
-          $type: 'color',
-          alpha: 1,
-        },
-      },
-      borderColor: {
-        hover: {
-          $value: '{borderColor.default}',
-          $type: 'color',
-        },
-        active: {
-          $value: '{borderColor.default}',
-          $type: 'color',
-        },
-      },
-    },
-    danger: {
-      fgColor: {
-        hover: {
-          $value: '{fgColor.onEmphasis}',
-          $type: 'color',
-        },
-      },
-      bgColor: {
-        hover: {
-          $value: '{bgColor.danger.emphasis}',
-          $type: 'color',
-          alpha: null,
-        },
-        active: {
-          $value: '#8c0b1d',
-          $type: 'color',
-        },
-      },
-    },
-    checked: {
-      bgColor: {
-        hover: {
-          $value: '#0344a8',
-          $type: 'color',
-        },
-        active: {
-          $value: '#033f9d',
-          $type: 'color',
-        },
-      },
-      borderColor: {
-        hover: {
-          $value: '#0344a8',
-          $type: 'color',
-        },
-        active: {
-          $value: '#033f9d',
-          $type: 'color',
-        },
-      },
-    },
-  },
-  controlTrack: {
-    bgColor: {
-      rest: {
-        $value: '{base.color.neutral.5}',
-        $type: 'color',
-      },
-      hover: {
-        $value: '{base.color.neutral.6}',
-        $type: 'color',
-      },
-      active: {
-        $value: '{base.color.neutral.7}',
-        $type: 'color',
-      },
-    },
-    borderColor: {
-      rest: {
-        $value: '{borderColor.emphasis}',
-        $type: 'color',
-      },
-    },
-  },
-  button: {
-    primary: {
-      bgColor: {
-        rest: {
-          $value: '{base.color.green.5}',
-          $type: 'color',
-        },
-        hover: {
-          $value: '#04571e',
-          $type: 'color',
-        },
-        active: {
-          $value: '#03501b',
-          $type: 'color',
-        },
-        disabled: {
-          $value: '#85cb97',
-          $type: 'color',
-        },
-      },
-      borderColor: {
-        rest: {
-          $value: '{base.color.green.7}',
-          $type: 'color',
-          alpha: 1,
-        },
-        hover: {
-          $value: '{base.color.green.7}',
-          $type: 'color',
-          alpha: 1,
-        },
-        active: {
-          $value: '{base.color.green.7}',
-          $type: 'color',
-          alpha: 1,
-        },
-        disabled: {
-          $value: '#85cb97',
-          $type: 'color',
-        },
-      },
-    },
-    inactive: {
-      fgColor: {
-        $value: '{base.color.neutral.10}',
-        $type: 'color',
-        $extensions: {
-          'org.primer.figma': {
-            collection: 'mode',
-            group: 'component (internal)',
-            scopes: ['fgColor'],
-          },
-        },
-      },
-      bgColor: {
-        $value: '{control.bgColor.rest}',
-        $type: 'color',
-      },
-    },
-    invisible: {
-      fgColor: {
-        hover: {
-          $value: '{base.color.neutral.11}',
-          $type: 'color',
-        },
-      },
-      iconColor: {
-        hover: {
-          $value: '{base.color.neutral.11}',
-          $type: 'color',
-        },
-      },
-    },
-    outline: {
-      bgColor: {
-        active: {
-          $value: '#033f9d',
-          $type: 'color',
-        },
-      },
-    },
-    danger: {
-      bgColor: {
-        active: {
-          $value: '#74041a',
-          $type: 'color',
-        },
-      },
-    },
-  },
-  buttonCounter: {
-    default: {
-      bgColor: {
-        rest: {
-          $value: '{base.color.neutral.7}',
-          $type: 'color',
-        },
-      },
-    },
-    danger: {
-      fgColor: {
-        rest: {
-          $value: '#980e1e',
-          $type: 'color',
-        },
-      },
-    },
-  },
-  header: {
-    borderColor: {
-      divider: {
-        $value: '{base.color.neutral.7}',
-        $type: 'color',
-      },
-    },
-  },
-  display: {
-    blue: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.blue.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.blue.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.blue.6}',
-          $type: 'color',
-        },
-      },
-    },
-    indigo: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.indigo.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.indigo.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.indigo.6}',
-          $type: 'color',
-        },
-      },
-    },
-    gray: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.gray.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.gray.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.gray.6}',
-          $type: 'color',
-        },
-      },
-    },
-    cyan: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.cyan.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.cyan.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.cyan.6}',
-          $type: 'color',
-        },
-      },
-    },
-    teal: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.teal.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.teal.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.teal.6}',
-          $type: 'color',
-        },
-      },
-    },
-    pine: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.pine.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.pine.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.pine.6}',
-          $type: 'color',
-        },
-      },
-    },
-    green: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.green.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.green.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.green.6}',
-          $type: 'color',
-        },
-      },
-    },
-    lime: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.lime.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.lime.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.lime.6}',
-          $type: 'color',
-        },
-      },
-    },
-    olive: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.olive.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.olive.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.olive.6}',
-          $type: 'color',
-        },
-      },
-    },
-    lemon: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.lemon.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.lemon.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.lemon.6}',
-          $type: 'color',
-        },
-      },
-    },
-    yellow: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.yellow.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.yellow.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.yellow.6}',
-          $type: 'color',
-        },
-      },
-    },
-    orange: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.orange.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.orange.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.orange.6}',
-          $type: 'color',
-        },
-      },
-    },
-    red: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.red.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.red.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.red.6}',
-          $type: 'color',
-        },
-      },
-    },
-    coral: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.coral.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.coral.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.coral.6}',
-          $type: 'color',
-        },
-      },
-    },
-    pink: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.pink.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.pink.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.pink.6}',
-          $type: 'color',
-        },
-      },
-    },
-    plum: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.plum.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.plum.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.plum.6}',
-          $type: 'color',
-        },
-      },
-    },
-    purple: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.purple.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.purple.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.purple.6}',
-          $type: 'color',
-        },
-      },
-    },
-    brown: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.brown.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.brown.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.brown.6}',
-          $type: 'color',
-        },
-      },
-    },
-    auburn: {
-      bgColor: {
-        emphasis: {
-          $value: '{base.display.color.auburn.7}',
-          $type: 'color',
-        },
-      },
-      fgColor: {
-        $value: '{base.display.color.auburn.8}',
-        $type: 'color',
-      },
-      borderColor: {
-        emphasis: {
-          $value: '{base.display.color.auburn.6}',
-          $type: 'color',
-        },
-      },
-    },
-  },
-}

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

@@ -1,145 +0,0 @@
-/**
- * Light protanopia and deuteranopia (colorblind)
- * @extends all functional tokens
- * @description All overwrites for functional color tokens for light protanopia and deuteranopia color mode are in this file
- */
-{
-  button: {
-    primary: {
-      bgColor: {
-        hover: {
-          $value: '#0864d1',
-          $type: 'color',
-        },
-        active: {
-          $value: '#075fc8',
-          $type: 'color',
-        },
-        disabled: {
-          $value: '#92caff',
-          $type: 'color',
-        },
-      },
-      shadow: {
-        selected: {
-          $value: [
-            {
-              color: '{base.color.blue.9}',
-              alpha: 0.3,
-              offsetX: '0px',
-              offsetY: '1px',
-              blur: '0px',
-              spread: '0px',
-              inset: true,
-            },
-          ],
-          $type: 'shadow',
-        },
-      },
-    },
-    danger: {
-      bgColor: {
-        hover: {
-          $value: '{base.color.orange.6}',
-          $type: 'color',
-        },
-        active: {
-          $value: '#7e2f00',
-          $type: 'color',
-        },
-      },
-      shadow: {
-        selected: {
-          $value: [
-            {
-              color: '{base.color.orange.9}',
-              alpha: 0.2,
-              offsetX: '0px',
-              offsetY: '1px',
-              blur: '0px',
-              spread: '0px',
-              inset: true,
-            },
-          ],
-          $type: 'shadow',
-        },
-      },
-    },
-  },
-  color: {
-    ansi: {
-      green: {
-        $value: '{base.color.blue.6}',
-        $type: 'color',
-      },
-      'green-bright': {
-        $value: '{base.color.blue.5}',
-        $type: 'color',
-      },
-      red: {
-        $value: '{base.color.orange.5}',
-        $type: 'color',
-      },
-      'red-bright': {
-        $value: '{base.color.orange.6}',
-        $type: 'color',
-      },
-    },
-    prettylights: {
-      syntax: {
-        keyword: {
-          $value: '{base.color.orange.5}',
-          $type: 'color',
-        },
-        invalid: {
-          illegal: {
-            bg: {
-              $value: '{base.color.orange.7}',
-              $type: 'color',
-            },
-          },
-        },
-        carriage: {
-          return: {
-            bg: {
-              $value: '{base.color.orange.5}',
-              $type: 'color',
-            },
-          },
-        },
-        'string-regexp': {
-          $value: '{base.color.blue.6}',
-          $type: 'color',
-        },
-        brackethighlighter: {
-          unmatched: {
-            $value: '{base.color.orange.7}',
-            $type: 'color',
-          },
-        },
-        markup: {
-          deleted: {
-            text: {
-              $value: '{base.color.orange.7}',
-              $type: 'color',
-            },
-            bg: {
-              $value: '{base.color.orange.0}',
-              $type: 'color',
-            },
-          },
-          inserted: {
-            text: {
-              $value: '{base.color.blue.6}',
-              $type: 'color',
-            },
-            bg: {
-              $value: '{base.color.blue.0}',
-              $type: 'color',
-            },
-          },
-        },
-      },
-    },
-  },
-}