@elastic/eui 102.1.0 → 102.2.0-snapshot.1748601905883

package/lib/themes/json/eui_theme_borealis_light.json

@@ -0,0 +1,427 @@
+{
+  "euiZDataGrid": 999,
+  "euiZHeaderBelowDataGrid": 998,
+  "euiZDataGridCellPopover": 1000,
+  "euiDataGridCellPaddingS": "4px",
+  "euiDataGridCellPaddingM": "6px",
+  "euiDataGridCellPaddingL": "8px",
+  "euiTableHoverColor": "rgba(54, 95, 178, 0.06)",
+  "euiTableSelectedColor": "#EDEFF3",
+  "euiTableHoverSelectedColor": "rgba(54, 95, 178, 0.06)",
+  "euiTableActionsBorderColor": "#E3E8F2",
+  "euiTableHoverClickableColor": "rgba(54, 95, 178, 0.06)",
+  "euiTableFocusClickableColor": "rgba(54, 95, 178, 0.06)",
+  "euiContrastRatioText": 4.5,
+  "euiContrastRatioGraphic": 3,
+  "euiContrastRatioDisabled": 2,
+  "euiAnimSlightBounce": "cubic-bezier(0.34, 1.61, 0.7, 1)",
+  "euiAnimSlightResistance": "cubic-bezier(0.694, 0.0482, 0.335, 1)",
+  "euiAnimSpeedExtraFast": "90ms",
+  "euiAnimSpeedFast": "150ms",
+  "euiAnimSpeedNormal": "250ms",
+  "euiAnimSpeedSlow": "350ms",
+  "euiAnimSpeedExtraSlow": "500ms",
+  "euiBorderWidthThin": "1px",
+  "euiBorderWidthThick": "2px",
+  "euiBorderColor": "#E3E8F2",
+  "euiBorderRadius": "4px",
+  "euiBorderRadiusSmall": "4px",
+  "euiBorderThick": "2px solid #E3E8F2",
+  "euiBorderThin": "1px solid #E3E8F2",
+  "euiBorderEditable": "2px dotted #E3E8F2",
+  "euiButtonHeight": "40px",
+  "euiButtonHeightSmall": "32px",
+  "euiButtonHeightXSmall": "24px",
+  "euiButtonColorDisabled": "#ECF1F9",
+  "euiButtonColorDisabledText": "#798EAF",
+  "euiButtonColorGhostDisabled": "#ECF1F9",
+  "euiButtonTypes": {
+    "primary": "#0B64DD",
+    "accent": "#BC1E70",
+    "accentSecondary": "#008B87",
+    "neutral": "#1C8CB5",
+    "success": "#008A5E",
+    "warning": "#FACB3D",
+    "risk": "#ED6723",
+    "danger": "#C61E25",
+    "ghost": "#ffffff",
+    "text": "#5A6D8C"
+  },
+  "euiFontWeightLight": 300,
+  "euiFontWeightRegular": 400,
+  "euiFontWeightMedium": 450,
+  "euiFontWeightSemiBold": 500,
+  "euiFontWeightBold": 600,
+  "euiCodeFontWeightRegular": 400,
+  "euiCodeFontWeightBold": 600,
+  "euiFormMaxWidth": "400px",
+  "euiFormControlHeight": "40px",
+  "euiFormControlCompressedHeight": "32px",
+  "euiFormControlPadding": "12px",
+  "euiFormControlCompressedPadding": "8px",
+  "euiFormControlBorderRadius": "4px",
+  "euiFormControlCompressedBorderRadius": "4px",
+  "euiRadioSize": "16px",
+  "euiCheckBoxSize": "16px",
+  "euiCheckboxBorderRadius": "4px",
+  "euiSwitchHeight": "20px",
+  "euiSwitchWidth": "44px",
+  "euiSwitchThumbSize": "20px",
+  "euiSwitchIconHeight": "16px",
+  "euiSwitchHeightCompressed": "16px",
+  "euiSwitchWidthCompressed": "28px",
+  "euiSwitchThumbSizeCompressed": "16px",
+  "euiSwitchHeightMini": "10px",
+  "euiSwitchWidthMini": "22px",
+  "euiSwitchThumbSizeMini": "10px",
+  "euiFormBackgroundColor": "#F6F9FC",
+  "euiFormBackgroundDisabledColor": "#ECF1F9",
+  "euiFormBackgroundReadOnlyColor": "#FFFFFF",
+  "euiFormBorderOpaqueColor": "#1c2390",
+  "euiFormBorderColor": "#CAD3E2",
+  "euiFormBorderDisabledColor": "#CAD3E2",
+  "euiFormCustomControlDisabledIconColor": "#798EAF",
+  "euiFormCustomControlBorderColor": "#CAD3E2",
+  "euiFormControlDisabledColor": "#CAD3E2",
+  "euiFormControlBoxShadow": "0 0 rgba(0, 0, 0, 0)",
+  "euiFormControlPlaceholderText": "#5A6D8C",
+  "euiFormInputGroupLabelBackground": "#ECF1F9",
+  "euiFormInputGroupBorder": "none",
+  "euiSwitchOffColor": "#5A6D8C",
+  "euiFormControlIconSizes": {
+    "small": "12px",
+    "medium": "16px",
+    "large": "24px",
+    "xLarge": "32px",
+    "xxLarge": "40px"
+  },
+  "euiFormControlLayoutGroupInputHeight": "38px",
+  "euiFormControlLayoutGroupInputCompressedHeight": "30px",
+  "euiFormControlLayoutGroupInputCompressedBorderRadius": "2px",
+  "euiHeaderBackgroundColor": "#FFFFFF",
+  "euiHeaderDarkBackgroundColor": "#0B1628",
+  "euiHeaderBorderColor": "#E3E8F2",
+  "euiHeaderBreadcrumbColor": "#D9E8FF",
+  "euiHeaderHeight": "48px",
+  "euiHeaderChildSize": "40px",
+  "euiHeaderHeightCompensation": "48px",
+  "euiPageDefaultMaxWidth": "1200px",
+  "euiPageSidebarMinWidth": "192px",
+  "euiPanelPaddingModifiers": {
+    "paddingSmall": "8px",
+    "paddingMedium": "16px",
+    "paddingLarge": "24px"
+  },
+  "euiPanelBorderRadiusModifiers": {
+    "borderRadiusNone": 0,
+    "borderRadiusMedium": "4px"
+  },
+  "euiPanelBackgroundColorModifiers": {
+    "transparent": "rgba(0, 0, 0, 0)",
+    "plain": "#FFFFFF",
+    "subdued": "#F6F9FC",
+    "accent": "#FFEBF5",
+    "accentSecondary": "#E2F9F7",
+    "primary": "#E8F1FF",
+    "success": "#E2F8F0",
+    "warning": "#FDF3D8",
+    "danger": "#FFE8E5"
+  },
+  "euiBreakpoints": {
+    "xs": 0,
+    "s": "575px",
+    "m": "768px",
+    "l": "992px",
+    "xl": "1200px"
+  },
+  "euiBreakpointKeys": "'xs', 's', 'm', 'l', 'xl'",
+  "euiShadowColor": "#000000",
+  "euiSize": "16px",
+  "euiSizeXS": "4px",
+  "euiSizeS": "8px",
+  "euiSizeM": "12px",
+  "euiSizeL": "24px",
+  "euiSizeXL": "32px",
+  "euiSizeXXL": "40px",
+  "euiScrollBar": "16px",
+  "euiScrollBarCorner": "4px",
+  "euiScrollBarCornerThin": "6px",
+  "euiFocusRingColor": "#1750BA",
+  "euiFocusRingAnimStartColor": "rgba(0, 0, 0, 0)",
+  "euiFocusRingAnimStartSize": "2px",
+  "euiFocusRingAnimStartSizeLarge": "10px",
+  "euiFocusRingSizeLarge": "4px",
+  "euiFocusRingSize": "2px",
+  "euiFocusTransparency": 0.9,
+  "euiFocusTransparencyPercent": "90%",
+  "euiFocusBackgroundColor": "#ECF1F9",
+  "euiFontFamily": "'Inter', '-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Helvetica', 'Arial', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'",
+  "euiCodeFontFamily": "'Roboto Mono', 'Consolas', 'Menlo', 'Courier', monospace",
+  "euiFontFeatureSettings": "calt 1 kern 1 liga 1",
+  "euiTextScale": "1,875, 1.5, 1.25, 1, .875, .75",
+  "euiFontSize": "14px",
+  "euiFontSizeXS": "12px",
+  "euiFontSizeS": "14px",
+  "euiFontSizeM": "16px",
+  "euiFontSizeL": "20px",
+  "euiFontSizeXL": "24px",
+  "euiFontSizeXXL": "30px",
+  "euiLineHeight": 1.5,
+  "euiBodyLineHeight": 1.142857143,
+  "euiTitles": {
+    "xxxs": {
+      "font-size": "12px",
+      "line-height": "1.1429rem",
+      "font-weight": 600
+    },
+    "xxs": {
+      "font-size": "14px",
+      "line-height": "1.4286rem",
+      "font-weight": 600
+    },
+    "xs": {
+      "font-size": "16px",
+      "line-height": "1.7143rem",
+      "font-weight": 600
+    },
+    "s": {
+      "font-size": "20px",
+      "line-height": "1.7143rem",
+      "font-weight": 600
+    },
+    "m": {
+      "font-size": "24px",
+      "line-height": "2rem",
+      "font-weight": 600
+    },
+    "l": {
+      "font-size": "30px",
+      "line-height": "2.5714rem",
+      "font-weight": 600
+    }
+  },
+  "euiZLevel0": 0,
+  "euiZLevel1": 1000,
+  "euiZLevel2": 2000,
+  "euiZLevel3": 3000,
+  "euiZLevel4": 4000,
+  "euiZLevel5": 5000,
+  "euiZLevel6": 6000,
+  "euiZLevel7": 7000,
+  "euiZLevel8": 8000,
+  "euiZLevel9": 9000,
+  "euiZToastList": 9000,
+  "euiZModal": 8000,
+  "euiZMask": 6000,
+  "euiZNavigation": 6000,
+  "euiZContentMenu": 2000,
+  "euiZHeader": 1000,
+  "euiZFlyout": 1000,
+  "euiZMaskBelowHeader": 1000,
+  "euiZContent": 0,
+  "euiPaletteColorBlind": {
+    "euiColorVis0": {
+      "graphic": "#16C5C0",
+      "behindText": "#16C5C0"
+    },
+    "euiColorVis1": {
+      "graphic": "#98E6E2",
+      "behindText": "#98E6E2"
+    },
+    "euiColorVis2": {
+      "graphic": "#61A2FF",
+      "behindText": "#61A2FF"
+    },
+    "euiColorVis3": {
+      "graphic": "#BFDBFF",
+      "behindText": "#BFDBFF"
+    },
+    "euiColorVis4": {
+      "graphic": "#EE72A6",
+      "behindText": "#EE72A6"
+    },
+    "euiColorVis5": {
+      "graphic": "#FFC7DB",
+      "behindText": "#FFC7DB"
+    },
+    "euiColorVis6": {
+      "graphic": "#F6726A",
+      "behindText": "#F6726A"
+    },
+    "euiColorVis7": {
+      "graphic": "#FFC9C2",
+      "behindText": "#FFC9C2"
+    },
+    "euiColorVis8": {
+      "graphic": "#EAAE01",
+      "behindText": "#EAAE01"
+    },
+    "euiColorVis9": {
+      "graphic": "#FCD883",
+      "behindText": "#FCD883"
+    }
+  },
+  "euiPaletteColorBlindKeys": "'euiColorVis0', 'euiColorVis1', 'euiColorVis2', 'euiColorVis3', 'euiColorVis4', 'euiColorVis5', 'euiColorVis6', 'euiColorVis7', 'euiColorVis8', 'euiColorVis9'",
+  "euiColorVis0": "#16C5C0",
+  "euiColorVis1": "#A6EDEA",
+  "euiColorVis2": "#61A2FF",
+  "euiColorVis3": "#BFDBFF",
+  "euiColorVis4": "#EE72A6",
+  "euiColorVis5": "#FFC7DB",
+  "euiColorVis6": "#F6726A",
+  "euiColorVis7": "#FFC9C2",
+  "euiColorVis8": "#EAAE01",
+  "euiColorVis9": "#FCD883",
+  "euiColorVis0_behindText": "#16C5C0",
+  "euiColorVis1_behindText": "#A6EDEA",
+  "euiColorVis2_behindText": "#61A2FF",
+  "euiColorVis3_behindText": "#B4D5FF",
+  "euiColorVis4_behindText": "#EE72A6",
+  "euiColorVis5_behindText": "#FFC7DB",
+  "euiColorVis6_behindText": "#F6726A",
+  "euiColorVis7_behindText": "#FFC9C2",
+  "euiColorVis8_behindText": "#EAAE01",
+  "euiColorVis9_behindText": "#FCD883",
+  "euiColorVisAsTextLight0": "#047471",
+  "euiColorVisAsTextLight1": "#1750BA",
+  "euiColorVisAsTextLight2": "#A11262",
+  "euiColorVisAsTextLight3": "#A71627",
+  "euiColorVisAsTextLight4": "#825803",
+  "euiColorVisAsTextLight5": "#09724D",
+  "euiColorVisAsTextLight6": "#6B3C9F",
+  "euiColorVisAsTextDark0": "#16C5C0",
+  "euiColorVisAsTextDark1": "#61A2FF",
+  "euiColorVisAsTextDark2": "#EE72A6",
+  "euiColorVisAsTextDark3": "#F6726A",
+  "euiColorVisAsTextDark4": "#EAAE01",
+  "euiColorVisAsTextDark5": "#24C292",
+  "euiColorVisAsTextDark6": "#B084F5",
+  "euiColorVisSuccess0": "#24C292",
+  "euiColorVisSuccess1": "#AEE8D2",
+  "euiColorVisWarning0": "#FCD883",
+  "euiColorVisDanger0": "#F6726A",
+  "euiColorVisDanger1": "#FFC9C2",
+  "euiColorVisNeutral0": "#F6F9FC",
+  "euiColorVisGrey0": "#CAD3E2",
+  "euiColorVisGrey1": "#8E9FBC",
+  "euiColorVisGrey2": "#5A6D8C",
+  "euiColorVisGrey3": "#1D2A3E",
+  "euiColorVisWarm0": "#FFE8E5",
+  "euiColorVisWarm1": "#FFB5AD",
+  "euiColorVisWarm2": "#F6726A",
+  "euiColorVisCool0": "#E8F1FF",
+  "euiColorVisCool1": "#A3CBFF",
+  "euiColorVisCool2": "#61A2FF",
+  "euiColorVisComplementary0": "#61A2FF",
+  "euiColorVisComplementary1": "#EAAE01",
+  "euiColorSeverityUnknown": "#E3E8F2",
+  "euiColorSeverityNeutral": "#B5E5F2",
+  "euiColorSeveritySuccess": "#24C292",
+  "euiColorSeverityWarning": "#FCD883",
+  "euiColorSeverityRisk": "#FF995E",
+  "euiColorSeverityDanger": "#EE4C48",
+  "euiColorChartLines": "#CAD3E2",
+  "euiColorChartBand": "#F6F9FC",
+  "euiColorGhost": "#FFFFFF",
+  "euiColorInk": "#000000",
+  "euiColorPrimary": "#0B64DD",
+  "euiColorAccent": "#BC1E70",
+  "euiColorAccentSecondary": "#008B87",
+  "euiColorSuccess": "#008A5E",
+  "euiColorWarning": "#FACB3D",
+  "euiColorDanger": "#C61E25",
+  "euiColorEmptyShade": "#FFFFFF",
+  "euiColorLightestShade": "#ECF1F9",
+  "euiColorLightShade": "#CAD3E2",
+  "euiColorMediumShade": "#8E9FBC",
+  "euiColorDarkShade": "#5A6D8C",
+  "euiColorDarkestShade": "#2B394F",
+  "euiColorFullShade": "#07101F",
+  "euiPageBackgroundColor": "#F6F9FC",
+  "euiColorHighlight": "#E8F1FF",
+  "euiTextColor": "#1D2A3E",
+  "euiTitleColor": "#111C2C",
+  "euiTextSubduedColor": "#516381",
+  "euiColorDisabled": "#E3E8F2",
+  "euiColorPrimaryText": "#1750BA",
+  "euiColorSuccessText": "#09724D",
+  "euiColorAccentText": "#A11262",
+  "euiColorWarningText": "#6A4906",
+  "euiColorDangerText": "#A71627",
+  "euiColorDisabledText": "#798EAF",
+  "euiLinkColor": "#0B64DD",
+  "euiColorPlainLight": "#FFFFFF",
+  "euiColorPlainDark": "#07101F",
+  "euiColorTextPrimary": "#1750BA",
+  "euiColorTextAccent": "#A11262",
+  "euiColorTextAccentSecondary": "#047471",
+  "euiColorTextNeutral": "#0F658A",
+  "euiColorTextSuccess": "#09724D",
+  "euiColorTextWarning": "#6A4906",
+  "euiColorTextRisk": "#9E3A16",
+  "euiColorTextDanger": "#A71627",
+  "euiColorTextParagraph": "#1D2A3E",
+  "euiColorTextHeading": "#111C2C",
+  "euiColorTextSubdued": "#516381",
+  "euiColorTextDisabled": "#798EAF",
+  "euiColorTextInverse": "#FFFFFF",
+  "euiColorBackgroundBasePrimary": "#E8F1FF",
+  "euiColorBackgroundBaseAccent": "#FFEBF5",
+  "euiColorBackgroundBaseAccentSecondary": "#E2F9F7",
+  "euiColorBackgroundBaseNeutral": "#E5F6FA",
+  "euiColorBackgroundBaseSuccess": "#E2F8F0",
+  "euiColorBackgroundBaseWarning": "#FDF3D8",
+  "euiColorBackgroundBaseRisk": "#FFEDD6",
+  "euiColorBackgroundBaseDanger": "#FFE8E5",
+  "euiColorBackgroundBaseSubdued": "#F6F9FC",
+  "euiColorBackgroundBasePlain": "#FFFFFF",
+  "euiColorBackgroundBaseDisabled": "#ECF1F9",
+  "euiColorBackgroundBaseHighlighted": "#F6F9FC",
+  "euiColorBackgroundBaseFormsPrepend": "#ECF1F9",
+  "euiColorBackgroundBaseFormsControlDisabled": "#CAD3E2",
+  "euiColorBackgroundBaseInteractiveHover": "rgba(23,80,186, 0.04)",
+  "euiColorBackgroundBaseInteractiveSelect": "#E8F1FF",
+  "euiColorBackgroundBaseInteractiveOverlay": "rgba(72,89,117, 0.7)",
+  "euiColorBackgroundBaseSkeletonEdge": "rgba(72,89,117, 0.16)",
+  "euiColorBackgroundBaseSkeletonMiddle": "rgba(72,89,117, 0.04)",
+  "euiColorBackgroundLightPrimary": "#D9E8FF",
+  "euiColorBackgroundLightAccent": "#FDDDE9",
+  "euiColorBackgroundLightAccentSecondary": "#C9F3F0",
+  "euiColorBackgroundLightNeutral": "#CFEEF7",
+  "euiColorBackgroundLightSuccess": "#C9F3E3",
+  "euiColorBackgroundLightWarning": "#FDE9B5",
+  "euiColorBackgroundLightRisk": "#FFDEBF",
+  "euiColorBackgroundLightDanger": "#FDDDD8",
+  "euiColorBackgroundLightText": "#E3E8F2",
+  "euiColorBackgroundFilledPrimary": "#0B64DD",
+  "euiColorBackgroundFilledAccent": "#BC1E70",
+  "euiColorBackgroundFilledAccentSecondary": "#008B87",
+  "euiColorBackgroundFilledNeutral": "#1C8CB5",
+  "euiColorBackgroundFilledSuccess": "#008A5E",
+  "euiColorBackgroundFilledWarning": "#FACB3D",
+  "euiColorBackgroundFilledRisk": "#ED6723",
+  "euiColorBackgroundFilledDanger": "#C61E25",
+  "euiColorBackgroundFilledText": "#5A6D8C",
+  "euiColorBorderBasePrimary": "#BFDBFF",
+  "euiColorBorderBaseAccent": "#FFC7DB",
+  "euiColorBorderBaseAccentSecondary": "#A6EDEA",
+  "euiColorBorderBaseNeutral": "#B5E5F2",
+  "euiColorBorderBaseSuccess": "#AEE8D2",
+  "euiColorBorderBaseWarning": "#FCD883",
+  "euiColorBorderBaseRisk": "#FFCDA1",
+  "euiColorBorderBaseDanger": "#FFC9C2",
+  "euiColorBorderBasePlain": "#CAD3E2",
+  "euiColorBorderBaseSubdued": "#E3E8F2",
+  "euiColorBorderBaseDisabled": "#CAD3E2",
+  "euiColorBorderBaseFloating": "transparent",
+  "euiColorBorderBaseFormsColorSwatch": "rgba(72,89,117, 0.24)",
+  "euiColorBorderBaseFormsControl": "#8E9FBC",
+  "euiColorBorderStrongPrimary": "#1750BA",
+  "euiColorBorderStrongAccent": "#A11262",
+  "euiColorBorderStrongAccentSecondary": "#047471",
+  "euiColorBorderStrongNeutral": "#0F658A",
+  "euiColorBorderStrongSuccess": "#09724D",
+  "euiColorBorderStrongWarning": "#825803",
+  "euiColorBorderStrongRisk": "#9E3A16",
+  "euiColorBorderStrongDanger": "#A71627"
+}

