Fix linting errors

.github/workflows/release.yml

@@ -45,10 +45,8 @@ jobs:
         run: yarn install --immutable
       - name: Build local packages
         run: yarn workspaces foreach --all --parallel --topological-dev --exclude @elastic/eui-website --exclude @elastic/eui-monorepo --exclude @elastic/eui-docgen run build
-      # TODO: Uncomment when code formatting is fixed in eui-theme-common and eui-theme-borealis
-      # This is prepared in the upstream/build/gh-release-action branch
-      # - name: Lint
-      #   run: yarn workspaces foreach --all --parallel --topological-dev --exclude @elastic/eui-website --exclude @elastic/eui-monorepo --exclude @elastic/eui-docgen run lint
+      - name: Lint
+        run: yarn workspaces foreach --all --parallel --topological-dev --exclude @elastic/eui-website --exclude @elastic/eui-monorepo --exclude @elastic/eui-docgen run lint
       - name: Unit tests
         run: yarn workspaces foreach --all --parallel --topological-dev --exclude @elastic/eui-website --exclude @elastic/eui-monorepo --exclude @elastic/eui-docgen run test-unit
   cypress_tests:

packages/eui-theme-borealis/.stylelintrc.js

@@ -41,7 +41,10 @@ module.exports = {
     'number-max-precision': null,
     // Attempt to catch/flag non-variable color values
     'color-named': 'never',
-    'color-no-hex': true,
+    // This is a theme, and it's expected it includes hex color definitions
+    'color-no-hex': null,
+    // Long hex format to keep consistency with JS color definitions
+    'color-hex-length': 'long',
     // Prefer lowercase values, except for font names and currentColor
     'value-keyword-case': [
       'lower',

packages/eui-theme-borealis/package.json

@@ -12,8 +12,9 @@
     "build:types": "NODE_ENV=production tsc --project tsconfig.types.json",
     "build-pack": "yarn build && npm pack",
     "copy-files": "node ./scripts/copy-json-files.js",
-    "lint": "yarn tsc --noEmit && yarn lint-es && yarn lint-sass",
-    "lint-es": "eslint --cache src/**/*.ts --max-warnings 0",
+    "lint": "yarn run lint-ts && yarn run lint-es && yarn run lint-sass",
+    "lint-ts": "tsc --noEmit",
+    "lint-es": "eslint --cache \"src/**/*.ts\" --max-warnings 0",
     "lint-sass": "yarn stylelint \"**/*.scss\" --quiet-deprecation-warnings",
     "test": "yarn test-unit",
     "test-unit": "jest ./src --passWithNoTests",
@@ -24,7 +25,7 @@
     "url": "https://github.com/elastic/eui.git",
     "directory": "packages/eui-theme-borealis"
   },
-  "dependency": {
+  "dependencies": {
     "@elastic/eui-theme-common": "workspace:*",
     "chroma-js": "^2.4.2"
   },

packages/eui-theme-borealis/src/mixins/_shadow.scss

@@ -6,6 +6,7 @@
   }
 }
 
