@elastic/eui 114.1.0 → 114.2.0

package/optimize/es/services/window_event/window_event.js

@@ -1,10 +1,3 @@
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/inherits";
-function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -13,49 +6,10 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
  * Side Public License, v 1.
  */
 
-import { Component } from 'react';
-export var EuiWindowEvent = /*#__PURE__*/function (_Component) {
-  function EuiWindowEvent() {
-    _classCallCheck(this, EuiWindowEvent);
-    return _callSuper(this, EuiWindowEvent, arguments);
-  }
-  _inherits(EuiWindowEvent, _Component);
-  return _createClass(EuiWindowEvent, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      this.addEvent(this.props);
-    }
-  }, {
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps) {
-      if (prevProps.event !== this.props.event || prevProps.handler !== this.props.handler) {
-        this.removeEvent(prevProps);
-        this.addEvent(this.props);
-      }
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.removeEvent(this.props);
-    }
-  }, {
-    key: "addEvent",
-    value: function addEvent(_ref) {
-      var event = _ref.event,
-        handler = _ref.handler;
-      window.addEventListener(event, handler);
-    }
-  }, {
-    key: "removeEvent",
-    value: function removeEvent(_ref2) {
-      var event = _ref2.event,
-        handler = _ref2.handler;
-      window.removeEventListener(event, handler);
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return null;
-    }
-  }]);
-}(Component);
+import { useEuiWindowEvent } from './hooks';
+export var EuiWindowEvent = function EuiWindowEvent(_ref) {
+  var event = _ref.event,
+    handler = _ref.handler;
+  useEuiWindowEvent(event, handler);
+  return null;
+};

package/optimize/lib/components/card/checkable_card/checkable_card.styles.js

