@elastic/eui-theme-borealis 5.4.0 → 6.0.0

package/lib/cjs/variables/_components.js

@@ -295,106 +295,101 @@ var component_colors = {
     return borderBaseSubdued;
   }, ['colors.borderBaseSubdued']),
   skeletonBackgroundSkeletonMiddleHighContrast: "rgba(".concat(_semantic_colors.SEMANTIC_COLORS.shade100RGB, ", 0.04)"),
-  superDatePickerBackgroundSuccees: (0, _euiThemeCommon.computed)(function (_ref91) {
+  switchBackgroundOn: (0, _euiThemeCommon.computed)(function (_ref91) {
     var _ref92 = _slicedToArray(_ref91, 1),
-      backgroundBaseSuccess = _ref92[0];
-    return backgroundBaseSuccess;
-  }, ['colors.backgroundBaseSuccess']),
-  switchBackgroundOn: (0, _euiThemeCommon.computed)(function (_ref93) {
-    var _ref94 = _slicedToArray(_ref93, 1),
-      backgroundFilledPrimary = _ref94[0];
+      backgroundFilledPrimary = _ref92[0];
     return backgroundFilledPrimary;
   }, ['colors.backgroundFilledPrimary']),
-  switchBackgroundOff: (0, _euiThemeCommon.computed)(function (_ref95) {
-    var _ref96 = _slicedToArray(_ref95, 1),
-      backgroundFilledText = _ref96[0];
+  switchBackgroundOff: (0, _euiThemeCommon.computed)(function (_ref93) {
+    var _ref94 = _slicedToArray(_ref93, 1),
+      backgroundFilledText = _ref94[0];
     return backgroundFilledText;
   }, ['colors.backgroundFilledText']),
-  switchUncompressedBackgroundDisabled: (0, _euiThemeCommon.computed)(function (_ref97) {
+  switchUncompressedBackgroundDisabled: (0, _euiThemeCommon.computed)(function (_ref95) {
+    var _ref96 = _slicedToArray(_ref95, 1),
+      backgroundBaseFormsControlDisabled = _ref96[0];
+    return backgroundBaseFormsControlDisabled;
+  }, ['colors.backgroundBaseFormsControlDisabled']),
+  switchCompressedBackgroundDisabled: (0, _euiThemeCommon.computed)(function (_ref97) {
     var _ref98 = _slicedToArray(_ref97, 1),
       backgroundBaseFormsControlDisabled = _ref98[0];
     return backgroundBaseFormsControlDisabled;
   }, ['colors.backgroundBaseFormsControlDisabled']),
-  switchCompressedBackgroundDisabled: (0, _euiThemeCommon.computed)(function (_ref99) {
+  switchMiniBackgroundDisabled: (0, _euiThemeCommon.computed)(function (_ref99) {
     var _ref100 = _slicedToArray(_ref99, 1),
       backgroundBaseFormsControlDisabled = _ref100[0];
     return backgroundBaseFormsControlDisabled;
   }, ['colors.backgroundBaseFormsControlDisabled']),
-  switchMiniBackgroundDisabled: (0, _euiThemeCommon.computed)(function (_ref101) {
+  switchThumbBackgroundDisabled: (0, _euiThemeCommon.computed)(function (_ref101) {
     var _ref102 = _slicedToArray(_ref101, 1),
-      backgroundBaseFormsControlDisabled = _ref102[0];
-    return backgroundBaseFormsControlDisabled;
-  }, ['colors.backgroundBaseFormsControlDisabled']),
-  switchThumbBackgroundDisabled: (0, _euiThemeCommon.computed)(function (_ref103) {
-    var _ref104 = _slicedToArray(_ref103, 1),
-      backgroundBasePlain = _ref104[0];
+      backgroundBasePlain = _ref102[0];
     return backgroundBasePlain;
   }, ['colors.backgroundBasePlain']),
-  switchThumbBorderOn: (0, _euiThemeCommon.computed)(function (_ref105) {
-    var _ref106 = _slicedToArray(_ref105, 1),
-      backgroundFilledPrimary = _ref106[0];
+  switchThumbBorderOn: (0, _euiThemeCommon.computed)(function (_ref103) {
+    var _ref104 = _slicedToArray(_ref103, 1),
+      backgroundFilledPrimary = _ref104[0];
     return backgroundFilledPrimary;
   }, ['colors.backgroundFilledPrimary']),
-  switchThumbBorderOff: (0, _euiThemeCommon.computed)(function (_ref107) {
-    var _ref108 = _slicedToArray(_ref107, 1),
-      backgroundFilledText = _ref108[0];
+  switchThumbBorderOff: (0, _euiThemeCommon.computed)(function (_ref105) {
+    var _ref106 = _slicedToArray(_ref105, 1),
+      backgroundFilledText = _ref106[0];
     return backgroundFilledText;
   }, ['colors.backgroundFilledText']),
   switchIconDisabled: _forms.forms.LIGHT.iconDisabled,
-  tableRowBackgroundHover: (0, _euiThemeCommon.computed)(function (_ref109) {
-    var _ref110 = _slicedToArray(_ref109, 1),
-      backgroundBaseInteractiveHover = _ref110[0];
+  tableRowBackgroundHover: (0, _euiThemeCommon.computed)(function (_ref107) {
+    var _ref108 = _slicedToArray(_ref107, 1),
+      backgroundBaseInteractiveHover = _ref108[0];
     return backgroundBaseInteractiveHover;
   }, ['colors.backgroundBaseInteractiveHover']),
-  tableRowBackgroundSelected: (0, _euiThemeCommon.computed)(function (_ref111) {
-    var _ref112 = _slicedToArray(_ref111, 1),
-      backgroundBaseInteractiveSelect = _ref112[0];
+  tableRowBackgroundSelected: (0, _euiThemeCommon.computed)(function (_ref109) {
+    var _ref110 = _slicedToArray(_ref109, 1),
+      backgroundBaseInteractiveSelect = _ref110[0];
     return backgroundBaseInteractiveSelect;
   }, ['colors.backgroundBaseInteractiveSelect']),
-  tableRowBackgroundSelectedHover: (0, _euiThemeCommon.computed)(function (_ref113) {
-    var _ref114 = _slicedToArray(_ref113, 1),
-      backgroundBaseInteractiveSelectHover = _ref114[0];
+  tableRowBackgroundSelectedHover: (0, _euiThemeCommon.computed)(function (_ref111) {
+    var _ref112 = _slicedToArray(_ref111, 1),
+      backgroundBaseInteractiveSelectHover = _ref112[0];
     return backgroundBaseInteractiveSelectHover;
   }, ['colors.backgroundBaseInteractiveSelectHover']),
-  tableRowInteractiveBackgroundHover: (0, _euiThemeCommon.computed)(function (_ref115) {
-    var _ref116 = _slicedToArray(_ref115, 1),
-      backgroundBaseInteractiveSelect = _ref116[0];
+  tableRowInteractiveBackgroundHover: (0, _euiThemeCommon.computed)(function (_ref113) {
+    var _ref114 = _slicedToArray(_ref113, 1),
+      backgroundBaseInteractiveSelect = _ref114[0];
     return backgroundBaseInteractiveSelect;
   }, ['colors.backgroundBaseInteractiveSelect']),
-  tableRowInteractiveBackgroundFocus: (0, _euiThemeCommon.computed)(function (_ref117) {
-    var _ref118 = _slicedToArray(_ref117, 1),
-      backgroundBaseInteractiveHover = _ref118[0];
+  tableRowInteractiveBackgroundFocus: (0, _euiThemeCommon.computed)(function (_ref115) {
+    var _ref116 = _slicedToArray(_ref115, 1),
+      backgroundBaseInteractiveHover = _ref116[0];
     return backgroundBaseInteractiveHover;
   }, ['colors.backgroundBaseInteractiveHover']),
   tableRowBackgroundMarked: _semantic_colors.SEMANTIC_COLORS.warning10,
   tableRowBackgroundMarkedHover: _semantic_colors.SEMANTIC_COLORS.warning20,
-  tableCellSortableIconColor: (0, _euiThemeCommon.computed)(function (_ref119) {
-    var _ref120 = _slicedToArray(_ref119, 1),
-      backgroundFilledText = _ref120[0];
+  tableCellSortableIconColor: (0, _euiThemeCommon.computed)(function (_ref117) {
+    var _ref118 = _slicedToArray(_ref117, 1),
+      backgroundFilledText = _ref118[0];
     return backgroundFilledText;
   }, ['colors.backgroundFilledText']),
   tableFooterBackground: _semantic_colors.SEMANTIC_COLORS.shade15,
   tooltipBackground: _colors_dark.dark_background_colors.backgroundBaseSubdued,
   tooltipBorder: _colors_dark.dark_border_colors.borderBaseSubdued,
-  tooltipBorderFloating: (0, _euiThemeCommon.computed)(function (_ref121) {
-    var _ref122 = _slicedToArray(_ref121, 1),
-      borderBaseFloating = _ref122[0];
+  tooltipBorderFloating: (0, _euiThemeCommon.computed)(function (_ref119) {
+    var _ref120 = _slicedToArray(_ref119, 1),
+      borderBaseFloating = _ref120[0];
     return borderBaseFloating;
   }, ['colors.borderBaseFloating']),
-  tourFooterBackground: (0, _euiThemeCommon.computed)(function (_ref123) {
-    var _ref124 = _slicedToArray(_ref123, 1),
-      backgroundBaseHighlighted = _ref124[0];
+  tourFooterBackground: (0, _euiThemeCommon.computed)(function (_ref121) {
+    var _ref122 = _slicedToArray(_ref121, 1),
+      backgroundBaseHighlighted = _ref122[0];
     return backgroundBaseHighlighted;
   }, ['colors.backgroundBaseHighlighted']),
   tourStepIndicatorInactiveColor: _semantic_colors.SEMANTIC_COLORS.shade50,
-  tourStepIndicatorActiveColor: (0, _euiThemeCommon.computed)(function (_ref125) {
-    var _ref126 = _slicedToArray(_ref125, 1),
-      backgroundFilledSuccess = _ref126[0];
+  tourStepIndicatorActiveColor: (0, _euiThemeCommon.computed)(function (_ref123) {
+    var _ref124 = _slicedToArray(_ref123, 1),
+      backgroundFilledSuccess = _ref124[0];
     return backgroundFilledSuccess;
   }, ['colors.backgroundFilledSuccess']),
-  treeViewItemBackgroundHover: (0, _euiThemeCommon.computed)(function (_ref127) {
-    var _ref128 = _slicedToArray(_ref127, 1),
-      backgroundBaseInteractiveHover = _ref128[0];
+  treeViewItemBackgroundHover: (0, _euiThemeCommon.computed)(function (_ref125) {
+    var _ref126 = _slicedToArray(_ref125, 1),
+      backgroundBaseInteractiveHover = _ref126[0];
     return backgroundBaseInteractiveHover;
   }, ['colors.backgroundBaseInteractiveHover'])
 };
@@ -433,23 +428,23 @@ var components = exports.components = {
     skeletonBackgroundSkeletonMiddleHighContrast: "rgba(".concat(_semantic_colors.SEMANTIC_COLORS.plainLightRGB, ", 0.3)"),
     switchIconDisabled: _forms.forms.DARK.iconDisabled,
     // TODO: align table hover states
-    tableRowInteractiveBackgroundHover: (0, _euiThemeCommon.computed)(function (_ref129) {
-      var _ref130 = _slicedToArray(_ref129, 1),
-        backgroundBaseInteractiveHover = _ref130[0];
+    tableRowInteractiveBackgroundHover: (0, _euiThemeCommon.computed)(function (_ref127) {
+      var _ref128 = _slicedToArray(_ref127, 1),
+        backgroundBaseInteractiveHover = _ref128[0];
       return backgroundBaseInteractiveHover;
     }, ['colors.backgroundBaseInteractiveHover']),
-    tableRowInteractiveBackgroundFocus: (0, _euiThemeCommon.computed)(function (_ref131) {
-      var _ref132 = _slicedToArray(_ref131, 1),
-        backgroundBaseInteractiveHover = _ref132[0];
+    tableRowInteractiveBackgroundFocus: (0, _euiThemeCommon.computed)(function (_ref129) {
+      var _ref130 = _slicedToArray(_ref129, 1),
+        backgroundBaseInteractiveHover = _ref130[0];
       return backgroundBaseInteractiveHover;
     }, ['colors.backgroundBaseInteractiveHover']),
     tableRowBackgroundMarked: _semantic_colors.SEMANTIC_COLORS.warning140,
     tableRowBackgroundMarkedHover: _semantic_colors.SEMANTIC_COLORS.warning130,
     tableFooterBackground: _semantic_colors.SEMANTIC_COLORS.shade135,
     tourStepIndicatorInactiveColor: _semantic_colors.SEMANTIC_COLORS.shade100,
-    tourStepIndicatorActiveColor: (0, _euiThemeCommon.computed)(function (_ref133) {
-      var _ref134 = _slicedToArray(_ref133, 1),
-        backgroundFilledSuccess = _ref134[0];
+    tourStepIndicatorActiveColor: (0, _euiThemeCommon.computed)(function (_ref131) {
+      var _ref132 = _slicedToArray(_ref131, 1),
+        backgroundFilledSuccess = _ref132[0];
       return backgroundFilledSuccess;
     }, ['colors.backgroundFilledSuccess'])
   })

package/lib/cjs/variables/_overrides.js

@@ -18,9 +18,15 @@ var _colors_severity_hcm = require("./colors/_colors_severity_hcm");
 var overrides = exports.overrides = {
   HCM: {
     colors: {
-      ink: _primitive_colors.PRIMITIVE_COLORS.black,
-      ghost: _primitive_colors.PRIMITIVE_COLORS.white,
+      plainDark: _primitive_colors.PRIMITIVE_COLORS.black,
+      plainLight: _primitive_colors.PRIMITIVE_COLORS.white,
+      DARK: {
+        textInk: _primitive_colors.PRIMITIVE_COLORS.black,
+        textGhost: _primitive_colors.PRIMITIVE_COLORS.white
+      },
       LIGHT: {
+        textInk: _primitive_colors.PRIMITIVE_COLORS.black,
+        textGhost: _primitive_colors.PRIMITIVE_COLORS.white,
         vis: _colors_vis_hcm.visColorsLightHighContrast,
         severity: _colors_severity_hcm.severityColorsLightHighContrast
       }

package/lib/cjs/variables/colors/_colors_dark.js

@@ -58,7 +58,9 @@ var dark_text_colors = exports.dark_text_colors = {
   textHeading: _semantic_colors.SEMANTIC_COLORS.shade20,
   textSubdued: _semantic_colors.SEMANTIC_COLORS.shade55,
   textDisabled: _semantic_colors.SEMANTIC_COLORS.shade80,
-  textInverse: _semantic_colors.SEMANTIC_COLORS.plainDark
+  textInverse: _semantic_colors.SEMANTIC_COLORS.plainDark,
+  textInk: _semantic_colors.SEMANTIC_COLORS.plainDark,
+  textGhost: _semantic_colors.SEMANTIC_COLORS.plainLight
 };
 var dark_shades = exports.dark_shades = {
   emptyShade: _semantic_colors.SEMANTIC_COLORS.shade145,

package/lib/cjs/variables/colors/_colors_light.js

@@ -58,7 +58,9 @@ var text_colors = exports.text_colors = {
   textHeading: _semantic_colors.SEMANTIC_COLORS.shade140,
   textSubdued: _semantic_colors.SEMANTIC_COLORS.shade95,
   textDisabled: _semantic_colors.SEMANTIC_COLORS.shade70,
-  textInverse: _semantic_colors.SEMANTIC_COLORS.plainLight
+  textInverse: _semantic_colors.SEMANTIC_COLORS.plainLight,
+  textInk: _semantic_colors.SEMANTIC_COLORS.plainDark,
+  textGhost: _semantic_colors.SEMANTIC_COLORS.plainLight
 };
 var shade_colors = exports.shade_colors = {
   emptyShade: _semantic_colors.SEMANTIC_COLORS.plainLight,

package/lib/cjs/variables/colors/_colors_vis_hcm.js

@@ -61,7 +61,10 @@ var visColorsLightHighContrast = exports.visColorsLightHighContrast = _objectSpr
   euiColorVisRisk1: _semantic_colors.SEMANTIC_COLORS.risk80,
   euiColorVisDanger0: _semantic_colors.SEMANTIC_COLORS.danger100,
   euiColorVisDanger1: _semantic_colors.SEMANTIC_COLORS.danger80,
-  euiColorVisBase0: _primitive_colors.PRIMITIVE_COLORS.mutedGrey10,
+  // We removed the `mutedGrey` palette in favor of the `blueGrey` palette from the theme
+  // but we need to keep this specific value for visualizations backwards compatibility.
+  // We want to limit its usage to visualizations only, so we're keeping it hardcoded here.
+  euiColorVisBase0: '#F6F9FC',
   euiColorVisGrey0: _primitive_colors.PRIMITIVE_COLORS.blueGrey30,
   euiColorVisGrey1: _primitive_colors.PRIMITIVE_COLORS.blueGrey60,
   euiColorVisGrey2: _primitive_colors.PRIMITIVE_COLORS.blueGrey90,

package/lib/cjs/variables/colors/_colors_vis_light.js

@@ -90,7 +90,10 @@ var colorVisLight = exports.colorVisLight = {
   euiColorVisRisk1: _semantic_colors.SEMANTIC_COLORS.risk30,
   euiColorVisDanger0: _semantic_colors.SEMANTIC_COLORS.danger60,
   euiColorVisDanger1: _semantic_colors.SEMANTIC_COLORS.danger30,
-  euiColorVisBase0: _primitive_colors.PRIMITIVE_COLORS.mutedGrey10,
+  // We removed the `mutedGrey` palette in favor of the `blueGrey` palette from the theme
+  // but we need to keep this specific value for visualizations backwards compatibility.
+  // We want to limit its usage to visualizations only, so we're keeping it hardcoded here.
+  euiColorVisBase0: '#F6F9FC',
   euiColorVisGrey0: _primitive_colors.PRIMITIVE_COLORS.blueGrey30,
   euiColorVisGrey1: _primitive_colors.PRIMITIVE_COLORS.blueGrey60,
   euiColorVisGrey2: _primitive_colors.PRIMITIVE_COLORS.blueGrey90,

package/lib/cjs/variables/colors/_primitive_colors.d.ts

@@ -4,34 +4,6 @@ export declare const PRIMITIVE_COLORS: {
     mutedBlack: string;
     blueBlack: string;
     transparent: string;
-    mutedGrey10: string;
-    mutedGrey15: string;
-    mutedGrey20: string;
-    mutedGrey25: string;
-    mutedGrey30: string;
-    mutedGrey35: string;
-    mutedGrey40: string;
-    mutedGrey45: string;
-    mutedGrey50: string;
-    mutedGrey55: string;
-    mutedGrey60: string;
-    mutedGrey65: string;
-    mutedGrey70: string;
-    mutedGrey75: string;
-    mutedGrey80: string;
-    mutedGrey85: string;
-    mutedGrey90: string;
-    mutedGrey95: string;
-    mutedGrey100: string;
-    mutedGrey105: string;
-    mutedGrey110: string;
-    mutedGrey115: string;
-    mutedGrey120: string;
-    mutedGrey125: string;
-    mutedGrey130: string;
-    mutedGrey135: string;
-    mutedGrey140: string;
-    mutedGrey145: string;
     blueGrey10: string;
     blueGrey15: string;
     blueGrey20: string;

package/lib/cjs/variables/colors/_primitive_colors.js

@@ -18,34 +18,6 @@ var PRIMITIVE_COLORS = exports.PRIMITIVE_COLORS = {
   mutedBlack: '#0E0F12',
   blueBlack: '#07101F',
   transparent: 'transparent',
-  mutedGrey10: '#F6F9FC',
-  mutedGrey15: '#EDEFF3',
-  mutedGrey20: '#E3E6EB',
-  mutedGrey25: '#D9DDE3',
-  mutedGrey30: '#D0D4DA',
-  mutedGrey35: '#C6CBD2',
-  mutedGrey40: '#BDC2CA',
-  mutedGrey45: '#B3B9C2',
-  mutedGrey50: '#AAB0BA',
-  mutedGrey55: '#A1A8B2',
-  mutedGrey60: '#989FAA',
-  mutedGrey65: '#8F96A2',
-  mutedGrey70: '#868E9A',
-  mutedGrey75: '#7E8691',
-  mutedGrey80: '#767D89',
-  mutedGrey85: '#6E7581',
-  mutedGrey90: '#666D78',
-  mutedGrey95: '#5D6570',
-  mutedGrey100: '#555C67',
-  mutedGrey105: '#4D545E',
-  mutedGrey110: '#464C56',
-  mutedGrey115: '#3F444D',
-  mutedGrey120: '#373D45',
-  mutedGrey125: '#30353C',
-  mutedGrey130: '#292E34',
-  mutedGrey135: '#23262C',
-  mutedGrey140: '#1C1F24',
-  mutedGrey145: '#16181D',
   blueGrey10: '#F6F9FC',
   blueGrey15: '#ECF1F9',
   blueGrey20: '#E3E8F2',

package/lib/cjs/variables/colors/index.js

@@ -23,8 +23,6 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
  * Side Public License, v 1.
  */
 var colors = exports.colors = {
-  ghost: _semantic_colors.SEMANTIC_COLORS.plainLight,
-  ink: _semantic_colors.SEMANTIC_COLORS.plainDark,
   plainLight: _semantic_colors.SEMANTIC_COLORS.plainLight,
   plainDark: _semantic_colors.SEMANTIC_COLORS.plainDark,
   LIGHT: _objectSpread(_objectSpread({}, _colors_light.light_colors), {}, {

package/lib/esm/variables/_components.js

@@ -98,7 +98,6 @@ const component_colors = {
     sideNavItemEmphasizedBackground: computed(([backgroundBaseInteractiveSelect]) => backgroundBaseInteractiveSelect, ['colors.backgroundBaseInteractiveSelect']),
     selectableListItemBorderColor: computed(([borderBaseSubdued]) => borderBaseSubdued, ['colors.borderBaseSubdued']),
     skeletonBackgroundSkeletonMiddleHighContrast: `rgba(${SEMANTIC_COLORS.shade100RGB}, 0.04)`,
-    superDatePickerBackgroundSuccees: computed(([backgroundBaseSuccess]) => backgroundBaseSuccess, ['colors.backgroundBaseSuccess']),
     switchBackgroundOn: computed(([backgroundFilledPrimary]) => backgroundFilledPrimary, ['colors.backgroundFilledPrimary']),
     switchBackgroundOff: computed(([backgroundFilledText]) => backgroundFilledText, ['colors.backgroundFilledText']),
     switchUncompressedBackgroundDisabled: computed(([backgroundBaseFormsControlDisabled]) => backgroundBaseFormsControlDisabled, ['colors.backgroundBaseFormsControlDisabled']),

package/lib/esm/variables/_overrides.js

@@ -11,9 +11,15 @@ import { severityColorsLightHighContrast } from './colors/_colors_severity_hcm';
 export const overrides = {
     HCM: {
         colors: {
-            ink: PRIMITIVE_COLORS.black,
-            ghost: PRIMITIVE_COLORS.white,
+            plainDark: PRIMITIVE_COLORS.black,
+            plainLight: PRIMITIVE_COLORS.white,
+            DARK: {
+                textInk: PRIMITIVE_COLORS.black,
+                textGhost: PRIMITIVE_COLORS.white,
+            },
             LIGHT: {
+                textInk: PRIMITIVE_COLORS.black,
+                textGhost: PRIMITIVE_COLORS.white,
                 vis: visColorsLightHighContrast,
                 severity: severityColorsLightHighContrast,
             },

package/lib/esm/variables/colors/_colors_dark.js

@@ -47,6 +47,8 @@ export const dark_text_colors = {
     textSubdued: SEMANTIC_COLORS.shade55,
     textDisabled: SEMANTIC_COLORS.shade80,
     textInverse: SEMANTIC_COLORS.plainDark,
+    textInk: SEMANTIC_COLORS.plainDark,
+    textGhost: SEMANTIC_COLORS.plainLight,
 };
 export const dark_shades = {
     emptyShade: SEMANTIC_COLORS.shade145,

package/lib/esm/variables/colors/_colors_light.js

@@ -47,6 +47,8 @@ export const text_colors = {
     textSubdued: SEMANTIC_COLORS.shade95,
     textDisabled: SEMANTIC_COLORS.shade70,
     textInverse: SEMANTIC_COLORS.plainLight,
+    textInk: SEMANTIC_COLORS.plainDark,
+    textGhost: SEMANTIC_COLORS.plainLight,
 };
 export const shade_colors = {
     emptyShade: SEMANTIC_COLORS.plainLight,

package/lib/esm/variables/colors/_colors_vis_hcm.js

@@ -51,7 +51,10 @@ export const visColorsLightHighContrast = {
     euiColorVisRisk1: SEMANTIC_COLORS.risk80,
     euiColorVisDanger0: SEMANTIC_COLORS.danger100,
     euiColorVisDanger1: SEMANTIC_COLORS.danger80,
-    euiColorVisBase0: PRIMITIVE_COLORS.mutedGrey10,
+    // We removed the `mutedGrey` palette in favor of the `blueGrey` palette from the theme
+    // but we need to keep this specific value for visualizations backwards compatibility.
+    // We want to limit its usage to visualizations only, so we're keeping it hardcoded here.
+    euiColorVisBase0: '#F6F9FC',
     euiColorVisGrey0: PRIMITIVE_COLORS.blueGrey30,
     euiColorVisGrey1: PRIMITIVE_COLORS.blueGrey60,
     euiColorVisGrey2: PRIMITIVE_COLORS.blueGrey90,

package/lib/esm/variables/colors/_colors_vis_light.js

@@ -83,7 +83,10 @@ export const colorVisLight = {
     euiColorVisRisk1: SEMANTIC_COLORS.risk30,
     euiColorVisDanger0: SEMANTIC_COLORS.danger60,
     euiColorVisDanger1: SEMANTIC_COLORS.danger30,
-    euiColorVisBase0: PRIMITIVE_COLORS.mutedGrey10,
+    // We removed the `mutedGrey` palette in favor of the `blueGrey` palette from the theme
+    // but we need to keep this specific value for visualizations backwards compatibility.
+    // We want to limit its usage to visualizations only, so we're keeping it hardcoded here.
+    euiColorVisBase0: '#F6F9FC',
     euiColorVisGrey0: PRIMITIVE_COLORS.blueGrey30,
     euiColorVisGrey1: PRIMITIVE_COLORS.blueGrey60,
     euiColorVisGrey2: PRIMITIVE_COLORS.blueGrey90,

package/lib/esm/variables/colors/_primitive_colors.d.ts

@@ -4,34 +4,6 @@ export declare const PRIMITIVE_COLORS: {
     mutedBlack: string;
     blueBlack: string;
     transparent: string;
-    mutedGrey10: string;
-    mutedGrey15: string;
-    mutedGrey20: string;
-    mutedGrey25: string;
-    mutedGrey30: string;
-    mutedGrey35: string;
-    mutedGrey40: string;
-    mutedGrey45: string;
-    mutedGrey50: string;
-    mutedGrey55: string;
-    mutedGrey60: string;
-    mutedGrey65: string;
-    mutedGrey70: string;
-    mutedGrey75: string;
-    mutedGrey80: string;
-    mutedGrey85: string;
-    mutedGrey90: string;
-    mutedGrey95: string;
-    mutedGrey100: string;
-    mutedGrey105: string;
-    mutedGrey110: string;
-    mutedGrey115: string;
-    mutedGrey120: string;
-    mutedGrey125: string;
-    mutedGrey130: string;
-    mutedGrey135: string;
-    mutedGrey140: string;
-    mutedGrey145: string;
     blueGrey10: string;
     blueGrey15: string;
     blueGrey20: string;

package/lib/esm/variables/colors/_primitive_colors.js

@@ -11,34 +11,6 @@ export const PRIMITIVE_COLORS = {
     mutedBlack: '#0E0F12',
     blueBlack: '#07101F',
     transparent: 'transparent',
-    mutedGrey10: '#F6F9FC',
-    mutedGrey15: '#EDEFF3',
-    mutedGrey20: '#E3E6EB',
-    mutedGrey25: '#D9DDE3',
-    mutedGrey30: '#D0D4DA',
-    mutedGrey35: '#C6CBD2',
-    mutedGrey40: '#BDC2CA',
-    mutedGrey45: '#B3B9C2',
-    mutedGrey50: '#AAB0BA',
-    mutedGrey55: '#A1A8B2',
-    mutedGrey60: '#989FAA',
-    mutedGrey65: '#8F96A2',
-    mutedGrey70: '#868E9A',
-    mutedGrey75: '#7E8691',
-    mutedGrey80: '#767D89',
-    mutedGrey85: '#6E7581',
-    mutedGrey90: '#666D78',
-    mutedGrey95: '#5D6570',
-    mutedGrey100: '#555C67',
-    mutedGrey105: '#4D545E',
-    mutedGrey110: '#464C56',
-    mutedGrey115: '#3F444D',
-    mutedGrey120: '#373D45',
-    mutedGrey125: '#30353C',
-    mutedGrey130: '#292E34',
-    mutedGrey135: '#23262C',
-    mutedGrey140: '#1C1F24',
-    mutedGrey145: '#16181D',
     blueGrey10: '#F6F9FC',
     blueGrey15: '#ECF1F9',
     blueGrey20: '#E3E8F2',

package/lib/esm/variables/colors/index.js

@@ -12,8 +12,6 @@ import { colorVisLight } from './_colors_vis_light';
 import { colorVisDark } from './_colors_vis_dark';
 import { severityColors } from './_colors_severity';
 export const colors = {
-    ghost: SEMANTIC_COLORS.plainLight,
-    ink: SEMANTIC_COLORS.plainDark,
     plainLight: SEMANTIC_COLORS.plainLight,
     plainDark: SEMANTIC_COLORS.plainDark,
     LIGHT: {

package/lib/eui_theme_borealis_dark.json

@@ -354,8 +354,6 @@
   "euiColorSeverityDanger": "#EE4C48",
   "euiColorChartLines": "#7186A8",
   "euiColorChartBand": "#243147",
-  "euiColorGhost": "#FFFFFF",
-  "euiColorInk": "#000000",
   "euiColorPrimary": "#61A2FF",
   "euiColorAccent": "#EE72A6",
   "euiColorAccentSecondary": "#16C5C0",
@@ -397,6 +395,8 @@
   "euiColorTextSubdued": "#98A8C3",
   "euiColorTextDisabled": "#6A7FA0",
   "euiColorTextInverse": "#07101F",
+  "euiColorTextGhost": "#FFFFFF",
+  "euiColorTextInk": "#07101F",
   "euiColorBackgroundBasePrimary": "#0A2342",
   "euiColorBackgroundBaseAccent": "#351725",
   "euiColorBackgroundBaseAccentSecondary": "#03282B",

package/lib/eui_theme_borealis_dark.json.d.ts

@@ -355,8 +355,6 @@ declare module '@elastic/eui-theme-borealis/lib/eui_theme_borealis_dark.json' {
     euiColorSeverityDanger: string;
     euiColorChartLines: string;
     euiColorChartBand: string;
-    euiColorGhost: string;
-    euiColorInk: string;
     euiColorPrimary: string;
     euiColorAccent: string;
     euiColorAccentSecondary: string;
@@ -398,6 +396,8 @@ declare module '@elastic/eui-theme-borealis/lib/eui_theme_borealis_dark.json' {
     euiColorTextSubdued: string;
     euiColorTextDisabled: string;
     euiColorTextInverse: string;
+    euiColorTextGhost: string;
+    euiColorTextInk: string;
     euiColorBackgroundBasePrimary: string;
     euiColorBackgroundBaseAccent: string;
     euiColorBackgroundBaseAccentSecondary: string;

package/lib/eui_theme_borealis_light.json

@@ -354,8 +354,6 @@
   "euiColorSeverityDanger": "#EE4C48",
   "euiColorChartLines": "#CAD3E2",
   "euiColorChartBand": "#F6F9FC",
-  "euiColorGhost": "#FFFFFF",
-  "euiColorInk": "#000000",
   "euiColorPrimary": "#0B64DD",
   "euiColorAccent": "#BC1E70",
   "euiColorAccentSecondary": "#008B87",
@@ -397,6 +395,8 @@
   "euiColorTextSubdued": "#516381",
   "euiColorTextDisabled": "#798EAF",
   "euiColorTextInverse": "#FFFFFF",
+  "euiColorTextGhost": "#FFFFFF",
+  "euiColorTextInk": "#07101F",
   "euiColorBackgroundBasePrimary": "#E8F1FF",
   "euiColorBackgroundBaseAccent": "#FFEBF5",
   "euiColorBackgroundBaseAccentSecondary": "#E2F9F7",

package/lib/eui_theme_borealis_light.json.d.ts

@@ -355,8 +355,6 @@ declare module '@elastic/eui-theme-borealis/lib/eui_theme_borealis_light.json' {
     euiColorSeverityDanger: string;
     euiColorChartLines: string;
     euiColorChartBand: string;
-    euiColorGhost: string;
-    euiColorInk: string;
     euiColorPrimary: string;
     euiColorAccent: string;
     euiColorAccentSecondary: string;
@@ -398,6 +396,8 @@ declare module '@elastic/eui-theme-borealis/lib/eui_theme_borealis_light.json' {
     euiColorTextSubdued: string;
     euiColorTextDisabled: string;
     euiColorTextInverse: string;
+    euiColorTextGhost: string;
+    euiColorTextInk: string;
     euiColorBackgroundBasePrimary: string;
     euiColorBackgroundBaseAccent: string;
     euiColorBackgroundBaseAccentSecondary: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elastic/eui-theme-borealis",
-  "version": "5.4.0",
+  "version": "6.0.0",
   "description": "A visual theme for EUI",
   "license": "SEE LICENSE IN LICENSE.txt",
   "scripts": {
@@ -26,7 +26,7 @@
     "directory": "packages/eui-theme-borealis"
   },
   "dependencies": {
-    "@elastic/eui-theme-common": "7.3.0",
+    "@elastic/eui-theme-common": "8.0.0",
     "chroma-js": "^2.4.2"
   },
   "devDependencies": {
@@ -35,7 +35,7 @@
     "@babel/preset-env": "^7.21.5",
     "@babel/preset-react": "^7.18.6",
     "@babel/preset-typescript": "^7.21.5",
-    "@elastic/eui-theme-common": "7.3.0",
+    "@elastic/eui-theme-common": "8.0.0",
     "@types/chroma-js": "^2.4.0",
     "@types/jest": "^29.5.12",
     "@types/prettier": "2.7.3",

package/src/variables/_buttons.scss

@@ -11,7 +11,7 @@ $euiButtonTypes: (
   warning: $euiColorBackgroundFilledWarning,
   risk: $euiColorBackgroundFilledRisk,
   danger: $euiColorBackgroundFilledDanger,
-  ghost: $euiColorGhost, // Ghost is special, and does not care about theming.
+  ghost: $euiColorPlainLight, // Ghost is color-mode-invariant
   text: $euiColorBackgroundFilledText, // Reserved for special use cases
 ) !default;
 

package/src/variables/_shadows_dark.scss

@@ -1,5 +1,5 @@
 // Shadows
-$euiShadowColor: $euiColorInk !default;
+$euiShadowColor: $euiColorPlainDark !default;
 
 $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);

package/src/variables/colors/_colors_dark.scss

@@ -5,10 +5,6 @@
 
 @import 'semantic_colors';
 
-// Constants (legacy)
-$euiColorGhost: $euiColorWhite !default;
-$euiColorInk: $euiColorBlack !default;
-
 // Brand
 $euiColorPrimary: $euiColorPrimary60 !default;
 $euiColorAccent: $euiColorAccent60 !default;

package/src/variables/colors/_colors_light.scss

@@ -5,11 +5,6 @@
 
 @import 'semantic_colors';
 
-// These colors stay the same no matter the theme
-// @deprecated
-$euiColorGhost: $euiColorWhite !default;
-$euiColorInk: $euiColorBlack !default;
-
 // Brand
 $euiColorPrimary: $euiColorPrimary90 !default;
 $euiColorAccent: $euiColorAccent90 !default;