@elastic/eui 122.0.0 → 122.1.0

package/dist/svgs/table_sparkles.svg

@@ -1,6 +1,4 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
-  <path d="M14.5 13a.5.5 0 0 1 .5.5v.5h.5a.5.5 0 0 1 0 1H15v.5a.5.5 0 0 1-1 0V15h-.5a.5.5 0 0 1 0-1h.5v-.5a.5.5 0 0 1 .5-.5"/>
-  <path fill-rule="evenodd" d="M14 1a1 1 0 0 1 1 1v4.086a1.5 1.5 0 0 0-1 0V5H2v9h7.912q.057.159.077.331l.012.219q0 .023.004.047l.01.1q.004.053.015.104.022.102.057.199H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1zM2 4h12V2H2z" clip-rule="evenodd"/>
-  <path fill-rule="evenodd" d="M11.5 8a.5.5 0 0 1 .5.5 2.5 2.5 0 0 0 2 2.45v-.007q.174.037.356.05.071.006.144.007a.5.5 0 0 1 0 1q-.072 0-.144.007-.182.011-.356.048v-.005c-.98.199-1.751.97-1.95 1.95h.006a2.5 2.5 0 0 0-.056.5l-.01.1a.5.5 0 0 1-.98 0l-.01-.1-.013-.256a2.5 2.5 0 0 0-.221-.797l-.03-.065a3 3 0 0 0-.09-.161l-.015-.026-.08-.12-.049-.07-.085-.107-.042-.05-.1-.105-.052-.053-.096-.085q-.036-.032-.072-.061a2.6 2.6 0 0 0-.57-.34q-.048-.021-.098-.04-.05-.02-.1-.035l-.117-.037-.117-.029-.091-.02a3 3 0 0 0-.205-.03l-.019-.002A3 3 0 0 0 8.5 12a.5.5 0 0 1 0-1A2.5 2.5 0 0 0 11 8.5a.5.5 0 0 1 .5-.5m0 2.302c-.295.49-.707.903-1.198 1.198.49.295.903.707 1.198 1.197.295-.49.707-.902 1.197-1.197a3.5 3.5 0 0 1-1.197-1.198" clip-rule="evenodd"/>
-  <path d="M5 13H3v-1h2zm0-3H3V9h2zm3 0H6V9h2zm6.5-3a.5.5 0 0 1 .5.5V8h.5a.5.5 0 0 1 0 1H15v.5a.5.5 0 0 1-1 0V9h-.5a.5.5 0 0 1 0-1h.5v-.5a.5.5 0 0 1 .5-.5M5 7H3V6h2zm3 0H6V6h2zm5 0H9V6h4z"/>
+  <path fill-rule="evenodd" d="M13.995.95a1 1 0 0 1 1 1V10c-.156-.055-.509-.239-.688-.475a1.8 1.8 0 0 1-.316-.599l.004-3.977h-12v9h7.75c.037.106.101.395.128.528.027.132.047.355.047.472H1.995a1 1 0 0 1-1-1v-12a1 1 0 0 1 1-1zm-12 3h12v-2h-12z" clip-rule="evenodd"/>
+  <path d="M5 13H3v-1h2zm0-3H3V9h2zm3 0H6V9h2zM5 7H3V6h2zm3 0H6V6h2zm5 0H9V6h4zm-.5 1.501v.02l.005.093a3.8 3.8 0 0 0 .379 1.411c.19.379.466.742.87 1.011.402.268.96.463 1.747.463a.5.5 0 0 1 0 1c-.788 0-1.345.196-1.746.463-.405.27-.682.633-.87 1.012a3.8 3.8 0 0 0-.384 1.504l-.001.02v.002l-.01.1a.5.5 0 0 1-.98 0l-.01-.1v-.022l-.005-.093a4 4 0 0 0-.043-.35 3.8 3.8 0 0 0-.337-1.061 2.6 2.6 0 0 0-.87-1.012c-.4-.267-.958-.463-1.745-.463a.5.5 0 1 1 0-1c.787 0 1.344-.195 1.746-.463.404-.27.68-.632.869-1.01.19-.38.287-.767.337-1.062a4 4 0 0 0 .048-.442v-.023a.5.5 0 0 1 1 0zm-.5 1.99a3.56 3.56 0 0 1-1.2 1.377q-.102.07-.214.131.111.063.214.131c.573.382.951.887 1.2 1.378a3.57 3.57 0 0 1 1.413-1.509A3.57 3.57 0 0 1 12 10.49"/>
 </svg>

package/es/components/avatar/avatar.styles.js