+/* stylelint-disable-next-line scss/at-function-pattern */
 @function _colorMode() {
   @if (lightness($euiColorTextParagraph) < 50) {
     @return 'light';
@@ -18,39 +19,39 @@
 @mixin euiSlightShadow($color: $euiShadowColor) {
   @if _colorMode() == 'light' {
     box-shadow:
-      0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16),
-      0px 1px 4px 0px hsl(from $euiShadowColor h s l / 0.06),
-      0px 2px 8px 0px hsl(from $euiShadowColor h s l / 0.04);
+      0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16),
+      0 1px 4px 0 hsl(from $euiShadowColor h s l / 0.06),
+      0 2px 8px 0 hsl(from $euiShadowColor h s l / 0.04);
   } @else {
     box-shadow:
-      0px 1px 4px 0px hsl(from $euiShadowColor h s l / 0.4),
-      0px 2px 8px 0px hsl(from $euiShadowColor h s l/ 0.24);
+      0 1px 4px 0 hsl(from $euiShadowColor h s l / 0.4),
+      0 2px 8px 0 hsl(from $euiShadowColor h s l/ 0.24);
   }
 }
 
 @mixin euiBottomShadowSmall($color: $euiShadowColor) {
   @if _colorMode == 'light' {
     box-shadow:
-      0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16),
-      0px 2px 7px 0px hsl(from $euiShadowColor h s l / 0.08),
-      0px 4px 11px 0px hsl(from $euiShadowColor h s l / 0.05);
+      0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16),
+      0 2px 7px 0 hsl(from $euiShadowColor h s l / 0.08),
+      0 4px 11px 0 hsl(from $euiShadowColor h s l / 0.05);
   } @else {
     box-shadow:
-      0px 2px 7px 0px hsl(from $euiShadowColor h s l / 0.46),
-      0px 4px 11px 0px hsl(from $euiShadowColor h s l / 0.26);
+      0 2px 7px 0 hsl(from $euiShadowColor h s l / 0.46),
+      0 4px 11px 0 hsl(from $euiShadowColor h s l / 0.26);
   }
 }
 
 @mixin euiBottomShadowMedium($color: $euiShadowColor) {
   @if _colorMode == 'light' {
     box-shadow:
-      0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16),
-      0px 3px 10px 0px hsl(from $euiShadowColor h s l / 0.1),
-      0px 6px 14px 0px hsl(from $euiShadowColor h s l / 0.06);
+      0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16),
+      0 3px 10px 0 hsl(from $euiShadowColor h s l / 0.1),
+      0 6px 14px 0 hsl(from $euiShadowColor h s l / 0.06);
   } @else {
     box-shadow:
-      0px 3px 10px 0px hsl(from $euiShadowColor h s l / 0.52),
-      0px 6px 14px 0px hsl(from $euiShadowColor h s l / 0.28);
+      0 3px 10px 0 hsl(from $euiShadowColor h s l / 0.52),
+      0 6px 14px 0 hsl(from $euiShadowColor h s l / 0.28);
   }
 }
 
@@ -70,24 +71,24 @@
   @if ($reverse) {
     @if _colorMode == 'light' {
       box-shadow:
-        0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16),
-        0px -4px 13px 0px hsl(from $euiShadowColor h s l / 0.12),
-        0px -8px 17px 0px hsl(from $euiShadowColor h s l / 0.07);
+        0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16),
+        0 -4px 13px 0 hsl(from $euiShadowColor h s l / 0.12),
+        0 -8px 17px 0 hsl(from $euiShadowColor h s l / 0.07);
     } @else {
       box-shadow:
-        0px -4px 13px 0px hsl(from $euiShadowColor h s l / 0.58),
-        0px -8px 17px 0px hsl(from $euiShadowColor h s l / 0.3);
+        0 -4px 13px 0 hsl(from $euiShadowColor h s l / 0.58),
+        0 -8px 17px 0 hsl(from $euiShadowColor h s l / 0.3);
     }
   } @else {
     @if _colorMode == 'light' {
       box-shadow:
-        0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16),
-        0px 4px 13px 0px hsl(from $euiShadowColor h s l / 0.12),
-        0px 8px 17px 0px hsl(from $euiShadowColor h s l / 0.07);
+        0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16),
+        0 4px 13px 0 hsl(from $euiShadowColor h s l / 0.12),
+        0 8px 17px 0 hsl(from $euiShadowColor h s l / 0.07);
     } @else {
       box-shadow:
-        0px 4px 13px 0px hsl(from $euiShadowColor h s l / 0.58),
-        0px 8px 17px 0px hsl(from $euiShadowColor h s l / 0.3);
+        0 4px 13px 0 hsl(from $euiShadowColor h s l / 0.58),
+        0 8px 17px 0 hsl(from $euiShadowColor h s l / 0.3);
     }
   }
 }
@@ -128,4 +129,4 @@
   // This workaround forces a stacking context on the scrolling container, which
   // hopefully addresses the bug. @see https://github.com/elastic/eui/pull/7855
   transform: translateZ(0);
-}
+}

packages/eui-theme-borealis/src/theme_dark.scss