@@ -18,8 +18,12 @@ var euiCheckableCardStyles = exports.euiCheckableCardStyles = function euiChecka
   var euiTheme = euiThemeContext.euiTheme;
   var padding = (0, _global_styling.euiPaddingSize)(euiThemeContext, 'm');
   return {
-    euiCheckableCard: /*#__PURE__*/(0, _react.css)(_global_styling.euiCanAnimate, "{transition:border-color ", euiTheme.animation.normal, " ease-in;};label:euiCheckableCard;"),
-    isChecked: /*#__PURE__*/(0, _react.css)("border-color:", euiTheme.colors.primary, ";;label:isChecked;"),
+    euiCheckableCard: /*#__PURE__*/(0, _react.css)(_global_styling.euiCanAnimate, "{&::after{transition:border-color ", euiTheme.animation.normal, " ease-in;}};label:euiCheckableCard;"),
+    isChecked: /*#__PURE__*/(0, _react.css)((0, _global_styling.highContrastModeStyles)(euiThemeContext, {
+      none: "\n          &::after {\n            border-color: ".concat(euiTheme.colors.primary, ";\n          }\n        "),
+      preferred: "\n          border-color: ".concat(euiTheme.colors.primary, ";\n        "),
+      forced: "\n          &::after {\n            content: '';\n            position: absolute;\n            inset: 0;\n            border: ".concat(euiTheme.border.width.thick, " solid ").concat(euiTheme.colors.primary, ";\n            border-radius: inherit;\n            pointer-events: none;\n\n            ").concat((0, _global_styling.preventForcedColors)(euiThemeContext), "\n          }\n        ")
+    }), ";;label:isChecked;"),
     label: {
       euiCheckableCard__label: /*#__PURE__*/(0, _react.css)("cursor:pointer;display:block;", _global_styling.logicals.width, ":calc(100% + (", padding, " * 2));padding:", padding, ";margin:-", padding, ";;label:euiCheckableCard__label;"),
       isDisabled: /*#__PURE__*/(0, _react.css)("color:", euiTheme.colors.disabledText, ";cursor:not-allowed;;label:isDisabled;")

package/optimize/lib/components/form/form_control_button/form_control_button.js

@@ -42,7 +42,7 @@ var EuiFormControlButton = exports.EuiFormControlButton = function EuiFormContro
     _isInvalid = _ref.isInvalid,
     _ref$fullWidth = _ref.fullWidth,
     fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth,
-    iconSide = _ref.iconSide,
+    _iconSide = _ref.iconSide,
     _isLoading = _ref.isLoading,
     href = _ref.href,
     rel = _ref.rel,
@@ -61,18 +61,19 @@ var EuiFormControlButton = exports.EuiFormControlButton = function EuiFormContro
   var isInvalid = _isInvalid !== null && _isInvalid !== void 0 ? _isInvalid : formLayoutIsInvalid;
   var isLoading = formLayoutIsLoading === true ? false : _isLoading;
   var compressed = _compressed !== null && _compressed !== void 0 ? _compressed : formLayoutCompressed;
+  var hasText = value || placeholder;
+  var iconSide = isLoading ? 'right' : _iconSide;
   var styles = (0, _services.useEuiMemoizedStyles)(_form_control_button.euiFormControlButtonStyles);
   var classes = (0, _classnames.default)('euiFormControlButton', className);
   var cssStyles = [styles.euiFormControlButton, isInvalid && styles.isInvalid, isLoading && styles.isLoading, formLayoutReadOnly && styles.readOnly, compressed && styles.compressed, fullWidth ? styles.fullWidth : styles.formWidth];
   var contentProps = _objectSpread(_objectSpread({}, _contentProps), {}, {
-    css: [styles.euiFormControlButton__content, _contentProps === null || _contentProps === void 0 ? void 0 : _contentProps.css]
+    css: [styles.euiFormControlButton__content, !hasText && iconSide === 'right' && styles.alignEnd, _contentProps === null || _contentProps === void 0 ? void 0 : _contentProps.css]
   });
   var customTextProps = _objectSpread(_objectSpread({}, _textProps), {}, {
     className: (0, _classnames.default)('eui-textTruncate', _textProps && (_textProps === null || _textProps === void 0 ? void 0 : _textProps.className)),
     css: [styles.textContent, !value && styles.placeholder, _textProps && (_textProps === null || _textProps === void 0 ? void 0 : _textProps.css)]
   });
   var content = children ? /*#__PURE__*/(0, _react.isValidElement)(children) ? children : (0, _react2.jsx)("span", null, children) : null;
-  var hasText = value || placeholder;
   var linkProps = _objectSpread({
     href: href,
     rel: rel

package/optimize/lib/components/form/form_control_button/form_control_button.styles.js

@@ -22,6 +22,14 @@ var _ref = process.env.NODE_ENV === "production" ? {
   styles: "flex:1;text-align:start;label:textContent;",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
+var _ref2 = process.env.NODE_ENV === "production" ? {
+  name: "dfpczd-alignEnd",
+  styles: "justify-content:flex-end;label:alignEnd;"
+} : {
+  name: "dfpczd-alignEnd",
+  styles: "justify-content:flex-end;label:alignEnd;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
 var euiFormControlButtonStyles = exports.euiFormControlButtonStyles = function euiFormControlButtonStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   var form = (0, _form.euiFormVariables)(euiThemeContext);
@@ -35,6 +43,7 @@ var euiFormControlButtonStyles = exports.euiFormControlButtonStyles = function e
     formWidth: formStyles.formWidth,
     fullWidth: /*#__PURE__*/(0, _react.css)(formStyles.fullWidth, ";label:fullWidth;"),
     euiFormControlButton__content: /*#__PURE__*/(0, _react.css)("justify-content:flex-start;", (0, _global_styling.logicalCSS)('width', '100%'), ";;label:euiFormControlButton__content;"),
+    alignEnd: _ref2,
     textContent: _ref,
     placeholder: /*#__PURE__*/(0, _react.css)((0, _form.euiFormPlaceholderStyles)(euiThemeContext), ";;label:placeholder;")
   };

package/optimize/lib/components/icon/assets/add_to_dashboard.js

@@ -0,0 +1,59 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.icon = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var React = _interopRequireWildcard(require("react"));
+var _services = require("../../../services");
+var _react2 = require("@emotion/react");
+var _excluded = ["title", "titleId"];
+/*
+ * 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.
+ */
+// THIS IS A GENERATED FILE. DO NOT MODIFY MANUALLY. @see scripts/compile-icons.js
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var EuiIconAddToDashboard = function EuiIconAddToDashboard(_ref) {
+  var title = _ref.title,
+    titleId = _ref.titleId,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var generateId = (0, _services.htmlIdGenerator)('add_to_dashboard');
+  return (0, _react2.jsx)("svg", (0, _extends2.default)({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    viewBox: "0 0 16 16",
+    "aria-labelledby": titleId
+  }, props), title ? (0, _react2.jsx)("title", {
+    id: titleId
+  }, title) : null, (0, _react2.jsx)("path", {
+    d: "m8.5 9.207 3.854-3.853-.708-.708L8.5 7.793l-2-2-3.854 3.853.708.708L6.5 7.207zM14 13h2v1h-2v2h-1v-2h-2v-1h2v-2h1z"
+  }), (0, _react2.jsx)("mask", {
+    id: generateId('a'),
+    width: 13,
+    height: 13,
+    x: 1,
+    y: 1,
+    maskUnits: "userSpaceOnUse",
+    style: {
+      maskType: 'alpha'
+    }
+  }, (0, _react2.jsx)("path", {
+    fillRule: "evenodd",
+    d: "M13.072 1c.464 0 .928.542.928 1.083v10.834c0 .541-.464 1.083-.929 1.083H1.931C1.464 14 1 13.567 1 12.917V2.083C1 1.542 1.467 1 1.93 1zM1.93 12.917h11.14V2.083H1.932z"
+  })), (0, _react2.jsx)("g", {
+    mask: "url(#".concat(generateId('a'), ")")
+  }, (0, _react2.jsx)("path", {
+    d: "M1-.083h13.464V9H9v5H1z"
+  })));
+};
+var icon = exports.icon = EuiIconAddToDashboard;

package/optimize/lib/components/icon/icon_map.js

@@ -27,6 +27,11 @@ var typeToPathMap = exports.typeToPathMap = {
       return _interopRequireWildcard(require('./assets/app_add_data'));
     });
   },
+  addToDashboard: function addToDashboard() {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('./assets/add_to_dashboard'));
+    });
+  },
   advancedSettingsApp: function advancedSettingsApp() {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require('./assets/app_advanced_settings'));