@@ -58,7 +58,7 @@ export var euiAvatarStyles = function euiAvatarStyles(_ref7) {
   var euiTheme = _ref7.euiTheme;
   var borderRadius = {
     user: '50%',
-    space: euiTheme.border.radius.medium
+    space: euiTheme.border.radius.control
   };
   return {
     // Base

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

@@ -13,18 +13,16 @@ import { euiBadgeColors } from '../color_utils';
 export var euiNotificationBadgeStyles = function euiNotificationBadgeStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   var badgeColors = euiBadgeColors(euiThemeContext);
-  var borderRadius = mathWithUnits(euiTheme.border.radius.small, function (x) {
-    return x / 2;
+  var sizeM = mathWithUnits(euiTheme.size.xs, function (x) {
+    return x + euiTheme.base;
   });
   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:", borderRadius, ";", 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), " ", highContrastModeStyles(euiThemeContext, {
       preferred: "\n          border: ".concat(euiTheme.border.thin, ";\n          overflow: hidden; /* Fix text clipping */\n        ")
     }), " cursor:default;-webkit-text-fill-color:currentColor;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
-    s: /*#__PURE__*/css(logicalCSS('height', euiTheme.size.base), " ", logicalCSS('min-width', euiTheme.size.base), ";;label:s;"),
-    m: /*#__PURE__*/css(logicalCSS('height', mathWithUnits(euiTheme.size.xs, function (x) {
-      return x + euiTheme.base;
-    })), " ", logicalCSS('min-width', euiTheme.size.l), ";;label:m;"),
+    s: /*#__PURE__*/css(logicalCSS('height', euiTheme.size.base), " ", logicalCSS('min-width', euiTheme.size.base), " border-radius:", euiTheme.border.radius.inline, ";;label:s;"),
+    m: /*#__PURE__*/css(logicalCSS('height', sizeM), " ", logicalCSS('min-width', sizeM), " border-radius:", euiTheme.border.radius.control, ";;label:m;"),
     // Colors
     accent: /*#__PURE__*/css(badgeColors.accentText, ";label:accent;"),
     success: /*#__PURE__*/css(badgeColors.fill.success, ";label:success;"),

package/es/components/banner/banner.styles.js

@@ -42,7 +42,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
 export var euiBannerStyles = function euiBannerStyles(_ref3) {
   var euiTheme = _ref3.euiTheme;
   return {
-    euiBanner: /*#__PURE__*/css("container-name:", CONTAINER_NAME, ";container-type:inline-size;position:relative;border:", euiTheme.border.thin, ";border-radius:", euiTheme.border.radius.medium, ";&[data-size='s']{container-name:", CONTAINER_NAME, " ", CONTAINER_NAME, "--s;}&[data-size='m']{container-name:", CONTAINER_NAME, " ", CONTAINER_NAME, "--m;};label:euiBanner;"),
+    euiBanner: /*#__PURE__*/css("container-name:", CONTAINER_NAME, ";container-type:inline-size;position:relative;border:", euiTheme.border.thin, ";border-radius:", euiTheme.border.radius.panel, ";&[data-size='s']{container-name:", CONTAINER_NAME, " ", CONTAINER_NAME, "--s;}&[data-size='m']{container-name:", CONTAINER_NAME, " ", CONTAINER_NAME, "--m;};label:euiBanner;"),
     container: /*#__PURE__*/css("display:flex;flex-direction:column;align-items:stretch;gap:", euiTheme.size.m, ";padding-inline-start:", euiTheme.size.base, ";padding-inline-end:", euiTheme.size.base, ";[data-size='m'] &{padding-block:", euiTheme.size.base, ";}[data-size='s'] &{padding-block:", euiTheme.size.m, ";}", withContainerQuery({
       layout: 'narrow',
       styles: "\n        flex-direction: row;\n        align-items: flex-start;\n        gap: ".concat(euiTheme.size.base, ";\n      ")

package/es/components/basic_table/basic_table.js

@@ -1343,6 +1343,11 @@ EuiBasicTable.propTypes = {
       type: PropTypes.oneOfType([PropTypes.oneOf(["button"]), PropTypes.oneOf(["icon"]).isRequired]),
       /**
          * Defines the color of the button
+         * @default text
+         */
+      /**
+         * Defines the color of the button.
+         * @default text
          */
       color: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.func.isRequired]),
       /**

package/es/components/basic_table/basic_table.styles.js

@@ -26,7 +26,7 @@ export var euiBasicTableBodyLoading = function euiBasicTableBodyLoading(euiTheme
 export var euiBasicTableWrapperPanelledStyles = function euiBasicTableWrapperPanelledStyles(responsiveBreakpoint) {
   return function (theme) {
     var euiTheme = theme.euiTheme;
-    var styles = /*#__PURE__*/css("border:", euiTheme.border.thin, ";border-block-end-width:0;padding-block-start:", euiTheme.border.width.thin, ";border-radius:", euiTheme.border.radius.medium, ";.euiTable{border-radius:", euiTheme.border.radius.medium, ";}.", EUI_BASIC_TABLE_PANEL_CLASS_NAME, "+.euiBasicTable &{border-start-start-radius:0;border-start-end-radius:0;.euiTable{border-start-start-radius:0;border-start-end-radius:0;}}&:not(:last-child),&:has(+ .", EUI_BASIC_TABLE_PANEL_CLASS_NAME, "){border-end-start-radius:0;border-end-end-radius:0;.euiTable{border-end-start-radius:0;border-end-end-radius:0;}};label:styles;");
+    var styles = /*#__PURE__*/css("border:", euiTheme.border.thin, ";padding-block-start:", euiTheme.border.width.thin, ";border-radius:", euiTheme.border.radius.panel, ";&:not(:last-child){border-block-end-width:0;}.euiTable{border-radius:", euiTheme.border.radius.panel, ";}.", EUI_BASIC_TABLE_PANEL_CLASS_NAME, "+.euiBasicTable &{border-start-start-radius:0;border-start-end-radius:0;.euiTable,.euiTable__wrapper,.euiTableStickyHeader__container{border-start-start-radius:0;border-start-end-radius:0;}.euiTableHeaderCell[data-sticky='start']{border-start-start-radius:0;}.euiTableHeaderCell[data-sticky='end']{border-start-end-radius:0;}}&:not(:last-child),&:has(+ .", EUI_BASIC_TABLE_PANEL_CLASS_NAME, "){border-end-start-radius:0;border-end-end-radius:0;.euiTable{border-end-start-radius:0;border-end-end-radius:0;}.euiTableFooterCell{&[data-sticky='start'],&:first-child{border-end-start-radius:0;}&[data-sticky='end'],&:last-child{border-end-end-radius:0;}}}.euiTable__wrapper,.euiTableStickyHeader__container{border-start-start-radius:", euiTheme.border.radius.panel, ";border-start-end-radius:", euiTheme.border.radius.panel, ";}.euiTableHeaderCell{&[data-sticky='start']{border-start-start-radius:", euiTheme.border.radius.panel, ";}&[data-sticky='end']{border-start-end-radius:", euiTheme.border.radius.panel, ";}.euiTableCellContent{border-radius:inherit;}}.euiTableFooterCell{&[data-sticky='start'],&:first-child{border-end-start-radius:", euiTheme.border.radius.panel, ";}&[data-sticky='end'],&:last-child{border-end-end-radius:", euiTheme.border.radius.panel, ";}.euiTableCellContent{border-radius:inherit;}};label:styles;");
     if (responsiveBreakpoint === true) {
       return null;
     }

package/es/components/basic_table/default_item_action.js

@@ -26,7 +26,7 @@ export var DefaultItemAction = function DefaultItemAction(_ref) {
     event.persist(); // TODO: Remove once React 16 support is dropped
     action.onClick(item, event);
   }, [action.onClick, item]);
-  var color = action.color ? callWithItemIfFunction(item)(action.color) : 'primary';
+  var color = action.color ? callWithItemIfFunction(item)(action.color) : 'text';
   var icon = action.icon ? callWithItemIfFunction(item)(action.icon) : undefined;
   var actionContent = callWithItemIfFunction(item)(action.name);
   var tooltipContent = callWithItemIfFunction(item)(action.description);

package/es/components/basic_table/in_memory_table.js

@@ -843,6 +843,11 @@ EuiInMemoryTable.propTypes = {
       type: PropTypes.oneOfType([PropTypes.oneOf(["button"]), PropTypes.oneOf(["icon"]).isRequired]),
       /**
          * Defines the color of the button
+         * @default text
+         */
+      /**
+         * Defines the color of the button.
+         * @default text
          */
       color: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.func.isRequired]),
       /**

package/es/components/basic_table/pagination_bar.styles.js

@@ -16,6 +16,6 @@ export var euiBasicTablePaginationBarStyles = function euiBasicTablePaginationBa
   var euiTheme = theme.euiTheme;
   return {
     root: /*#__PURE__*/css(logicalShorthandCSS('padding', "".concat(euiTheme.size.xs, " ").concat(euiTheme.size.s)), ";;label:root;"),
-    panelled: /*#__PURE__*/css("background:", euiTheme.colors.backgroundBaseSubdued, ";border:", euiTheme.border.thin, ";border-block-start-width:0;", logicalShorthandCSS('border-radius', "0 0 ".concat(euiTheme.border.radius.medium, " ").concat(euiTheme.border.radius.medium)), ";;label:panelled;")
+    panelled: /*#__PURE__*/css("background:", euiTheme.colors.backgroundBaseSubdued, ";border:", euiTheme.border.thin, ";border-block-start-width:0;", logicalShorthandCSS('border-radius', "0 0 ".concat(euiTheme.border.radius.panel, " ").concat(euiTheme.border.radius.panel)), ";;label:panelled;")
   };
 };

package/es/components/basic_table/panel.styles.js

@@ -10,5 +10,5 @@ import { css } from '@emotion/react';
 import { logicalShorthandCSS } from '../../global_styling';
 export var euiBasicTablePanelStyles = function euiBasicTablePanelStyles(_ref) {
   var euiTheme = _ref.euiTheme;
-  return /*#__PURE__*/css("background-color:", euiTheme.colors.backgroundBaseSubdued, ";border:", euiTheme.border.thin, ";border-block-end-width:0;", logicalShorthandCSS('border-radius', "".concat(euiTheme.border.radius.medium, " ").concat(euiTheme.border.radius.medium, " 0 0")), "&+&{border-start-start-radius:0;border-start-end-radius:0;};label:euiBasicTablePanelStyles;");
+  return /*#__PURE__*/css("background-color:", euiTheme.colors.backgroundBaseSubdued, ";border:", euiTheme.border.thin, ";border-block-end-width:0;", logicalShorthandCSS('border-radius', "".concat(euiTheme.border.radius.panel, " ").concat(euiTheme.border.radius.panel, " 0 0")), "&+&{border-start-start-radius:0;border-start-end-radius:0;};label:euiBasicTablePanelStyles;");
 };

package/es/components/breadcrumbs/_breadcrumb_content.js

@@ -213,11 +213,14 @@ EuiBreadcrumbContent.propTypes = {
     panelProps: PropTypes.shape({
       element: PropTypes.oneOf(["div"]),
       /**
-         * Padding for all four sides
+         * Padding for all four sides.
+         * Do not use `xs` and `xl` values, they will be removed in the future.
+         * @default m
          */
       paddingSize: PropTypes.any,
       /**
-         * Corner border radius
+         * Corner border radius.
+         * @default m
          */
       borderRadius: PropTypes.any,
       /**

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

@@ -47,19 +47,19 @@ export var euiBreadcrumbContentStyles = function euiBreadcrumbContentStyles(euiT
       return x * 10;
     })), ";;label:isTruncated;"),
     isTruncatedLast: /*#__PURE__*/css(euiTextTruncate('none'), ";;label:isTruncatedLast;"),
-    isInteractive: /*#__PURE__*/css("&:not(:disabled){text-decoration:underline;&[class*='euiLink-subdued']{&:hover,&:focus{color:", euiTheme.colors.textParagraph, ";}}};label:isInteractive;"),
+    isInteractive: /*#__PURE__*/css("&:where(:not(:disabled)){text-decoration:underline dotted;&[class*='euiLink-subdued']{&:hover,&:focus{color:", euiTheme.colors.textPrimary, ";}}};label:isInteractive;"),
     // Types
     page: /*#__PURE__*/css("&:is(a):focus{", euiFocusRing(euiThemeContext, 'inset'), ";}&:is(button):focus{", euiFocusRing(euiThemeContext, 'center'), ";};label:page;"),
     application: /*#__PURE__*/css(euiFontSize(euiThemeContext, 'xs'), " font-weight:", euiTheme.font.weight.medium, ";background-color:", applicationTextColors.backgroundColor, ";", highContrastModeStyles(euiThemeContext, {
       preferred: "border: ".concat(euiTheme.border.width.thin, " solid currentColor;")
-    }), " color:", applicationTextColors.color, ";line-height:", euiTheme.size.base, ";", logicalCSS('padding-vertical', euiTheme.size.xs), " ", logicalCSS('padding-horizontal', euiTheme.size.base), " &:is(a, button){background-color:", applicationButtonColors.backgroundColor, ";color:", applicationButtonColors.color, ";}&:focus{", euiFocusRing(euiThemeContext, 'inset'), ";}&:focus-visible{border-radius:", euiTheme.border.radius.medium, ";clip-path:none;.euiBreadcrumb:has(&){z-index:2;", highContrastModeStyles(euiThemeContext, {
+    }), " color:", applicationTextColors.color, ";line-height:", euiTheme.size.base, ";", logicalCSS('padding-vertical', euiTheme.size.xs), " ", logicalCSS('padding-horizontal', euiTheme.size.base), " &:is(a, button){background-color:", applicationButtonColors.backgroundColor, ";color:", applicationButtonColors.color, ";text-decoration:none;}&:focus{", euiFocusRing(euiThemeContext, 'inset'), ";}&:focus-visible{border-radius:", euiTheme.border.radius.control, ";clip-path:none;.euiBreadcrumb:has(&){z-index:2;", highContrastModeStyles(euiThemeContext, {
       preferred: 'filter: none;'
     }), ";}};label:application;"),
     applicationStyles: {
-      onlyChild: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.medium, ";", logicalCSS('padding-horizontal', euiTheme.size.m), ";;label:onlyChild;"),
-      firstChild: /*#__PURE__*/css(logicalBorderRadiusCSS("".concat(euiTheme.border.radius.medium, " 0 0 ").concat(euiTheme.border.radius.medium), true), " clip-path:polygon(\n          0 0,\n          calc(100% - ", euiTheme.size.s, ") 0,\n          100% 50%,\n          calc(100% - ", euiTheme.size.s, ") 100%,\n          0 100%\n        );", logicalCSS('padding-left', euiTheme.size.m), " ", applicationHighContrastArrow, ";;label:firstChild;"),
+      onlyChild: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.control, ";", logicalCSS('padding-horizontal', euiTheme.size.m), ";;label:onlyChild;"),
+      firstChild: /*#__PURE__*/css(logicalBorderRadiusCSS("".concat(euiTheme.border.radius.control, " 0 0 ").concat(euiTheme.border.radius.control), true), " clip-path:polygon(\n          0 0,\n          calc(100% - ", euiTheme.size.s, ") 0,\n          100% 50%,\n          calc(100% - ", euiTheme.size.s, ") 100%,\n          0 100%\n        );", logicalCSS('padding-left', euiTheme.size.m), " ", applicationHighContrastArrow, ";;label:firstChild;"),
       intermediateChild: "\n        clip-path: polygon(\n          0 0,\n          calc(100% - ".concat(euiTheme.size.s, ") 0,\n          100% 50%,\n          calc(100% - ").concat(euiTheme.size.s, ") 100%,\n          0 100%,\n          ").concat(euiTheme.size.s, " 50%\n        );\n        ").concat(applicationHighContrastArrow, "\n      "),
-      lastChild: /*#__PURE__*/css(logicalBorderRadiusCSS("0 ".concat(euiTheme.border.radius.medium, " ").concat(euiTheme.border.radius.medium, " 0"), true), " clip-path:polygon(\n          0 0,\n          100% 0,\n          100% 100%,\n          0 100%,\n          ", euiTheme.size.s, " 50%\n        );", logicalCSS('padding-right', euiTheme.size.m), ";;label:lastChild;")
+      lastChild: /*#__PURE__*/css(logicalBorderRadiusCSS("0 ".concat(euiTheme.border.radius.control, " ").concat(euiTheme.border.radius.control, " 0"), true), " clip-path:polygon(\n          0 0,\n          100% 0,\n          100% 100%,\n          0 100%,\n          ", euiTheme.size.s, " 50%\n        );", logicalCSS('padding-right', euiTheme.size.m), ";;label:lastChild;")
     }
   };
 };

package/es/components/breadcrumbs/breadcrumb.styles.js

@@ -14,11 +14,11 @@ import { logicalCSS } from '../../global_styling';
  * Styles cast to <li> element
  */
 var _ref = process.env.NODE_ENV === "production" ? {
-  name: "1k7t4ns-isCollapsed",
-  styles: "flex-shrink:0;label:isCollapsed;"
+  name: "rcrisn-isCollapsed",
+  styles: "flex-shrink:0;.euiLink{text-decoration:none;};label:isCollapsed;"
 } : {
-  name: "1k7t4ns-isCollapsed",
-  styles: "flex-shrink:0;label:isCollapsed;",
+  name: "rcrisn-isCollapsed",
+  styles: "flex-shrink:0;.euiLink{text-decoration:none;};label:isCollapsed;",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
 var _ref2 = process.env.NODE_ENV === "production" ? {

package/es/components/breadcrumbs/breadcrumbs.js

@@ -223,11 +223,14 @@ EuiBreadcrumbs.propTypes = {
       panelProps: PropTypes.shape({
         element: PropTypes.oneOf(["div"]),
         /**
-           * Padding for all four sides
+           * Padding for all four sides.
+           * Do not use `xs` and `xl` values, they will be removed in the future.
+           * @default m
            */
         paddingSize: PropTypes.any,
         /**
-           * Corner border radius
+           * Corner border radius.
+           * @default m
            */
         borderRadius: PropTypes.any,
         /**

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

@@ -66,7 +66,8 @@ export var EuiButtonDisplay = /*#__PURE__*/forwardRef(function (_ref2, ref) {
     isLoading = _ref2.isLoading,
     isSelected = _ref2.isSelected,
     fullWidth = _ref2.fullWidth,
-    minWidth = _ref2.minWidth,
+    _ref2$minWidth = _ref2.minWidth,
+    minWidth = _ref2$minWidth === void 0 ? false : _ref2$minWidth,
     contentProps = _ref2.contentProps,
     textProps = _ref2.textProps,
     href = _ref2.href,

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

@@ -41,7 +41,7 @@ export var euiButtonGroupButtonsStyles = function euiButtonGroupButtonsStyles(eu
       })
     },
     radius: {
-      outer: euiTheme.border.radius.medium,
+      outer: euiTheme.border.radius.control,
       inner: buttonSizeMap.s.radiusInset
     },
     size: {
@@ -65,7 +65,7 @@ export var euiButtonGroupButtonsStyles = function euiButtonGroupButtonsStyles(eu
   var segmentedChildrenStyles = "\n    /* Buttons are used inset and shouldn't have their own borders */\n    .euiButton,\n    .euiButtonIcon {\n      border: none;\n      pointer-events: auto; /* Ensure buttons are still clickable in jsdom */\n\n      &::before {\n        border-radius: inherit;\n      }\n\n      &:focus-visible {\n        outline-offset: 0;\n      }\n    }\n\n    /* Adjust children for inset behavior */\n    ".concat(buttonItemSelector, ",\n    .euiButtonIcon {\n      display: inline-flex;\n      align-items: center;\n      block-size: var(--euiButtonGroupButtonInsetSize);\n      border-radius: ").concat(buttonGroupVariables.radius.inner, ";\n    }\n\n    .euiButtonIcon {\n      inline-size: var(--euiButtonGroupButtonInsetSize);\n    }\n\n    /* Only non-icon buttons auto-grow/shrink */\n    .euiButton,\n    ").concat(buttonOnlyItemSelector, " {\n      flex: 1;\n      min-inline-size: auto;\n    }\n  ");
   return {
     // Base
-    euiButtonGroup__container: /*#__PURE__*/css("&:where(", segmentedStyledSelector, " &){position:relative;display:inline-flex;align-items:center;max-inline-size:100%;z-index:", euiTheme.levels.content, ";padding:", splitPadding, ";border-radius:", buttonGroupVariables.radius.outer, ";background-color:", euiTheme.colors.backgroundBasePlain, ";", containerBorderStyles, ";&:where([data-size='s'] &){--euiButtonGroupButtonInsetSize:", buttonGroupVariables.size.s, ";min-block-size:", buttonSizeMap.s.height, ";}&:where([data-size='m'] &){--euiButtonGroupButtonInsetSize:", buttonGroupVariables.size.m, ";min-block-size:", buttonSizeMap.m.height, ";}}&:where([data-variant='selection'][data-display='inverse'] &){background-color:", euiTheme.colors.backgroundBaseSubdued, ";};label:euiButtonGroup__container;"),
+    euiButtonGroup__container: /*#__PURE__*/css("&:where(", segmentedStyledSelector, " &){position:relative;display:inline-flex;align-items:center;max-inline-size:100%;z-index:", euiTheme.levels.content, ";padding:", splitPadding, ";border-radius:", buttonGroupVariables.radius.outer, ";background-color:", buttonGroupVariables.backgroundColor, ";", containerBorderStyles, ";&:where([data-size='s'] &){--euiButtonGroupButtonInsetSize:", buttonGroupVariables.size.s, ";min-block-size:", buttonSizeMap.s.height, ";}&:where([data-size='m'] &){--euiButtonGroupButtonInsetSize:", buttonGroupVariables.size.m, ";min-block-size:", buttonSizeMap.m.height, ";}}&:where([data-variant='selection'][data-display='inverse'] &){background-color:", euiTheme.colors.backgroundBaseSubdued, ";};label:euiButtonGroup__container;"),
     euiButtonGroup__buttons: /*#__PURE__*/css(logicalCSS('max-width', '100%'), " display:flex;align-items:center;z-index:", euiTheme.levels.content, ";&:where(.euiButtonGroup:not([data-variant]) &){", containerCommonStyles, " padding:", containerPadding, ";border-radius:", buttonGroupVariables.radius.outer, ";background-color:", euiTheme.colors.backgroundBasePlain, ";", containerBorderStyles, ";}&:where([data-variant='default'] &){flex-wrap:wrap;}&:where(", segmentedStyledSelector, " &){flex-wrap:wrap;", containerCommonStyles, " ", segmentedChildrenStyles, " *:where(.euiButton, .euiButtonIcon){&:where(:is(", euiDisabledSelector, "):not([aria-pressed='true'])){background-color:transparent;}}&:where([data-dividers='true'] &){", dividerStyles, ";}&:where([data-layout='vertical'] &){flex-direction:column;.euiButtonGroup__item{justify-content:center;}}}&:where([data-variant='segmented'] &){*:where(.euiButton, .euiButtonIcon):is(", euiDisabledSelector, "){background-color:transparent;}}&:where([data-variant='selection'] &){*:where(.euiButton, .euiButtonIcon){&:is(", euiDisabledSelector, "){", highContrastModeStyles(euiThemeContext, {
       forced: "\n              opacity: 0.5;\n            "
     }), ";}&:is([aria-pressed='true']){", highContrastModeStyles(euiThemeContext, {

package/es/components/button/split_button/split_button.styles.js

@@ -15,10 +15,10 @@ export var euiSplitButtonStyles = function euiSplitButtonStyles(euiThemeContext,
   var euiTheme = euiThemeContext.euiTheme;
   var buttonSizeMap = euiButtonSizeMap(euiThemeContext);
   var borderStyles = function borderStyles(color) {
-    return "\n    &::after {\n      content: '';\n      position: absolute;\n      inset: 0;\n      border: ".concat(euiTheme.border.width.thin, " solid ").concat(color, ";\n      border-radius: ").concat(euiTheme.border.radius.small, ";\n      pointer-events: none;\n    }\n  ");
+    return "\n    &::after {\n      content: '';\n      position: absolute;\n      inset: 0;\n      border: ".concat(euiTheme.border.width.thin, " solid ").concat(color, ";\n      border-radius: ").concat(euiTheme.border.radius.control, ";\n      pointer-events: none;\n    }\n  ");
   };
   return {
-    euiSplitButton: /*#__PURE__*/css("position:relative;display:inline-flex;align-items:center;flex-wrap:nowrap;max-inline-size:fit-content;padding:", euiTheme.size.xs, ";border-radius:", euiTheme.border.radius.small, ";background-color:", backgroundColor, ";&:where([data-size='s']){block-size:", buttonSizeMap.s.height, ";}&:where([data-size='m']){block-size:", buttonSizeMap.m.height, ";}&:where(", hasAllDisabledActionsSelector, "){background-color:", euiTheme.colors.backgroundBaseDisabled, ";};label:euiSplitButton;"),
+    euiSplitButton: /*#__PURE__*/css("position:relative;display:inline-flex;align-items:center;flex-wrap:nowrap;max-inline-size:fit-content;padding:", euiTheme.size.xs, ";border-radius:", euiTheme.border.radius.control, ";background-color:", backgroundColor, ";&:where([data-size='s']){block-size:", buttonSizeMap.s.height, ";}&:where([data-size='m']){block-size:", buttonSizeMap.m.height, ";}&:where(", hasAllDisabledActionsSelector, "){background-color:", euiTheme.colors.backgroundBaseDisabled, ";};label:euiSplitButton;"),
     hasBorder: /*#__PURE__*/css(highContrastModeStyles(euiThemeContext, {
       none: "\n          &:where(:not([data-fill])):not(".concat(hasAllDisabledActionsSelector, ") {\n            ").concat(borderStyles("var(--euiSplitButtonBorderColor)"), "\n          }\n        "),
       preferred: "\n          &:where(:not([data-fill])) {\n            ".concat(borderStyles("var(--euiSplitButtonBorderColor)"), "\n\n            &:where(").concat(hasAllDisabledActionsSelector, ") {\n              ").concat(borderStyles(euiTheme.colors.borderBaseDisabled), "\n            }\n          }\n\n          &:where([data-fill]").concat(hasAllDisabledActionsSelector, ") {\n            ").concat(borderStyles(euiTheme.colors.borderBaseDisabled), "\n          }\n        "),

package/es/components/call_out/call_out.styles.js

@@ -11,14 +11,15 @@ import { logicalCSS, logicalShorthandCSS, mathWithUnits, preventForcedColors } f
 /** Maximum reading width for `text` and `children` slots. */
 var TEXT_MAX_WIDTH = 1200;
 export var euiCallOutStyles = function euiCallOutStyles(euiThemeContext) {
-  var euiTheme = euiThemeContext.euiTheme;
+  var euiTheme = euiThemeContext.euiTheme,
+    highContrastMode = euiThemeContext.highContrastMode;
   var paddingSizes = {
     s: euiTheme.size.m,
     m: euiTheme.size.base
   };
-  var borderRadius = euiTheme.border.radius.small;
+  var borderRadius = euiTheme.border.radius.panel;
   var highlightSize = mathWithUnits([euiTheme.border.width.thin, euiTheme.border.width.thick], function (x, y) {
-    return x + y;
+    return highContrastMode ? x * 2 + y : x + y;
   });
   var highlightOffset = euiTheme.border.width.thin;
   var highlightSizeOffset = mathWithUnits([highlightOffset], function (x) {
@@ -27,8 +28,11 @@ export var euiCallOutStyles = function euiCallOutStyles(euiThemeContext) {
   var separatorSize = mathWithUnits([euiTheme.size.s, euiTheme.size.xxs], function (x, y) {
     return x + y;
   });
+  var highlightClipSize = mathWithUnits([euiTheme.size.s, euiTheme.border.width.thin], function (x, y) {
+    return x + y;
+  });
   return {
-    euiCallOut: /*#__PURE__*/css("position:relative;display:flex;max-inline-size:100%;align-items:center;border:", euiTheme.border.width.thin, " solid;border-radius:", borderRadius, ";&:focus{outline-offset:2px;}&::before{content:'';position:absolute;inset-block-start:-", euiTheme.border.width.thin, ";inset-inline-start:-", euiTheme.border.width.thin, ";block-size:calc(100% + ", highlightSizeOffset, ");border-inline-start:", highlightSize, " solid var(--euiCallOutTypeColor);border-start-start-radius:", borderRadius, ";border-end-start-radius:", borderRadius, ";pointer-events:none;", preventForcedColors(euiThemeContext), ";}&:where([data-size='s']){", logicalShorthandCSS('padding', "".concat(paddingSizes.s, " ").concat(paddingSizes.m)), ";}&:where([data-size='m']){padding:", paddingSizes.m, ";};label:euiCallOut;"),
+    euiCallOut: /*#__PURE__*/css("position:relative;display:flex;max-inline-size:100%;align-items:center;border:", euiTheme.border.width.thin, " solid;border-radius:", borderRadius, ";&:focus{outline-offset:2px;}&::before{content:'';position:absolute;inset-block-start:-", highlightOffset, ";inset-inline-start:-", highlightOffset, ";block-size:calc(100% + ", highlightSizeOffset, ");inline-size:100%;border-radius:", borderRadius, ";border-inline-start:", highlightSize, " solid var(--euiCallOutTypeColor);clip-path:polygon(\n          0 0,\n          ", highlightClipSize, " 0,\n          ", highlightClipSize, " 100%,\n          0 100%\n        );pointer-events:none;", preventForcedColors(euiThemeContext), ";}[dir='rtl'] &::before{clip-path:polygon(\n          calc(100% - ", highlightClipSize, ") 0,\n          100% 0,\n          100% 100%,\n          calc(100% - ", highlightClipSize, ") 100%\n        );}&:where([data-size='s']){", logicalShorthandCSS('padding', "".concat(paddingSizes.s, " ").concat(paddingSizes.m)), ";}&:where([data-size='m']){padding:", paddingSizes.m, ";};label:euiCallOut;"),
     // handles content + actions layout
     wrapper: /*#__PURE__*/css("display:flex;flex-direction:column;inline-size:100%;&:where([data-size='s'] &){gap:", euiTheme.size.s, ";}&:where([data-size='m'] &){gap:", euiTheme.size.m, ";}&:where([data-layout='wide'] &){flex-direction:row;gap:", euiTheme.size.xxl, ";};label:wrapper;"),
     // handles icon + text layout

package/es/components/card/card.js

@@ -265,7 +265,7 @@ export var EuiCard = function EuiCard(_ref) {
     onClick: isClickable ? outerOnClick : undefined,
     color: isDisabled ? 'subdued' : display,
     hasShadow: isDisabled || display ? false : true,
-    hasBorder: display ? false : undefined,
+    hasBorder: false,
     paddingSize: paddingSize
   }, rest), ___EmotionJSX("div", {
     className: "euiCard__main",

package/es/components/card/card.styles.js

@@ -8,7 +8,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  */
 
 import { css } from '@emotion/react';
-import { euiPaddingSize, logicalCSS, logicals, logicalTextAlignCSS } from '../../global_styling';
+import { euiPaddingSize, logicalCSS, logicalTextAlignCSS } from '../../global_styling';
 import { euiButtonColor } from '../../global_styling/mixins';
 var paddingKey = 'm';
 var halfPaddingKey = 's';
@@ -99,8 +99,8 @@ export var euiCardStyles = function euiCardStyles(euiThemeContext, paddingSize)
       disabled: _ref2
     },
     image: {
-      euiCard__image: /*#__PURE__*/css("position:relative;overflow:hidden;", logicalCSS('width', "calc(100% + (".concat(paddingAmount, " * 2))")), " ", logicalCSS('left', "-".concat(paddingAmount)), " ", logicalCSS('top', "-".concat(paddingAmount)), logicalCSS('margin-bottom', "-".concat(paddingAmount)), logicalCSS('border-top-left-radius', "calc(".concat(euiTheme.border.radius.medium, " - ").concat(euiTheme.border.width.thin, ")")), " ", logicals['border-top-right-radius'], ":calc(", euiTheme.border.radius.medium, " - ", euiTheme.border.width.thin, ");img{", logicalCSS('width', '100%'), ";};label:euiCard__image;"),
-      transparent: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.medium, ";;label:transparent;")
+      euiCard__image: /*#__PURE__*/css("position:relative;overflow:hidden;", logicalCSS('width', "calc(100% + (".concat(paddingAmount, " * 2))")), " ", logicalCSS('left', "-".concat(paddingAmount)), " ", logicalCSS('top', "-".concat(paddingAmount)), logicalCSS('margin-bottom', "-".concat(paddingAmount)), logicalCSS('border-top-left-radius', "calc(".concat(euiTheme.border.radius.panel, ")")), " ", logicalCSS('border-top-right-radius', "calc(".concat(euiTheme.border.radius.panel, ")")), ";img{", logicalCSS('width', '100%'), ";};label:euiCard__image;"),
+      transparent: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.panel, ";;label:transparent;")
     },
     icon: {
       euiCard__icon: /*#__PURE__*/css(";label:euiCard__icon;"),

package/es/components/code/code.styles.js

@@ -27,7 +27,7 @@ export var euiCodeStyles = function euiCodeStyles(euiThemeContext) {
      */
     euiCode: /*#__PURE__*/css("font-family:", euiTheme.font.familyCode, ";font-size:0.9em;", logicalShorthandCSS('padding', '0.2em 0.5em'), "background-color:", codeSyntaxVariables.inlineBackgroundColor, ";", highContrastModeStyles(euiThemeContext, {
       forced: "\n          border: ".concat(euiTheme.border.thin, ";\n        ")
-    }), " border-radius:", euiTheme.border.radius.small, ";font-weight:", euiTheme.font.weight.bold, ";color:", codeSyntaxVariables.inlineCodeColor, ";", codeSyntaxVariables.tokensCss, " .token.atrule .token.rule,.token.keyword{color:", codeSyntaxVariables.inlineCodeKeywordColor, ";};label:euiCode;"),
+    }), " border-radius:", euiTheme.border.radius.inline, ";font-weight:", euiTheme.font.weight.bold, ";color:", codeSyntaxVariables.inlineCodeColor, ";", codeSyntaxVariables.tokensCss, " .token.atrule .token.rule,.token.keyword{color:", codeSyntaxVariables.inlineCodeKeywordColor, ";};label:euiCode;"),
     transparentBackground: _ref
   };
 };

package/es/components/code/code_block.styles.js

@@ -37,7 +37,7 @@ export var euiCodeBlockStyles = function euiCodeBlockStyles(euiThemeContext) {
   var codeSyntaxVariables = euiCodeSyntaxVariables(euiThemeContext);
   var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiCodeBlock: /*#__PURE__*/css("max-inline-size:100%;display:block;position:relative;background:", codeSyntaxVariables.backgroundColor, ";", highContrastModeStyles(euiThemeContext, {
+    euiCodeBlock: /*#__PURE__*/css("max-inline-size:100%;display:block;position:relative;border-radius:", euiTheme.border.radius.control, ";background:", codeSyntaxVariables.backgroundColor, ";", highContrastModeStyles(euiThemeContext, {
       preferred: "border: ".concat(euiTheme.border.thin, ";"),
       // Fix scrolling text occluding the border in Windows high contrast mode
       forced: 'overflow: hidden;'

package/es/components/color_picker/color_picker_swatch.styles.js

@@ -9,7 +9,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
 
 import { css } from '@emotion/react';
 import { transparentize } from '../../services';
-import { logicalSizeCSS, mathWithUnits, euiOutline } from '../../global_styling';
+import { logicalSizeCSS, euiOutline } from '../../global_styling';
 import { highContrastModeStyles, preventForcedColors } from '../../global_styling/functions/high_contrast';
 var _ref = process.env.NODE_ENV === "production" ? {
   name: "164u3xw-tooltip",
@@ -22,9 +22,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
 export var euiColorPickerSwatchStyles = function euiColorPickerSwatchStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiColorPickerSwatch: /*#__PURE__*/css("display:inline-block;", logicalSizeCSS(euiTheme.size.l), " border-radius:", mathWithUnits(euiTheme.border.radius.medium, function (x) {
-      return x / 2;
-    }), ";", highContrastModeStyles(euiThemeContext, {
+    euiColorPickerSwatch: /*#__PURE__*/css("display:inline-block;", logicalSizeCSS(euiTheme.size.l), " border-radius:", euiTheme.border.radius.inline, ";", highContrastModeStyles(euiThemeContext, {
       none: "\n          border: ".concat(euiTheme.border.width.thin, " solid\n            ").concat(euiTheme.colors.borderBaseFormsColorSwatch, ";\n          box-shadow: inset 0 0 0 ").concat(euiTheme.border.width.thin, "\n            ").concat(transparentize(euiTheme.colors.emptyShade, 0.05), ";\n        "),
       preferred: "border: ".concat(euiTheme.border.thin, ";"),
       forced: preventForcedColors(euiThemeContext)

package/es/components/color_picker/saturation.styles.js

@@ -12,7 +12,7 @@ import { highContrastModeStyles, preventForcedColors } from '../../global_stylin
 export var euiSaturationStyles = function euiSaturationStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   var indicatorSize = euiTheme.size.m;
-  var borderRadius = euiTheme.border.radius.small;
+  var borderRadius = euiTheme.border.radius.control;
   // Without this slight decrease in border radius, the color can be seen
   // peeking through the top left corner of the saturation gradient
   var gradientBorderRadius = mathWithUnits(borderRadius, function (x) {

package/es/components/comment_list/comment_event.js

@@ -53,7 +53,9 @@ export var EuiCommentEvent = function EuiCommentEvent(_ref) {
       color: type === 'custom' ? 'transparent' : eventColor,
       paddingSize: type === 'custom' ? 'none' : 's',
       borderRadius: type === 'regular' ? 'none' : 'm',
-      hasShadow: false // `plain` color needs this
+      hasShadow: false,
+      // `plain` color needs this
+      hasBorder: false
     };
   }, [type, eventColor]);
   var isFigure = isTypeRegular;

package/es/components/comment_list/comment_event.styles.js

@@ -22,7 +22,7 @@ export var euiCommentEventStyles = function euiCommentEventStyles(euiThemeContex
   var euiTheme = euiThemeContext.euiTheme;
   return {
     euiCommentEvent: _ref2,
-    border: /*#__PURE__*/css("border-width:", euiTheme.border.width.thin, ";border-style:solid;border-radius:", euiTheme.border.radius.medium, ";;label:border;")
+    border: /*#__PURE__*/css("border-width:", euiTheme.border.width.thin, ";border-style:solid;border-radius:", euiTheme.border.radius.panel, ";;label:border;")
   };
 };
 var _ref = process.env.NODE_ENV === "production" ? {

package/es/components/context_menu/context_menu.styles.js

@@ -21,7 +21,7 @@ export var euiContextMenuStyles = function euiContextMenuStyles(euiThemeContext)
   var _euiContextMenuVariab = euiContextMenuVariables(euiThemeContext),
     panelWidth = _euiContextMenuVariab.panelWidth;
   return {
-    euiContextMenu: /*#__PURE__*/css(logicalCSS('width', panelWidth), " ", logicalCSS('max-width', '100%'), " position:relative;overflow:hidden;border-radius:", euiTheme.border.radius.medium, ";", euiCanAnimate, "{transition:height ", euiTheme.animation.fast, " ", euiTheme.animation.resistance, ";};label:euiContextMenu;"),
+    euiContextMenu: /*#__PURE__*/css(logicalCSS('width', panelWidth), " ", logicalCSS('max-width', '100%'), " position:relative;overflow:hidden;border-radius:", euiTheme.border.radius.panel, ";", euiCanAnimate, "{transition:height ", euiTheme.animation.fast, " ", euiTheme.animation.resistance, ";};label:euiContextMenu;"),
     fixedHeight: /*#__PURE__*/css(".euiContextMenuPanel{display:flex;flex-direction:column;", logicalCSS('height', '100%'), ";}.euiContextMenuPanel__list{display:block;flex:1 1 0;", euiYScrollWithShadows(euiThemeContext, {
       hasAnimatedOverflowShadow: true
     }), ";};label:fixedHeight;")

package/es/components/datagrid/body/cell/data_grid_cell.styles.js

@@ -15,7 +15,7 @@ export var euiDataGridCellOutlineStyles = function euiDataGridCellOutlineStyles(
   var hoverColor = euiTheme.components.dataGridRowBorderHover;
   var markedColor = euiTheme.components.dataGridRowBorderMarked;
   var outlineWidth = euiTheme.border.width.thick;
-  var borderRadius = mathWithUnits(euiTheme.border.radius.medium, function (x) {
+  var borderRadius = mathWithUnits(euiTheme.border.radius.inline, function (x) {
     return x / 2;
   });
 

package/es/components/datagrid/body/cell/data_grid_cell_actions.js

@@ -52,10 +52,10 @@ export var EuiDataGridCellActions = function EuiDataGridCellActions(_ref) {
       }, ___EmotionJSX(EuiButtonIcon, {
         "aria-hidden": true,
         className: "euiDataGridRowCell__actionButtonIcon euiDataGridRowCell__expandCell",
-        color: "primary",
+        color: "text",
         css: styles.euiDataGridRowCell__actionButtonIcon,
         "data-test-subj": "euiDataGridCellExpandButton",
-        display: "fill",
+        display: "empty",
         iconSize: "s",
         iconType: "maximize",
         onClick: onExpandClick
@@ -73,8 +73,8 @@ export var EuiDataGridCellActions = function EuiDataGridCellActions(_ref) {
         ,
         size: "xs",
         iconSize: "s",
-        display: "fill",
-        color: "primary"
+        display: "empty",
+        color: "text"
       }));
     };
     var _getVisibleCellAction = getVisibleCellActions(column === null || column === void 0 ? void 0 : column.cellActions, column === null || column === void 0 ? void 0 : column.visibleCellActions),

package/es/components/date_picker/react_date_picker.styles.js

@@ -77,7 +77,7 @@ export var euiReactDatePickerStyles = function euiReactDatePickerStyles(euiTheme
     paddingSize = datePickerVars.paddingSize,
     headerOffset = datePickerVars.headerOffset;
   return {
-    euiReactDatePicker: /*#__PURE__*/css("display:flex;justify-content:center;padding:", paddingSize, ";font-size:", euiFontSize(euiThemeContext, 'xs').fontSize, ";color:", euiTheme.colors.textParagraph, ";border-radius:", euiTheme.border.radius.medium, ";&.react-datepicker--non-interactive{pointer-events:none;}.react-datepicker__focusTrap{display:flex;justify-content:center;gap:", paddingSize, ";}", euiMaxBreakpoint(euiThemeContext, 's'), "{&,.react-datepicker__focusTrap{flex-direction:column;}}.react-datepicker__header__dropdown{position:absolute;", logicalCSS('top', 0), " ", logicalCSS('horizontal', headerOffset), " padding:", paddingSize, ";display:flex;justify-content:center;gap:", gapSize, ";}.react-datepicker__navigation{z-index:1;position:absolute;", logicalCSS('top', paddingSize), "&:hover,&:focus{transform:none;}}.react-datepicker__navigation--previous{", logicalCSS('left', paddingSize), ";}.react-datepicker__navigation--next{", logicalCSS('right', paddingSize), ";}.react-datepicker__month-container{flex-grow:1;", logicalCSS('margin-top', headerOffset), ";}.react-datepicker__time-container{flex-grow:1;", logicalCSS('margin-top',
+    euiReactDatePicker: /*#__PURE__*/css("display:flex;justify-content:center;padding:", paddingSize, ";font-size:", euiFontSize(euiThemeContext, 'xs').fontSize, ";color:", euiTheme.colors.textParagraph, ";&.react-datepicker--non-interactive{pointer-events:none;}.react-datepicker__focusTrap{display:flex;justify-content:center;gap:", paddingSize, ";}", euiMaxBreakpoint(euiThemeContext, 's'), "{&,.react-datepicker__focusTrap{flex-direction:column;}}.react-datepicker__header__dropdown{position:absolute;", logicalCSS('top', 0), " ", logicalCSS('horizontal', headerOffset), " padding:", paddingSize, ";display:flex;justify-content:center;gap:", gapSize, ";}.react-datepicker__navigation{z-index:1;position:absolute;", logicalCSS('top', paddingSize), "&:hover,&:focus{transform:none;}}.react-datepicker__navigation--previous{", logicalCSS('left', paddingSize), ";}.react-datepicker__navigation--next{", logicalCSS('right', paddingSize), ";}.react-datepicker__month-container{flex-grow:1;", logicalCSS('margin-top', headerOffset), ";}.react-datepicker__time-container{flex-grow:1;", logicalCSS('margin-top',
     // The time select gets a little extra offset
     mathWithUnits([headerOffset, gapSize], function (x, y) {
       return x + y;
@@ -90,9 +90,9 @@ var _monthYearDropdowns = function _monthYearDropdowns(euiThemeContext, _ref) {
   var formStyles = euiFormControlStyles(euiThemeContext);
   return /*#__PURE__*/css(".react-datepicker__year-read-view,.react-datepicker__month-read-view,.react-datepicker__month-year-read-view{display:flex;justify-content:space-between;align-items:center;", formStyles.compressed, " ", euiFormControlText(euiThemeContext), " font-weight:", euiTheme.font.weight.medium, ";", euiFormControlDefaultShadow(euiThemeContext), " &:hover{cursor:pointer;text-decoration:underline;}}.react-datepicker__year-dropdown-container{position:relative;flex-grow:1;}.react-datepicker__month-dropdown-container{position:relative;flex-grow:2;}.react-datepicker__year-dropdown,.react-datepicker__month-dropdown{z-index:1;position:absolute;", euiYScroll(euiThemeContext, {
     height: 'auto'
-  }), " ", logicalCSS('max-height', '250px'), " ", logicalCSS('width', '100%'), " padding:", euiTheme.size.xs, ";background-color:", euiTheme.colors.emptyShade, ";border-radius:", euiTheme.border.radius.medium, ";", euiShadowSmall(euiThemeContext, {
+  }), " ", logicalCSS('max-height', '250px'), " ", logicalCSS('width', '100%'), " padding:", euiTheme.size.xs, ";background-color:", euiTheme.colors.emptyShade, ";border-radius:", euiTheme.border.radius.panel, ";", euiShadowSmall(euiThemeContext, {
     borderAllInHighContrastMode: true
-  }), ";}.react-datepicker__year-dropdown{", logicalCSS('min-width', '100px'), ";}.react-datepicker__month-dropdown{", logicalCSS('min-width', '140px'), ";}.react-datepicker__year-option,.react-datepicker__month-option,.react-datepicker__month-year-option{display:flex;align-items:center;", logicalCSS('height', euiTheme.size.l), " ", logicalCSS('margin-vertical', euiTheme.size.xs), " ", logicalCSS('padding-horizontal', euiTheme.size.s), " font-size:", euiFontSize(euiThemeContext, 's').fontSize, ";border-radius:", euiTheme.border.radius.small, ";cursor:pointer;&:hover{text-decoration:underline;}&--preselected{", colors.hover, ";}&--selected_year,&--selected_month{", colors.selected, ";}&--selected{display:none;}}");
+  }), ";}.react-datepicker__year-dropdown{", logicalCSS('min-width', '100px'), ";}.react-datepicker__month-dropdown{", logicalCSS('min-width', '140px'), ";}.react-datepicker__year-option,.react-datepicker__month-option,.react-datepicker__month-year-option{display:flex;align-items:center;", logicalCSS('height', euiTheme.size.l), " ", logicalCSS('margin-vertical', euiTheme.size.xs), " ", logicalCSS('padding-horizontal', euiTheme.size.s), " font-size:", euiFontSize(euiThemeContext, 's').fontSize, ";border-radius:", euiTheme.border.radius.control, ";cursor:pointer;&:hover{text-decoration:underline;}&--preselected{", colors.hover, ";}&--selected_year,&--selected_month{", colors.selected, ";}&--selected{display:none;}}");
 };
 var _dayCalendarStyles = function _dayCalendarStyles(euiThemeContext, _ref2) {
   var gapSize = _ref2.gapSize,
@@ -106,7 +106,7 @@ var _dayCalendarStyles = function _dayCalendarStyles(euiThemeContext, _ref2) {
   var rangeMarginOffset = mathWithUnits(dayMargin, function (x) {
     return x * 1.5;
   });
-  return /*#__PURE__*/css(".react-datepicker__day-names,.react-datepicker__week{display:flex;justify-content:space-between;flex-grow:1;color:", colors.day.header, ";}.react-datepicker__day-name,.react-datepicker__day{display:inline-flex;justify-content:center;align-items:center;", logicalSizeCSS(daySize), " margin:", dayMargin, ";font-weight:", euiTheme.font.weight.medium, ";}.react-datepicker__day{color:", colors.day.inMonth, ";border-radius:", euiTheme.border.radius.small, ";", euiCanAnimate, "{transition:transform ", animationSpeed, " ease-in-out,background-color ", animationSpeed, " ease-in;}&:hover{", colors.hover, " text-decoration:underline;cursor:pointer;", euiCanAnimate, "{transform:scale(1.1);}}&--today{color:", colors.day.today, ";font-weight:", euiTheme.font.weight.bold, ";}&--outside-month{color:", colors.day.outsideMonth, ";}&--highlighted,&--highlighted:hover{", colors.highlighted, ";}&--in-range,&--in-range:hover{", colors.inRange, ";}", highContrastModeStyles(euiThemeContext, {
+  return /*#__PURE__*/css(".react-datepicker__day-names,.react-datepicker__week{display:flex;justify-content:space-between;flex-grow:1;color:", colors.day.header, ";}.react-datepicker__day-name,.react-datepicker__day{display:inline-flex;justify-content:center;align-items:center;", logicalSizeCSS(daySize), " margin:", dayMargin, ";font-weight:", euiTheme.font.weight.medium, ";}.react-datepicker__day{color:", colors.day.inMonth, ";border-radius:", euiTheme.border.radius.control, ";", euiCanAnimate, "{transition:transform ", animationSpeed, " ease-in-out,background-color ", animationSpeed, " ease-in;}&:hover{", colors.hover, " text-decoration:underline;cursor:pointer;", euiCanAnimate, "{transform:scale(1.1);}}&--today{color:", colors.day.today, ";font-weight:", euiTheme.font.weight.bold, ";}&--outside-month{color:", colors.day.outsideMonth, ";}&--highlighted,&--highlighted:hover{", colors.highlighted, ";}&--in-range,&--in-range:hover{", colors.inRange, ";}", highContrastModeStyles(euiThemeContext, {
     // Ranges use 2 side box-shadows that are the same as the button
     // background to fill the gap between margins
     none: "\n          &--in-range:not(&--selected):not(:hover):not(&--disabled) {\n            box-shadow: -".concat(rangeMarginOffset, " 0 ").concat(colors.inRange.backgroundColor, ",\n              ").concat(rangeMarginOffset, " 0 ").concat(colors.inRange.backgroundColor, ";\n            border-radius: 0;\n\n            &:first-child {\n              box-shadow: ").concat(rangeMarginOffset, " 0 ").concat(colors.inRange.backgroundColor, ";\n            }\n\n            &:last-child {\n              box-shadow: -").concat(rangeMarginOffset, " 0 ").concat(colors.inRange.backgroundColor, ";\n            }\n          }\n          /* Animate smoothly on hover */\n          &--in-range:not(&--selected) {\n            ").concat(euiCanAnimate, " {\n              transition: transform ").concat(animationSpeed, " ease-in-out,\n                box-shadow ").concat(animationSpeed, " ease-in-out,\n                border-radius ").concat(animationSpeed, " ease-in-out,\n                background-color ").concat(animationSpeed, " ease-in;\n            }\n          }\n        "),
@@ -123,9 +123,9 @@ var _timeSelectStyles = function _timeSelectStyles(euiThemeContext, _ref3) {
     colors = _ref3.colors,
     animationSpeed = _ref3.animationSpeed;
   var euiTheme = euiThemeContext.euiTheme;
-  return /*#__PURE__*/css(".react-datepicker__time-container{display:flex;", logicalCSS('width', 'auto'), " background-color:", euiTheme.colors.body, ";border-radius:", euiTheme.border.radius.medium, ";&--focus{.react-datepicker__time-list-item--preselected{text-decoration:underline;}}}.react-datepicker__time,.react-datepicker__time-box{display:flex;flex-direction:column;flex-grow:1;}.react-datepicker__time-list{", euiYScroll(euiThemeContext, {
+  return /*#__PURE__*/css(".react-datepicker__time-container{display:flex;", logicalCSS('width', 'auto'), " background-color:", euiTheme.colors.backgroundBaseSubdued, ";border-radius:", euiTheme.border.radius.control, ";&--focus{.react-datepicker__time-list-item--preselected{text-decoration:underline;}}}.react-datepicker__time,.react-datepicker__time-box{display:flex;flex-direction:column;flex-grow:1;}.react-datepicker__time-list{", euiYScroll(euiThemeContext, {
     height: '100px'
-  }), " display:flex;flex-direction:column;flex-grow:1;align-items:center;gap:", gapSize, ";", logicalCSS('padding-vertical', euiTheme.size.xs), " ", logicalCSS('padding-horizontal', euiTheme.size.m), " &:focus-visible{outline-style:auto;}}.react-datepicker__time-list-item{display:flex;justify-content:align-center;align-items:center;", logicalCSS('min-height', euiTheme.size.l), " ", logicalCSS('margin-horizontal', 'auto'), " ", logicalCSS('padding-horizontal', euiTheme.size.s), " font-size:", euiFontSize(euiThemeContext, 'xs').fontSize, ";font-weight:", euiTheme.font.weight.medium, ";white-space:nowrap;border-radius:", euiTheme.border.radius.small, ";&:not(:disabled):hover{text-decoration:underline;cursor:pointer;}&--disabled{cursor:not-allowed;color:", colors.disabled.color, ";}&--injected{", colors.highlighted, ";}&--selected{", colors.selected, ";}&--preselected{", colors.hover, " ", highContrastModeStyles(euiThemeContext, {
+  }), " display:flex;flex-direction:column;flex-grow:1;align-items:center;gap:", gapSize, ";", logicalCSS('padding-vertical', euiTheme.size.xs), " ", logicalCSS('padding-horizontal', euiTheme.size.m), " &:focus-visible{outline-style:auto;}}.react-datepicker__time-list-item{display:flex;justify-content:align-center;align-items:center;", logicalCSS('min-height', euiTheme.size.l), " ", logicalCSS('margin-horizontal', 'auto'), " ", logicalCSS('padding-horizontal', euiTheme.size.s), " font-size:", euiFontSize(euiThemeContext, 'xs').fontSize, ";font-weight:", euiTheme.font.weight.medium, ";white-space:nowrap;border-radius:", euiTheme.border.radius.control, ";&:not(:disabled):hover{text-decoration:underline;cursor:pointer;}&--disabled{cursor:not-allowed;color:", colors.disabled.color, ";}&--injected{", colors.highlighted, ";}&--selected{", colors.selected, ";}&--preselected{", colors.hover, " ", highContrastModeStyles(euiThemeContext, {
     // Use negative margins to offset the added border width
     forced: "\n            border: ".concat(euiTheme.border.thin, ";\n            margin-inline: -").concat(euiTheme.border.width.thin, ";\n          ")
   }), ";}", euiCanAnimate, "{transition:background-color ", animationSpeed, " ease-in;}}&.react-datepicker--time-only{padding:0;.react-datepicker__time-container{background-color:transparent;margin:0;}.react-datepicker__time-list{", logicalCSS('height', '204px'), ";}.react-datepicker__time-list-item{", logicalCSS('min-width', '112px'), " font-size:", euiFontSize(euiThemeContext, 's').fontSize, ";text-align:start;}}");

package/es/components/date_picker/super_date_picker/super_date_picker.styles.js

@@ -69,7 +69,7 @@ export var euiSuperDatePickerStyles = function euiSuperDatePickerStyles(euiTheme
       euiSuperDatePicker__formControlLayout: /*#__PURE__*/css(".euiFormControlLayout__childrenWrapper{", highContrastModeStyles(euiThemeContext, {
         none: "\n              box-shadow: none;\n            ",
         preferred: 'border: none;'
-      }), ".euiDatePopoverButton:not(.euiDatePopoverButton-isSelected):hover{outline:none;}.euiPopover{border-radius:", forms.controlBorderRadius, ";}.euiDatePopoverButton{background-color:transparent;border-radius:inherit;}};label:euiSuperDatePicker__formControlLayout;"),
+      }), ".euiDatePopoverButton:not(.euiDatePopoverButton-isSelected):hover{outline:none;}.euiPopover{border-radius:", forms.controlBorderRadius, ";.euiToolTipAnchor{border-radius:inherit;}}.euiDatePopoverButton{background-color:transparent;border-radius:inherit;}};label:euiSuperDatePicker__formControlLayout;"),
       default: /*#__PURE__*/css(".euiFormControlLayout__childrenWrapper{color:", forms.textColor, ";background-color:", forms.backgroundColor, ";}.euiDatePopoverButton{--euiFormControlStateHoverColor:", forms.borderHovered, ";box-shadow:none;}.euiDatePopoverButton:focus,.euiPopover-isOpen .euiDatePopoverButton{", euiFormControlFocusStyles(euiThemeContext), ";};label:default;"),
       disabled: /*#__PURE__*/css(".euiFormControlLayout__childrenWrapper{", euiFormControlDisabledStyles(euiThemeContext), ";};label:disabled;"),
       invalid: /*#__PURE__*/css(".euiFormControlLayout__childrenWrapper{color:", euiTheme.colors.textDanger, ";&:has(.euiPopover-isOpen, .euiDatePopoverButton:focus){--euiFormControlStateColor:transparent;--euiFormControlStateHoverColor:transparent;}&:not(:has(.euiPopover-isOpen, .euiDatePopoverButton:focus)){", euiFormControlInvalidStyles(euiThemeContext), ";}.euiDatePopoverButton:focus,.euiPopover-isOpen .euiDatePopoverButton{", euiFormControlFocusStyles(euiThemeContext), ";}};label:invalid;"),

package/es/components/description_list/description_list_description.js

@@ -35,7 +35,7 @@ export var EuiDescriptionListDescription = function EuiDescriptionListDescriptio
     compressed = _useContext.compressed,
     align = _useContext.align;
   var styles = useEuiMemoizedStyles(euiDescriptionListDescriptionStyles);
-  var conditionalStyles = compressed && textStyle === 'reverse' ? [styles.fontStyles.compressed] : [styles.fontStyles[textStyle]];
+  var conditionalStyles = compressed ? [textStyle === 'reverse' ? styles.fontStyles.compressed : styles.fontStyles.compressedNormal] : [styles.fontStyles[textStyle]];
   switch (type) {
     case 'inline':
       conditionalStyles = compressed ? [styles.inlineStyles.compressed] : [styles.inlineStyles.normal];

package/es/components/description_list/description_list_description.styles.js

@@ -29,7 +29,8 @@ export var euiDescriptionListDescriptionStyles = function euiDescriptionListDesc
     fontStyles: {
       normal: /*#__PURE__*/css(euiFontSize(euiThemeContext, 's'), ";;label:normal;"),
       reverse: /*#__PURE__*/css(euiTitle(euiThemeContext, 'xs'), ";;label:reverse;"),
-      compressed: /*#__PURE__*/css(euiTitle(euiThemeContext, 'xxs'), ";;label:compressed;")
+      compressed: /*#__PURE__*/css(euiTitle(euiThemeContext, 'xxs'), ";;label:compressed;"),
+      compressedNormal: /*#__PURE__*/css(euiFontSize(euiThemeContext, 'xs'), ";;label:compressedNormal;")
     },
     // Nested inline styles for type and font
     inlineStyles: {

package/es/components/description_list/description_list_title.js

@@ -36,7 +36,10 @@ export var EuiDescriptionListTitle = function EuiDescriptionListTitle(_ref) {
     align = _useContext.align,
     rowGutterSize = _useContext.rowGutterSize;
   var styles = useEuiMemoizedStyles(euiDescriptionListTitleStyles);
-  var conditionalStyles = compressed && textStyle !== 'reverse' ? [styles.fontStyles.compressed] : [styles.fontStyles[textStyle]];
+
+  // normal is title-styled, so its compressed size lives in fontStyles;
+  // reverse is text-styled, so it uses a padding-free compressed size
+  var conditionalStyles = compressed ? [textStyle !== 'reverse' ? styles.fontStyles.compressed : styles.fontStyles.compressedReverse] : [styles.fontStyles[textStyle]];
   switch (type) {
     case 'inline':
       conditionalStyles = compressed ? [styles.inlineStyles.compressed] : [styles.inlineStyles.normal];