@@ -1,11 +1,9 @@
-
 // color mode specific variables
 @import './variables/colors/colors_vis_dark';
 @import './variables/colors/colors_dark';
 @import './variables/shadows_dark';
 
-
 // Global styling
 @import './variables/index';
 @import 'mixins/index';
-@import 'node_modules/@elastic/eui-theme-common/src/global_styling/index';
+@import 'node_modules/@elastic/eui-theme-common/src/global_styling/index';

packages/eui-theme-borealis/src/theme_light.scss

@@ -3,8 +3,7 @@
 @import './variables/colors/colors_light';
 @import './variables/shadows_light';
 
-
 // Global styling
 @import './variables/index';
 @import 'mixins/index';
-@import 'node_modules/@elastic/eui-theme-common/src/global_styling/index';
+@import 'node_modules/@elastic/eui-theme-common/src/global_styling/index';

packages/eui-theme-borealis/src/variables/_index.scss

@@ -1,7 +1,7 @@
 // Import base theme first, then override
 
-// TODO: untangle border scss definitions by moving them and related usage to the theme 
-// package instead of the common one 
+// TODO: untangle border scss definitions by moving them and related usage to the theme
+// package instead of the common one
 
 @import 'node_modules/@elastic/eui-theme-common/src/global_styling/variables/size';
 @import 'node_modules/@elastic/eui-theme-common/src/global_styling/variables/responsive';

packages/eui-theme-borealis/src/variables/_shadows_dark.scss

@@ -1,20 +1,20 @@
 // Shadows
 $euiShadowColor: $euiColorInk !default;
 
-$euiShadowDownXS: 0px 1px 4px 0px hsla(from $euiShadowColor h s l / 0.4), 0px 2px 8px 0px hsla(from $euiShadowColor h s l / 0.24);
-$euiShadowDownS: 0px 2px 7px 0px hsla(from $euiShadowColor h s l / 0.46), 0px 4px 11px 0px hsla(from $euiShadowColor h s l / 0.26);
-$euiShadowDownM: 0px 3px 10px 0px hsla(from $euiShadowColor h s l / 0.52), 0px 6px 14px 0px hsla(from $euiShadowColor h s l / 0.28);
-$euiShadowDownL: 0px 4px 13px 0px hsla(from $euiShadowColor h s l / 0.58), 0px 8px 17px 0px hsla(from $euiShadowColor h s l / 0.3);
-$euiShadowDownXL: 0px 5px 16px 0px hsla(from $euiShadowColor h s l / 0.64), 0px 10px 20px 0px hsla(from $euiShadowColor h s l / 0.32);
+$euiShadowDownXS: 0 1px 4px 0 hsla(from $euiShadowColor h s l / 0.4), 0 2px 8px 0 hsla(from $euiShadowColor h s l / 0.24);
+$euiShadowDownS: 0 2px 7px 0 hsla(from $euiShadowColor h s l / 0.46), 0 4px 11px 0 hsla(from $euiShadowColor h s l / 0.26);
+$euiShadowDownM: 0 3px 10px 0 hsla(from $euiShadowColor h s l / 0.52), 0 6px 14px 0 hsla(from $euiShadowColor h s l / 0.28);
+$euiShadowDownL: 0 4px 13px 0 hsla(from $euiShadowColor h s l / 0.58), 0 8px 17px 0 hsla(from $euiShadowColor h s l / 0.3);
+$euiShadowDownXL: 0 5px 16px 0 hsla(from $euiShadowColor h s l / 0.64), 0 10px 20px 0 hsla(from $euiShadowColor h s l / 0.32);
 
