@elastic/eui 90.0.0 → 90.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/es/components/collapsible_nav_beta/collapsible_nav_beta.styles.js +2 -2
- package/es/components/collapsible_nav_beta/collapsible_nav_body_footer.js +4 -1
- package/es/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js +13 -9
- package/es/components/collapsible_nav_beta/collapsible_nav_group/collapsible_nav_group.js +1 -101
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +20 -58
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +89 -37
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +67 -81
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.styles.js +1 -19
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.js +7 -102
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.styles.js +4 -4
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js +11 -90
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +150 -130
- package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_link.js +0 -10
- package/es/components/combo_box/combo_box.js +1 -1
- package/es/components/selectable/selectable.js +16 -1
- package/es/components/selectable/selectable_list/selectable_list.js +227 -78
- package/es/components/selectable/selectable_templates/selectable_template_sitewide.js +16 -1
- package/es/components/text_truncate/text_truncate.js +33 -10
- package/eui.d.ts +381 -68
- package/i18ntokens.json +38 -38
- package/lib/components/collapsible_nav_beta/collapsible_nav_beta.styles.js +1 -1
- package/lib/components/collapsible_nav_beta/collapsible_nav_body_footer.js +4 -1
- package/lib/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js +13 -9
- package/lib/components/collapsible_nav_beta/collapsible_nav_group/collapsible_nav_group.js +1 -101
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +20 -58
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +89 -37
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +66 -80
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.styles.js +11 -28
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.js +7 -104
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.styles.js +4 -4
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js +10 -89
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +150 -130
- package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_link.js +0 -10
- package/lib/components/combo_box/combo_box.js +1 -1
- package/lib/components/selectable/selectable.js +16 -1
- package/lib/components/selectable/selectable_list/selectable_list.js +227 -78
- package/lib/components/selectable/selectable_templates/selectable_template_sitewide.js +16 -1
- package/lib/components/text_truncate/text_truncate.js +32 -9
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_beta.styles.js +2 -2
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_body_footer.js +4 -1
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js +13 -9
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +1 -3
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +10 -5
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +8 -36
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.styles.js +1 -19
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.js +6 -23
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.styles.js +4 -4
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js +10 -10
- package/optimize/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +9 -5
- package/optimize/es/components/selectable/selectable_list/selectable_list.js +199 -76
- package/optimize/es/components/text_truncate/text_truncate.js +26 -9
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_beta.styles.js +1 -1
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_body_footer.js +4 -1
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js +13 -9
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +1 -3
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +10 -5
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +8 -36
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.styles.js +11 -28
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.js +6 -26
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.styles.js +4 -4
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js +9 -9
- package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +9 -5
- package/optimize/lib/components/selectable/selectable_list/selectable_list.js +199 -76
- package/optimize/lib/components/text_truncate/text_truncate.js +25 -8
- package/package.json +1 -1
- package/test-env/components/auto_sizer/auto_sizer.js +10 -3
- package/test-env/components/collapsible_nav_beta/collapsible_nav_beta.styles.js +1 -1
- package/test-env/components/collapsible_nav_beta/collapsible_nav_body_footer.js +4 -1
- package/test-env/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js +13 -9
- package/test-env/components/collapsible_nav_beta/collapsible_nav_group/collapsible_nav_group.js +1 -101
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js +20 -58
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_item.js +89 -37
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.js +66 -80
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_popover.styles.js +11 -28
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.js +7 -105
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_accordion.styles.js +4 -4
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js +10 -89
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js +150 -130
- package/test-env/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_link.js +0 -10
- package/test-env/components/combo_box/combo_box.js +1 -1
- package/test-env/components/selectable/selectable.js +16 -1
- package/test-env/components/selectable/selectable_list/selectable_list.js +227 -78
- package/test-env/components/selectable/selectable_templates/selectable_template_sitewide.js +16 -1
- package/test-env/components/text_truncate/text_truncate.js +32 -9
|
@@ -11,13 +11,12 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
|
11
11
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
12
12
|
var _react = _interopRequireWildcard(require("react"));
|
|
13
13
|
var _services = require("../../../../services");
|
|
14
|
-
var _link = require("../../../link");
|
|
15
14
|
var _popover = require("../../../popover");
|
|
16
15
|
var _collapsible_nav_item = require("../collapsible_nav_item");
|
|
17
16
|
var _collapsed_nav_button = require("./collapsed_nav_button");
|
|
18
17
|
var _collapsed_nav_popover = require("./collapsed_nav_popover.styles");
|
|
19
18
|
var _react2 = require("@emotion/react");
|
|
20
|
-
var _excluded = ["items", "
|
|
19
|
+
var _excluded = ["items", "title", "titleElement", "icon", "iconProps", "isSelected"];
|
|
21
20
|
/*
|
|
22
21
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
23
22
|
* or more contributor license agreements. Licensed under the Elastic License
|
|
@@ -29,14 +28,12 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
29
28
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
30
29
|
var EuiCollapsedNavPopover = function EuiCollapsedNavPopover(_ref) {
|
|
31
30
|
var items = _ref.items,
|
|
32
|
-
href = _ref.href,
|
|
33
|
-
linkProps = _ref.linkProps,
|
|
34
31
|
title = _ref.title,
|
|
35
|
-
titleElement = _ref.titleElement,
|
|
32
|
+
_ref$titleElement = _ref.titleElement,
|
|
33
|
+
TitleElement = _ref$titleElement === void 0 ? 'span' : _ref$titleElement,
|
|
36
34
|
icon = _ref.icon,
|
|
37
35
|
iconProps = _ref.iconProps,
|
|
38
36
|
isSelected = _ref.isSelected,
|
|
39
|
-
accordionProps = _ref.accordionProps,
|
|
40
37
|
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
41
38
|
var euiTheme = (0, _services.useEuiTheme)();
|
|
42
39
|
var styles = (0, _collapsed_nav_popover.euiCollapsedNavPopoverStyles)(euiTheme);
|
|
@@ -68,14 +65,11 @@ var EuiCollapsedNavPopover = function EuiCollapsedNavPopover(_ref) {
|
|
|
68
65
|
isSelected: isSelected,
|
|
69
66
|
onClick: togglePopover,
|
|
70
67
|
hideToolTip: isPopoverOpen
|
|
71
|
-
// Note: do not pass `linkProps` to buttons that toggle popovers
|
|
72
68
|
})
|
|
73
|
-
}, rest), (0, _react2.jsx)(
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
linkProps: linkProps
|
|
78
|
-
}), (0, _react2.jsx)("div", {
|
|
69
|
+
}, rest), (0, _react2.jsx)(_popover.EuiPopoverTitle, null, (0, _react2.jsx)(TitleElement, {
|
|
70
|
+
css: styles.euiCollapsedNavPopover__title,
|
|
71
|
+
className: "eui-textTruncate"
|
|
72
|
+
}, title)), (0, _react2.jsx)("div", {
|
|
79
73
|
css: styles.euiCollapsedNavPopover__items
|
|
80
74
|
}, items.map(function (item, index) {
|
|
81
75
|
return (0, _react2.jsx)(_collapsible_nav_item.EuiCollapsibleNavSubItem, (0, _extends2.default)({
|
|
@@ -83,26 +77,4 @@ var EuiCollapsedNavPopover = function EuiCollapsedNavPopover(_ref) {
|
|
|
83
77
|
}, item));
|
|
84
78
|
})));
|
|
85
79
|
};
|
|
86
|
-
exports.EuiCollapsedNavPopover = EuiCollapsedNavPopover;
|
|
87
|
-
var EuiCollapsedNavPopoverTitle = function EuiCollapsedNavPopoverTitle(_ref2) {
|
|
88
|
-
var title = _ref2.title,
|
|
89
|
-
_ref2$titleElement = _ref2.titleElement,
|
|
90
|
-
TitleElement = _ref2$titleElement === void 0 ? 'span' : _ref2$titleElement,
|
|
91
|
-
href = _ref2.href,
|
|
92
|
-
linkProps = _ref2.linkProps;
|
|
93
|
-
var euiTheme = (0, _services.useEuiTheme)();
|
|
94
|
-
var styles = (0, _collapsed_nav_popover.euiCollapsedNavPopoverTitleStyles)(euiTheme);
|
|
95
|
-
var cssStyles = [styles.euiCollapsedNavPopover__title, href ? styles.link : styles.span, href && (linkProps === null || linkProps === void 0 ? void 0 : linkProps.css)];
|
|
96
|
-
return (0, _react2.jsx)(_popover.EuiPopoverTitle, null, href ? (0, _react2.jsx)(_link.EuiLink, (0, _extends2.default)({
|
|
97
|
-
href: href,
|
|
98
|
-
color: "text"
|
|
99
|
-
}, linkProps, {
|
|
100
|
-
// ExclusiveUnion shenanigans :|
|
|
101
|
-
css: cssStyles
|
|
102
|
-
}), (0, _react2.jsx)(TitleElement, {
|
|
103
|
-
className: "eui-textTruncate"
|
|
104
|
-
}, title)) : (0, _react2.jsx)(TitleElement, {
|
|
105
|
-
css: cssStyles,
|
|
106
|
-
className: "eui-textTruncate"
|
|
107
|
-
}, title));
|
|
108
|
-
};
|
|
80
|
+
exports.EuiCollapsedNavPopover = EuiCollapsedNavPopover;
|
|
@@ -3,42 +3,25 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.euiCollapsedNavPopoverStyles = void 0;
|
|
7
7
|
var _react = require("@emotion/react");
|
|
8
8
|
var _global_styling = require("../../../../global_styling");
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
9
|
+
/*
|
|
10
|
+
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
11
|
+
* or more contributor license agreements. Licensed under the Elastic License
|
|
12
|
+
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
13
|
+
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
14
|
+
* Side Public License, v 1.
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
17
|
var euiCollapsedNavPopoverStyles = function euiCollapsedNavPopoverStyles(euiThemeContext) {
|
|
18
18
|
var euiTheme = euiThemeContext.euiTheme;
|
|
19
19
|
return {
|
|
20
20
|
euiCollapsedNavPopover__panel: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('width', (0, _global_styling.mathWithUnits)(euiTheme.size.base, function (x) {
|
|
21
21
|
return x * 15;
|
|
22
22
|
})), ";;label:euiCollapsedNavPopover__panel;"),
|
|
23
|
+
euiCollapsedNavPopover__title: /*#__PURE__*/(0, _react.css)("display:block;padding:", euiTheme.size.m, ";font-weight:", euiTheme.font.weight.bold, ";;label:euiCollapsedNavPopover__title;"),
|
|
23
24
|
euiCollapsedNavPopover__items: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiYScrollWithShadows)(euiThemeContext), " padding-block:", euiTheme.size.s, ";padding-inline:", euiTheme.size.xs, ";", (0, _global_styling.logicalCSS)('max-height', '50vh'), "@media (max-height: ", euiTheme.breakpoint.s, "px){", (0, _global_styling.logicalCSS)('max-height', '75vh'), ";};label:euiCollapsedNavPopover__items;")
|
|
24
25
|
};
|
|
25
26
|
};
|
|
26
|
-
exports.euiCollapsedNavPopoverStyles = euiCollapsedNavPopoverStyles;
|
|
27
|
-
var _ref = process.env.NODE_ENV === "production" ? {
|
|
28
|
-
name: "1423k63-span",
|
|
29
|
-
styles: "display:block;label:span;"
|
|
30
|
-
} : {
|
|
31
|
-
name: "1423k63-span",
|
|
32
|
-
styles: "display:block;label:span;",
|
|
33
|
-
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
34
|
-
};
|
|
35
|
-
var euiCollapsedNavPopoverTitleStyles = function euiCollapsedNavPopoverTitleStyles(euiThemeContext) {
|
|
36
|
-
var euiTheme = euiThemeContext.euiTheme;
|
|
37
|
-
var sharedStyles = (0, _collapsible_nav_item.euiCollapsibleNavItemVariables)(euiThemeContext);
|
|
38
|
-
return {
|
|
39
|
-
euiCollapsedNavPopover__title: /*#__PURE__*/(0, _react.css)("padding:", euiTheme.size.m, ";font-weight:", euiTheme.font.weight.bold, ";;label:euiCollapsedNavPopover__title;"),
|
|
40
|
-
link: /*#__PURE__*/(0, _react.css)("display:flex;align-items:center;[class*='euiLink__externalIcon']{", (0, _global_styling.logicalCSS)('margin-left', 'auto'), " ", (0, _global_styling.logicalCSS)('margin-right', euiTheme.size.xxs), " color:", sharedStyles.rightIconColor, ";};label:link;"),
|
|
41
|
-
span: _ref
|
|
42
|
-
};
|
|
43
|
-
};
|
|
44
|
-
exports.euiCollapsedNavPopoverTitleStyles = euiCollapsedNavPopoverTitleStyles;
|
|
27
|
+
exports.euiCollapsedNavPopoverStyles = euiCollapsedNavPopoverStyles;
|
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.EuiCollapsibleNavAccordion = void 0;
|
|
9
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
10
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
10
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
12
|
-
var _react =
|
|
11
|
+
var _react = _interopRequireDefault(require("react"));
|
|
13
12
|
var _classnames = _interopRequireDefault(require("classnames"));
|
|
14
13
|
var _services = require("../../../services");
|
|
15
14
|
var _accordion = require("../../accordion");
|
|
@@ -17,7 +16,7 @@ var _collapsible_nav_item = require("./collapsible_nav_item");
|
|
|
17
16
|
var _collapsible_nav_link = require("./collapsible_nav_link");
|
|
18
17
|
var _collapsible_nav_accordion = require("./collapsible_nav_accordion.styles");
|
|
19
18
|
var _react2 = require("@emotion/react");
|
|
20
|
-
var _excluded = ["id", "className", "items", "
|
|
19
|
+
var _excluded = ["id", "className", "items", "isSubItem", "isSelected", "accordionProps", "buttonContent", "children"];
|
|
21
20
|
/*
|
|
22
21
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
23
22
|
* or more contributor license agreements. Licensed under the Elastic License
|
|
@@ -25,8 +24,6 @@ var _excluded = ["id", "className", "items", "href", "isSubItem", "isSelected",
|
|
|
25
24
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
26
25
|
* Side Public License, v 1.
|
|
27
26
|
*/
|
|
28
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
29
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
30
27
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
31
28
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
32
29
|
/**
|
|
@@ -41,10 +38,8 @@ var EuiCollapsibleNavAccordion = function EuiCollapsibleNavAccordion(_ref) {
|
|
|
41
38
|
var id = _ref.id,
|
|
42
39
|
className = _ref.className,
|
|
43
40
|
items = _ref.items,
|
|
44
|
-
href = _ref.href,
|
|
45
41
|
isSubItem = _ref.isSubItem,
|
|
46
42
|
isSelected = _ref.isSelected,
|
|
47
|
-
linkProps = _ref.linkProps,
|
|
48
43
|
accordionProps = _ref.accordionProps,
|
|
49
44
|
buttonContent = _ref.buttonContent,
|
|
50
45
|
_children = _ref.children,
|
|
@@ -56,30 +51,15 @@ var EuiCollapsibleNavAccordion = function EuiCollapsibleNavAccordion(_ref) {
|
|
|
56
51
|
var euiTheme = (0, _services.useEuiTheme)();
|
|
57
52
|
var styles = (0, _collapsible_nav_accordion.euiCollapsibleNavAccordionStyles)(euiTheme);
|
|
58
53
|
var cssStyles = [styles.euiCollapsibleNavAccordion, isSubItem ? styles.isSubItem : styles.isTopItem, isSelected && styles.isSelected, accordionProps === null || accordionProps === void 0 ? void 0 : accordionProps.css];
|
|
59
|
-
var isTitleInteractive = !!(href || linkProps !== null && linkProps !== void 0 && linkProps.onClick);
|
|
60
|
-
|
|
61
|
-
// Stop propagation on the title so that the accordion toggle doesn't occur on click
|
|
62
|
-
// (should only occur on accordion arrow click for UX consistency)
|
|
63
|
-
var stopPropagationClick = (0, _react.useCallback)(function (e) {
|
|
64
|
-
var _linkProps$onClick;
|
|
65
|
-
e.stopPropagation();
|
|
66
|
-
linkProps === null || linkProps === void 0 ? void 0 : (_linkProps$onClick = linkProps.onClick) === null || _linkProps$onClick === void 0 ? void 0 : _linkProps$onClick.call(linkProps, e);
|
|
67
|
-
}, [linkProps === null || linkProps === void 0 ? void 0 : linkProps.onClick] // eslint-disable-line react-hooks/exhaustive-deps
|
|
68
|
-
);
|
|
69
|
-
|
|
70
54
|
return (0, _react2.jsx)(_accordion.EuiAccordion, (0, _extends2.default)({
|
|
71
55
|
id: groupID,
|
|
72
56
|
className: classes,
|
|
73
57
|
initialIsOpen: isSelected,
|
|
74
|
-
|
|
75
|
-
buttonContent: (0, _react2.jsx)(_collapsible_nav_link.EuiCollapsibleNavLink, (0, _extends2.default)({
|
|
76
|
-
href: href
|
|
77
|
-
}, linkProps, {
|
|
58
|
+
buttonContent: (0, _react2.jsx)(_collapsible_nav_link.EuiCollapsibleNavLink, {
|
|
78
59
|
isSelected: isSelected,
|
|
79
60
|
isSubItem: isSubItem,
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
}), buttonContent),
|
|
61
|
+
isInteractive: false
|
|
62
|
+
}, buttonContent),
|
|
83
63
|
arrowDisplay: "right"
|
|
84
64
|
}, rest, accordionProps, {
|
|
85
65
|
css: cssStyles,
|
|
@@ -21,12 +21,12 @@ var euiCollapsibleNavAccordionStyles = function euiCollapsibleNavAccordionStyles
|
|
|
21
21
|
return {
|
|
22
22
|
// NOTE: Specific usage of `>`s selectors are important here, because accordions can be nested
|
|
23
23
|
// - just because a parent accordion is open or selected does not mean its child accordion is the same
|
|
24
|
-
euiCollapsibleNavAccordion: /*#__PURE__*/(0, _react.css)(".euiAccordion__button{overflow:hidden
|
|
25
|
-
|
|
26
|
-
|
|
24
|
+
euiCollapsibleNavAccordion: /*#__PURE__*/(0, _react.css)(".euiAccordion__button{overflow:hidden;}&>.euiAccordion__triggerWrapper{border-radius:", sharedStyles.borderRadius, ";overflow:hidden;", _global_styling.euiCanAnimate, "{transition:background-color ", sharedStyles.animation, ";}&:hover,&:focus-within{background-color:", sharedStyles.backgroundHoverColor, ";.euiAccordion__arrow .euiIcon{color:", sharedStyles.color, ";}}&:has(:focus-visible){outline-style:auto;outline-offset:-", euiTheme.focus.width, ";*:focus{outline:none;}}}.euiAccordion__buttonContent{", (0, _global_styling.logicalCSS)('max-width', '100%'), " flex-basis:100%;display:flex;align-items:center;}.euiCollapsibleNavLink{", (0, _global_styling.logicalCSS)('width', '100%'), ";};label:euiCollapsibleNavAccordion;"),
|
|
25
|
+
isSelected: /*#__PURE__*/(0, _react.css)("&>.euiAccordion__triggerWrapper{background-color:", sharedStyles.backgroundSelectedColor, ";&:hover,&:focus-within{background-color:", sharedStyles.backgroundSelectedColor, ";}};label:isSelected;"),
|
|
26
|
+
isTopItem: /*#__PURE__*/(0, _react.css)("margin:", sharedStyles.padding, ";;label:isTopItem;"),
|
|
27
27
|
isSubItem: /*#__PURE__*/(0, _react.css)("&.euiAccordion-isOpen .euiAccordion__children::after{content:'';display:block;", (0, _global_styling.logicalCSS)('height', euiTheme.size.m), ";};label:isSubItem;"),
|
|
28
28
|
// Arrow element
|
|
29
|
-
euiCollapsibleNavAccordion__arrow: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('
|
|
29
|
+
euiCollapsibleNavAccordion__arrow: /*#__PURE__*/(0, _react.css)("margin:0;", (0, _global_styling.logicalCSS)('height', sharedStyles.height), (0, _global_styling.logicalCSS)('width', euiTheme.size.xl), "transform:none!important;&>.euiIcon{color:", sharedStyles.rightIconColor, ";transform:rotate(90deg);", _global_styling.euiCanAnimate, "{transition:transform ", sharedStyles.animation, ",color ", sharedStyles.animation, ";}}&.euiAccordion__arrow[aria-expanded='true']>.euiIcon{color:", sharedStyles.color, ";transform:rotate(-90deg);}&:hover,&:focus{background-color:transparent;};label:euiCollapsibleNavAccordion__arrow;")
|
|
30
30
|
};
|
|
31
31
|
};
|
|
32
32
|
exports.euiCollapsibleNavAccordionStyles = euiCollapsibleNavAccordionStyles;
|
package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group.js
CHANGED
|
@@ -14,7 +14,7 @@ var _collapsible_nav_item = require("./collapsible_nav_item");
|
|
|
14
14
|
var _collapsible_nav_item2 = require("./collapsible_nav_item.styles");
|
|
15
15
|
var _collapsible_nav_link = require("./collapsible_nav_link");
|
|
16
16
|
var _react2 = require("@emotion/react");
|
|
17
|
-
var _excluded = ["className", "header", "
|
|
17
|
+
var _excluded = ["className", "header", "items", "isSubItem", "isSelected", "children"];
|
|
18
18
|
/*
|
|
19
19
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
20
20
|
* or more contributor license agreements. Licensed under the Elastic License
|
|
@@ -33,11 +33,9 @@ var _excluded = ["className", "header", "href", "items", "isSubItem", "isSelecte
|
|
|
33
33
|
var EuiCollapsibleNavGroup = function EuiCollapsibleNavGroup(_ref) {
|
|
34
34
|
var className = _ref.className,
|
|
35
35
|
header = _ref.header,
|
|
36
|
-
href = _ref.href,
|
|
37
36
|
items = _ref.items,
|
|
38
37
|
isSubItem = _ref.isSubItem,
|
|
39
38
|
isSelected = _ref.isSelected,
|
|
40
|
-
linkProps = _ref.linkProps,
|
|
41
39
|
_children = _ref.children,
|
|
42
40
|
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
43
41
|
var classes = (0, _classnames.default)('euiCollapsibleNavGroup', className);
|
|
@@ -50,18 +48,20 @@ var EuiCollapsibleNavGroup = function EuiCollapsibleNavGroup(_ref) {
|
|
|
50
48
|
}
|
|
51
49
|
} : undefined; // Prevents Emotion from generating a selector if no styles need to be applied
|
|
52
50
|
|
|
51
|
+
var labelledById = (0, _services.useGeneratedHtmlId)();
|
|
53
52
|
return (0, _react2.jsx)("div", (0, _extends2.default)({
|
|
54
53
|
className: classes
|
|
55
|
-
}, cssStyles, rest), (0, _react2.jsx)(_collapsible_nav_link.EuiCollapsibleNavLink,
|
|
56
|
-
|
|
57
|
-
}, linkProps, {
|
|
54
|
+
}, cssStyles, rest), (0, _react2.jsx)(_collapsible_nav_link.EuiCollapsibleNavLink, {
|
|
55
|
+
id: labelledById,
|
|
58
56
|
isSelected: isSelected,
|
|
59
57
|
isSubItem: isSubItem,
|
|
60
|
-
isInteractive:
|
|
61
|
-
}
|
|
58
|
+
isInteractive: false
|
|
59
|
+
}, header), (0, _react2.jsx)(_collapsible_nav_item.EuiCollapsibleNavSubItems, {
|
|
62
60
|
items: items,
|
|
63
61
|
isSubItem: isSubItem,
|
|
64
|
-
className: "euiCollapsibleNavGroup__children"
|
|
62
|
+
className: "euiCollapsibleNavGroup__children",
|
|
63
|
+
role: "group",
|
|
64
|
+
"aria-labelledby": labelledById
|
|
65
65
|
}));
|
|
66
66
|
};
|
|
67
67
|
exports.EuiCollapsibleNavGroup = EuiCollapsibleNavGroup;
|
package/optimize/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.js
CHANGED
|
@@ -19,7 +19,7 @@ var _collapsible_nav_group = require("./collapsible_nav_group");
|
|
|
19
19
|
var _collapsible_nav_link = require("./collapsible_nav_link");
|
|
20
20
|
var _collapsible_nav_item = require("./collapsible_nav_item.styles");
|
|
21
21
|
var _react2 = require("@emotion/react");
|
|
22
|
-
var _excluded = ["isSubItem", "title", "titleElement", "icon", "iconProps", "items", "isCollapsible", "accordionProps", "children"],
|
|
22
|
+
var _excluded = ["isSubItem", "title", "titleElement", "icon", "iconProps", "href", "linkProps", "items", "isCollapsible", "accordionProps", "children"],
|
|
23
23
|
_excluded2 = ["renderItem", "className"],
|
|
24
24
|
_excluded3 = ["items", "isSubItem", "isGroup", "className"],
|
|
25
25
|
_excluded4 = ["className"];
|
|
@@ -38,12 +38,13 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
38
38
|
* determine whether to render an accordion or a link
|
|
39
39
|
*/
|
|
40
40
|
var EuiCollapsibleNavItemDisplay = function EuiCollapsibleNavItemDisplay(_ref) {
|
|
41
|
-
var _props$linkProps;
|
|
42
41
|
var isSubItem = _ref.isSubItem,
|
|
43
42
|
title = _ref.title,
|
|
44
43
|
titleElement = _ref.titleElement,
|
|
45
44
|
icon = _ref.icon,
|
|
46
45
|
iconProps = _ref.iconProps,
|
|
46
|
+
href = _ref.href,
|
|
47
|
+
linkProps = _ref.linkProps,
|
|
47
48
|
items = _ref.items,
|
|
48
49
|
_ref$isCollapsible = _ref.isCollapsible,
|
|
49
50
|
isCollapsible = _ref$isCollapsible === void 0 ? true : _ref$isCollapsible,
|
|
@@ -56,7 +57,7 @@ var EuiCollapsibleNavItemDisplay = function EuiCollapsibleNavItemDisplay(_ref) {
|
|
|
56
57
|
icon: icon,
|
|
57
58
|
iconProps: iconProps
|
|
58
59
|
});
|
|
59
|
-
if (items
|
|
60
|
+
if (items) {
|
|
60
61
|
if (isCollapsible) {
|
|
61
62
|
return (0, _react2.jsx)(_collapsible_nav_accordion.EuiCollapsibleNavAccordion, (0, _extends2.default)({
|
|
62
63
|
buttonContent: headerContent,
|
|
@@ -74,11 +75,14 @@ var EuiCollapsibleNavItemDisplay = function EuiCollapsibleNavItemDisplay(_ref) {
|
|
|
74
75
|
}));
|
|
75
76
|
}
|
|
76
77
|
}
|
|
77
|
-
return (0, _react2.jsx)(_collapsible_nav_link.EuiCollapsibleNavLink, (0, _extends2.default)({
|
|
78
|
+
return (0, _react2.jsx)(_collapsible_nav_link.EuiCollapsibleNavLink, (0, _extends2.default)({
|
|
79
|
+
href: href,
|
|
80
|
+
linkProps: linkProps
|
|
81
|
+
}, props, {
|
|
78
82
|
// EuiLink ExclusiveUnion type shenanigans
|
|
79
83
|
isSubItem: isSubItem,
|
|
80
84
|
isNotAccordion: true,
|
|
81
|
-
isInteractive: !!(
|
|
85
|
+
isInteractive: !!(href || props.onClick || linkProps !== null && linkProps !== void 0 && linkProps.onClick)
|
|
82
86
|
}), headerContent);
|
|
83
87
|
};
|
|
84
88
|
|