@elastic/eui 62.0.0 → 62.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (29) hide show
  1. package/dist/eui_charts_theme.js +330 -330
  2. package/dist/eui_charts_theme.js.map +1 -1
  3. package/es/components/filter_group/filter_button.js +3 -1
  4. package/es/components/image/image_caption.js +2 -2
  5. package/es/components/image/image_wrapper.styles.js +1 -1
  6. package/es/components/popover/wrapping_popover.js +45 -88
  7. package/es/components/portal/portal.js +38 -79
  8. package/eui.d.ts +4 -19
  9. package/lib/components/filter_group/filter_button.js +3 -1
  10. package/lib/components/image/image_caption.js +2 -2
  11. package/lib/components/image/image_wrapper.styles.js +1 -1
  12. package/lib/components/popover/wrapping_popover.js +44 -85
  13. package/lib/components/portal/portal.js +39 -82
  14. package/optimize/es/components/filter_group/filter_button.js +3 -1
  15. package/optimize/es/components/image/image_caption.js +2 -2
  16. package/optimize/es/components/image/image_wrapper.styles.js +1 -1
  17. package/optimize/es/components/popover/wrapping_popover.js +38 -79
  18. package/optimize/es/components/portal/portal.js +34 -61
  19. package/optimize/lib/components/filter_group/filter_button.js +3 -1
  20. package/optimize/lib/components/image/image_caption.js +2 -2
  21. package/optimize/lib/components/image/image_wrapper.styles.js +1 -1
  22. package/optimize/lib/components/popover/wrapping_popover.js +38 -78
  23. package/optimize/lib/components/portal/portal.js +45 -61
  24. package/package.json +1 -1
  25. package/test-env/components/filter_group/filter_button.js +3 -1
  26. package/test-env/components/image/image_caption.js +2 -2
  27. package/test-env/components/image/image_wrapper.styles.js +1 -1
  28. package/test-env/components/popover/wrapping_popover.js +38 -78
  29. package/test-env/components/portal/portal.js +46 -75
@@ -86,7 +86,9 @@ export var EuiFilterButton = function EuiFilterButton(_ref) {
86
86
  var badgeContent = showBadge && ___EmotionJSX(EuiNotificationBadge, {
87
87
  className: "euiFilterButton__notification",
88
88
  "aria-label": hasActiveFilters ? activeBadgeLabel : availableBadgeLabel,
89
- color: isDisabled || !hasActiveFilters ? 'subdued' : 'accent'
89
+ color: isDisabled || !hasActiveFilters ? 'subdued' : 'accent',
90
+ role: "marquee" // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/marquee_role
91
+
90
92
  }, badgeCount);
91
93
 
92
94
  var dataText;
@@ -17,10 +17,10 @@ export var EuiImageCaption = /*#__PURE__*/forwardRef(function (_ref, ref) {
17
17
  var euiTheme = useEuiTheme();
18
18
  var styles = euiImageCaptionStyles(euiTheme);
19
19
  var cssStyles = [styles.euiImageCaption, isOnOverlayMask && styles.isOnOverlayMask];
20
- return ___EmotionJSX("figcaption", {
20
+ return caption ? ___EmotionJSX("figcaption", {
21
21
  ref: ref,
22
22
  css: cssStyles
23
- }, caption);
23
+ }, caption) : null;
24
24
  });
25
25
  EuiImageCaption.propTypes = {
26
26
  isOnOverlayMask: PropTypes.bool
@@ -23,7 +23,7 @@ export var euiImageWrapperStyles = function euiImageWrapperStyles(euiThemeContex
23
23
  var euiTheme = euiThemeContext.euiTheme;
24
24
  return {
25
25
  // Base
26
- euiImageWrapper: /*#__PURE__*/css("display:table;", logicalCSS('max-width', '100%'), " ", logicalTextAlignCSS('center'), ";line-height:0;flex-shrink:0;;label:euiImageWrapper;"),
26
+ euiImageWrapper: /*#__PURE__*/css("display:inline-block;", logicalCSS('max-width', '100%'), " ", logicalTextAlignCSS('center'), ";line-height:0;flex-shrink:0;;label:euiImageWrapper;"),
27
27
  allowFullScreen: _ref,
28
28
  // Margins
29
29
  s: /*#__PURE__*/css("margin:", euiTheme.size.s, ";;label:s;"),
@@ -1,34 +1,22 @@
1
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
2
-
3
1
  var _excluded = ["button"];
4
2
 
5
3
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
6
4
 
7
- function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
8
-
9
- function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
10
-
11
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
12
-
13
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
14
-
15
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
5
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
16
6
 
17
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
7
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
18
8
 
19
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
9
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
20
10
 
21
- 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); }; }
11
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
22
12
 
23
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
13
+ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
24
14
 
25
- function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
15
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
26
16
 
27
- 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; } }
28
-
29
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
17
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
30
18
 
