@elastic/eui 83.1.1-rc1.0 → 85.0.0

package/optimize/lib/components/search_bar/search_filters.js

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.EuiSearchFilters = void 0;
+exports.EuiSearchBarFilters = void 0;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
@@ -26,14 +26,14 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
                                                                                                                                                                                                                                                                                                                                            * in compliance with, at your election, the Elastic License 2.0 or the Server
                                                                                                                                                                                                                                                                                                                                            * Side Public License, v 1.
                                                                                                                                                                                                                                                                                                                                            */
-var EuiSearchFilters = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(EuiSearchFilters, _Component);
-  var _super = _createSuper(EuiSearchFilters);
-  function EuiSearchFilters() {
-    (0, _classCallCheck2.default)(this, EuiSearchFilters);
+var EuiSearchBarFilters = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(EuiSearchBarFilters, _Component);
+  var _super = _createSuper(EuiSearchBarFilters);
+  function EuiSearchBarFilters() {
+    (0, _classCallCheck2.default)(this, EuiSearchBarFilters);
     return _super.apply(this, arguments);
   }
-  (0, _createClass2.default)(EuiSearchFilters, [{
+  (0, _createClass2.default)(EuiSearchBarFilters, [{
     key: "render",
     value: function render() {
       var _this$props = this.props,
@@ -55,9 +55,9 @@ var EuiSearchFilters = /*#__PURE__*/function (_Component) {
       return (0, _react2.jsx)(_filter_group.EuiFilterGroup, null, items);
     }
   }]);
-  return EuiSearchFilters;
+  return EuiSearchBarFilters;
 }(_react.Component);
-exports.EuiSearchFilters = EuiSearchFilters;
-(0, _defineProperty2.default)(EuiSearchFilters, "defaultProps", {
+exports.EuiSearchBarFilters = EuiSearchBarFilters;
+(0, _defineProperty2.default)(EuiSearchBarFilters, "defaultProps", {
   filters: []
 });

package/optimize/lib/components/steps/step_horizontal.js

@@ -14,7 +14,7 @@ var _step_strings = require("./step_strings");
 var _services = require("../../services");
 var _step_horizontal = require("./step_horizontal.styles");
 var _react2 = require("@emotion/react");
-var _excluded = ["className", "step", "title", "onClick", "disabled", "status"];
+var _excluded = ["className", "step", "title", "onClick", "disabled", "status", "size"];
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -31,12 +31,14 @@ var EuiStepHorizontal = function EuiStepHorizontal(_ref) {
     disabled = _ref.disabled,
     _ref$status = _ref.status,
     status = _ref$status === void 0 ? 'incomplete' : _ref$status,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'm' : _ref$size,
     rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   if (disabled) status = 'disabled';
   var classes = (0, _classnames.default)('euiStepHorizontal', className);
   var euiTheme = (0, _services.useEuiTheme)();
   var styles = (0, _step_horizontal.euiStepHorizontalStyles)(euiTheme);
-  var cssStyles = [styles.euiStepHorizontal, status === 'disabled' ? styles.disabled : styles.enabled];
+  var cssStyles = [styles.euiStepHorizontal, styles[size], status === 'disabled' ? styles.disabled : styles.enabled];
   var numberStyles = (0, _step_horizontal.euiStepHorizontalNumberStyles)(euiTheme);
   var cssNumberStyles = [numberStyles.euiStepHorizontal__number];
   var titleStyles = (0, _step_horizontal.euiStepHorizontalTitleStyles)(euiTheme);
@@ -90,6 +92,8 @@ var EuiStepHorizontal = function EuiStepHorizontal(_ref) {
     className: "euiStepHorizontal__number",
     status: status,
     number: step,
+    titleSize: size === 's' ? 'xs' : 'm' // The titleSize map is not 1 to 1; small == xs on the titleSize map
+    ,
     css: cssNumberStyles
   }), (0, _react2.jsx)("span", {
     className: "euiStepHorizontal__title",

package/optimize/lib/components/steps/step_horizontal.styles.js

@@ -33,10 +33,16 @@ var euiStepHorizontalStyles = function euiStepHorizontalStyles(euiThemeContext)
    *    e.g. due to some of their titles wrapping to multiple lines
    */
 
-  return {
-    euiStepHorizontal: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalShorthandCSS)('padding', "".concat(euiTheme.size.l, " ").concat(euiTheme.size.base, " ").concat(euiTheme.size.base)), " display:flex;flex-direction:column;align-items:center;justify-content:flex-start;cursor:pointer;position:relative;inline-size:100%;&::before,&::after{content:'';position:absolute;background-color:", euiTheme.border.color, ";block-size:", euiTheme.border.width.thick, ";inline-size:calc(50% - (", euiStep.numberSize, " / 2));inset-block-start:", (0, _global_styling.mathWithUnits)([euiTheme.size.l, euiStep.numberSize], function (x, y) {
+  var _generateStepSizeAndInset = function _generateStepSizeAndInset(stepNumberSize) {
+    return /*#__PURE__*/(0, _react.css)("&::before,&::after{inline-size:calc(50% - (", stepNumberSize, " / 2));inset-block-start:", (0, _global_styling.mathWithUnits)([euiTheme.size.l, stepNumberSize], function (x, y) {
       return x + y / 2;
-    }), ";z-index:", euiTheme.levels.content, ";}&::before{inset-inline-start:0;}&::after{inset-inline-end:0;};label:euiStepHorizontal;"),
+    }), ";}");
+  };
+  return {
+    euiStepHorizontal: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalShorthandCSS)('padding', "".concat(euiTheme.size.l, " ").concat(euiTheme.size.base, " ").concat(euiTheme.size.base)), " display:flex;flex-direction:column;align-items:center;justify-content:flex-start;cursor:pointer;position:relative;inline-size:100%;&::before,&::after{content:'';position:absolute;background-color:", euiTheme.border.color, ";block-size:", euiTheme.border.width.thick, ";z-index:", euiTheme.levels.content, ";}&::before{inset-inline-start:0;}&::after{inset-inline-end:0;};label:euiStepHorizontal;"),
+    // Adjust the size of the step number and connecting lines based on size
+    m: _generateStepSizeAndInset(euiStep.numberSize),
+    s: _generateStepSizeAndInset(euiStep.numberXSSize),
     // Note: these selectors must be nested because focus/hover state
     // is on the parent container, but affects specific children
     enabled: /*#__PURE__*/(0, _react.css)("&:focus,&:hover{.euiStepHorizontal__title{text-decoration:underline;}}&:focus{outline:none;.euiStepHorizontal__number{", (0, _global_styling.euiFocusRing)(euiThemeContext), ";}.euiStepHorizontal__number:not(:focus-visible){outline:", euiTheme.focus.width, " solid ", euiTheme.colors.darkestShade, ";}};label:enabled;"),

package/optimize/lib/components/steps/steps_horizontal.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.EuiStepsHorizontal = void 0;
+exports.SIZES = exports.EuiStepsHorizontal = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _classnames = _interopRequireDefault(require("classnames"));
@@ -12,7 +12,7 @@ var _react = _interopRequireDefault(require("react"));
 var _step_horizontal = require("./step_horizontal");
 var _steps_horizontal = require("./steps_horizontal.styles");
 var _react2 = require("@emotion/react");
-var _excluded = ["className", "steps"];
+var _excluded = ["className", "steps", "size"];
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -20,9 +20,13 @@ var _excluded = ["className", "steps"];
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
+var SIZES = ['s', 'm'];
+exports.SIZES = SIZES;
 var EuiStepsHorizontal = function EuiStepsHorizontal(_ref) {
   var className = _ref.className,
     steps = _ref.steps,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'm' : _ref$size,
     rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var classes = (0, _classnames.default)('euiStepsHorizontal', className);
   var styles = (0, _steps_horizontal.euiStepsHorizontalStyles)();
@@ -38,7 +42,8 @@ var EuiStepsHorizontal = function EuiStepsHorizontal(_ref) {
       css: cssItemStyles,
       "aria-current": stepProps.status === 'current' ? 'step' : undefined
     }, (0, _react2.jsx)(_step_horizontal.EuiStepHorizontal, (0, _extends2.default)({
-      step: index + 1
+      step: index + 1,
+      size: size
     }, stepProps)));
   }));
 };

package/optimize/lib/components/tabs/tab.js

@@ -50,7 +50,7 @@ var EuiTab = function EuiTab(_ref) {
   var tabStyles = (0, _tab.euiTabStyles)(euiTheme);
   var cssTabStyles = [tabStyles.euiTab, expand && tabStyles.expanded, disabled && tabStyles.disabled.disabled, isSelected && (disabled ? tabStyles.disabled.selected : tabStyles.selected)];
   var tabContentStyles = (0, _tab.euiTabContentStyles)(euiTheme);
-  var cssTabContentStyles = [tabContentStyles.euiTab__content, size && tabContentStyles[size], isSelected && tabContentStyles.selected, disabled && tabContentStyles.disabled];
+  var cssTabContentStyles = [tabContentStyles.euiTab__content, size && tabContentStyles[size]];
   var prependNode = prepend && (0, _react2.jsx)("span", {
     className: "euiTab__prepend"
   }, prepend);

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

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.euiTabStyles = exports.euiTabContentStyles = void 0;
 var _react = require("@emotion/react");
 var _global_styling = require("../../global_styling");
-var _title = require("../title/title.styles");
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; } /*
                                                                                                                                                                                                                                                                                            * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
                                                                                                                                                                                                                                                                                            * or more contributor license agreements. Licensed under the Elastic License
@@ -14,7 +13,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
                                                                                                                                                                                                                                                                                            * in compliance with, at your election, the Elastic License 2.0 or the Server
                                                                                                                                                                                                                                                                                            * Side Public License, v 1.
                                                                                                                                                                                                                                                                                            */
-var _ref2 = process.env.NODE_ENV === "production" ? {
+var _ref = process.env.NODE_ENV === "production" ? {
   name: "10tso78-expanded",
   styles: "flex-basis:0%;flex-grow:1;justify-content:center;label:expanded;"
 } : {
@@ -22,13 +21,13 @@ var _ref2 = process.env.NODE_ENV === "production" ? {
   styles: "flex-basis:0%;flex-grow:1;justify-content:center;label:expanded;",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
-var euiTabStyles = function euiTabStyles(_ref3) {
-  var euiTheme = _ref3.euiTheme;
+var euiTabStyles = function euiTabStyles(_ref2) {
+  var euiTheme = _ref2.euiTheme;
   return {
-    euiTab: /*#__PURE__*/(0, _react.css)("display:flex;cursor:pointer;flex-direction:row;align-items:center;font-weight:", euiTheme.font.weight.semiBold, ";gap:", euiTheme.size.s, ";", (0, _global_styling.logicalCSS)('padding-vertical', 0), " ", (0, _global_styling.logicalCSS)('padding-horizontal', euiTheme.size.xs), " &:focus{background-color:transparent;outline-offset:-", euiTheme.focus.width, ";};label:euiTab;"),
+    euiTab: /*#__PURE__*/(0, _react.css)("display:flex;cursor:pointer;flex-direction:row;align-items:center;gap:", euiTheme.size.s, ";", (0, _global_styling.logicalCSS)('padding-vertical', 0), " ", (0, _global_styling.logicalCSS)('padding-horizontal', euiTheme.size.xs), "font-weight:", euiTheme.font.weight.semiBold, ";color:", euiTheme.colors.title, ";&:focus{outline-offset:-", euiTheme.focus.width, ";};label:euiTab;"),
     // variations
-    expanded: _ref2,
-    selected: /*#__PURE__*/(0, _react.css)("box-shadow:inset 0 -", euiTheme.border.width.thick, " 0 ", euiTheme.colors.primary, ";;label:selected;"),
+    expanded: _ref,
+    selected: /*#__PURE__*/(0, _react.css)("box-shadow:inset 0 -", euiTheme.border.width.thick, " 0 ", euiTheme.colors.primary, ";color:", euiTheme.colors.primaryText, ";;label:selected;"),
     disabled: {
       disabled: /*#__PURE__*/(0, _react.css)("cursor:not-allowed;color:", euiTheme.colors.disabledText, ";;label:disabled;"),
       selected: /*#__PURE__*/(0, _react.css)("box-shadow:inset 0 -", euiTheme.border.width.thick, " 0 ", euiTheme.colors.disabledText, ";;label:selected;")
@@ -36,30 +35,19 @@ var euiTabStyles = function euiTabStyles(_ref3) {
   };
 };
 exports.euiTabStyles = euiTabStyles;
-var _ref = process.env.NODE_ENV === "production" ? {
-  name: "1yhgei9-euiTab__content",
-  styles: "&:hover{text-decoration:none;};label:euiTab__content;"
-} : {
-  name: "1yhgei9-euiTab__content",
-  styles: "&:hover{text-decoration:none;};label:euiTab__content;",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-};
 var euiTabContentStyles = function euiTabContentStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiTab__content: _ref,
+    euiTab__content: /*#__PURE__*/(0, _react.css)("font-weight:", euiTheme.font.weight[euiTheme.font.title.weight], ";;label:euiTab__content;"),
     // sizes
-    s: /*#__PURE__*/(0, _react.css)((0, _title.euiTitle)(euiThemeContext, 'xxxs'), " line-height:", euiTheme.size.xl, ";;label:s;"),
-    m: /*#__PURE__*/(0, _react.css)((0, _title.euiTitle)(euiThemeContext, 'xxs'), " line-height:", euiTheme.size.xxl, ";;label:m;"),
-    l: /*#__PURE__*/(0, _react.css)((0, _title.euiTitle)(euiThemeContext, 'xs'), " line-height:", (0, _global_styling.mathWithUnits)([euiTheme.size.xl, euiTheme.size.s], function (x, y) {
+    s: /*#__PURE__*/(0, _react.css)("font-size:", (0, _global_styling.euiFontSize)(euiThemeContext, 'xs').fontSize, ";line-height:", euiTheme.size.xl, ";;label:s;"),
+    m: /*#__PURE__*/(0, _react.css)("font-size:", (0, _global_styling.euiFontSize)(euiThemeContext, 's').fontSize, ";line-height:", euiTheme.size.xxl, ";;label:m;"),
+    l: /*#__PURE__*/(0, _react.css)("font-size:", (0, _global_styling.euiFontSize)(euiThemeContext, 'm').fontSize, ";line-height:", (0, _global_styling.mathWithUnits)([euiTheme.size.xl, euiTheme.size.s], function (x, y) {
       return x + y;
     }), ";;label:l;"),
-    xl: /*#__PURE__*/(0, _react.css)((0, _title.euiTitle)(euiThemeContext, 's'), " line-height:", (0, _global_styling.mathWithUnits)([euiTheme.size.xxxl, euiTheme.size.s], function (x, y) {
+    xl: /*#__PURE__*/(0, _react.css)("font-size:", (0, _global_styling.euiFontSize)(euiThemeContext, 'l').fontSize, ";line-height:", (0, _global_styling.mathWithUnits)([euiTheme.size.xxxl, euiTheme.size.s], function (x, y) {
       return x + y;
-    }), ";;label:xl;"),
-    // variations
-    selected: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.primaryText, ";;label:selected;"),
-    disabled: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.disabledText, ";;label:disabled;")
+    }), ";;label:xl;")
   };
 };
 exports.euiTabContentStyles = euiTabContentStyles;

package/optimize/lib/components/text/text_align.js

@@ -9,7 +9,7 @@ exports.EuiTextAlign = exports.ALIGNMENTS = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
-var _clone_element = require("../../services/theme/clone_element");
+var _services = require("../../services");
 var _text_align = require("./text_align.styles");
 var _react2 = require("@emotion/react");
 var _excluded = ["children", "textAlign", "cloneElement"];
@@ -39,7 +39,7 @@ var EuiTextAlign = function EuiTextAlign(_ref) {
     css: cssStyles
   }, rest);
   if ( /*#__PURE__*/(0, _react.isValidElement)(children) && cloneElement) {
-    return (0, _clone_element.cloneElementWithCss)(children, props);
+    return (0, _services.cloneElementWithCss)(children, props);
   } else {
     return (0, _react2.jsx)("div", props, children);
   }

package/optimize/lib/components/text/text_color.js

@@ -9,7 +9,6 @@ exports.EuiTextColor = exports.COLORS = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
-var _clone_element = require("../../services/theme/clone_element");
 var _services = require("../../services");
 var _text_color = require("./text_color.styles");
 var _react2 = require("@emotion/react");
@@ -54,7 +53,7 @@ var EuiTextColor = function EuiTextColor(_ref) {
   }, rest);
   if ( /*#__PURE__*/(0, _react.isValidElement)(children) && cloneElement) {
     var childrenStyle = _objectSpread(_objectSpread({}, children.props.style), euiTextStyle);
-    return (0, _clone_element.cloneElementWithCss)(children, _objectSpread(_objectSpread({}, props), {}, {
+    return (0, _services.cloneElementWithCss)(children, _objectSpread(_objectSpread({}, props), {}, {
       style: childrenStyle
     }));
   } else {

package/optimize/lib/components/title/title.js

@@ -9,7 +9,6 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _services = require("../../services");
-var _clone_element = require("../../services/theme/clone_element");
 var _title = require("./title.styles");
 var _excluded = ["size", "children", "className", "textTransform"];
 /*
@@ -40,6 +39,6 @@ var EuiTitle = function EuiTitle(_ref) {
     css: cssStyles,
     className: classes
   }, rest);
-  return (0, _clone_element.cloneElementWithCss)(children, props);
+  return (0, _services.cloneElementWithCss)(children, props);
 };
 exports.EuiTitle = EuiTitle;

package/optimize/lib/components/toast/global_toast_list_item.js

@@ -8,7 +8,6 @@ exports.EuiGlobalToastListItem = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _services = require("../../services");
-var _clone_element = require("../../services/theme/clone_element");
 var _global_toast_list = require("./global_toast_list.styles");
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; } /*
@@ -29,7 +28,7 @@ var EuiGlobalToastListItem = function EuiGlobalToastListItem(_ref) {
   var styles = (0, _global_toast_list.euiGlobalToastListItemStyles)(euiTheme);
   var cssStyles = [styles.euiGlobalToastListItem, isDismissed && styles.dismissed];
   var classes = (0, _classnames.default)('euiGlobalToastListItem', children.props.className, className);
-  return (0, _clone_element.cloneElementWithCss)(children, _objectSpread(_objectSpread({}, children.props), {
+  return (0, _services.cloneElementWithCss)(children, _objectSpread(_objectSpread({}, children.props), {
     className: classes,
     css: cssStyles
   }));

package/{test-env/services/theme → optimize/lib/services/emotion}/clone_element.js

@@ -19,8 +19,6 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
  * React.cloneElement does not work if the cloned element does not already have the
  * `css` prop - as a result, we need to use `jsx()` to manually clone the element
  * See https://github.com/emotion-js/emotion/issues/1404
- *
- * NOTE: We're still using/testing this utility internally, so this is not yet a public API
  */
 var cloneElementWithCss = function cloneElementWithCss(element, props) {
   var clonedElement = element.props.__EMOTION_TYPE_PLEASE_DO_NOT_USE__ || element.type; // EMOTION_TYPE handles non-React elements (native JSX/HTML nodes)

package/optimize/lib/services/emotion/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _clone_element = require("./clone_element");
+Object.keys(_clone_element).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _clone_element[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _clone_element[key];
+    }
+  });
+});

package/optimize/lib/services/index.js

@@ -609,6 +609,18 @@ Object.keys(_console).forEach(function (key) {
   });
 });
 var _copy_to_clipboard = require("./copy_to_clipboard");
+var _emotion = require("./emotion");
+Object.keys(_emotion).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _emotion[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _emotion[key];
+    }
+  });
+});
 var _findElement = require("./findElement");
 Object.keys(_findElement).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/optimize/lib/services/theme/emotion.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.EuiEmotionThemeProvider = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@emotion/react");
