@elastic/eui-theme-common 7.3.0 → 8.0.0

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

@@ -128,6 +128,8 @@ export declare type _EuiThemeTextColors = {
     textSubdued: ColorModeSwitch;
     textDisabled: ColorModeSwitch;
     textInverse: ColorModeSwitch;
+    textInk: ColorModeSwitch;
+    textGhost: ColorModeSwitch;
 };
 export declare type _EuiThemeSpecialColors = {
     /**
@@ -329,8 +331,6 @@ export declare type _EuiThemeSeverityColors = {
     danger: string;
 };
 export declare type _EuiThemeConstantColors = {
-    ghost: string;
-    ink: string;
     plainLight: string;
     plainDark: string;
 };

package/lib/cjs/global_styling/variables/components.d.ts

@@ -87,7 +87,6 @@ export declare type _EuiThemeComponentColors = {
     sideNavItemEmphasizedBackground: ColorModeSwitch;
     selectableListItemBorderColor: ColorModeSwitch;
     skeletonBackgroundSkeletonMiddleHighContrast: ColorModeSwitch;
-    superDatePickerBackgroundSuccees: ColorModeSwitch;
     switchBackgroundOn: ColorModeSwitch;
     switchBackgroundOff: ColorModeSwitch;
     switchUncompressedBackgroundDisabled: ColorModeSwitch;

package/lib/cjs/global_styling/variables/typography.d.ts

@@ -52,11 +52,11 @@ export declare type _EuiThemeFontWeights = {
     light: CSSProperties['fontWeight'];
     /** - Default value: 400 */
     regular: CSSProperties['fontWeight'];
-    /** - Default value: 500 */
+    /** - Default value: 450 */
     medium: CSSProperties['fontWeight'];
-    /** - Default value: 600 */
+    /** - Default value: 500 */
     semiBold: CSSProperties['fontWeight'];
-    /** - Default value: 700 */
+    /** - Default value: 600 */
     bold: CSSProperties['fontWeight'];
 };
 /**

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

@@ -128,6 +128,8 @@ export declare type _EuiThemeTextColors = {
     textSubdued: ColorModeSwitch;
     textDisabled: ColorModeSwitch;
     textInverse: ColorModeSwitch;
+    textInk: ColorModeSwitch;
+    textGhost: ColorModeSwitch;
 };
 export declare type _EuiThemeSpecialColors = {
     /**
@@ -329,8 +331,6 @@ export declare type _EuiThemeSeverityColors = {
     danger: string;
 };
 export declare type _EuiThemeConstantColors = {
-    ghost: string;
-    ink: string;
     plainLight: string;
     plainDark: string;
 };

package/lib/esm/global_styling/variables/components.d.ts

@@ -87,7 +87,6 @@ export declare type _EuiThemeComponentColors = {
     sideNavItemEmphasizedBackground: ColorModeSwitch;
     selectableListItemBorderColor: ColorModeSwitch;
     skeletonBackgroundSkeletonMiddleHighContrast: ColorModeSwitch;
-    superDatePickerBackgroundSuccees: ColorModeSwitch;
     switchBackgroundOn: ColorModeSwitch;
     switchBackgroundOff: ColorModeSwitch;
     switchUncompressedBackgroundDisabled: ColorModeSwitch;

package/lib/esm/global_styling/variables/typography.d.ts

@@ -52,11 +52,11 @@ export declare type _EuiThemeFontWeights = {
     light: CSSProperties['fontWeight'];
     /** - Default value: 400 */
     regular: CSSProperties['fontWeight'];
-    /** - Default value: 500 */
+    /** - Default value: 450 */
     medium: CSSProperties['fontWeight'];
-    /** - Default value: 600 */
+    /** - Default value: 500 */
     semiBold: CSSProperties['fontWeight'];
-    /** - Default value: 700 */
+    /** - Default value: 600 */
     bold: CSSProperties['fontWeight'];
 };
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elastic/eui-theme-common",
-  "version": "7.3.0",
+  "version": "8.0.0",
   "description": "EUI theme common",
   "license": "SEE LICENSE IN LICENSE.txt",
   "scripts": {

package/src/global_styling/functions/_colors.scss

@@ -5,12 +5,12 @@
 
 // Mixes a provided color with white.
 @function tint($color, $percent) {
-  @return mix($euiColorGhost, $color, $percent);
+  @return mix($euiColorPlainLight, $color, $percent);
 }
 
 // Mixes a provided color with black.
 @function shade($color, $percent) {
-  @return mix($euiColorInk, $color, $percent);
+  @return mix($euiColorPlainDark, $color, $percent);
 }
 
 // For theming. Checks the text color and tells us whether it's light or dark.
@@ -72,7 +72,7 @@
 // Given $color, decide whether $lightText or $darkText should be used as the text color
 // ex: chooseLightOrDarkText(#EEE, #FFF, #000) would return #000 because it has
 //     a higher contrast than #FFF against a #EEE background.
-@function chooseLightOrDarkText($background, $lightText: $euiColorGhost, $darkText: $euiColorInk) {
+@function chooseLightOrDarkText($background, $lightText: $euiColorPlainLight, $darkText: $euiColorPlainDark) {
   $lightContrast: contrastRatio($background, $lightText);
   $darkContrast: contrastRatio($background, $darkText);
 

package/src/global_styling/mixins/_tool_tip.scss

@@ -1,12 +1,12 @@
 @mixin euiToolTipStyle($size: null) {
-  @include euiBottomShadow($color: $euiColorInk);
+  @include euiBottomShadow($color: $euiColorPlainDark);
 
   $euiTooltipBackgroundColor: tintOrShade($euiColorFullShade, 25%, 100%) !default;
   $euiTooltipBorderColor: tintOrShade($euiColorFullShade, 35%, 80%) !default;
 
   border-radius: $euiBorderRadius;
   background-color: $euiTooltipBackgroundColor;
-  color: $euiColorGhost;
+  color: $euiColorPlainLight;
   z-index: $euiZLevel9;
   max-width: 256px;
   overflow-wrap: break-word;

package/src/global_styling/variables/_buttons.scss

@@ -9,7 +9,7 @@ $euiButtonTypes: (
   success: $euiColorSuccess,
   warning: $euiColorWarning,
   danger: $euiColorDanger,
-  ghost: $euiColorGhost, // Ghost is special, and does not care about theming.
+  ghost: $euiColorPlainLight, // Ghost is color-mode-invariant
   text: $euiColorDarkShade, // Reserved for special use cases
 ) !default;