31
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
19
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
32
20
 
33
21
  /*
34
22
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -37,7 +25,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
37
25
  * in compliance with, at your election, the Elastic License 2.0 or the Server
38
26
  * Side Public License, v 1.
39
27
  */
40
- import React, { Component } from 'react';
28
+ import React, { useState, useEffect } from 'react';
41
29
  import PropTypes from "prop-types";
42
30
  import { EuiPopover } from './popover';
43
31
  import { EuiPortal } from '../portal';
@@ -48,77 +36,46 @@ import { jsx as ___EmotionJSX } from "@emotion/react";
48
36
  * then the button element is moved into the popover dom.
49
37
  * On unmount, the button is moved back to its original location.
50
38
  */
51
- export var EuiWrappingPopover = /*#__PURE__*/function (_Component) {
52
- _inherits(EuiWrappingPopover, _Component);
53
-
54
- var _super = _createSuper(EuiWrappingPopover);
55
-
56
- function EuiWrappingPopover() {
57
- var _this;
58
-
59
- _classCallCheck(this, EuiWrappingPopover);
60
-
61
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
62
- args[_key] = arguments[_key];
39
+ export var EuiWrappingPopover = function EuiWrappingPopover(_ref) {
40
+ var button = _ref.button,
41
+ rest = _objectWithoutProperties(_ref, _excluded);
42
+
43
+ var _useState = useState(null),
44
+ _useState2 = _slicedToArray(_useState, 2),
45
+ anchor = _useState2[0],
46
+ setAnchor = _useState2[1];
47
+
48
+ var _useState3 = useState(null),
49
+ _useState4 = _slicedToArray(_useState3, 2),
50
+ portal = _useState4[0],
51
+ setPortal = _useState4[1];
52
+
53
+ useEffect(function () {
54
+ if (anchor) {
55
+ // move the button into the popover DOM
56
+ anchor.insertAdjacentElement('beforebegin', button);
63
57
  }
64
58
 
65
- _this = _super.call.apply(_super, [this].concat(args));
66
-
67
- _defineProperty(_assertThisInitialized(_this), "portal", null);
68
-
69
- _defineProperty(_assertThisInitialized(_this), "anchor", null);
70
-
71
- _defineProperty(_assertThisInitialized(_this), "setPortalRef", function (node) {
72
- _this.portal = node;
73
- });
74
-
75
- _defineProperty(_assertThisInitialized(_this), "setAnchorRef", function (node) {
76
- _this.anchor = node;
77
- });
78
-
79
- return _this;
80
- }
81
-
82
- _createClass(EuiWrappingPopover, [{
83
- key: "componentDidMount",
84
- value: function componentDidMount() {
85
- if (this.anchor) {
86
- this.anchor.insertAdjacentElement('beforebegin', this.props.button);
87
- }
88
- }
89
- }, {
90
- key: "componentWillUnmount",
91
- value: function componentWillUnmount() {
92
- if (this.props.button.parentNode) {
93
- if (this.portal) {
94
- this.portal.insertAdjacentElement('beforebegin', this.props.button);
95
- }
59
+ return function () {
60
+ if (portal) {
61
+ // move the button back out of the popover DOM
62
+ portal.insertAdjacentElement('beforebegin', button);
96
63
  }
64
+ };
65
+ }, [anchor, button, portal]);
66
+ return ___EmotionJSX(EuiPortal, {
67
+ portalRef: setPortal,
68
+ insert: {
69
+ sibling: button,
70
+ position: 'after'
97
71
  }
98
- }, {
99
- key: "render",
100
- value: function render() {
101
- var _this$props = this.props,
102
- button = _this$props.button,
103
- rest = _objectWithoutProperties(_this$props, _excluded);
104
-
105
- return ___EmotionJSX(EuiPortal, {
106
- portalRef: this.setPortalRef,
107
- insert: {
108
- sibling: this.props.button,
109
- position: 'after'
110
- }
111
- }, ___EmotionJSX(EuiPopover, _extends({}, rest, {
112
- button: ___EmotionJSX("div", {
113
- ref: this.setAnchorRef,
114
- className: "euiWrappingPopover__anchor"
115
- })
116
- })));
117
- }
118
- }]);
119
-
120
- return EuiWrappingPopover;
121
- }(Component);
72
+ }, ___EmotionJSX(EuiPopover, _extends({}, rest, {
73
+ button: ___EmotionJSX("div", {
74
+ ref: setAnchor,
75
+ className: "euiWrappingPopover__anchor"
76
+ })
77
+ })));
78
+ };
122
79
  EuiWrappingPopover.propTypes = {
123
80
  button: PropTypes.any.isRequired
124
81
  };
@@ -1,26 +1,14 @@
1
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
1
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
2
2
 
3
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
3
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
4
4
 
5
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
5
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
6
6
 
7
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
7
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
8
8
 
9
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
9
+ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
10
10
 
11
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
12
-
13
- 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); }; }
14
-
15
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
16
-
17
- function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
18
-
19
- 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; } }
20
-
21
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
22
-
23
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
11
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
24
12
 