+var _hooks = require("./hooks");
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * @see https://emotion.sh/docs/theming
+ * This Emotion theme provider is added for *consumer usage* & convenience only.
+ *
+ * EUI should stick to using our own context/`useEuiTheme` internally
+ * instead of Emotion's shorthand `css={theme => {}}` API. If consumers
+ * set their own theme via <ThemeProvider>; EUI's styles should continue
+ * working as-is.
+ */
+var EuiEmotionThemeProvider = function EuiEmotionThemeProvider(_ref) {
+  var children = _ref.children;
+  var euiThemeContext = (0, _hooks.useEuiTheme)();
+  return (0, _react2.jsx)(_react2.ThemeProvider, {
+    theme: euiThemeContext
+  }, children);
+};
+exports.EuiEmotionThemeProvider = EuiEmotionThemeProvider;

package/optimize/lib/services/theme/hooks.js

@@ -9,7 +9,7 @@ exports.withEuiTheme = exports.useEuiTheme = exports.RenderWithEuiTheme = void 0
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
 var _context = require("./context");
-var _provider = require("./provider");
+var _warning = require("./warning");
 var _react2 = require("@emotion/react");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -32,20 +32,8 @@ var useEuiTheme = function useEuiTheme() {
   var colorMode = (0, _react.useContext)(_context.EuiColorModeContext);
   var modifications = (0, _react.useContext)(_context.EuiModificationsContext);
   var isFallback = theme === _context.defaultComputedTheme;
-  var warningLevel = (0, _provider.getEuiDevProviderWarning)();
-  if (isFallback && typeof warningLevel !== 'undefined') {
-    switch (warningLevel) {
-      case 'log':
-        console.log(providerMessage);
-        break;
-      case 'warn':
-        console.warn(providerMessage);
-        break;
-      case 'error':
-        throw new Error(providerMessage);
-      default:
-        break;
-    }
+  if (isFallback) {
+    (0, _warning.emitEuiProviderWarning)(providerMessage);
   }
   var assembledTheme = (0, _react.useMemo)(function () {
     return {

package/optimize/lib/services/theme/index.js

@@ -84,7 +84,7 @@ Object.defineProperty(exports, "getComputed", {
 Object.defineProperty(exports, "getEuiDevProviderWarning", {
   enumerable: true,
   get: function get() {
-    return _provider.getEuiDevProviderWarning;
+    return _warning.getEuiDevProviderWarning;
   }
 });
 Object.defineProperty(exports, "getOn", {
@@ -108,7 +108,7 @@ Object.defineProperty(exports, "mergeDeep", {
 Object.defineProperty(exports, "setEuiDevProviderWarning", {
   enumerable: true,
   get: function get() {
-    return _provider.setEuiDevProviderWarning;
+    return _warning.setEuiDevProviderWarning;
   }
 });
 Object.defineProperty(exports, "setOn", {
@@ -132,5 +132,6 @@ Object.defineProperty(exports, "withEuiTheme", {
 var _context = require("./context");
 var _hooks = require("./hooks");
 var _provider = require("./provider");
+var _warning = require("./warning");
 var _utils = require("./utils");
 var _types = require("./types");

package/optimize/lib/services/theme/provider.js

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.setEuiDevProviderWarning = exports.getEuiDevProviderWarning = exports.EuiThemeProvider = void 0;
+exports.EuiThemeProvider = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
@@ -15,6 +15,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _css = require("@emotion/css");
 var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
 var _context = require("./context");
+var _emotion = require("./emotion");
 var _utils = require("./utils");
 var _react2 = require("@emotion/react");
 var _excluded = ["cloneElement", "className"];
@@ -28,15 +29,6 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           * in compliance with, at your election, the Elastic License 2.0 or the Server
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           * Side Public License, v 1.
                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           */
-var providerWarning = undefined;
-var setEuiDevProviderWarning = function setEuiDevProviderWarning(level) {
-  return providerWarning = level;
-};
-exports.setEuiDevProviderWarning = setEuiDevProviderWarning;
-var getEuiDevProviderWarning = function getEuiDevProviderWarning() {
-  return providerWarning;
-};
-exports.getEuiDevProviderWarning = getEuiDevProviderWarning;
 var EuiThemeProvider = function EuiThemeProvider(_ref) {
   var _system = _ref.theme,
     _colorMode = _ref.colorMode,
@@ -141,6 +133,6 @@ var EuiThemeProvider = function EuiThemeProvider(_ref) {
     value: theme
   }, (0, _react2.jsx)(_context.EuiNestedThemeContext.Provider, {
     value: nestedThemeContext
-  }, renderedChildren)))));
+  }, (0, _react2.jsx)(_emotion.EuiEmotionThemeProvider, null, renderedChildren))))));
 };
 exports.EuiThemeProvider = EuiThemeProvider;

package/optimize/lib/services/theme/warning.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.setEuiDevProviderWarning = exports.getEuiDevProviderWarning = exports.emitEuiProviderWarning = void 0;
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+var providerWarning = undefined;
+var setEuiDevProviderWarning = function setEuiDevProviderWarning(level) {
+  return providerWarning = level;
+};
+exports.setEuiDevProviderWarning = setEuiDevProviderWarning;
+var getEuiDevProviderWarning = function getEuiDevProviderWarning() {
+  return providerWarning;
+};
+
+// Not a public top-level EUI export, currently for internal use
+exports.getEuiDevProviderWarning = getEuiDevProviderWarning;
+var emitEuiProviderWarning = function emitEuiProviderWarning(providerMessage) {
+  switch (providerWarning) {
+    case 'log':
+      console.log(providerMessage);
+      break;
+    case 'warn':
+      console.warn(providerMessage);
+      break;
+    case 'error':
+      throw new Error(providerMessage);
+    case undefined:
+    default:
+      break;
+  }
+};
+exports.emitEuiProviderWarning = emitEuiProviderWarning;

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@elastic/eui",
   "description": "Elastic UI Component Library",
-  "version": "83.1.1-rc1.0",
+  "version": "85.0.0",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "lib",
   "module": "es",
   "types": "eui.d.ts",
-  "docker_image": "18.16.0",
+  "docker_image": "18.16.1",
   "engines": {
     "node": "16.x || 18.x || >=20.0"
   },
@@ -56,7 +56,8 @@
   },
   "resolutions": {
     "**/prismjs": "1.27.0",
-    "**/react": "^17.0.0"
+    "**/react": "^17.0.0",
+    "react-focus-lock": "^2.9.5"
   },
   "pre-commit": [
     "test-staged"
@@ -81,7 +82,7 @@
     "react-beautiful-dnd": "^13.1.0",
     "react-dropzone": "^11.5.3",
     "react-element-to-jsx-string": "^14.3.4",
-    "react-focus-on": "^3.9.0",
+    "react-focus-on": "^3.9.1",
     "react-input-autosize": "^3.0.0",
     "react-is": "^17.0.2",
     "react-remove-scroll-bar": "^2.3.4",

package/src/components/combo_box/combo_box_input/_combo_box_pill.scss

@@ -17,6 +17,10 @@
     margin: ($euiSizeXS + 1px) $euiSizeXS 0 0;
   }
 
+  .euiComboBox--compressed &--plainText {
+    margin-top: $euiSizeXS;
+  }
+
   &--plainText {
     @include euiFont;
     @include euiTextTruncate;

package/src/components/filter_group/_index.scss

@@ -1,3 +1 @@
-@import 'filter_group';
-@import 'filter_button';
 @import 'filter_select_item';

package/src/components/resizable_container/_resizable_collapse_button.scss

@@ -16,6 +16,7 @@
   animation: none !important; // stylelint-disable-line declaration-no-important
   // Remove transition from EuiButtonIcon because of the custom transforms
   transition-property: background, box-shadow;
+  background: $euiColorEmptyShade;
 
   &:focus {
     @include euiSlightShadowHover;

package/src/themes/amsterdam/overrides/_index.scss

@@ -1,7 +1,6 @@
 @import 'combo_box';
 @import 'data_grid';
 @import 'description_list';
-@import 'filter_group';
 @import 'form_control_layout';
 @import 'form_control_layout_delimited';
 @import 'form_controls';

package/test-env/components/accessibility/screen_reader_only/screen_reader_only.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.EuiScreenReaderOnly = void 0;
 var _classnames = _interopRequireDefault(require("classnames"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _clone_element = require("../../../services/theme/clone_element");
+var _services = require("../../../services");
 var _screen_reader_only = require("./screen_reader_only.styles");
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -28,7 +28,7 @@ var EuiScreenReaderOnly = function EuiScreenReaderOnly(_ref) {
     className: classes.length ? classes : undefined,
     css: cssStyles
   };
-  return (0, _clone_element.cloneElementWithCss)(children, props);
+  return (0, _services.cloneElementWithCss)(children, props);
 };
 exports.EuiScreenReaderOnly = EuiScreenReaderOnly;
 EuiScreenReaderOnly.propTypes = {