@elastic/eui 122.0.0 → 122.1.0

package/optimize/es/components/panel/panel.js

@@ -44,9 +44,9 @@ export var EuiPanel = function EuiPanel(_ref) {
     _ref$color = _ref.color,
     color = _ref$color === void 0 ? 'plain' : _ref$color,
     _ref$hasShadow = _ref.hasShadow,
-    hasShadow = _ref$hasShadow === void 0 ? true : _ref$hasShadow,
+    hasShadow = _ref$hasShadow === void 0 ? false : _ref$hasShadow,
     _ref$hasBorder = _ref.hasBorder,
-    hasBorder = _ref$hasBorder === void 0 ? false : _ref$hasBorder,
+    hasBorder = _ref$hasBorder === void 0 ? true : _ref$hasBorder,
     _ref$grow = _ref.grow,
     grow = _ref$grow === void 0 ? true : _ref$grow,
     panelRef = _ref.panelRef,

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

@@ -50,7 +50,7 @@ export var euiPanelStyles = function euiPanelStyles(euiThemeContext) {
     }), ";;label:hasBorder;"),
     radius: {
       none: /*#__PURE__*/css(";label:none;"),
-      m: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.medium, ";;label:m;")
+      m: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.panel, ";;label:m;")
     },
     // Setup interactive behavior
     isClickable: /*#__PURE__*/css(euiCanAnimate, "{transition:box-shadow ", euiTheme.animation.fast, " ", euiTheme.animation.resistance, ";}&:enabled{display:block;", logicalCSS('width', '100%'), " ", logicalTextAlignCSS('left'), ";}&:hover,&:focus{", highContrastModeStyles(euiThemeContext, {

package/optimize/es/components/popover/popover.js

@@ -243,7 +243,8 @@ export var EuiPopover = /*#__PURE__*/function (_Component) {
           offset: _this.props.attachToAnchor ? offset : _this.props.hasArrow ? 16 + offset : 8 + offset,
           arrowConfig: _this.props.hasArrow ? {
             arrowWidth: 16,
-            arrowBuffer: 10
+            arrowBuffer: 10,
+            borderRadius: 12
           } : {
             arrowWidth: 0,
             arrowBuffer: 0
@@ -493,6 +494,7 @@ export var EuiPopover = /*#__PURE__*/function (_Component) {
           isAttached: attachToAnchor,
           className: classNames(panelClassName, panelProps === null || panelProps === void 0 ? void 0 : panelProps.className),
           hasShadow: false,
+          hasBorder: false,
           paddingSize: panelPaddingSize,
           tabIndex: tabIndex,
           "aria-live": ariaLive,

package/optimize/es/components/popover/popover_footer.styles.js

@@ -13,7 +13,7 @@ export var euiPopoverFooterStyles = function euiPopoverFooterStyles(euiThemeCont
     highContrastMode = euiThemeContext.highContrastMode;
   return {
     // Base
-    euiPopoverFooter: /*#__PURE__*/css(euiFontSize(euiThemeContext, 's'), " ", logicalCSS('border-top', "".concat(euiTheme.border.width.thin, " solid ").concat(highContrastMode ? euiTheme.border.color : euiTheme.components.popoverFooterBorderColor)), logicalCSS('border-bottom-left-radius', euiTheme.border.radius.medium), " ", logicalCSS('border-bottom-right-radius', euiTheme.border.radius.medium), ";;label:euiPopoverFooter;"),
+    euiPopoverFooter: /*#__PURE__*/css(euiFontSize(euiThemeContext, 's'), " ", logicalCSS('border-top', "".concat(euiTheme.border.width.thin, " solid ").concat(highContrastMode ? euiTheme.border.color : euiTheme.components.popoverFooterBorderColor)), logicalCSS('border-bottom-left-radius', euiTheme.border.radius.panel), " ", logicalCSS('border-bottom-right-radius', euiTheme.border.radius.panel), ";;label:euiPopoverFooter;"),
     // If the popover's containing panel has padding applied,
     // ensure the footer expands to cover that padding via negative margins
     panelPaddingSizes: {

package/optimize/es/components/popover/popover_title.styles.js

@@ -13,7 +13,7 @@ export var euiPopoverTitleStyles = function euiPopoverTitleStyles(euiThemeContex
   var euiTheme = euiThemeContext.euiTheme;
   return {
     // Base
-    euiPopoverTitle: /*#__PURE__*/css(euiTitle(euiThemeContext, 'xxs'), " ", logicalCSS('border-bottom', euiTheme.border.thin), logicalCSS('border-top-left-radius', euiTheme.border.radius.medium), " ", logicalCSS('border-top-right-radius', euiTheme.border.radius.medium), ";;label:euiPopoverTitle;"),
+    euiPopoverTitle: /*#__PURE__*/css(euiTitle(euiThemeContext, 'xxs'), " ", logicalCSS('border-bottom', euiTheme.border.thin), logicalCSS('border-top-left-radius', euiTheme.border.radius.panel), " ", logicalCSS('border-top-right-radius', euiTheme.border.radius.panel), ";;label:euiPopoverTitle;"),
     // If the popover's containing panel has padding applied,
     // ensure the title expands to cover that padding via negative margins
     panelPaddingSizes: {

package/optimize/es/components/progress/progress.styles.js

@@ -109,7 +109,7 @@ export var euiProgressStyles = function euiProgressStyles(euiThemeContext, isNat
     },
     // Positioning
     fixed: /*#__PURE__*/css("position:fixed;z-index:", Number(euiTheme.levels.header) + 1, ";", nonStaticPositioning(isNative), ";;label:fixed;"),
-    absolute: /*#__PURE__*/css("position:absolute;", nonStaticPositioning(isNative), " ", logicalCSS('border-top-left-radius', 'inherit'), " ", logicalCSS('border-top-right-radius', 'inherit'), ";;label:absolute;"),
+    absolute: /*#__PURE__*/css("position:absolute;z-index:", Number(euiTheme.levels.content) + 1, ";", nonStaticPositioning(isNative), " ", logicalCSS('border-top-left-radius', 'inherit'), " ", logicalCSS('border-top-right-radius', 'inherit'), ";;label:absolute;"),
     static: _ref2,
     // Colors
     primary: /*#__PURE__*/css(nativeVsIndeterminateColor(euiTheme.colors.primary, isNative, highContrastMode), ";;label:primary;"),

package/optimize/es/components/resizable_container/resizable_panel.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _typeof from "@babel/runtime/helpers/typeof";
-var _excluded = ["children", "className", "css", "id", "isHorizontal", "size", "initialSize", "minSize", "scrollable", "mode", "registration", "onToggleCollapsed", "onToggleCollapsedInternal", "wrapperProps", "hasShadow", "borderRadius", "color", "paddingSize", "wrapperPadding"];
+var _excluded = ["children", "className", "css", "id", "isHorizontal", "size", "initialSize", "minSize", "scrollable", "mode", "registration", "onToggleCollapsed", "onToggleCollapsedInternal", "wrapperProps", "hasShadow", "hasBorder", "borderRadius", "color", "paddingSize", "wrapperPadding"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /*
@@ -62,6 +62,8 @@ export var EuiResizablePanel = function EuiResizablePanel(_ref) {
     wrapperProps = _ref.wrapperProps,
     _ref$hasShadow = _ref.hasShadow,
     hasShadow = _ref$hasShadow === void 0 ? false : _ref$hasShadow,
+    _ref$hasBorder = _ref.hasBorder,
+    hasBorder = _ref$hasBorder === void 0 ? false : _ref$hasBorder,
     _ref$borderRadius = _ref.borderRadius,
     borderRadius = _ref$borderRadius === void 0 ? 'none' : _ref$borderRadius,
     _ref$color = _ref.color,
@@ -219,6 +221,7 @@ export var EuiResizablePanel = function EuiResizablePanel(_ref) {
     css: contentCssStyles,
     className: panelClasses,
     hasShadow: hasShadow,
+    hasBorder: hasBorder,
     borderRadius: borderRadius,
     color: color,
     paddingSize: isCollapsed ? 'none' : paddingSize

package/optimize/es/components/selectable/selectable_list/selectable_list.styles.js

@@ -28,7 +28,7 @@ export var euiSelectableListStyles = function euiSelectableListStyles(euiThemeCo
   return {
     euiSelectableList: /*#__PURE__*/css("&:has(:focus-visible){", euiFocusRing(euiThemeContext, 'outset'), ";};label:euiSelectableList;"),
     fullHeight: _ref,
-    bordered: /*#__PURE__*/css("overflow:hidden;border:", euiTheme.border.thin, ";border-radius:", euiTheme.border.radius.medium, ";;label:bordered;"),
+    bordered: /*#__PURE__*/css("overflow:hidden;border:", euiTheme.border.thin, ";border-radius:", euiTheme.border.radius.panel, ";;label:bordered;"),
     paddingSize: {
       s: /*#__PURE__*/css("padding:", euiTheme.size.s, ";;label:s;")
     },

package/optimize/es/components/selectable/selectable_message/selectable_message.styles.js

@@ -12,6 +12,6 @@ export var euiSelectableMessageStyles = function euiSelectableMessageStyles(euiT
   return {
     euiSelectableMessage: /*#__PURE__*/css("display:flex;flex-direction:column;justify-content:center;align-items:center;padding:", euiTheme.size.s, ";text-align:center;word-wrap:break-word;;label:euiSelectableMessage;"),
     // Match border from selectable_list
-    bordered: /*#__PURE__*/css("overflow:hidden;border:", euiTheme.border.thin, ";border-radius:", euiTheme.border.radius.medium, ";;label:bordered;")
+    bordered: /*#__PURE__*/css("overflow:hidden;border:", euiTheme.border.thin, ";border-radius:", euiTheme.border.radius.panel, ";;label:bordered;")
   };
 };

package/optimize/es/components/skeleton/skeleton_rectangle.styles.js

@@ -26,8 +26,8 @@ export var euiSkeletonRectangleStyles = function euiSkeletonRectangleStyles(euiT
       gradientSize: '400%'
     }), " ", preventForcedColors(euiThemeContext), ";;label:euiSkeletonRectangle;"),
     // Border radius
-    s: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.small, ";;label:s;"),
-    m: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.medium, ";;label:m;"),
+    s: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.inline, ";;label:s;"),
+    m: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.inline, ";;label:m;"),
     none: _ref
   };
 };

package/optimize/es/components/skeleton/skeleton_text.styles.js

@@ -23,7 +23,7 @@ var calculateLineSize = function calculateLineSize(euiThemeContext, size) {
 export var euiSkeletonTextStyles = function euiSkeletonTextStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiSkeletonText: /*#__PURE__*/css("display:block;", logicalCSS('width', '100%'), " border-radius:", euiTheme.border.radius.small, ";", euiSkeletonGradientAnimation(euiThemeContext), " ", preventForcedColors(euiThemeContext), "transform:translateY(-25%);&:last-child:not(:only-child){", logicalCSS('width', '75%'), ";};label:euiSkeletonText;"),
+    euiSkeletonText: /*#__PURE__*/css("display:block;", logicalCSS('width', '100%'), " border-radius:", euiTheme.border.radius.inline, ";", euiSkeletonGradientAnimation(euiThemeContext), " ", preventForcedColors(euiThemeContext), "transform:translateY(-25%);&:last-child:not(:only-child){", logicalCSS('width', '75%'), ";};label:euiSkeletonText;"),
     // Sizes
     m: /*#__PURE__*/css(calculateLineSize(euiThemeContext, 'm'), ";;label:m;"),
     s: /*#__PURE__*/css(calculateLineSize(euiThemeContext, 's'), ";;label:s;"),

package/optimize/es/components/skeleton/skeleton_title.styles.js

@@ -14,13 +14,13 @@ import { euiSkeletonGradientAnimation } from './utils';
 export var euiSkeletonTitleStyles = function euiSkeletonTitleStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiSkeletonTitle: /*#__PURE__*/css("display:block;", logicalCSS('width', '45%'), " border-radius:", euiTheme.border.radius.medium, ";", euiSkeletonGradientAnimation(euiThemeContext), " ", preventForcedColors(euiThemeContext), ";;label:euiSkeletonTitle;"),
+    euiSkeletonTitle: /*#__PURE__*/css("display:block;", logicalCSS('width', '45%'), " border-radius:", euiTheme.border.radius.inline, ";", euiSkeletonGradientAnimation(euiThemeContext), " ", preventForcedColors(euiThemeContext), ";;label:euiSkeletonTitle;"),
     // Sizes
     l: /*#__PURE__*/css(logicalCSS('height', euiTitle(euiThemeContext, 'l').lineHeight), ";;label:l;"),
     m: /*#__PURE__*/css(logicalCSS('height', euiTitle(euiThemeContext, 'm').lineHeight), ";;label:m;"),
     s: /*#__PURE__*/css(logicalCSS('height', euiTitle(euiThemeContext, 's').lineHeight), ";;label:s;"),
     xs: /*#__PURE__*/css(logicalCSS('height', euiTitle(euiThemeContext, 'xs').lineHeight), ";;label:xs;"),
     xxs: /*#__PURE__*/css(logicalCSS('height', euiTitle(euiThemeContext, 'xxs').lineHeight), ";;label:xxs;"),
-    xxxs: /*#__PURE__*/css(logicalCSS('height', euiTitle(euiThemeContext, 'xxxs').lineHeight), " border-radius:", euiTheme.border.radius.small, ";;label:xxxs;")
+    xxxs: /*#__PURE__*/css(logicalCSS('height', euiTitle(euiThemeContext, 'xxxs').lineHeight), " border-radius:", euiTheme.border.radius.inline, ";;label:xxxs;")
   };
 };

package/optimize/es/components/table/sticky_header/sticky_header.js

@@ -123,12 +123,14 @@ export var EuiTableStickyHeader = function EuiTableStickyHeader(_ref) {
     css: styles.wrapper,
     "aria-hidden": "true"
   }, ___EmotionJSX("div", {
+    className: "euiTableStickyHeader__container",
     css: [
     // This CSS container is needed to feed `<EuiTableHeaderCell>`
     // with `sticky` prop set the necessary scroll state
     euiContainerCSS('normal', EUI_TABLE_CSS_CONTAINER_NAME, true), styles.innerWrapper, ";label:EuiTableStickyHeader;"],
     ref: stickyTableWrapperRef
   }, ___EmotionJSX("table", {
+    className: "euiTableStickyHeader",
     css: tableStyles,
     ref: stickyTableRef
   }, ___EmotionJSX(EuiTableHeader, {

package/optimize/es/components/table/sticky_scrollbar/sticky_scrollbar.styles.js

@@ -22,6 +22,6 @@ export var euiTableStickyScrollbarStyles = function euiTableStickyScrollbarStyle
   return {
     wrapper: /*#__PURE__*/css("block-size:", euiTheme.size.base, ";padding:", euiTheme.size.xs, ";position:sticky;background:", euiTheme.components.scrollbarTrackColor, ";inset-block-end:var(--euiTableStickyScrollbarOffsetBottom, 0);z-index:var(--euiTableStickyScrollbarZIndex, 0);;label:wrapper;"),
     wrapperHidden: _ref,
-    track: /*#__PURE__*/css("block-size:100%;background:", transparentize(euiTheme.colors.darkShade, 0.5), ";border-radius:", euiTheme.border.radius.small, ";;label:track;")
+    track: /*#__PURE__*/css("block-size:100%;background:", transparentize(euiTheme.colors.darkShade, 0.5), ";border-radius:", euiTheme.border.radius.inline, ";;label:track;")
   };
 };

package/optimize/es/components/table/table.js

@@ -63,6 +63,7 @@ export var EuiTable = function EuiTable(originalProps) {
     compressed: compressed,
     isResponsive: isResponsive
   }), ___EmotionJSX("div", {
+    className: "euiTable__wrapper",
     css: cssStyles,
     ref: tableWrapperRef
   }, ___EmotionJSX("table", _extends({

package/optimize/es/components/table/table_header_cell.js

@@ -50,7 +50,8 @@ var CellContents = function CellContents(_ref) {
     position: "top",
     iconProps: _objectSpread({
       role: 'button'
-    }, tooltipProps.iconProps)
+    }, tooltipProps.iconProps),
+    display: "flex"
   }, tooltipProps.tooltipProps)) : null;
   return ___EmotionJSX(EuiTableCellContent, {
     className: className,

package/optimize/es/components/table/table_row.styles.js

@@ -38,7 +38,7 @@ export var euiTableRowStyles = function euiTableRowStyles(euiThemeContext) {
       checkboxOffset: /*#__PURE__*/css("&>.euiTableRowCell:first-child{", logicalCSS('padding-left', checkboxSize), ";};label:checkboxOffset;")
     },
     mobile: {
-      mobile: /*#__PURE__*/css("position:relative;display:flex;flex-wrap:wrap;padding:", cellContentPadding, ";", logicalCSS('margin-bottom', cellContentPadding), " border-radius:", euiTheme.border.radius.medium, ";", cssSupportsHasWithNextSibling("\n            &:has(+ .euiTableRow-isExpandedRow) {\n              ".concat(logicalCSS('border-bottom-left-radius', 0), "\n              ").concat(logicalCSS('border-bottom-right-radius', 0), "\n            }\n          ")), ";;label:mobile;"),
+      mobile: /*#__PURE__*/css("position:relative;display:flex;flex-wrap:wrap;padding:", cellContentPadding, ";", logicalCSS('margin-bottom', cellContentPadding), " border-radius:", euiTheme.border.radius.panel, ";", cssSupportsHasWithNextSibling("\n            &:has(+ .euiTableRow-isExpandedRow) {\n              ".concat(logicalCSS('border-bottom-left-radius', 0), "\n              ").concat(logicalCSS('border-bottom-right-radius', 0), "\n            }\n          ")), ";;label:mobile;"),
       /* Omitting adding a class via css here as it's a default style on mobile, not a standalone prop-related style.
       Adding it separate allows better appliance control via props without the need to override the styles. */
       hasBorder: "\n        ".concat(highContrastModeStyles(euiThemeContext, {

package/optimize/es/components/tabs/tab.styles.js

@@ -24,10 +24,10 @@ export var euiTabStyles = function euiTabStyles(euiThemeContext) {
     return x * 2;
   }) : euiTheme.border.width.thick;
   return {
-    euiTab: /*#__PURE__*/css("position:relative;display:flex;cursor:pointer;flex-direction:row;align-items:center;gap:", euiTheme.size.s, ";", logicalCSS('padding-vertical', 0), " ", logicalCSS('padding-horizontal', euiTheme.size.xs), "font-weight:", euiTheme.font.weight.semiBold, ";color:", euiTheme.colors.textHeading, ";&:focus{outline-offset:-", euiTheme.focus.width, ";}&::after{position:absolute;", logicalCSS('bottom', 0), " ", logicalCSS('horizontal', 0), " ", logicalCSS('border-bottom-style', 'solid'), " ", logicalCSS('border-bottom-width', selectedUnderlineSize), " pointer-events:none;};label:euiTab;"),
+    euiTab: /*#__PURE__*/css("position:relative;display:flex;cursor:pointer;flex-direction:row;align-items:center;gap:", euiTheme.size.s, ";", logicalCSS('padding-vertical', 0), " ", logicalCSS('padding-horizontal', 0), " border-radius:", euiTheme.border.radius.control, ";font-weight:", euiTheme.font.weight.semiBold, ";color:", euiTheme.colors.textSubdued, ";&:focus{outline-offset:-", euiTheme.focus.width, ";}&::after{position:absolute;", logicalCSS('bottom', 0), " ", logicalCSS('horizontal', 0), " ", logicalCSS('border-bottom-style', 'solid'), " ", logicalCSS('border-bottom-width', selectedUnderlineSize), " pointer-events:none;};label:euiTab;"),
     // variations
     expanded: _ref,
-    selected: /*#__PURE__*/css("color:", euiTheme.colors.textPrimary, ";&::after{content:'';border-color:", euiTheme.colors.primary, ";};label:selected;"),
+    selected: /*#__PURE__*/css("color:", euiTheme.colors.textHeading, ";&::after{content:'';border-color:", euiTheme.colors.primary, ";};label:selected;"),
     disabled: {
       disabled: /*#__PURE__*/css("cursor:not-allowed;color:", euiTheme.colors.textDisabled, ";;label:disabled;"),
       selected: /*#__PURE__*/css("&::after{content:'';border-color:", euiTheme.colors.textDisabled, ";};label:selected;")
@@ -37,7 +37,7 @@ export var euiTabStyles = function euiTabStyles(euiThemeContext) {
 export var euiTabContentStyles = function euiTabContentStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiTab__content: /*#__PURE__*/css("font-weight:", euiTheme.font.weight[euiTheme.font.title.weight], ";;label:euiTab__content;"),
+    euiTab__content: /*#__PURE__*/css("font-weight:", euiTheme.font.weight.semiBold, ";;label:euiTab__content;"),
     // sizes
     s: /*#__PURE__*/css("font-size:", euiFontSize(euiThemeContext, 'xs').fontSize, ";line-height:", euiTheme.size.xl, ";;label:s;"),
     m: /*#__PURE__*/css("font-size:", euiFontSize(euiThemeContext, 's').fontSize, ";line-height:", euiTheme.size.xxl, ";;label:m;"),

package/optimize/es/components/text/text.js

@@ -24,7 +24,7 @@ export var EuiText = function EuiText(_ref) {
   var _ref$component = _ref.component,
     component = _ref$component === void 0 ? 'div' : _ref$component,
     _ref$size = _ref.size,
-    size = _ref$size === void 0 ? 'm' : _ref$size,
+    size = _ref$size === void 0 ? 's' : _ref$size,
     color = _ref.color,
     _ref$grow = _ref.grow,
     grow = _ref$grow === void 0 ? true : _ref$grow,

package/optimize/es/components/text/text.styles.js

@@ -74,7 +74,7 @@ export var euiTextStyles = function euiTextStyles(euiThemeContext) {
   return {
     euiText: /*#__PURE__*/css(euiText(euiTheme, true), "clear:both;a:not([class]){", euiLinkCSS(euiThemeContext), ";}ul{list-style:disc;}ol{list-style:decimal;}blockquote{border-inline-start-color:", euiTheme.border.color, ";border-inline-start-style:solid;}blockquote:not(.euiMarkdownFormat__blockquote){color:", euiTheme.colors.textSubdued, ";}h1{", euiTitle(euiThemeContext, 'l'), ";}h2{", euiTitle(euiThemeContext, 'm'), ";}h3{", euiTitle(euiThemeContext, 's'), ";}h4,dt{", euiTitle(euiThemeContext, 'xs'), ";}h5{", euiTitle(euiThemeContext, 'xxs'), ";}h6{", euiTitle(euiThemeContext, 'xxxs'), ";}h1,h2,h3,h4,h5,h6,dt{color:inherit;}pre:not(.euiCodeBlock > pre){white-space:pre-wrap;background-color:", codeColors.backgroundColor, ";color:", codeColors.color, ";", highContrastModeStyles(euiThemeContext, {
       preferred: "border: ".concat(euiTheme.border.thin)
-    }), ";}pre:not(.euiCodeBlock__pre),pre:not(.euiCodeBlock__pre) code{display:block;}>:last-child{", logicalCSS('margin-bottom', '0 !important'), ";}kbd{position:relative;display:inline-block;", logicalCSS('padding-vertical', euiTheme.size.xxs), " ", logicalCSS('padding-horizontal', euiTheme.size.xs), " line-height:1;border:", euiTheme.border.width.thin, " solid ", euiTheme.colors.textParagraph, ";border-radius:", mathWithUnits(euiTheme.border.radius.small, function (x) {
+    }), ";}pre:not(.euiCodeBlock__pre),pre:not(.euiCodeBlock__pre) code{display:block;}>:last-child{", logicalCSS('margin-bottom', '0 !important'), ";}kbd{position:relative;display:inline-block;", logicalCSS('padding-vertical', euiTheme.size.xxs), " ", logicalCSS('padding-horizontal', euiTheme.size.xs), " line-height:1;border:", euiTheme.border.width.thin, " solid ", euiTheme.colors.textParagraph, ";border-radius:", mathWithUnits(euiTheme.border.radius.inline, function (x) {
       return x / 2;
     }), ";", highContrastModeStyles(euiThemeContext, {
       // Fixes an odd border issue in Windows high contrast themes

package/optimize/es/components/title/title.styles.js

@@ -31,7 +31,8 @@ export var euiTitle = function euiTitle(euiThemeContext) {
   };
   return _objectSpread(_objectSpread({}, euiFontSize(euiThemeContext, titleScaleToFontSizeScaleMap[scale], options)), {}, {
     fontWeight: euiTheme.font.weight[euiTheme.font.title.weight],
-    color: euiTheme.colors.textHeading
+    color: euiTheme.colors.textHeading,
+    letterSpacing: euiTheme.font.title.letterSpacing
   });
 };
 

package/optimize/es/components/toast/toast.styles.js

@@ -1,5 +1,5 @@
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
-var _templateObject;
+var _templateObject, _templateObject2;
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -11,17 +11,27 @@ var _templateObject;
 import { css, keyframes } from '@emotion/react';
 import { euiCanAnimate, euiShadowLarge, mathWithUnits } from '@elastic/eui-theme-common';
 import { euiTextBreakWord, logicalCSS } from '../../global_styling';
-import { preventForcedColors } from '../../global_styling/functions/high_contrast';
+import { highContrastModeStyles, preventForcedColors } from '../../global_styling/functions/high_contrast';
 import { euiTitle } from '../title/title.styles';
 import { euiPanelBorderStyles } from '../panel/panel.styles';
 var TEXT_MAX_WIDTH = 1200;
 var CONTAINER_NAME = 'euiToast';
 var CQC_BREAKPOINT_NARROWEST = '(max-width: 320px)';
-var euiToastAnimation = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  from {\n    transform: scaleX(1);\n  }\n  to {\n    transform: scaleX(0);\n  }\n"])));
+var decorClipSize = '9px'; // the height of the decor clip that includes the border rounding
+var decorClipPath = "polygon(0 0, 100% 0, 100% ".concat(decorClipSize, ", 0 ").concat(decorClipSize, ")");
+var euiToastAnimation = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  from {\n    clip-path: ", ";\n  }\n  to {\n    clip-path: polygon(0 0, 0% 0, 0% ", ", 0 ", ");\n  }\n"])), decorClipPath, decorClipSize, decorClipSize);
+var euiToastAnimationRTL = keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  from {\n    clip-path: ", ";\n  }\n  to {\n    clip-path: polygon(100% 0, 100% 0, 100% ", ", 100% ", ");\n  }\n"])), decorClipPath, decorClipSize, decorClipSize);
 export var euiToastStyles = function euiToastStyles(euiThemeContext) {
-  var euiTheme = euiThemeContext.euiTheme;
+  var euiTheme = euiThemeContext.euiTheme,
+    highContrastMode = euiThemeContext.highContrastMode;
+  var borderRadius = euiTheme.border.radius.panel;
+  var decorLevel = Number(euiTheme.levels.content) + 1;
   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) {
+    return x * 2;
   });
   var paddingTop = mathWithUnits([euiTheme.size.base, highlightSize], function (x, y) {
     return x + y;
@@ -29,12 +39,17 @@ export var euiToastStyles = function euiToastStyles(euiThemeContext) {
   var offsetTop = mathWithUnits([euiTheme.size.s, highlightSize], function (x, y) {
     return x + y;
   });
+  var decorCommonStyles = "\n    content: '';\n    position: absolute;\n    inset-block-start: 0;\n    inset-inline-start: 0;\n    block-size: 100%;\n    inline-size: 100%;\n    border-radius: ".concat(euiTheme.border.radius.panel, ";\n    border-end-start-radius: 0;\n    border-block-start: ").concat(highlightSize, " solid;\n    clip-path: ").concat(decorClipPath, ";\n    pointer-events: none;\n\n    ").concat(highContrastModeStyles(euiThemeContext, {
+    preferred: "\n        inset-block-start: -".concat(highlightOffset, ";\n      inset-inline-start: -").concat(highlightOffset, ";\n      inline-size: calc(100% + ").concat(highlightSizeOffset, ");\n      ")
+  }), "\n  ");
   return {
     // Base
-    euiToast: /*#__PURE__*/css("container-type:inline-size;container-name:", CONTAINER_NAME, ";position:relative;border-radius:", euiTheme.border.radius.medium, ";", euiShadowLarge(euiThemeContext, {
+    euiToast: /*#__PURE__*/css("container-type:inline-size;container-name:", CONTAINER_NAME, ";position:relative;border-radius:", borderRadius, ";", euiShadowLarge(euiThemeContext, {
       borderAllInHighContrastMode: true
     }), " ", logicalCSS('padding-top', paddingTop), " ", logicalCSS('padding-bottom', euiTheme.size.base), " ", logicalCSS('padding-horizontal', euiTheme.size.base), " background-color:", euiTheme.colors.backgroundBasePlain, ";", logicalCSS('width', '100%'), " ", euiTextBreakWord(), euiPanelBorderStyles(euiThemeContext), ";;label:euiToast;"),
-    decor: /*#__PURE__*/css("position:absolute;overflow:hidden;inset-block-start:0;inset-inline:0;", logicalCSS('height', highlightSize), " border-start-start-radius:", euiTheme.border.radius.medium, ";border-start-end-radius:", euiTheme.border.radius.medium, ";background-color:var(--euiToastTypeBackgroundColor);", preventForcedColors(euiThemeContext), " &::before{content:'';position:absolute;z-index:", euiTheme.levels.content, ";inset-block-start:0;inset-inline:0;", logicalCSS('height', '100%'), " border-radius:1px;border-end-start-radius:0;background-color:var(--euiToastTypeColor);pointer-events:none;", preventForcedColors(euiThemeContext), " transform-origin:left center;[dir='rtl'] &{transform-origin:right center;border-end-start-radius:1px;border-end-end-radius:0;}};label:decor;"),
+    decor: /*#__PURE__*/css("position:absolute;inset:0;pointer-events:none;", preventForcedColors(euiThemeContext), " ", highContrastModeStyles(euiThemeContext, {
+      preferred: "\n          --euiToastTypeBackgroundColor: ".concat(euiTheme.colors.borderBasePlain, ";\n        ")
+    }), " &::before{", decorCommonStyles, " z-index:", decorLevel, ";border-block-start-color:var(--euiToastTypeBackgroundColor);}&::after{", decorCommonStyles, "z-index:", decorLevel + 1, ";border-block-start-color:var(--euiToastTypeColor);};label:decor;"),
     // handles content + actions layout
     wrapper: /*#__PURE__*/css("display:flex;flex-direction:column;gap:", euiTheme.size.m, ";inline-size:100%;;label:wrapper;"),
     // handles icon + text layout
@@ -45,7 +60,7 @@ export var euiToastStyles = function euiToastStyles(euiThemeContext) {
     icon: /*#__PURE__*/css("grid-area:icon;position:relative;", logicalCSS('margin-vertical', euiTheme.size.xxs), ";;label:icon;"),
     actions: /*#__PURE__*/css("grid-area:actions;display:flex;gap:", euiTheme.size.s, ";", logicalCSS('margin-left', euiTheme.size.xl), "@container ", CONTAINER_NAME, " ", CQC_BREAKPOINT_NARROWEST, "{flex-wrap:wrap;>*{inline-size:100%;}};label:actions;"),
     dismissButton: /*#__PURE__*/css("position:absolute;", logicalCSS('top', offsetTop), ";", logicalCSS('right', euiTheme.size.s), ";;label:dismissButton;"),
-    hasAnimation: /*#__PURE__*/css("&::before{", euiCanAnimate, "{animation:", euiToastAnimation, " var(--euiToastAnimationMs) linear forwards;}};label:hasAnimation;")
+    hasAnimation: /*#__PURE__*/css("&::after{", euiCanAnimate, "{will-change:clip-path;animation:", euiToastAnimation, " var(--euiToastAnimationMs) linear forwards;[dir='rtl'] &{animation:", euiToastAnimationRTL, " var(--euiToastAnimationMs) linear forwards;}}};label:hasAnimation;")
   };
 };
 export var euiToastHeaderStyles = function euiToastHeaderStyles(euiThemeContext) {

package/optimize/es/components/token/token.styles.js

@@ -62,10 +62,10 @@ export var euiTokenStyles = function euiTokenStyles(euiThemeContext, fill) {
     euiToken: /*#__PURE__*/css("display:inline-flex;align-items:center;justify-content:center;svg{", logicalCSS('height', '100%'), " margin:auto;};label:euiToken;"),
     // Shapes
     circle: _ref,
-    square: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.small, ";;label:square;"),
-    rectangle: /*#__PURE__*/css("box-sizing:content-box;border-radius:", euiTheme.border.radius.small, ";;label:rectangle;"),
+    square: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.inline, ";;label:square;"),
+    rectangle: /*#__PURE__*/css("box-sizing:content-box;border-radius:", euiTheme.border.radius.inline, ";;label:rectangle;"),
     // Sizes
-    xs: /*#__PURE__*/css(logicalSizeCSS(euiTheme.size.s), " &[class*='-square'],&[class*='-rectangle']{border-radius:", mathWithUnits(euiTheme.border.radius.small, function (x) {
+    xs: /*#__PURE__*/css(logicalSizeCSS(euiTheme.size.s), " &[class*='-square'],&[class*='-rectangle']{border-radius:", mathWithUnits(euiTheme.border.radius.inline, function (x) {
       return x / 2;
     }), ";}&[class*='-rectangle']{", logicalCSS('padding-vertical', '1px'), " ", logicalCSS('padding-horizontal', euiTheme.size.xs), ";};label:xs;"),
     s: /*#__PURE__*/css(logicalSizeCSS(euiTheme.size.base), " &[class*='-rectangle']{", logicalCSS('padding-horizontal', euiTheme.size.xs), ";};label:s;"),

package/optimize/es/components/tool_tip/tool_tip.js

@@ -15,7 +15,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 
 import React, { forwardRef, useCallback, useContext, useEffect, useImperativeHandle, useRef, useState } from 'react';
 import classNames from 'classnames';
-import { findPopoverPosition, useGeneratedHtmlId, keys } from '../../services';
+import { findPopoverPosition, useEuiTheme, useGeneratedHtmlId, keys } from '../../services';
 import { getRepositionOnScroll } from '../../services/popover/reposition_on_scroll';
 import { EuiResizeObserver } from '../observer/resize_observer';
 import { EuiPortal } from '../portal';
@@ -74,6 +74,8 @@ export var EuiToolTip = /*#__PURE__*/forwardRef(function (_ref, ref) {
     onMouseOutProp = _ref.onMouseOut,
     onBlurProp = _ref.onBlur,
     rest = _objectWithoutProperties(_ref, _excluded);
+  var _useEuiTheme = useEuiTheme(),
+    euiTheme = _useEuiTheme.euiTheme;
   var componentDefaultsContext = useContext(EuiComponentDefaultsContext);
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
@@ -114,7 +116,8 @@ export var EuiToolTip = /*#__PURE__*/forwardRef(function (_ref, ref) {
         offset: offset !== null && offset !== void 0 ? offset : DEFAULT_TOOLTIP_OFFSET,
         arrowConfig: {
           arrowWidth: 12,
-          arrowBuffer: 4
+          arrowBuffer: 4,
+          borderRadius: euiTheme.border.radius.control ? parseFloat(String(euiTheme.border.radius.control)) : undefined
         }
       }),
       position = _findPopoverPosition.position,
@@ -138,7 +141,7 @@ export var EuiToolTip = /*#__PURE__*/forwardRef(function (_ref, ref) {
     setCalculatedPosition(position);
     setToolTipStyles(newToolTipStyles);
     setArrowStyles(arrow);
-  }, [positionProp, offset]);
+  }, [euiTheme, positionProp, offset]);
   var setAnchorRef = useCallback(function (el) {
     anchorRef.current = el;
   }, []);

package/optimize/es/components/tool_tip/tool_tip.styles.js

@@ -29,7 +29,7 @@ export var euiToolTipStyles = function euiToolTipStyles(euiThemeContext) {
   var arrowStyles = _popoverArrowStyles(euiThemeContext, arrowSize);
   return {
     // Base
-    euiToolTip: /*#__PURE__*/css(hasShadow ? euiShadow(euiThemeContext) : '', " border-radius:", euiTheme.border.radius.medium, ";background-color:", euiToolTipBackgroundColor(euiTheme), ";color:", euiTheme.colors.textGhost, ";z-index:", euiTheme.levels.toast, ";", logicalCSS('max-width', '256px'), " overflow-wrap:break-word;padding:", euiTheme.size.s, ";", euiFontSize(euiThemeContext, 'xs'), " position:absolute;pointer-events:none;", euiPanelBorderStyles(euiThemeContext), " [class*='euiHorizontalRule']{background-color:", euiToolTipBorderColor(euiTheme), ";}", euiCanAnimate, "{animation:", euiToolTipAnimation, " ", euiTheme.animation.extraFast, " ease-out ", euiTheme.animation.fast, " both;};label:euiToolTip;"),
+    euiToolTip: /*#__PURE__*/css(hasShadow ? euiShadow(euiThemeContext) : '', " border-radius:", euiTheme.border.radius.control, ";background-color:", euiToolTipBackgroundColor(euiTheme), ";color:", euiTheme.colors.textGhost, ";z-index:", euiTheme.levels.toast, ";", logicalCSS('max-width', '256px'), " overflow-wrap:break-word;padding:", euiTheme.size.s, ";", euiFontSize(euiThemeContext, 'xs'), " position:absolute;pointer-events:none;", euiPanelBorderStyles(euiThemeContext), " [class*='euiHorizontalRule']{background-color:", euiToolTipBorderColor(euiTheme), ";}", euiCanAnimate, "{animation:", euiToolTipAnimation, " ", euiTheme.animation.extraFast, " ease-out ", euiTheme.animation.fast, " both;};label:euiToolTip;"),
     // Positions - kept for component compatibility. Animation is in the base style.
     top: /*#__PURE__*/css(";label:top;"),
     bottom: /*#__PURE__*/css(";label:bottom;"),
@@ -67,11 +67,11 @@ var _ref3 = process.env.NODE_ENV === "production" ? {
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
 var _ref4 = process.env.NODE_ENV === "production" ? {
-  name: "1s3i3p5-euiToolTipAnchor",
-  styles: "*[disabled]{pointer-events:none;};label:euiToolTipAnchor;"
+  name: "rwadfc-euiToolTipAnchor",
+  styles: "*[disabled],*[aria-disabled='true']{pointer-events:none;};label:euiToolTipAnchor;"
 } : {
-  name: "1s3i3p5-euiToolTipAnchor",
-  styles: "*[disabled]{pointer-events:none;};label:euiToolTipAnchor;",
+  name: "rwadfc-euiToolTipAnchor",
+  styles: "*[disabled],*[aria-disabled='true']{pointer-events:none;};label:euiToolTipAnchor;",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
 export var euiToolTipAnchorStyles = function euiToolTipAnchorStyles() {

package/optimize/es/components/tour/_tour_footer.styles.js

@@ -16,6 +16,6 @@ export var euiTourFooterStyles = function euiTourFooterStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
     // Base
-    euiTourFooter: /*#__PURE__*/css("background-color:", _tourFooterBgColor(euiThemeContext), ";", logicalCSS('border-bottom-left-radius', euiTheme.border.radius.medium), " ", logicalCSS('border-bottom-right-radius', euiTheme.border.radius.medium), ";;label:euiTourFooter;")
+    euiTourFooter: /*#__PURE__*/css("background-color:", _tourFooterBgColor(euiThemeContext), ";", logicalCSS('border-bottom-left-radius', euiTheme.border.radius.panel), " ", logicalCSS('border-bottom-right-radius', euiTheme.border.radius.panel), ";;label:euiTourFooter;")
   };
 };

package/optimize/es/components/tree_view/tree_view_item.styles.js

@@ -30,8 +30,8 @@ export var euiTreeViewItemStyles = function euiTreeViewItemStyles(euiThemeContex
     },
     button: {
       euiTreeView__nodeInner: /*#__PURE__*/css(logicalCSS('width', '100%'), " ", logicalCSS('padding-left', euiTheme.size.s), " ", logicalCSS('padding-right', euiTheme.size.xxs), " display:flex;align-items:center;&:focus{", euiFocusRing(euiThemeContext, 'inset'), ";}&:hover,&:active,&:focus{background-color:", euiTheme.components.treeViewItemBackgroundHover, ";};label:euiTreeView__nodeInner;"),
-      default: /*#__PURE__*/css(logicalCSS('height', defaultSize), " gap:", euiTheme.size.s, ";border-radius:", euiTheme.border.radius.medium, ";;label:default;"),
-      compressed: /*#__PURE__*/css(logicalCSS('height', compressedSize), " gap:", euiTheme.size.xs, ";border-radius:", euiTheme.border.radius.small, ";;label:compressed;")
+      default: /*#__PURE__*/css(logicalCSS('height', defaultSize), " gap:", euiTheme.size.s, ";border-radius:", euiTheme.border.radius.control, ";;label:default;"),
+      compressed: /*#__PURE__*/css(logicalCSS('height', compressedSize), " gap:", euiTheme.size.xs, ";border-radius:", euiTheme.border.radius.control, ";;label:compressed;")
     },
     icon: {
       euiTreeView__iconWrapper: /*#__PURE__*/css("flex-shrink:0;line-height:0;&>*{", logicalCSS('max-width', '100%'), ";}&>.euiToken{", logicalCSS('max-height', '100%'), " ", logicalCSS('height', 'auto'), " svg{", logicalCSS('width', '100%'), ";}};label:euiTreeView__iconWrapper;"),

package/optimize/es/global_styling/mixins/_button.js

@@ -199,8 +199,10 @@ var euiButtonFocusCSS = function euiButtonFocusCSS(_euiThemeContext) {
 export var euiButtonSizeMap = function euiButtonSizeMap(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
 
-  // TODO: replace with token once available
-  var radiusInset = '2px';
+  // Used for inset buttons that sit within a parent container
+  var radiusInset = mathWithUnits([euiTheme.border.radius.control, euiTheme.size.xxs], function (x, y) {
+    return x - y;
+  });
   var getInsetHeight = function getInsetHeight(height, padding) {
     return mathWithUnits([height, padding], function (x, y) {
       return x - y * 2;
@@ -214,7 +216,7 @@ export var euiButtonSizeMap = function euiButtonSizeMap(euiThemeContext) {
       padding: mathWithUnits(euiTheme.size.m, function (x) {
         return x / 2;
       }),
-      radius: euiTheme.border.radius.small,
+      radius: euiTheme.border.radius.control,
       radiusInset: radiusInset,
       fontScale: 'xs'
     },
@@ -223,7 +225,7 @@ export var euiButtonSizeMap = function euiButtonSizeMap(euiThemeContext) {
       height: euiTheme.size.xl,
       getInsetHeight: getInsetHeight,
       padding: euiTheme.size.s,
-      radius: euiTheme.border.radius.small,
+      radius: euiTheme.border.radius.control,
       radiusInset: radiusInset,
       fontScale: 's'
     },
@@ -232,7 +234,7 @@ export var euiButtonSizeMap = function euiButtonSizeMap(euiThemeContext) {
       height: euiTheme.size.xxl,
       getInsetHeight: getInsetHeight,
       padding: euiTheme.size.m,
-      radius: euiTheme.border.radius.small,
+      radius: euiTheme.border.radius.control,
       radiusInset: radiusInset,
       fontScale: 's'
     }
@@ -264,7 +266,7 @@ export var euiButtonInteractionStyles = function euiButtonInteractionStyles(euiT
  */
 export var highContrastHoverIndicatorStyles = function highContrastHoverIndicatorStyles(_ref2) {
   var euiTheme = _ref2.euiTheme;
-  return "\n  &:hover:not(".concat(euiDisabledSelector, ") {\n    transition: none;\n\n    /* using pseudo border to be able to control the color */\n    &::after {\n      content: '';\n      position: absolute;\n      inset: ").concat(euiTheme.border.width.thin, ";\n      border: ").concat(euiTheme.border.width.thick, " solid var(--highContrastHoverIndicatorColor, ").concat(euiTheme.border.color, ");\n      border-radius: ").concat(mathWithUnits(euiTheme.border.radius.small, function (x) {
+  return "\n  &:hover:not(".concat(euiDisabledSelector, ") {\n    transition: none;\n\n    /* using pseudo border to be able to control the color */\n    &::after {\n      content: '';\n      position: absolute;\n      inset: ").concat(euiTheme.border.width.thin, ";\n      border: ").concat(euiTheme.border.width.thick, " solid var(--highContrastHoverIndicatorColor, ").concat(euiTheme.border.color, ");\n      border-radius: ").concat(mathWithUnits(euiTheme.border.radius.inline, function (x) {
     return x / 2;
   }), ";\n      background-color: transparent;\n      pointer-events: none;\n    }\n  }\n");
 };

package/optimize/es/services/popover/popover_arrow.styles.js

@@ -20,7 +20,7 @@ export var _popoverArrowStyles = function _popoverArrowStyles(_ref, arrowSize) {
   ], function (x, y) {
     return highContrastMode ? x / -2 : x / -2 - y;
   });
-  var arrowBorderRadius = mathWithUnits(euiTheme.border.radius.small, function (x) {
+  var arrowBorderRadius = mathWithUnits(euiTheme.border.radius.inline, function (x) {
     return x / 2;
   });
   return {

package/optimize/es/services/popover/popover_positioning.js

@@ -1,5 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -183,6 +185,24 @@ export function findPopoverPosition(_ref) {
   if (returnBoundingBox) {
     bestPosition.anchorBoundingBox = anchorBoundingBox;
   }
+
+  // Adjust the arrow position based on borderRadius to prevent unexpected rough edges.
+  // Done after position selection to ensure it doesn't affect the base panel position.
+  if (arrowConfig !== null && arrowConfig !== void 0 && arrowConfig.borderRadius && bestPosition.arrow) {
+    var crossAxisSide = positionSubstitutes[bestPosition.position];
+    var arrowValue = bestPosition.arrow[crossAxisSide];
+    if (typeof arrowValue === 'number' && arrowValue < arrowConfig.borderRadius) {
+      // Clamp the arrow to the corner and shift the panel by the same amount in the
+      // opposite direction so the arrow still points at the same position on the anchor.
+      var delta = arrowConfig.borderRadius - arrowValue;
+      bestPosition.arrow = _objectSpread(_objectSpread({}, bestPosition.arrow), {}, _defineProperty({}, crossAxisSide, arrowConfig.borderRadius));
+      if (crossAxisSide === 'top') {
+        bestPosition.top -= delta;
+      } else if (crossAxisSide === 'left') {
+        bestPosition.left -= delta;
+      }
+    }
+  }
   return bestPosition;
 }
 /**

package/optimize/lib/components/avatar/avatar.styles.js

@@ -62,7 +62,7 @@ var euiAvatarStyles = exports.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/optimize/lib/components/badge/notification_badge/badge_notification.styles.js

@@ -19,18 +19,16 @@ var _color_utils = require("../color_utils");
 var euiNotificationBadgeStyles = exports.euiNotificationBadgeStyles = function euiNotificationBadgeStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   var badgeColors = (0, _color_utils.euiBadgeColors)(euiThemeContext);
-  var borderRadius = (0, _global_styling.mathWithUnits)(euiTheme.border.radius.small, function (x) {
-    return x / 2;
+  var sizeM = (0, _global_styling.mathWithUnits)(euiTheme.size.xs, function (x) {
+    return x + euiTheme.base;
   });
   return {
-    euiNotificationBadge: /*#__PURE__*/(0, _react.css)("flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;", (0, _global_styling.logicalCSS)('padding-horizontal', euiTheme.size.xs), " border-radius:", borderRadius, ";", (0, _high_contrast.highContrastModeStyles)(euiThemeContext, {
+    euiNotificationBadge: /*#__PURE__*/(0, _react.css)("flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;", (0, _global_styling.logicalCSS)('padding-horizontal', euiTheme.size.xs), " ", (0, _high_contrast.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:", (0, _global_styling.euiFontSizeFromScale)('xs', euiTheme), ";font-weight:", euiTheme.font.weight.medium, ";", (0, _global_styling.euiNumberFormat)(euiThemeContext), " text-align:center;", _global_styling.euiCanAnimate, "{transition:all ", euiTheme.animation.fast, " ease-in;};label:euiNotificationBadge;"),
     // Sizes
-    s: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('height', euiTheme.size.base), " ", (0, _global_styling.logicalCSS)('min-width', euiTheme.size.base), ";;label:s;"),
-    m: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('height', (0, _global_styling.mathWithUnits)(euiTheme.size.xs, function (x) {
-      return x + euiTheme.base;
-    })), " ", (0, _global_styling.logicalCSS)('min-width', euiTheme.size.l), ";;label:m;"),
+    s: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('height', euiTheme.size.base), " ", (0, _global_styling.logicalCSS)('min-width', euiTheme.size.base), " border-radius:", euiTheme.border.radius.inline, ";;label:s;"),
+    m: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('height', sizeM), " ", (0, _global_styling.logicalCSS)('min-width', sizeM), " border-radius:", euiTheme.border.radius.control, ";;label:m;"),
     // Colors
     accent: /*#__PURE__*/(0, _react.css)(badgeColors.accentText, ";label:accent;"),
     success: /*#__PURE__*/(0, _react.css)(badgeColors.fill.success, ";label:success;"),