-$euiShadowUpXS: 0px 1px 4px 0px hsla(from $euiShadowColor h s l / 0.4), 0px -2px 8px 0px hsla(from $euiShadowColor h s l / 0.24);
-$euiShadowUpS: 0px 2px 7px 0px hsla(from $euiShadowColor h s l / 0.46), 0px -4px 11px 0px hsla(from $euiShadowColor h s l / 0.26);
-$euiShadowUpM: 0px 3px 10px 0px hsla(from $euiShadowColor h s l / 0.52), 0px -6px 14px 0px hsla(from $euiShadowColor h s l / 0.28);
-$euiShadowUpL: 0px 4px 13px 0px hsla(from $euiShadowColor h s l / 0.58), 0px -8px 17px 0px hsla(from $euiShadowColor h s l / 0.3);
-$euiShadowUpXL: 0px 5px 16px 0px hsla(from $euiShadowColor h s l / 0.64), 0px -10px 20px 0px hsla(from $euiShadowColor h s l / 0.32);
+$euiShadowUpXS: 0 1px 4px 0 hsla(from $euiShadowColor h s l / 0.4), 0 -2px 8px 0 hsla(from $euiShadowColor h s l / 0.24);
+$euiShadowUpS: 0 2px 7px 0 hsla(from $euiShadowColor h s l / 0.46), 0 -4px 11px 0 hsla(from $euiShadowColor h s l / 0.26);
+$euiShadowUpM: 0 3px 10px 0 hsla(from $euiShadowColor h s l / 0.52), 0 -6px 14px 0 hsla(from $euiShadowColor h s l / 0.28);
+$euiShadowUpL: 0 4px 13px 0 hsla(from $euiShadowColor h s l / 0.58), 0 -8px 17px 0 hsla(from $euiShadowColor h s l / 0.3);
+$euiShadowUpXL: 0 5px 16px 0 hsla(from $euiShadowColor h s l / 0.64), 0 -10px 20px 0 hsla(from $euiShadowColor h s l / 0.32);
 
-$euiShadowHoverDown: 0px 2px 7px 0px hsla(from $euiShadowColor h s l / 0.46), 0px 4px 11px 0px hsla(from $euiShadowColor h s l / 0.26);
-$euiShadowHoverXLDown: 0px 6px 19px 0px hsla(from $euiShadowColor h s l / 0.7), 0px 12px 23px 0px hsla(from $euiShadowColor h s l / 0.34);
+$euiShadowHoverDown: 0 2px 7px 0 hsla(from $euiShadowColor h s l / 0.46), 0 4px 11px 0 hsla(from $euiShadowColor h s l / 0.26);
+$euiShadowHoverXLDown: 0 6px 19px 0 hsla(from $euiShadowColor h s l / 0.7), 0 12px 23px 0 hsla(from $euiShadowColor h s l / 0.34);
 
-$euiShadowHoverUp: 0px -2px 7px 0px hsla(from $euiShadowColor h s l / 0.46), 0px -4px 11px 0px hsla(from $euiShadowColor h s l / 0.26);
-$euiShadowHoverXLUp: 0px -6px 19px 0px hsla(from $euiShadowColor h s l / 0.7), 0px -12px 23px 0px hsla(from $euiShadowColor h s l / 0.34);
+$euiShadowHoverUp: 0 -2px 7px 0 hsla(from $euiShadowColor h s l / 0.46), 0 -4px 11px 0 hsla(from $euiShadowColor h s l / 0.26);
+$euiShadowHoverXLUp: 0 -6px 19px 0 hsla(from $euiShadowColor h s l / 0.7), 0 -12px 23px 0 hsla(from $euiShadowColor h s l / 0.34);

packages/eui-theme-borealis/src/variables/_shadows_light.scss

@@ -1,20 +1,20 @@
 // Shadows
 $euiShadowColor: $euiColorShade120 !default;
 