package/optimize/lib/components/icon/svgs/add_to_dashboard.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
+  <path d="m8.5 9.207 3.854-3.853-.708-.708L8.5 7.793l-2-2-3.854 3.853.708.708L6.5 7.207zM14 13h2v1h-2v2h-1v-2h-2v-1h2v-2h1z"/>
+  <mask id="a" width="13" height="13" x="1" y="1" maskUnits="userSpaceOnUse" style="mask-type:alpha">
+    <path fill-rule="evenodd" d="M13.072 1c.464 0 .928.542.928 1.083v10.834c0 .541-.464 1.083-.929 1.083H1.931C1.464 14 1 13.567 1 12.917V2.083C1 1.542 1.467 1 1.93 1zM1.93 12.917h11.14V2.083H1.932z"/>
+  </mask>
+  <g mask="url(#a)">
+    <path d="M1-.083h13.464V9H9v5H1z"/>
+  </g>
+</svg>

package/optimize/lib/components/markdown_editor/plugins/markdown_link_validator.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.DEFAULT_OPTIONS = void 0;
 exports.euiMarkdownLinkValidator = euiMarkdownLinkValidator;
+exports.isDocumentRelativeUrl = isDocumentRelativeUrl;
 exports.mutateLinkToText = mutateLinkToText;
 exports.validateUrl = validateUrl;
 var _unistUtilVisit = _interopRequireDefault(require("unist-util-visit"));