25
13
  /*
26
14
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
@@ -34,83 +22,54 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
34
22
  * NOTE: We can't test this component because Enzyme doesn't support rendering
35
23
  * into portals.
36
24
  */
37
- import { Component } from 'react';
38
- import PropTypes from "prop-types";
25
+ import { useState, useEffect } from 'react';
39
26
  import { createPortal } from 'react-dom';
40
27
  import { keysOf } from '../common';
28
+ import { useUpdateEffect } from '../../services';
41
29
  export var insertPositions = {
42
30
  after: 'afterend',
43
31
  before: 'beforebegin'
44
32
  };
45
33
  export var INSERT_POSITIONS = keysOf(insertPositions);
46
- export var EuiPortal = /*#__PURE__*/function (_Component) {
47
- _inherits(EuiPortal, _Component);
48
-
49
- var _super = _createSuper(EuiPortal);
50
-
51
- function EuiPortal(props) {
52
- var _this;
34
+ export var EuiPortal = function EuiPortal(_ref) {
35
+ var insert = _ref.insert,
36
+ portalRef = _ref.portalRef,
37
+ children = _ref.children;
53
38
 
54
- _classCallCheck(this, EuiPortal);
39
+ var _useState = useState(null),
40
+ _useState2 = _slicedToArray(_useState, 2),
41
+ portalNode = _useState2[0],
42
+ setPortalNode = _useState2[1]; // pull `sibling` and `position` out of insert in case their wrapping object is recreated every render
55
43
 
56
- _this = _super.call(this, props);
57
44
 
58
- _defineProperty(_assertThisInitialized(_this), "portalNode", void 0);
45
+ var _ref2 = insert || {},
46
+ sibling = _ref2.sibling,
47
+ position = _ref2.position;
59
48
 
60
- var insert = _this.props.insert;
61
- _this.portalNode = document.createElement('div');
49
+ useEffect(function () {
50
+ var portalNode = document.createElement('div');
51
+ portalNode.dataset.euiportal = 'true';
52
+ setPortalNode(portalNode);
62
53
 
63
- if (insert == null) {
54
+ if (sibling == null || position == null) {
64
55
  // no insertion defined, append to body
65
- document.body.appendChild(_this.portalNode);
56
+ document.body.appendChild(portalNode);
66
57
  } else {
67
58
  // inserting before or after an element
68
- var sibling = insert.sibling,
69
- position = insert.position;
70
- sibling.insertAdjacentElement(insertPositions[position], _this.portalNode);
59
+ sibling.insertAdjacentElement(insertPositions[position], portalNode);
71
60
  }
72
61
 
73
- return _this;
74
- }
75
-
76
- _createClass(EuiPortal, [{
77
- key: "componentDidMount",
78
- value: function componentDidMount() {
79
- this.updatePortalRef(this.portalNode);
80
- }
81
- }, {
82
- key: "componentWillUnmount",
83
- value: function componentWillUnmount() {
84
- if (this.portalNode.parentNode) {
85
- this.portalNode.parentNode.removeChild(this.portalNode);
86
- }
87
-
88
- this.updatePortalRef(null);
89
- }
90
- }, {
91
- key: "updatePortalRef",
92
- value: function updatePortalRef(ref) {
93
- if (this.props.portalRef) {
94
- this.props.portalRef(ref);
62
+ return function () {
63
+ if (portalNode && portalNode.parentNode) {
64
+ portalNode.parentNode.removeChild(portalNode);
95
65
  }
96
- }
97
- }, {
98
- key: "render",
99
- value: function render() {
100
- return /*#__PURE__*/createPortal(this.props.children, this.portalNode);
101
- }
102
- }]);
103
-
104
- return EuiPortal;
105
- }(Component);
106
- EuiPortal.propTypes = {
107
- /**
108
- * ReactNode to render as this component's content
109
- */
110
- children: PropTypes.node.isRequired,
111
- insert: PropTypes.shape({
112
- sibling: PropTypes.any.isRequired,
113
- position: PropTypes.oneOf(["before", "after"]).isRequired
114
- }),
115
- portalRef: PropTypes.func
66
+ };
67
+ }, [sibling, position]);
68
+ useUpdateEffect(function () {
69
+ portalRef === null || portalRef === void 0 ? void 0 : portalRef(portalNode);
70
+ return function () {
71
+ portalRef === null || portalRef === void 0 ? void 0 : portalRef(null);
72
+ };
73
+ }, [portalNode, portalRef]);
74
+ return portalNode == null ? null : /*#__PURE__*/createPortal(children, portalNode);
116
75
  };
package/eui.d.ts CHANGED
@@ -4611,7 +4611,7 @@ declare module '@elastic/eui/src/components/portal/portal' {
4611
4611
  * NOTE: We can't test this component because Enzyme doesn't support rendering
4612
4612
  * into portals.
4613
4613
  */
4614
- import { Component, ReactNode } from 'react';
4614
+ import { ReactNode } from 'react';
4615
4615
  interface InsertPositionsMap {
4616
4616
  after: InsertPosition;
4617
4617
  before: InsertPosition;
@@ -4629,14 +4629,7 @@ declare module '@elastic/eui/src/components/portal/portal' {
4629
4629
  };
4630
4630
  portalRef?: (ref: HTMLDivElement | null) => void;
4631
4631
  }
4632
- export class EuiPortal extends Component<EuiPortalProps> {
4633
- portalNode: HTMLDivElement;
4634
- constructor(props: EuiPortalProps);
4635
- componentDidMount(): void;
4636
- componentWillUnmount(): void;
4637
- updatePortalRef(ref: HTMLDivElement | null): void;
4638
- render(): import("react").ReactPortal;
4639
- }
4632
+ export const EuiPortal: React.FC<EuiPortalProps>;
4640
4633
  export {};
4641
4634
 
4642
4635
  }
@@ -5308,7 +5301,7 @@ declare module '@elastic/eui/src/components/popover/popover_footer' {
5308
5301
 
5309
5302
  }
5310
5303
  declare module '@elastic/eui/src/components/popover/wrapping_popover' {
5311
- import { Component } from 'react';
5304
+ import { FunctionComponent } from 'react';
5312
5305
  import { Props as EuiPopoverProps } from '@elastic/eui/src/components/popover/popover';
5313
5306
  export interface EuiWrappingPopoverProps extends EuiPopoverProps {
5314
5307
  button: HTMLElement;
@@ -5318,15 +5311,7 @@ declare module '@elastic/eui/src/components/popover/wrapping_popover' {
5318
5311
  * then the button element is moved into the popover dom.
5319
5312
  * On unmount, the button is moved back to its original location.
5320
5313
  */
5321
- export class EuiWrappingPopover extends Component<EuiWrappingPopoverProps> {
5322
- private portal;
5323
- private anchor;
5324
- componentDidMount(): void;
5325
- componentWillUnmount(): void;
5326
- setPortalRef: (node: HTMLElement | null) => void;
5327
- setAnchorRef: (node: HTMLElement | null) => void;
5328
- render(): JSX.Element;
5329
- }
5314
+ export const EuiWrappingPopover: FunctionComponent<EuiWrappingPopoverProps>;
5330
5315
 
5331
5316
  }
5332
5317
  declare module '@elastic/eui/src/components/popover' {
@@ -101,7 +101,9 @@ var EuiFilterButton = function EuiFilterButton(_ref) {
101
101
  var badgeContent = showBadge && (0, _react2.jsx)(_notification_badge.EuiNotificationBadge, {
102
102
  className: "euiFilterButton__notification",
103
103
  "aria-label": hasActiveFilters ? activeBadgeLabel : availableBadgeLabel,
104
- color: isDisabled || !hasActiveFilters ? 'subdued' : 'accent'
104
+ color: isDisabled || !hasActiveFilters ? 'subdued' : 'accent',
105
+ role: "marquee" // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/marquee_role
106
+
105
107
  }, badgeCount);
106
108
  var dataText;
107
109
 
@@ -37,10 +37,10 @@ var EuiImageCaption = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
37
37
  var euiTheme = (0, _services.useEuiTheme)();
38
38
  var styles = (0, _image_caption.euiImageCaptionStyles)(euiTheme);
39
39
  var cssStyles = [styles.euiImageCaption, isOnOverlayMask && styles.isOnOverlayMask];
40
- return (0, _react2.jsx)("figcaption", {
40
+ return caption ? (0, _react2.jsx)("figcaption", {
41
41
  ref: ref,
42
42
  css: cssStyles
43
- }, caption);
43
+ }, caption) : null;
44
44
  });
45
45
  exports.EuiImageCaption = EuiImageCaption;
46
46
  EuiImageCaption.propTypes = {
@@ -24,7 +24,7 @@ var euiImageWrapperStyles = function euiImageWrapperStyles(euiThemeContext) {
24
24
  var euiTheme = euiThemeContext.euiTheme;
25
25
  return {
26
26
  // Base
27
- euiImageWrapper: /*#__PURE__*/(0, _react.css)("display:table;", (0, _global_styling.logicalCSS)('max-width', '100%'), " ", (0, _global_styling.logicalTextAlignCSS)('center'), ";line-height:0;flex-shrink:0;;label:euiImageWrapper;"),
27
+ euiImageWrapper: /*#__PURE__*/(0, _react.css)("display:inline-block;", (0, _global_styling.logicalCSS)('max-width', '100%'), " ", (0, _global_styling.logicalTextAlignCSS)('center'), ";line-height:0;flex-shrink:0;;label:euiImageWrapper;"),
28
28
  allowFullScreen: _ref,
29
29
  // Margins
30
30
  s: /*#__PURE__*/(0, _react.css)("margin:", euiTheme.size.s, ";;label:s;"),
@@ -27,108 +27,67 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
27
27
 
28
28
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
29
29
 
30
- function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
31
-
32
- function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
33
-
34
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
35
-
36
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
37
-
38
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
30
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
39
31
 
40
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
32
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
41
33
 
42
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
34
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
43
35
 
44
- 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); }; }
36
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
45
37
 
46
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
38
+ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
47
39
 
48
- function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
40
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
49
41
 
50
- 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; } }
51
-
52
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
42
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
53
43
 
54
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
44
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
55
45
 
56
46
  /**
57
47
  * Injects the EuiPopover next to the button via EuiPortal
58
48
  * then the button element is moved into the popover dom.
59
49
  * On unmount, the button is moved back to its original location.
60
50
  */
61
- var EuiWrappingPopover = /*#__PURE__*/function (_Component) {
62
- _inherits(EuiWrappingPopover, _Component);
63
-
64
- var _super = _createSuper(EuiWrappingPopover);
65
-
66
- function EuiWrappingPopover() {
67
- var _this;
68
-
69
- _classCallCheck(this, EuiWrappingPopover);
70
-
71
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
72
- args[_key] = arguments[_key];
51
+ var EuiWrappingPopover = function EuiWrappingPopover(_ref) {
52
+ var button = _ref.button,
53
+ rest = _objectWithoutProperties(_ref, _excluded);
54
+
55
+ var _useState = (0, _react.useState)(null),
56
+ _useState2 = _slicedToArray(_useState, 2),
57
+ anchor = _useState2[0],
58
+ setAnchor = _useState2[1];
59
+
60
+ var _useState3 = (0, _react.useState)(null),
61
+ _useState4 = _slicedToArray(_useState3, 2),
62
+ portal = _useState4[0],
63
+ setPortal = _useState4[1];
64
+
65
+ (0, _react.useEffect)(function () {
66
+ if (anchor) {
67
+ // move the button into the popover DOM
68
+ anchor.insertAdjacentElement('beforebegin', button);
73
69
  }
74
70
 
75
- _this = _super.call.apply(_super, [this].concat(args));
76
-
77
- _defineProperty(_assertThisInitialized(_this), "portal", null);
78
-
79
- _defineProperty(_assertThisInitialized(_this), "anchor", null);
80
-
81
- _defineProperty(_assertThisInitialized(_this), "setPortalRef", function (node) {
82
- _this.portal = node;
83
- });
84
-
85
- _defineProperty(_assertThisInitialized(_this), "setAnchorRef", function (node) {
86
- _this.anchor = node;
87
- });
88
-
89
- return _this;
90
- }
91
-
92
- _createClass(EuiWrappingPopover, [{
93
- key: "componentDidMount",
94
- value: function componentDidMount() {
95
- if (this.anchor) {
96
- this.anchor.insertAdjacentElement('beforebegin', this.props.button);
97
- }
98
- }
99
- }, {
100
- key: "componentWillUnmount",
101
- value: function componentWillUnmount() {
102
- if (this.props.button.parentNode) {
103
- if (this.portal) {
104
- this.portal.insertAdjacentElement('beforebegin', this.props.button);
105
- }
71
+ return function () {
72
+ if (portal) {
73
+ // move the button back out of the popover DOM
74
+ portal.insertAdjacentElement('beforebegin', button);
106
75
  }
76
+ };
77
+ }, [anchor, button, portal]);
78
+ return (0, _react2.jsx)(_portal.EuiPortal, {
79
+ portalRef: setPortal,
80
+ insert: {
81
+ sibling: button,
82
+ position: 'after'
107
83
  }
108
- }, {
109
- key: "render",
110
- value: function render() {
111
- var _this$props = this.props,
112
- button = _this$props.button,
113
- rest = _objectWithoutProperties(_this$props, _excluded);
114
-
115
- return (0, _react2.jsx)(_portal.EuiPortal, {
116
- portalRef: this.setPortalRef,
117
- insert: {
118
- sibling: this.props.button,
119
- position: 'after'
120
- }
121
- }, (0, _react2.jsx)(_popover.EuiPopover, _extends({}, rest, {
122
- button: (0, _react2.jsx)("div", {
123
- ref: this.setAnchorRef,
124
- className: "euiWrappingPopover__anchor"
125
- })
126
- })));
127
- }
128
- }]);
129
-
130
- return EuiWrappingPopover;
131
- }(_react.Component);
84
+ }, (0, _react2.jsx)(_popover.EuiPopover, _extends({}, rest, {
85
+ button: (0, _react2.jsx)("div", {
86
+ ref: setAnchor,
87
+ className: "euiWrappingPopover__anchor"
88
+ })
89
+ })));
90
+ };
132
91
 
133
92
  exports.EuiWrappingPopover = EuiWrappingPopover;
134
93
  EuiWrappingPopover.propTypes = {