@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.
- package/dist/eui_charts_theme.js +330 -330
- package/dist/eui_charts_theme.js.map +1 -1
- package/es/components/filter_group/filter_button.js +3 -1
- package/es/components/image/image_caption.js +2 -2
- package/es/components/image/image_wrapper.styles.js +1 -1
- package/es/components/popover/wrapping_popover.js +45 -88
- package/es/components/portal/portal.js +38 -79
- package/eui.d.ts +4 -19
- package/lib/components/filter_group/filter_button.js +3 -1
- package/lib/components/image/image_caption.js +2 -2
- package/lib/components/image/image_wrapper.styles.js +1 -1
- package/lib/components/popover/wrapping_popover.js +44 -85
- package/lib/components/portal/portal.js +39 -82
- package/optimize/es/components/filter_group/filter_button.js +3 -1
- package/optimize/es/components/image/image_caption.js +2 -2
- package/optimize/es/components/image/image_wrapper.styles.js +1 -1
- package/optimize/es/components/popover/wrapping_popover.js +38 -79
- package/optimize/es/components/portal/portal.js +34 -61
- package/optimize/lib/components/filter_group/filter_button.js +3 -1
- package/optimize/lib/components/image/image_caption.js +2 -2
- package/optimize/lib/components/image/image_wrapper.styles.js +1 -1
- package/optimize/lib/components/popover/wrapping_popover.js +38 -78
- package/optimize/lib/components/portal/portal.js +45 -61
- package/package.json +1 -1
- package/test-env/components/filter_group/filter_button.js +3 -1
- package/test-env/components/image/image_caption.js +2 -2
- package/test-env/components/image/image_wrapper.styles.js +1 -1
- package/test-env/components/popover/wrapping_popover.js +38 -78
- 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:
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
15
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
26
16
|
|
|
27
|
-
function
|
|
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
|
|
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, {
|
|
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 =
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
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
|
-
|
|
66
|
-
|
|
67
|
-
|
|
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
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
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
|
|
1
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2
2
|
|
|
3
|
-
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
|
|
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
|
|
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
|
|
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
|
|
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 {
|
|
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 =
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
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
|
-
|
|
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
|
-
|
|
45
|
+
var _ref2 = insert || {},
|
|
46
|
+
sibling = _ref2.sibling,
|
|
47
|
+
position = _ref2.position;
|
|
59
48
|
|
|
60
|
-
|
|
61
|
-
|
|
49
|
+
useEffect(function () {
|
|
50
|
+
var portalNode = document.createElement('div');
|
|
51
|
+
portalNode.dataset.euiportal = 'true';
|
|
52
|
+
setPortalNode(portalNode);
|
|
62
53
|
|
|
63
|
-
if (
|
|
54
|
+
if (sibling == null || position == null) {
|
|
64
55
|
// no insertion defined, append to body
|
|
65
|
-
document.body.appendChild(
|
|
56
|
+
document.body.appendChild(portalNode);
|
|
66
57
|
} else {
|
|
67
58
|
// inserting before or after an element
|
|
68
|
-
|
|
69
|
-
position = insert.position;
|
|
70
|
-
sibling.insertAdjacentElement(insertPositions[position], _this.portalNode);
|
|
59
|
+
sibling.insertAdjacentElement(insertPositions[position], portalNode);
|
|
71
60
|
}
|
|
72
61
|
|
|
73
|
-
return
|
|
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
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
return
|
|
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 {
|
|
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
|
|
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 {
|
|
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
|
|
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:
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
40
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
49
41
|
|
|
50
|
-
function
|
|
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
|
|
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 =
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
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
|
-
|
|
76
|
-
|
|
77
|
-
|
|
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
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
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 = {
|