-$euiShadowDownXS: 0px 0px 2px 0px hsl(from $euiShadowColor h s l /  0.16), 0px 1px 4px 0px hsl(from $euiShadowColor h s l / 0.06), 0px 2px 8px 0px hsl(from $euiShadowColor h s l / 0.04);
-$euiShadowDownS: 0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16), 0px 2px 7px 0px hsl(from $euiShadowColor h s l / 0.08), 0px 4px 11px 0px hsl(from $euiShadowColor h s l / 0.05);
-$euiShadowDownM: 0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16), 0px 3px 10px 0px hsl(from $euiShadowColor h s l / 0.1), 0px 6px 14px 0px hsl(from $euiShadowColor h s l / 0.06);
-$euiShadowDownL: 0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16), 0px 4px 13px 0px hsl(from $euiShadowColor h s l / 0.12), 0px 8px 17px 0px hsl(from $euiShadowColor h s l / 0.07);
-$euiShadowDownXL: 0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16), 0px 5px 16px 0px hsl(from $euiShadowColor h s l / 0.14), 0px 10px 20px 0px hsl(from $euiShadowColor h s l / 0.08);
+$euiShadowDownXS: 0 0 2px 0 hsl(from $euiShadowColor h s l /  0.16), 0 1px 4px 0 hsl(from $euiShadowColor h s l / 0.06), 0 2px 8px 0 hsl(from $euiShadowColor h s l / 0.04);
+$euiShadowDownS: 0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16), 0 2px 7px 0 hsl(from $euiShadowColor h s l / 0.08), 0 4px 11px 0 hsl(from $euiShadowColor h s l / 0.05);
+$euiShadowDownM: 0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16), 0 3px 10px 0 hsl(from $euiShadowColor h s l / 0.1), 0 6px 14px 0 hsl(from $euiShadowColor h s l / 0.06);
+$euiShadowDownL: 0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16), 0 4px 13px 0 hsl(from $euiShadowColor h s l / 0.12), 0 8px 17px 0 hsl(from $euiShadowColor h s l / 0.07);
+$euiShadowDownXL: 0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16), 0 5px 16px 0 hsl(from $euiShadowColor h s l / 0.14), 0 10px 20px 0 hsl(from $euiShadowColor h s l / 0.08);
 
-$euiShadowUpXS: 0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16), 0px -1px 4px 0px hsl(from $euiShadowColor h s l / 0.06), 0px -2px 8px 0px hsl(from $euiShadowColor h s l / 0.04);
-$euiShadowUpS: 0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16), 0px -2px 7px 0px hsl(from $euiShadowColor h s l / 0.08), 0px -4px 11px 0px hsl(from $euiShadowColor h s l / 0.05);
-$euiShadowUpM: 0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16), 0px -3px 10px 0px hsl(from $euiShadowColor h s l / 0.1), 0px -6px 14px 0px hsl(from $euiShadowColor h s l / 0.06);
-$euiShadowUpL: 0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16), 0px -4px 13px 0px hsl(from $euiShadowColor h s l / 0.12), 0px -8px 17px 0px hsl(from $euiShadowColor h s l / 0.07);
-$euiShadowUpXL: 0px 0px 2px 0px hsl(from $euiShadowColor h s l / 0.16), 0px -5px 16px 0px hsl(from $euiShadowColor h s l / 0.14), 0px -10px 20px 0px hsl(from $euiShadowColor h s l / 0.08);
+$euiShadowUpXS: 0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16), 0 -1px 4px 0 hsl(from $euiShadowColor h s l / 0.06), 0 -2px 8px 0 hsl(from $euiShadowColor h s l / 0.04);
+$euiShadowUpS: 0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16), 0 -2px 7px 0 hsl(from $euiShadowColor h s l / 0.08), 0 -4px 11px 0 hsl(from $euiShadowColor h s l / 0.05);
+$euiShadowUpM: 0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16), 0 -3px 10px 0 hsl(from $euiShadowColor h s l / 0.1), 0 -6px 14px 0 hsl(from $euiShadowColor h s l / 0.06);
+$euiShadowUpL: 0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16), 0 -4px 13px 0 hsl(from $euiShadowColor h s l / 0.12), 0 -8px 17px 0 hsl(from $euiShadowColor h s l / 0.07);
+$euiShadowUpXL: 0 0 2px 0 hsl(from $euiShadowColor h s l / 0.16), 0 -5px 16px 0 hsl(from $euiShadowColor h s l / 0.14), 0 -10px 20px 0 hsl(from $euiShadowColor h s l / 0.08);
 
