@elastic/eui 66.0.0 → 67.1.0

package/optimize/es/components/search_bar/query/ast_to_es_query_dsl.js

@@ -1,5 +1,5 @@
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 
 function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
 
@@ -14,11 +14,11 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-import { printIso8601 } from './date_format';
-import { isDateValue, dateValue } from './date_value';
-import { AST } from './ast';
 import { isArray, isDateLike, isString } from '../../../services/predicate';
 import { keysOf } from '../../common';
+import { AST } from './ast';
+import { printIso8601 } from './date_format';
+import { dateValue, isDateValue } from './date_value';
 
 var processDateOperation = function processDateOperation(value, operator) {
   var granularity = value.granularity,
@@ -108,12 +108,17 @@ export var _fieldValuesToQuery = function _fieldValuesToQuery(field, operations,
           }
         });
 
-        if (_terms.length > 0) {
+        if (_terms.length > 1) {
+          queries.push({
+            bool: _defineProperty({}, andOr === 'and' ? 'must' : 'should', _toConsumableArray(_terms.map(function (value) {
+              return {
+                match: _defineProperty({}, field, value)
+              };
+            })))
+          });
+        } else if (_terms.length === 1) {
           queries.push({
-            match: _defineProperty({}, field, {
-              query: _terms.join(' '),
-              operator: andOr
-            })
+            match: _defineProperty({}, field, _terms[0])
           });
         }
 

package/optimize/es/components/search_bar/query/query.js

@@ -40,6 +40,11 @@ export var Query = /*#__PURE__*/function () {
   }
 
   _createClass(Query, [{
+    key: "hasClauses",
+    value: function hasClauses() {
+      return this.ast.clauses.length > 0;
+    }
+  }, {
     key: "hasSimpleFieldClause",
     value: function hasSimpleFieldClause(field, value) {
       return this.ast.hasSimpleFieldClause(field, value);
@@ -99,6 +104,12 @@ export var Query = /*#__PURE__*/function () {
       var ast = this.ast.removeOrFieldClauses(field);
       return new Query(ast, this.syntax);
     }
+  }, {
+    key: "removeAllClauses",
+    value: function removeAllClauses() {
+      var ast = this.ast.removeAllClauses();
+      return new Query(ast, this.syntax);
+    }
   }, {
     key: "hasIsClause",
     value: function hasIsClause(flag) {
@@ -127,6 +138,12 @@ export var Query = /*#__PURE__*/function () {
       var ast = this.ast.removeIsClause(flag);
       return new Query(ast, this.syntax);
     }
+  }, {
+    key: "removeIsClauses",
+    value: function removeIsClauses() {
+      var ast = this.ast.removeIsClauses();
+      return new Query(ast, this.syntax);
+    }
     /**
      * Executes this query over the given iterable item and returns
      * an new array of all items that matched this query. Options:

package/optimize/es/components/suggest/suggest.js

@@ -1,7 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["onItemClick", "onBlur", "onFocus", "onInput", "onSearch", "status", "append", "tooltipContent", "suggestions", "id", "aria-label", "aria-labelledby", "isVirtualized", "fullWidth", "maxHeight"];
+var _excluded = ["onItemClick", "onBlur", "onFocus", "onInput", "onSearch", "status", "append", "tooltipContent", "suggestions", "id", "aria-label", "aria-labelledby", "isPreFiltered", "isVirtualized", "fullWidth", "maxHeight"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -56,6 +56,8 @@ export var EuiSuggest = function EuiSuggest(_ref) {
       id = _ref.id,
       ariaLabel = _ref['aria-label'],
       labelId = _ref['aria-labelledby'],
+      _ref$isPreFiltered = _ref.isPreFiltered,
+      isPreFiltered = _ref$isPreFiltered === void 0 ? false : _ref$isPreFiltered,
       _ref$isVirtualized = _ref.isVirtualized,
       isVirtualized = _ref$isVirtualized === void 0 ? false : _ref$isVirtualized,
       _ref$fullWidth = _ref.fullWidth,
@@ -222,6 +224,7 @@ export var EuiSuggest = function EuiSuggest(_ref) {
       isVirtualized: isVirtualized
     },
     searchable: true,
+    isPreFiltered: isPreFiltered,
     searchProps: _objectSpread({
       id: id,
       append: appendArray.length ? appendArray : undefined,

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

@@ -9,10 +9,6 @@ import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 var _excluded = ["children", "className", "anchorClassName", "anchorProps", "content", "title", "delay", "display"];
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -24,10 +20,12 @@ 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.
  */
-import React, { Component, cloneElement, Fragment } from 'react';
+import React, { Component } from 'react';
 import classNames from 'classnames';
 import { keysOf } from '../common';
 import { EuiPortal } from '../portal';
+import { EuiToolTipAnchor } from './tool_tip_anchor';
+import { EuiToolTipArrow } from './tool_tip_arrow';
 import { EuiToolTipPopover } from './tool_tip_popover';
 import { enqueueStateChange } from '../../services/react';
 import { findPopoverPosition, htmlIdGenerator } from '../../services';
@@ -114,16 +112,12 @@ export var EuiToolTip = /*#__PURE__*/function (_Component) {
       }
     });
 
+    _defineProperty(_assertThisInitialized(_this), "setAnchorRef", function (ref) {
+      return _this.anchor = ref;
+    });
+
     _defineProperty(_assertThisInitialized(_this), "setPopoverRef", function (ref) {
-      _this.popover = ref; // if the popover has been unmounted, clear
-      // any previous knowledge about its size
-
-      if (ref == null) {
-        _this.setState({
-          toolTipStyles: DEFAULT_TOOLTIP_STYLES,
-          arrowStyles: undefined
-        });
-      }
+      return _this.popover = ref;
     });
 
     _defineProperty(_assertThisInitialized(_this), "showToolTip", function () {
@@ -189,7 +183,9 @@ export var EuiToolTip = /*#__PURE__*/function (_Component) {
       enqueueStateChange(function () {
         if (_this._isMounted) {
           _this.setState({
-            visible: false
+            visible: false,
+            toolTipStyles: DEFAULT_TOOLTIP_STYLES,
+            arrowStyles: undefined
           });
         }
       });
@@ -249,8 +245,6 @@ export var EuiToolTip = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var _this2 = this;
-
       var _this$props = this.props,
           children = _this$props.children,
           className = _this$props.className,
@@ -266,57 +260,39 @@ export var EuiToolTip = /*#__PURE__*/function (_Component) {
           arrowStyles = _this$state.arrowStyles,
           id = _this$state.id,
           toolTipStyles = _this$state.toolTipStyles,
-          visible = _this$state.visible;
+          visible = _this$state.visible,
+          calculatedPosition = _this$state.calculatedPosition;
       var classes = classNames('euiToolTip', positionsToClassNameMap[this.state.calculatedPosition], className);
-      var anchorClasses = classNames('euiToolTipAnchor', display ? displayToClassNameMap[display] : null, anchorClassName, anchorProps === null || anchorProps === void 0 ? void 0 : anchorProps.className);
-      var tooltip;
-
-      if (visible && (content || title)) {
-        tooltip = ___EmotionJSX(EuiPortal, null, ___EmotionJSX(EuiToolTipPopover, _extends({
-          className: classes,
-          style: toolTipStyles,
-          positionToolTip: this.positionToolTip,
-          popoverRef: this.setPopoverRef,
-          title: title,
-          id: id,
-          role: "tooltip"
-        }, rest), ___EmotionJSX("div", {
-          style: arrowStyles,
-          className: "euiToolTip__arrow"
-        }), ___EmotionJSX(EuiResizeObserver, {
-          onResize: this.positionToolTip
-        }, function (resizeRef) {
-          return ___EmotionJSX("div", {
-            ref: resizeRef
-          }, content);
-        })));
-      }
-
-      var anchor = // eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
-      ___EmotionJSX("span", _extends({
-        ref: function ref(anchor) {
-          return _this2.anchor = anchor;
-        }
-      }, anchorProps, {
-        className: anchorClasses,
+      var anchorClasses = classNames(anchorClassName, anchorProps === null || anchorProps === void 0 ? void 0 : anchorProps.className);
+      return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(EuiToolTipAnchor, _extends({}, anchorProps, {
+        ref: this.setAnchorRef,
+        onBlur: this.onBlur,
+        onFocus: this.onFocus,
         onMouseOver: this.showToolTip,
-        onMouseOut: this.onMouseOut
-      }), /*#__PURE__*/cloneElement(children, _objectSpread({
-        onFocus: function onFocus(e) {
-          _this2.onFocus();
-
-          children.props.onFocus && children.props.onFocus(e);
-        },
-        onBlur: function onBlur(e) {
-          _this2.onBlur();
-
-          children.props.onBlur && children.props.onBlur(e);
-        }
-      }, visible && {
-        'aria-describedby': this.state.id
-      })));
-
-      return ___EmotionJSX(Fragment, null, anchor, tooltip);
+        onMouseOut: this.onMouseOut,
+        id: this.state.id,
+        className: anchorClasses,
+        display: display,
+        isVisible: visible
+      }), children), visible && (content || title) && ___EmotionJSX(EuiPortal, null, ___EmotionJSX(EuiToolTipPopover, _extends({
+        className: classes,
+        style: toolTipStyles,
+        positionToolTip: this.positionToolTip,
+        popoverRef: this.setPopoverRef,
+        title: title,
+        id: id,
+        role: "tooltip",
+        calculatedPosition: calculatedPosition
+      }, rest), ___EmotionJSX(EuiToolTipArrow, {
+        style: arrowStyles,
+        className: "euiToolTip__arrow"
+      }), ___EmotionJSX(EuiResizeObserver, {
+        onResize: this.positionToolTip
+      }, function (resizeRef) {
+        return ___EmotionJSX("div", {
+          ref: resizeRef
+        }, content);
+      }))));
     }
   }]);
 

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

@@ -0,0 +1,107 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject, _templateObject2;
+
+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
+ * 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.
+ */
+import { css, keyframes } from '@emotion/react';
+import { logicalCSS, logicalSizeCSS, euiFontSize } from '../../global_styling';
+import { COLOR_MODES_STANDARD, tint, shade } from '../../services';
+import { euiShadow } from '../../themes/amsterdam';
+export var euiToolTipBackgroundColor = function euiToolTipBackgroundColor(euiTheme, colorMode) {
+  return colorMode === COLOR_MODES_STANDARD.dark ? shade(euiTheme.colors.emptyShade, 1) : tint(euiTheme.colors.fullShade, 0.25);
+};
+export var euiToolTipBorderColor = function euiToolTipBorderColor(euiTheme, colorMode) {
+  return colorMode === COLOR_MODES_STANDARD.dark ? shade(euiTheme.colors.fullShade, 0.8) : tint(euiTheme.colors.fullShade, 0.35);
+};
+
+var euiToolTipAnimationVertical = function euiToolTipAnimationVertical(size) {
+  return keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    0% {\n        opacity: 0;\n        transform: translateY(", ");\n    }\n\n    100% {\n        opacity: 1;\n        transform: translateY(0);\n    }\n"])), size);
+};
+
+var euiToolTipAnimationHorizontal = function euiToolTipAnimationHorizontal(size) {
+  return keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    0% {\n        opacity: 0;\n        transform: translateX(", ");\n    }\n\n    100% {\n        opacity: 1;\n        transform: translateX(0);\n    }\n"])), size);
+};
+
+export var euiToolTipStyles = function euiToolTipStyles(euiThemeContext) {
+  var euiTheme = euiThemeContext.euiTheme,
+      colorMode = euiThemeContext.colorMode;
+  var animationTiming = "".concat(euiTheme.animation.slow, " ease-out 0s forwards");
+  /*
+   * 1. Shift arrow 1px more than half its size to account for border radius
+   */
+
+  var arrowSize = euiTheme.size.m;
+  var arrowSizeInt = parseInt(arrowSize, 10);
+  var arrowPlusSize = "".concat((arrowSizeInt / 2 + 1) * -1, "px");
+  /* 1 */
+
+  var arrowMinusSize = "".concat((arrowSizeInt / 2 - 1) * -1, "px");
+  /* 1 */
+
+  return {
+    // Base
+    euiToolTip: /*#__PURE__*/css(euiShadow(euiThemeContext), ";border-radius:", euiTheme.border.radius.medium, ";background-color:", euiToolTipBackgroundColor(euiTheme, colorMode), ";color:", euiTheme.colors.ghost, ";z-index:", euiTheme.levels.toast, ";", logicalCSS('max-width', '256px'), " overflow-wrap:break-word;padding:", euiTheme.size.s, ";", euiFontSize(euiThemeContext, 's'), ";position:absolute;[class*='euiHorizontalRule']{background-color:", euiToolTipBorderColor(euiTheme, colorMode), ";};label:euiToolTip;"),
+    // Sizes
+    s: /*#__PURE__*/css(euiFontSize(euiThemeContext, 'xs'), ";;label:s;"),
+    // Positions
+    top: /*#__PURE__*/css("animation:", euiToolTipAnimationVertical("-".concat(euiTheme.size.base)), " ", animationTiming, ";;label:top;"),
+    bottom: /*#__PURE__*/css("animation:", euiToolTipAnimationVertical(euiTheme.size.base), " ", animationTiming, ";[class*='euiToolTip__arrow']{transform:translateY(", arrowMinusSize, ") rotateZ(45deg);};label:bottom;"),
+    left: /*#__PURE__*/css("animation:", euiToolTipAnimationHorizontal("-".concat(euiTheme.size.base)), " ", animationTiming, ";[class*='euiToolTip__arrow']{transform:translateX(", arrowPlusSize, ") rotateZ(45deg);};label:left;"),
+    right: /*#__PURE__*/css("animation:", euiToolTipAnimationHorizontal(euiTheme.size.base), " ", animationTiming, ";[class*='euiToolTip__arrow']{transform:translateX(", arrowMinusSize, ") rotateZ(45deg);};label:right;"),
+    // Elements
+    euiToolTip__arrow: /*#__PURE__*/css("content:'';position:absolute;transform-origin:center;border-radius:2px;background-color:", euiToolTipBackgroundColor(euiTheme, colorMode), ";", logicalSizeCSS(arrowSize, arrowSize), ";transform:translateY(", arrowPlusSize, ") rotateZ(45deg);;label:euiToolTip__arrow;")
+  };
+};
+export var euiToolTipPopoverStyles = function euiToolTipPopoverStyles(_ref4) {
+  var euiTheme = _ref4.euiTheme,
+      colorMode = _ref4.colorMode;
+  return {
+    // Elements
+    euiToolTip__title: /*#__PURE__*/css("font-weight:", euiTheme.font.weight.bold, ";", logicalCSS('border-bottom', "solid ".concat(euiTheme.border.width.thin, " ").concat(euiToolTipBorderColor(euiTheme, colorMode))), ";", logicalCSS('padding-bottom', euiTheme.size.xs), ";", logicalCSS('margin-bottom', euiTheme.size.xs), ";;label:euiToolTip__title;")
+  };
+};
+
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "fzilnk-inlineBlock",
+  styles: "display:inline-block;label:inlineBlock;"
+} : {
+  name: "fzilnk-inlineBlock",
+  styles: "display:inline-block;label:inlineBlock;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+
+var _ref2 = process.env.NODE_ENV === "production" ? {
+  name: "14aceuy-block",
+  styles: "display:block;label:block;"
+} : {
+  name: "14aceuy-block",
+  styles: "display:block;label:block;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+
+var _ref3 = process.env.NODE_ENV === "production" ? {
+  name: "1s3i3p5-euiToolTipAnchor",
+  styles: "*[disabled]{pointer-events:none;};label:euiToolTipAnchor;"
+} : {
+  name: "1s3i3p5-euiToolTipAnchor",
+  styles: "*[disabled]{pointer-events:none;};label:euiToolTipAnchor;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+
+export var euiToolTipAnchorStyles = function euiToolTipAnchorStyles() {
+  return {
+    // Elements
+    euiToolTipAnchor: _ref3,
+    // Variants
+    block: _ref2,
+    inlineBlock: _ref
+  };
+};

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

@@ -0,0 +1,60 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["onBlur", "onFocus", "onMouseOver", "onMouseOut", "id", "className", "children", "display", "isVisible"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+/*
+ * 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.
+ */
+import React, { cloneElement, forwardRef } from 'react';
+import classNames from 'classnames';
+import { euiToolTipAnchorStyles } from './tool_tip.styles';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var EuiToolTipAnchor = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var _onBlur = _ref.onBlur,
+      _onFocus = _ref.onFocus,
+      onMouseOver = _ref.onMouseOver,
+      onMouseOut = _ref.onMouseOut,
+      id = _ref.id,
+      className = _ref.className,
+      children = _ref.children,
+      display = _ref.display,
+      isVisible = _ref.isVisible,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var anchorCss = euiToolTipAnchorStyles();
+  var cssStyles = [anchorCss.euiToolTipAnchor, anchorCss[display]];
+  var classes = classNames('euiToolTipAnchor', className);
+  return (// eslint-disable-next-line jsx-a11y/mouse-events-have-key-events
+    ___EmotionJSX("span", _extends({
+      ref: ref
+    }, rest, {
+      css: cssStyles,
+      className: classes,
+      onMouseOver: onMouseOver,
+      onMouseOut: onMouseOut
+    }), /*#__PURE__*/cloneElement(children, _objectSpread({
+      onFocus: function onFocus(e) {
+        _onFocus();
+
+        children.props.onFocus && children.props.onFocus(e);
+      },
+      onBlur: function onBlur(e) {
+        _onBlur();
+
+        children.props.onBlur && children.props.onBlur(e);
+      }
+    }, isVisible && {
+      'aria-describedby': id
+    })))
+  );
+});
+EuiToolTipAnchor.displayName = 'EuiToolTipAnchor';

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

@@ -0,0 +1,20 @@
+import _extends from "@babel/runtime/helpers/extends";
+
+/*
+ * 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.
+ */
+import React from 'react';
+import { useEuiTheme } from '../../services';
+import { euiToolTipStyles } from './tool_tip.styles';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var EuiToolTipArrow = function EuiToolTipArrow(props) {
+  var euiTheme = useEuiTheme();
+  var toolTipCss = euiToolTipStyles(euiTheme);
+  return ___EmotionJSX("div", _extends({
+    css: [toolTipCss.euiToolTip__arrow, ";label:EuiToolTipArrow;"]
+  }, props));
+};

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

@@ -1,17 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["children", "title", "className", "positionToolTip", "popoverRef"];
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+var _excluded = ["children", "title", "className", "positionToolTip", "popoverRef", "calculatedPosition"];
 
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -20,85 +9,55 @@ 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.
  */
-import React, { Component } from 'react';
+import React, { useEffect, useRef, useCallback } from 'react';
 import classNames from 'classnames';
+import { useEuiTheme } from '../../services';
+import { euiToolTipStyles, euiToolTipPopoverStyles } from './tool_tip.styles';
 import { jsx as ___EmotionJSX } from "@emotion/react";
-export var EuiToolTipPopover = /*#__PURE__*/function (_Component) {
-  _inherits(EuiToolTipPopover, _Component);
-
-  var _super = _createSuper(EuiToolTipPopover);
-
-  function EuiToolTipPopover() {
-    var _this;
-
-    _classCallCheck(this, EuiToolTipPopover);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
-
-    _defineProperty(_assertThisInitialized(_this), "popover", void 0);
-
-    _defineProperty(_assertThisInitialized(_this), "updateDimensions", function () {
-      requestAnimationFrame(function () {
-        // Because of this delay, sometimes `positionToolTip` becomes unavailable.
-        if (_this.popover) {
-          _this.props.positionToolTip();
-        }
-      });
-    });
-
-    _defineProperty(_assertThisInitialized(_this), "setPopoverRef", function (ref) {
-      _this.popover = ref;
-
-      if (_this.props.popoverRef) {
-        _this.props.popoverRef(ref);
+export var EuiToolTipPopover = function EuiToolTipPopover(_ref) {
+  var children = _ref.children,
+      title = _ref.title,
+      className = _ref.className,
+      positionToolTip = _ref.positionToolTip,
+      popoverRef = _ref.popoverRef,
+      calculatedPosition = _ref.calculatedPosition,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var popover = useRef();
+  var euiTheme = useEuiTheme();
+  var toolTipCss = euiToolTipStyles(euiTheme);
+  var popoverStyles = euiToolTipPopoverStyles(euiTheme);
+  var titleCss = [popoverStyles.euiToolTip__title];
+  var updateDimensions = useCallback(function () {
+    requestAnimationFrame(function () {
+      // Because of this delay, sometimes `positionToolTip` becomes unavailable.
+      if (popover.current) {
+        positionToolTip();
       }
     });
+  }, [positionToolTip]);
 
-    return _this;
-  }
-
-  _createClass(EuiToolTipPopover, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      document.body.classList.add('euiBody-hasPortalContent');
-      window.addEventListener('resize', this.updateDimensions);
+  var setPopoverRef = function setPopoverRef(ref) {
+    if (popoverRef) {
+      popoverRef(ref);
     }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      document.body.classList.remove('euiBody-hasPortalContent');
-      window.removeEventListener('resize', this.updateDimensions);
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          children = _this$props.children,
-          title = _this$props.title,
-          className = _this$props.className,
-          positionToolTip = _this$props.positionToolTip,
-          popoverRef = _this$props.popoverRef,
-          rest = _objectWithoutProperties(_this$props, _excluded);
-
-      var classes = classNames('euiToolTipPopover', className);
-      var optionalTitle;
+  };
 
-      if (title) {
-        optionalTitle = ___EmotionJSX("div", {
-          className: "euiToolTip__title"
-        }, title);
-      }
-
-      return ___EmotionJSX("div", _extends({
-        className: classes,
-        ref: this.setPopoverRef
-      }, rest), optionalTitle, children);
-    }
-  }]);
-
-  return EuiToolTipPopover;
-}(Component);
+  useEffect(function () {
+    document.body.classList.add('euiBody-hasPortalContent');
+    window.addEventListener('resize', updateDimensions);
+    return function () {
+      document.body.classList.remove('euiBody-hasPortalContent');
+      window.removeEventListener('resize', updateDimensions);
+    };
+  }, [updateDimensions]);
+  var classes = classNames('euiToolTipPopover', className);
+  return ___EmotionJSX("div", _extends({
+    css: [toolTipCss.euiToolTip, calculatedPosition && toolTipCss[calculatedPosition], ";label:EuiToolTipPopover;"],
+    className: classes,
+    ref: setPopoverRef
+  }, rest), title && ___EmotionJSX("div", {
+    css: titleCss,
+    className: "euiToolTip__title"
+  }, title), children);
+};

package/optimize/es/global_styling/index.js

@@ -8,4 +8,5 @@
 export * from './reset/global_styles';
 export * from './functions';
 export * from './variables';
-export * from './mixins';
+export * from './mixins';
+export * from './utility/animations';

package/optimize/es/global_styling/utility/animations.js

@@ -0,0 +1,13 @@
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+
+var _templateObject;
+
+/*
+ * 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.
+ */
+import { keyframes } from '@emotion/react';
+export var euiAnimFadeIn = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  0% {\n    opacity: 0;\n  }\n\n  100% {\n    opacity: 1;\n  }\n"])));

package/optimize/es/services/color/contrast.js

@@ -10,6 +10,8 @@ import _typeof from "@babel/runtime/helpers/typeof";
 import chroma from 'chroma-js';
 import { shade, tint, lightness as getLightness } from './manipulation';
 import { getOn } from '../theme/utils';
+export var wcagContrastMin = 4.5; // WCAG AA minimum contrast ratio for normal (non-large) text
+
 /**
  * Creates a new color that meets or exceeds WCAG level AA
  * @param foreground - Color to manipulate

package/optimize/es/services/index.js

@@ -11,7 +11,7 @@ export { keys };
 export { accessibleClickKeys, cascadingMenuKeys, comboBoxKeys, htmlIdGenerator, useGeneratedHtmlId } from './accessibility';
 export { LEFT_ALIGNMENT, RIGHT_ALIGNMENT, CENTER_ALIGNMENT } from './alignment';
 export { useIsWithinBreakpoints, useIsWithinMaxBreakpoint, useIsWithinMinBreakpoint, CurrentEuiBreakpointContext, CurrentEuiBreakpointProvider, useCurrentEuiBreakpoint } from './breakpoint';
-export { isColorDark, isValidHex, calculateContrast, calculateLuminance, hexToHsv, hexToRgb, hsvToHex, hsvToRgb, rgbToHex, rgbToHsv, VISUALIZATION_COLORS, DEFAULT_VISUALIZATION_COLOR, colorPalette, euiPaletteForLightBackground, euiPaletteForDarkBackground, euiPaletteColorBlind, euiPaletteColorBlindBehindText, euiPaletteForStatus, euiPaletteForTemperature, euiPaletteComplimentary, euiPaletteNegative, euiPalettePositive, euiPaletteCool, euiPaletteWarm, euiPaletteGray, getSteppedGradient, transparentize, tint, shade, tintOrShade, shadeOrTint, saturate, desaturate, lightness, makeHighContrastColor, makeDisabledContrastColor } from './color';
+export { isColorDark, isValidHex, calculateContrast, calculateLuminance, hexToHsv, hexToRgb, hsvToHex, hsvToRgb, rgbToHex, rgbToHsv, VISUALIZATION_COLORS, DEFAULT_VISUALIZATION_COLOR, colorPalette, euiPaletteForLightBackground, euiPaletteForDarkBackground, euiPaletteColorBlind, euiPaletteColorBlindBehindText, euiPaletteForStatus, euiPaletteForTemperature, euiPaletteComplimentary, euiPaletteNegative, euiPalettePositive, euiPaletteCool, euiPaletteWarm, euiPaletteGray, getSteppedGradient, transparentize, tint, shade, tintOrShade, shadeOrTint, saturate, desaturate, lightness, makeHighContrastColor, makeDisabledContrastColor, wcagContrastMin } from './color';
 export { useColorPickerState, useColorStopsState } from './color_picker';
 export * from './console';
 export { copyToClipboard } from './copy_to_clipboard';