@@ -19,13 +20,33 @@ var _unistUtilVisit = _interopRequireDefault(require("unist-util-visit"));
 
 var DEFAULT_OPTIONS = exports.DEFAULT_OPTIONS = {
   allowRelative: true,
+  allowDocumentRelative: false,
   allowProtocols: ['https:', 'http:', 'mailto:']
 };
-function euiMarkdownLinkValidator(options) {
+function euiMarkdownLinkValidator(_ref) {
+  var _ref$allowRelative = _ref.allowRelative,
+    allowRelative = _ref$allowRelative === void 0 ? DEFAULT_OPTIONS.allowRelative : _ref$allowRelative,
+    _ref$allowDocumentRel = _ref.allowDocumentRelative,
+    allowDocumentRelative = _ref$allowDocumentRel === void 0 ? DEFAULT_OPTIONS.allowDocumentRelative : _ref$allowDocumentRel,
+    _ref$allowProtocols = _ref.allowProtocols,
+    allowProtocols = _ref$allowProtocols === void 0 ? DEFAULT_OPTIONS.allowProtocols : _ref$allowProtocols,
+    baseUrl = _ref.baseUrl;
   return function (ast) {
     (0, _unistUtilVisit.default)(ast, 'link', function (_node) {
       var node = _node;
-      if (!validateUrl(node.url, options)) {
+      if (allowRelative && allowDocumentRelative && (
+      // Prevent throwing in non-browser environments if baseUrl isn't configured
+      typeof window !== 'undefined' || baseUrl) && node.url && isDocumentRelativeUrl(node.url)) {
+        var newUrl = resolveDocumentRelativeUrl(node.url, baseUrl !== null && baseUrl !== void 0 ? baseUrl : window.location.href);
+        if (newUrl) {
+          node.url = newUrl;
+        } else {
+          mutateLinkToText(node);
+        }
+      } else if (!validateUrl(node.url, {
+        allowRelative: allowRelative,
+        allowProtocols: allowProtocols
+      })) {
         mutateLinkToText(node);
       }
     });
@@ -50,11 +71,11 @@ function mutateLinkToText(node) {
   delete node.url;
   return node;
 }
-function validateUrl(url, _ref) {
-  var _ref$allowRelative = _ref.allowRelative,
-    allowRelative = _ref$allowRelative === void 0 ? DEFAULT_OPTIONS.allowRelative : _ref$allowRelative,
-    _ref$allowProtocols = _ref.allowProtocols,
-    allowProtocols = _ref$allowProtocols === void 0 ? DEFAULT_OPTIONS.allowProtocols : _ref$allowProtocols;
+function validateUrl(url, _ref2) {
+  var _ref2$allowRelative = _ref2.allowRelative,
+    allowRelative = _ref2$allowRelative === void 0 ? DEFAULT_OPTIONS.allowRelative : _ref2$allowRelative,
+    _ref2$allowProtocols = _ref2.allowProtocols,
+    allowProtocols = _ref2$allowProtocols === void 0 ? DEFAULT_OPTIONS.allowProtocols : _ref2$allowProtocols;
   // relative captures both relative paths `/` and protocols `//`
   var isRelative = url.startsWith('/');
   if (isRelative) {
@@ -67,4 +88,38 @@ function validateUrl(url, _ref) {
     // failed to parse input as url
     return false;
   }
+}
+
+/**
+ * Tests whether a URL is a document relative URL (e.g. "discover", "dashboards#/view/123")
+ * that has no scheme, no leading slash, and is not an anchor or query-only link.
+ */
+function isDocumentRelativeUrl(url) {
+  if (url.startsWith('/') || url.startsWith('#') || url.startsWith('?')) {
+    return false;
+  }
+  // Return false if the url starts with a protocol/scheme. Catches http:, https:, mailto:, etc.
+  if (/^[a-z][a-z0-9+.-]*:/i.test(url)) {
+    return false;
+  }
+  return true;
+}
+
+/**
+ * Resolves a document relative URL against a base URL. This mostly replicates
+ * native browser resolution of e.g. `<a href="discover">`, except that
+ * trailing slashes are always removed to ensure consistent resolution,
+ * regardless of whether the current page URL ends with a trailing slash or not.
+ * Without this, "baz" on "/foo/bar/" resolves to "/foo/bar/baz" instead of the
+ * expected "/foo/baz".
+ */
+function resolveDocumentRelativeUrl(url, baseUrl) {
+  var normalizedBase = baseUrl.endsWith('/') ? baseUrl.slice(0, -1) : baseUrl;
+  try {
+    var resolved = new URL(url, normalizedBase);
+    return "".concat(resolved.pathname).concat(resolved.search).concat(resolved.hash);
+  } catch (e) {
+    // failed to parse URL
+    return null;
+  }
 }

package/optimize/lib/components/popover/wrapping_popover.js

@@ -5,80 +5,56 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.EuiWrappingPopover = void 0;
+exports.EuiWrappingPopover = EuiWrappingPopover;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _popover = require("./popover");
 var _portal = require("../portal");
 var _react2 = require("@emotion/react");
 var _excluded = ["button"];
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /*
+/*
  * 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.
  */
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
  * Injects the EuiPopover next to the button via EuiPortal
  * then the button element is moved into the popover dom.
  * On unmount, the button is moved back to its original location.
  */
-var EuiWrappingPopover = exports.EuiWrappingPopover = /*#__PURE__*/function (_Component) {
-  function EuiWrappingPopover() {
-    var _this;
-    (0, _classCallCheck2.default)(this, EuiWrappingPopover);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _callSuper(this, EuiWrappingPopover, [].concat(args));
-    (0, _defineProperty2.default)(_this, "portal", null);
-    (0, _defineProperty2.default)(_this, "setPortalRef", function (node) {
-      _this.portal = node;
-    });
-    (0, _defineProperty2.default)(_this, "setAnchorRef", function (node) {
-      node === null || node === void 0 || node.insertAdjacentElement('beforebegin', _this.props.button);
-    });
-    return _this;
-  }
-  (0, _inherits2.default)(EuiWrappingPopover, _Component);
-  return (0, _createClass2.default)(EuiWrappingPopover, [{
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      if (this.props.button.parentNode) {
-        if (this.portal) {
-          this.portal.insertAdjacentElement('beforebegin', this.props.button);
-        }
+
+function EuiWrappingPopover(props) {
+  var button = props.button,
+    rest = (0, _objectWithoutProperties2.default)(props, _excluded);
+  var portalRef = (0, _react.useRef)(null);
+  var setPortalRef = (0, _react.useCallback)(function (node) {
+    portalRef.current = node;
+  }, []);
+  var setAnchorRef = (0, _react.useCallback)(function (node) {
+    node === null || node === void 0 || node.insertAdjacentElement('beforebegin', button);
+  }, [button]);
+  (0, _react.useLayoutEffect)(function () {
+    return function () {
+      if (button.parentNode && portalRef.current) {
+        portalRef.current.insertAdjacentElement('beforebegin', button);
       }
+    };
+  }, [button]);
+  return (0, _react2.jsx)(_portal.EuiPortal, {
+    portalRef: setPortalRef,
+    insert: {
+      sibling: button,
+      position: 'after'
     }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-        button = _this$props.button,
-        rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
-      return (0, _react2.jsx)(_portal.EuiPortal, {
-        portalRef: this.setPortalRef,
-        insert: {
-          sibling: this.props.button,
-          position: 'after'
-        }
-      }, (0, _react2.jsx)(_popover.EuiPopover, (0, _extends2.default)({}, rest, {
-        button: (0, _react2.jsx)("div", {
-          ref: this.setAnchorRef,
-          className: "euiWrappingPopover__anchor"
-        })
-      })));
-    }
-  }]);
-}(_react.Component);
+  }, (0, _react2.jsx)(_popover.EuiPopover, (0, _extends2.default)({}, rest, {
+    button: (0, _react2.jsx)("div", {
+      ref: setAnchorRef,
+      className: "euiWrappingPopover__anchor"
+    })
+  })));
+}

package/optimize/lib/components/search_bar/filters/is_filter.js

@@ -1,85 +1,61 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.IsFilter = void 0;
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _filter_group = require("../../filter_group");
 var _predicate = require("../../../services/predicate");
 var _query = require("../query");
 var _react2 = require("@emotion/react");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /*
+/*
  * 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 IsFilter = exports.IsFilter = /*#__PURE__*/function (_Component) {
-  function IsFilter() {
-    (0, _classCallCheck2.default)(this, IsFilter);
-    return _callSuper(this, IsFilter, arguments);
-  }
-  (0, _inherits2.default)(IsFilter, _Component);
-  return (0, _createClass2.default)(IsFilter, [{
-    key: "resolveDisplay",
-    value: function resolveDisplay(clause) {
-      var _this$props$config = this.props.config,
-        name = _this$props$config.name,
-        negatedName = _this$props$config.negatedName;
-      if ((0, _predicate.isNil)(clause)) {
-        return {
-          hasActiveFilters: false,
-          name: name
-        };
-      }
-      return _query.Query.isMust(clause) ? {
-        hasActiveFilters: true,
+
+var IsFilter = exports.IsFilter = function IsFilter(props) {
+  var resolveDisplay = function resolveDisplay(clause) {
+    var _props$config = props.config,
+      name = _props$config.name,
+      negatedName = _props$config.negatedName;
+    if ((0, _predicate.isNil)(clause)) {
+      return {
+        hasActiveFilters: false,
         name: name
-      } : {
-        hasActiveFilters: true,
-        name: negatedName ? negatedName : "Not ".concat(name)
-      };
-    }
-  }, {
-    key: "valueChanged",
-    value: function valueChanged(field, checked) {
-      var query = checked ? this.props.query.removeIsClause(field) : this.props.query.addMustIsClause(field);
-      this.props.onChange(query);
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this = this;
-      var _this$props = this.props,
-        query = _this$props.query,
-        config = _this$props.config;
-      var clause = query.getIsClause(config.field);
-      var checked = !(0, _predicate.isNil)(clause);
-      var _this$resolveDisplay = this.resolveDisplay(clause),
-        hasActiveFilters = _this$resolveDisplay.hasActiveFilters,
-        name = _this$resolveDisplay.name;
-      var onClick = function onClick() {
-        _this.valueChanged(config.field, checked);
       };
-      return (0, _react2.jsx)(_filter_group.EuiFilterButton, {
-        onClick: onClick,
-        isSelected: hasActiveFilters,
-        hasActiveFilters: hasActiveFilters,
-        "aria-pressed": !!hasActiveFilters,
-        isToggle: true
-      }, name);
     }
-  }]);
-}(_react.Component);
+    return _query.Query.isMust(clause) ? {
+      hasActiveFilters: true,
+      name: name
+    } : {
+      hasActiveFilters: true,
+      name: negatedName ? negatedName : "Not ".concat(name)
+    };
+  };
+  var valueChanged = function valueChanged(field, checked) {
+    var query = checked ? props.query.removeIsClause(field) : props.query.addMustIsClause(field);
+    props.onChange(query);
+  };
+  var query = props.query,
+    config = props.config;
+  var clause = query.getIsClause(config.field);
+  var checked = !(0, _predicate.isNil)(clause);
+  var _resolveDisplay = resolveDisplay(clause),
+    hasActiveFilters = _resolveDisplay.hasActiveFilters,
+    name = _resolveDisplay.name;
+  var onClick = function onClick() {
+    valueChanged(config.field, checked);
+  };
+  return (0, _react2.jsx)(_filter_group.EuiFilterButton, {
+    onClick: onClick,
+    isSelected: hasActiveFilters,
+    hasActiveFilters: hasActiveFilters,
+    "aria-pressed": !!hasActiveFilters,
+    isToggle: true
+  }, name);
+};

package/optimize/lib/components/selectable/selectable.js

@@ -483,16 +483,6 @@ var EuiSelectable = exports.EuiSelectable = /*#__PURE__*/function (_Component) {
       var resultsLength = visibleOptions.filter(function (option) {
         return !option.disabled;
       }).length;
-      var listScreenReaderStatus = searchable && (0, _react2.jsx)(_i18n.EuiI18n, {
-        token: "euiSelectable.searchResults",
-        default: function _default(_ref6) {
-          var resultsLength = _ref6.resultsLength;
-          return "".concat(resultsLength, " result").concat(resultsLength === 1 ? '' : 's', " available");
-        },
-        values: {
-          resultsLength: resultsLength
-        }
-      });
       var listAriaDescribedbyId = this.rootId('instructions');
       var listAccessibleName = getAccessibleName(listProps, listAriaDescribedbyId);
       var listHasAccessibleName = Boolean(Object.keys(listAccessibleName).length);
@@ -500,9 +490,20 @@ var EuiSelectable = exports.EuiSelectable = /*#__PURE__*/function (_Component) {
         token: "euiSelectable.placeholderName",
         default: "Filter options"
       }, function (placeholderName) {
-        return (0, _react2.jsx)(_react.default.Fragment, null, searchable && (0, _react2.jsx)(_accessibility.EuiScreenReaderLive, {
-          isActive: messageContent != null || activeOptionIndex != null
-        }, messageContent || listScreenReaderStatus), messageContent ? (0, _react2.jsx)(_selectable_message.EuiSelectableMessage, {
+        return (0, _react2.jsx)(_react.default.Fragment, null, searchable && (0, _react2.jsx)(_i18n.EuiI18n, {
+          token: "euiSelectable.searchResults",
+          default: function _default(_ref6) {
+            var resultsLength = _ref6.resultsLength;
+            return "".concat(resultsLength, " result").concat(resultsLength === 1 ? '' : 's', " available");
+          },
+          values: {
+            resultsLength: resultsLength
+          }
+        }, function (searchResults) {
+          return (0, _react2.jsx)(_accessibility.EuiScreenReaderLive, {
+            isActive: messageContent != null || activeOptionIndex != null
+          }, messageContent || searchResults);
+        }), messageContent ? (0, _react2.jsx)(_selectable_message.EuiSelectableMessage, {
           "data-test-subj": "euiSelectableMessage",
           id: _this2.messageContentId,
           bordered: listProps && listProps.bordered

package/optimize/lib/services/index.js

@@ -98,7 +98,8 @@ var _exportNames = {
   getTransitionTimings: true,
   getWaitDuration: true,
   performOnFrame: true,
-  EuiWindowEvent: true
+  EuiWindowEvent: true,
+  useEuiWindowEvent: true
 };
 Object.defineProperty(exports, "CENTER_ALIGNMENT", {
   enumerable: true,
@@ -605,6 +606,12 @@ Object.defineProperty(exports, "useEuiDisabledElement", {
     return _hooks.useEuiDisabledElement;
   }
 });
+Object.defineProperty(exports, "useEuiWindowEvent", {
+  enumerable: true,
+  get: function get() {
+    return _window_event.useEuiWindowEvent;
+  }
+});
 Object.defineProperty(exports, "useForceRender", {
   enumerable: true,
   get: function get() {