-$euiShadowHoverDown: 0px 0px 2px 0px hsla(from $euiShadowColor h s l / 0.16), 0px 2px 7px 0px hsla(from $euiShadowColor h s l / 0.08), 0px 4px 11px 0px hsla(from $euiShadowColor h s l / 0.05);
-$euiShadowHoverXLDown: 0px 0px 2px 0px hsl(from $euiShadowColor h s l/ 0.16), 0px 6px 19px 0px hsl(from $euiShadowColor h s l / 0.16), 0px 12px 23px 0px hsl(from $euiShadowColor h s l / 0.09);
+$euiShadowHoverDown: 0 0 2px 0 hsla(from $euiShadowColor h s l / 0.16), 0 2px 7px 0 hsla(from $euiShadowColor h s l / 0.08), 0 4px 11px 0 hsla(from $euiShadowColor h s l / 0.05);
+$euiShadowHoverXLDown: 0 0 2px 0 hsl(from $euiShadowColor h s l/ 0.16), 0 6px 19px 0 hsl(from $euiShadowColor h s l / 0.16), 0 12px 23px 0 hsl(from $euiShadowColor h s l / 0.09);
 
-$euiShadowHoverUp: 0px 0px 2px 0px hsla(from $euiShadowColor h s l / 0.16), 0px -2px 7px 0px hsla(from $euiShadowColor h s l / 0.08), 0px -4px 11px 0px hsla(from $euiShadowColor h s l / 0.05);
-$euiShadowHoverXLUp: 0px 0px 2px 0px hsl(from $euiShadowColor h s l/ 0.16), 0px -6px 19px 0px hsl(from $euiShadowColor h s l / 0.16), 0px -12px 23px 0px hsl(from $euiShadowColor h s l / 0.09);
+$euiShadowHoverUp: 0 0 2px 0 hsla(from $euiShadowColor h s l / 0.16), 0 -2px 7px 0 hsla(from $euiShadowColor h s l / 0.08), 0 -4px 11px 0 hsla(from $euiShadowColor h s l / 0.05);
+$euiShadowHoverXLUp: 0 0 2px 0 hsl(from $euiShadowColor h s l/ 0.16), 0 -6px 19px 0 hsl(from $euiShadowColor h s l / 0.16), 0 -12px 23px 0 hsl(from $euiShadowColor h s l / 0.09);

packages/eui-theme-borealis/src/variables/colors/_colors_light.scss

@@ -137,7 +137,6 @@ $euiColorBorderStrongRisk: $euiColorRisk90 !default;
 $euiColorBorderStrongDanger: $euiColorDanger90 !default;
 $euiColorBorderStrongText: $euiColorShade90 !default;
 
-
 // Charts
 $euiColorChartLines: $euiColorShade30 !default;
 $euiColorChartBand: $euiColorShade10 !default;

packages/eui-theme-borealis/src/variables/colors/_semantic_colors.scss

@@ -4,7 +4,6 @@
  * TODO: automatically generate scss variable files
  */
 
-
 $euiColorWhite: #FFFFFF !default;
 $euiColorBlack: #000000 !default;
 $euiColorMutedBlack: #0E0F12 !default;
@@ -86,7 +85,7 @@ $euiColorNeutral30: #B5E5F2 !default;
 $euiColorNeutral40: #94D8EB !default;
 $euiColorNeutral50: #63C8E3 !default;
 $euiColorNeutral60: #37B8DC !default;
-$euiColorNeutral70: #0dA1C9 !default;
+$euiColorNeutral70: #0DA1C9 !default;
 $euiColorNeutral80: #1C8CB5 !default;
 $euiColorNeutral90: #19799F !default;
 $euiColorNeutral100: #0F658A !default;
@@ -217,5 +216,3 @@ $euiColorShade100Alpha24: rgba($euiColorShade100, 0.24) !default;
 $euiColorShade100Alpha70: rgba($euiColorShade100, 0.7) !default;
 
 $euiColorShade120Alpha70: rgba($euiColorShade120, 0.7) !default;
-
-

yarn.lock

@@ -7182,6 +7182,7 @@ __metadata:
     "@types/prettier": "npm:2.7.3"
     "@typescript-eslint/eslint-plugin": "npm:^5.59.7"
     "@typescript-eslint/parser": "npm:^5.59.7"
+    chroma-js: "npm:^2.4.2"
     eslint: "npm:^8.41.0"
     eslint-config-prettier: "npm:^8.8.0"
     eslint-plugin-import: "npm:^2.27.5"