package/optimize/es/components/badge/color_utils.js

@@ -27,7 +27,6 @@ export var euiBadgeColors = function euiBadgeColors(euiThemeContext) {
     risk: euiButtonFillColor(euiThemeContext, 'risk'),
     danger: euiButtonFillColor(euiThemeContext, 'danger'),
     accent: euiButtonFillColor(euiThemeContext, 'accent'),
-    accentSecondary: euiButtonFillColor(euiThemeContext, 'accentSecondary'),
     disabled: _objectSpread(_objectSpread({}, euiButtonColor(euiThemeContext, 'disabled')), {}, {
       borderColor: highContrastMode ? euiTheme.colors.textDisabled : ''
     }),
@@ -45,8 +44,7 @@ export var euiBadgeColors = function euiBadgeColors(euiThemeContext) {
     }),
     accentText: _objectSpread(_objectSpread({}, badgeColorsAccentText), {}, {
       borderColor: highContrastMode ? badgeColorsAccentText.backgroundColor : ''
-    }),
-    accentSecondaryText: getBadgeColors(euiThemeContext, euiTheme.colors.textAccentSecondary)
+    })
   };
 };
 export var getBadgeColors = function getBadgeColors(euiThemeContext, backgroundColor) {

package/optimize/es/components/badge/notification_badge/badge_notification.styles.js

@@ -9,12 +9,17 @@
 import { css } from '@emotion/react';
 import { logicalCSS, euiCanAnimate, euiFontSizeFromScale, euiNumberFormat, mathWithUnits } from '../../../global_styling';
 import { highContrastModeStyles } from '../../../global_styling/functions/high_contrast';
+import { isEuiThemeRefreshVariant } from '../../../services';
 import { euiBadgeColors } from '../color_utils';
 export var euiNotificationBadgeStyles = function euiNotificationBadgeStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
+  var isRefreshVariant = isEuiThemeRefreshVariant(euiThemeContext, 'buttonVariant');
   var badgeColors = euiBadgeColors(euiThemeContext);
+  var borderRadius = isRefreshVariant ? mathWithUnits(euiTheme.border.radius.small, function (x) {
+    return x / 2;
+  }) : euiTheme.border.radius.small;
   return {
-    euiNotificationBadge: /*#__PURE__*/css("flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;", logicalCSS('padding-horizontal', euiTheme.size.xs), " border-radius:", euiTheme.border.radius.small, ";", highContrastModeStyles(euiThemeContext, {
+    euiNotificationBadge: /*#__PURE__*/css("flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;", logicalCSS('padding-horizontal', euiTheme.size.xs), " border-radius:", borderRadius, ";", highContrastModeStyles(euiThemeContext, {
       preferred: "\n          border: ".concat(euiTheme.border.thin, ";\n          overflow: hidden; /* Fix text clipping */\n        ")
     }), " cursor:default;font-size:", euiFontSizeFromScale('xs', euiTheme), ";font-weight:", euiTheme.font.weight.medium, ";", euiNumberFormat(euiThemeContext), " text-align:center;", euiCanAnimate, "{transition:all ", euiTheme.animation.fast, " ease-in;};label:euiNotificationBadge;"),
     // Sizes

package/optimize/es/components/breadcrumbs/_breadcrumb_content.styles.js

@@ -7,9 +7,8 @@
  */
 
 import { css } from '@emotion/react';
-import { euiFontSize, euiTextTruncate, euiFocusRing, logicalCSS, logicalBorderRadiusCSS, mathWithUnits } from '../../global_styling';
+import { euiFontSize, euiTextTruncate, euiFocusRing, logicalCSS, logicalBorderRadiusCSS, mathWithUnits, euiButtonColor } from '../../global_styling';
 import { highContrastModeStyles } from '../../global_styling/functions/high_contrast';
-import { euiButtonColor } from '../../themes/amsterdam/global_styling/mixins/button';
 
 /**
  * Styles cast to inner <a>, <button>, <span> elements
@@ -19,7 +18,11 @@ export var euiBreadcrumbContentStyles = function euiBreadcrumbContentStyles(euiT
     highContrastMode = euiThemeContext.highContrastMode;
 
   // Reuse button colors for `type="application`" clickable breadcrumbs
-  var applicationButtonColors = euiButtonColor(euiThemeContext, 'primary');
+  var buttonColors = euiButtonColor(euiThemeContext, 'primary');
+  var applicationButtonColors = {
+    backgroundColor: euiTheme.colors.backgroundLightPrimary,
+    color: buttonColors.color
+  };
 
   // Create custom darker gray colors for non-clickable application breadcrumbs
   // The numbers/ratios are fairly specific here to pass WCAG AA contrast minimums

package/optimize/es/components/button/button_display/_button_display.js

@@ -71,7 +71,7 @@ export var EuiButtonDisplay = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     isLoading: isLoading
   });
   var styles = useEuiMemoizedStyles(euiButtonDisplayStyles);
-  var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, minWidth == null && styles.defaultMinWidth, buttonIsDisabled && styles.isDisabled];
+  var cssStyles = [styles.euiButtonDisplay, styles[size], fullWidth && styles.fullWidth, minWidth == null && [styles.defaultMinWidth.defaultMinWidth, styles.defaultMinWidth[size]], buttonIsDisabled && styles.isDisabled];
   var innerNode = ___EmotionJSX(EuiButtonDisplayContent, _extends({
     isLoading: isLoading,
     isDisabled: buttonIsDisabled,

package/optimize/es/components/button/button_display/_button_display.styles.js

@@ -7,6 +7,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  * Side Public License, v 1.
  */
 import { css } from '@emotion/react';
+import { isEuiThemeRefreshVariant } from '../../../services';
 import { euiFontSize, logicalCSS, logicalShorthandCSS, logicalTextAlignCSS } from '../../../global_styling';
 import { euiButtonSizeMap } from '../../../global_styling/mixins';
 // Provides a solid reset and base for handling sizing layout
@@ -24,18 +25,26 @@ var _ref = process.env.NODE_ENV === "production" ? {
 };
 export var euiButtonDisplayStyles = function euiButtonDisplayStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
+  var isRefreshVariant = isEuiThemeRefreshVariant(euiThemeContext, 'buttonVariant');
   var sizes = euiButtonSizeMap(euiThemeContext);
   var _buttonSize = function _buttonSize(sizeKey) {
     var size = sizes[sizeKey];
     return /*#__PURE__*/css(logicalCSS('height', size.height), " line-height:", size.height, ";", euiFontSize(euiThemeContext, size.fontScale), " border-radius:", size.radius, ";");
   };
+  var classicVariantStyles = "\n      &:hover:not(:disabled),\n      &:focus {\n        text-decoration: underline;\n      }\n  ";
   return {
     // Base
-    euiButtonDisplay: /*#__PURE__*/css(euiButtonBaseCSS(), " font-weight:", euiTheme.font.weight.medium, ";", logicalShorthandCSS('padding', "0 ".concat(euiTheme.size.m)), " &:hover:not(:disabled),&:focus{text-decoration:underline;};label:euiButtonDisplay;"),
+    euiButtonDisplay: /*#__PURE__*/css(euiButtonBaseCSS(), " font-weight:", euiTheme.font.weight.medium, ";", logicalShorthandCSS('padding', "0 ".concat(euiTheme.size.m)), " ", !isRefreshVariant && classicVariantStyles, ";;label:euiButtonDisplay;"),
     // States
     isDisabled: _ref,
     fullWidth: /*#__PURE__*/css("display:block;", logicalCSS('width', '100%'), ";;label:fullWidth;"),
-    defaultMinWidth: /*#__PURE__*/css(logicalCSS('min-width', "".concat(euiTheme.base * 7, "px")), ";;label:defaultMinWidth;"),
+    defaultMinWidth: {
+      defaultMinWidth: /*#__PURE__*/css(";label:defaultMinWidth;"),
+      // Skip css`` for the sizes as we already add classes for sizes and defaultMinWidth
+      xs: "\n        ".concat(logicalCSS('min-width', "".concat(sizes.xs.minWidth, "px")), "\n      "),
+      s: "\n        ".concat(logicalCSS('min-width', "".concat(sizes.s.minWidth, "px")), "\n      "),
+      m: "\n        ".concat(logicalCSS('min-width', "".concat(sizes.m.minWidth, "px")), "\n      ")
+    },
     // Sizes
     xs: /*#__PURE__*/css(_buttonSize('xs'), ";label:xs;"),
     s: /*#__PURE__*/css(_buttonSize('s'), ";label:s;"),

package/optimize/es/components/button/button_display/_button_display_content.styles.js

@@ -6,11 +6,14 @@
  * Side Public License, v 1.
  */
 import { css } from '@emotion/react';
+import { isEuiThemeRefreshVariant } from '../../../services';
 import { logicalCSS } from '../../../global_styling';
-export var euiButtonDisplayContentStyles = function euiButtonDisplayContentStyles(_ref) {
-  var euiTheme = _ref.euiTheme;
+export var euiButtonDisplayContentStyles = function euiButtonDisplayContentStyles(euiThemeContext) {
+  var euiTheme = euiThemeContext.euiTheme;
+  var isRefreshVariant = isEuiThemeRefreshVariant(euiThemeContext, 'buttonVariant');
+  var refreshVariantStyles = "\n      /* ensure content stays ontop of hover pseudo element */\n      position: relative;\n    ";
   return {
     // Base
-    euiButtonDisplayContent: /*#__PURE__*/css(logicalCSS('height', '100%'), " ", logicalCSS('width', '100%'), " display:flex;justify-content:center;align-items:center;vertical-align:middle;gap:", euiTheme.size.s, ";;label:euiButtonDisplayContent;")
+    euiButtonDisplayContent: /*#__PURE__*/css(logicalCSS('height', '100%'), " ", logicalCSS('width', '100%'), " display:flex;justify-content:center;align-items:center;vertical-align:middle;gap:", euiTheme.size.s, ";", isRefreshVariant && refreshVariantStyles, ";;label:euiButtonDisplayContent;")
   };
 };

package/optimize/es/components/button/button_empty/button_empty.styles.js

@@ -1,4 +1,3 @@
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -8,32 +7,30 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  */
 
 import { css } from '@emotion/react';
-import { logicalCSS, logicalShorthandCSS, euiCanAnimate } from '../../../global_styling';
+import { isEuiThemeRefreshVariant } from '../../../services';
+import { logicalCSS, logicalShorthandCSS, euiCanAnimate, highContrastModeStyles } from '../../../global_styling';
 import { euiButtonDisplayStyles } from '../button_display/_button_display.styles';
-var _ref = process.env.NODE_ENV === "production" ? {
-  name: "1lywbid-flush",
-  styles: "padding-inline:0;label:flush;"
-} : {
-  name: "1lywbid-flush",
-  styles: "padding-inline:0;label:flush;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
 export var euiButtonEmptyStyles = function euiButtonEmptyStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
+  var isRefreshVariant = isEuiThemeRefreshVariant(euiThemeContext, 'buttonVariant');
 
   // EuiButtonEmpty uses the same size/font styling as EuiButtonDisplay,
   // but does not share enough of the same colors/props to the point
   // of using the actual component - so we'll reuse its styles instead
   var displayStyles = euiButtonDisplayStyles(euiThemeContext);
+  var refreshFlushStyles = "\n      /* using duplicate selector to ensure specificity */\n      &&:hover,\n      &&:active {\n        background-color: transparent;\n\n        /* removes hover overlay */\n        &::before {\n          display: none;\n        }\n      }\n\n      &:hover:not(:disabled),\n      &:focus {\n        text-decoration: underline;\n\n        ".concat(highContrastModeStyles(euiThemeContext, {
+    forced: "\n            /* hides HCM hover border, flush buttons use text-decoration */\n            &::after {\n              display: none;\n            }\n          "
+  }), "\n      }\n  ");
   return {
     euiButtonEmpty: /*#__PURE__*/css(displayStyles.euiButtonDisplay, " ", logicalShorthandCSS('padding', "0 ".concat(euiTheme.size.s)), euiCanAnimate, "{transition-timing-function:ease-in;transition-duration:", euiTheme.animation.fast, ";};label:euiButtonEmpty;"),
     isDisabled: displayStyles.isDisabled,
     // Sizes
     xs: displayStyles.xs,
     s: displayStyles.s,
-    m: displayStyles.m,
+    // uses array here to prevent adding duplicate "m" classname partial
+    m: [displayStyles.m, isRefreshVariant && "\n        ".concat(logicalCSS('padding-horizontal', euiTheme.size.m), "\n      ")],
     // Flush sides
-    flush: _ref,
+    flush: /*#__PURE__*/css("padding-inline:0;", isRefreshVariant && refreshFlushStyles, ";;label:flush;"),
     left: /*#__PURE__*/css(logicalCSS('margin-right', euiTheme.size.s), ";;label:left;"),
     right: /*#__PURE__*/css(logicalCSS('margin-left', euiTheme.size.s), ";;label:right;"),
     both: /*#__PURE__*/css(";label:both;")

package/optimize/es/components/button/button_group/button_group.styles.js

@@ -8,6 +8,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  */
 
 import { css } from '@emotion/react';
+import { isEuiThemeRefreshVariant } from '../../../services';
 import { logicalCSS } from '../../../global_styling';
 import { highContrastModeStyles, preventForcedColors } from '../../../global_styling/functions/high_contrast';
 import { euiFormVariables } from '../../form/form.styles';
@@ -31,7 +32,7 @@ export var euiButtonGroupButtonsStyles = function euiButtonGroupButtonsStyles(eu
     borderColor = _euiFormVariables.borderColor;
   return {
     // Base
-    euiButtonGroup__buttons: /*#__PURE__*/css(logicalCSS('max-width', '100%'), " display:flex;;label:euiButtonGroup__buttons;"),
+    euiButtonGroup__buttons: /*#__PURE__*/css(logicalCSS('max-width', '100%'), " display:flex;align-items:center;;label:euiButtonGroup__buttons;"),
     fullWidth: /*#__PURE__*/css(logicalCSS('width', '100%'), " .euiButtonGroupButton,.euiButtonGroup__tooltipWrapper{flex:1;", logicalCSS('width', '100%'), ";};label:fullWidth;"),
     // Sizes
     m: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.medium, ";", _highContrastStyles(euiThemeContext), ";;label:m;"),
@@ -41,6 +42,7 @@ export var euiButtonGroupButtonsStyles = function euiButtonGroupButtonsStyles(eu
 };
 var _highContrastStyles = function _highContrastStyles(euiThemeContext, compressed) {
   var euiTheme = euiThemeContext.euiTheme;
+  var isRefreshVariant = isEuiThemeRefreshVariant(euiThemeContext, 'buttonVariant');
 
   // Account for buttons within tooltip wrappers in selectors
   var getButtonChildSelectors = function getButtonChildSelectors(selector) {
@@ -50,7 +52,7 @@ var _highContrastStyles = function _highContrastStyles(euiThemeContext, compress
     preferred: compressed ? "\n        .euiButtonGroupButton {\n          border: none;\n        }\n      " : // Conditionally unset the high contrast borders passed by `euiButtonColor` -
     // faux borders between selected/unselected buttons are rendered by pseudo elements,
     // and can flip colors depending on selected/unselected siblings
-    "\n        ".concat(getButtonChildSelectors(':not(:first-child, :last-child)'), " {\n          ").concat(logicalCSS('border-horizontal', 'none'), "\n        }\n        ").concat(getButtonChildSelectors(':first-child'), " {\n          ").concat(logicalCSS('border-right', 'none'), "\n        }\n        ").concat(getButtonChildSelectors(':last-child'), " {\n          ").concat(logicalCSS('border-left', 'none'), "\n        }\n      "),
-    forced: "\n      .euiButtonGroupButton-isSelected {\n        ".concat(preventForcedColors(euiThemeContext), "\n        color: ").concat(euiTheme.colors.emptyShade, ";\n        background-color: ").concat(euiTheme.colors.fullShade, ";\n      }\n\n      .euiButtonGroupButton[disabled] {\n        opacity: 0.5;\n      }\n    ")
+    "\n        ".concat(!isRefreshVariant && "\n              ".concat(getButtonChildSelectors(':not(:first-child, :last-child)'), " {\n                ").concat(logicalCSS('border-horizontal', 'none'), "\n              }\n              ").concat(getButtonChildSelectors(':first-child'), " {\n                ").concat(logicalCSS('border-right', 'none'), "\n              }\n              ").concat(getButtonChildSelectors(':last-child'), " {\n                ").concat(logicalCSS('border-left', 'none'), "\n              }\n            "), "\n      "),
+    forced: "\n      .euiButtonGroupButton-isSelected {\n        ".concat(preventForcedColors(euiThemeContext), "\n        color: ").concat(euiTheme.colors.emptyShade, ";\n        background-color: ").concat(euiTheme.colors.fullShade, ";\n\n        ").concat(isRefreshVariant && "\n              &:is(:hover, :focus):not(:disabled) {\n                &::before {\n                  border-color: ".concat(euiTheme.colors.textInverse, ";\n                }\n              }\n            "), "\n      }\n\n      .euiButtonGroupButton[disabled] {\n        opacity: 0.5;\n      }\n    ")
   });
 };