@elastic/eui 77.2.2 → 79.0.0

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 (87) hide show
  1. package/README.md +7 -21
  2. package/dist/eui_theme_dark.css +28 -29
  3. package/dist/eui_theme_dark.min.css +1 -1
  4. package/dist/eui_theme_light.css +28 -29
  5. package/dist/eui_theme_light.min.css +1 -1
  6. package/es/components/avatar/avatar.js +15 -3
  7. package/es/components/avatar/avatar.styles.js +46 -9
  8. package/es/components/form/form.styles.js +2 -2
  9. package/es/components/loading/index.js +0 -1
  10. package/es/components/page/page_header/page_header_content.js +15 -11
  11. package/es/components/search_bar/query/ast_to_es_query_dsl.js +2 -2
  12. package/es/components/selectable/selectable_templates/selectable_template_sitewide.js +7 -0
  13. package/es/components/skeleton/skeleton_circle.js +24 -3
  14. package/es/components/skeleton/skeleton_loading.js +11 -5
  15. package/es/components/skeleton/skeleton_rectangle.js +24 -3
  16. package/es/components/skeleton/skeleton_text.js +24 -3
  17. package/es/components/skeleton/skeleton_title.js +24 -3
  18. package/es/test/rtl/custom_render.js +11 -1
  19. package/es/test/rtl/index.d.ts +1 -1
  20. package/es/test/rtl/index.js +1 -1
  21. package/eui.d.ts +433 -419
  22. package/i18ntokens.json +14 -14
  23. package/lib/components/avatar/avatar.js +17 -4
  24. package/lib/components/avatar/avatar.styles.js +46 -9
  25. package/lib/components/form/form.styles.js +2 -2
  26. package/lib/components/loading/index.js +0 -7
  27. package/lib/components/page/page_header/page_header_content.js +15 -11
  28. package/lib/components/search_bar/query/ast_to_es_query_dsl.js +2 -2
  29. package/lib/components/selectable/selectable_templates/selectable_template_sitewide.js +7 -0
  30. package/lib/components/skeleton/skeleton_circle.js +24 -3
  31. package/lib/components/skeleton/skeleton_loading.js +11 -5
  32. package/lib/components/skeleton/skeleton_rectangle.js +24 -3
  33. package/lib/components/skeleton/skeleton_text.js +24 -3
  34. package/lib/components/skeleton/skeleton_title.js +24 -3
  35. package/lib/test/rtl/custom_render.js +11 -2
  36. package/lib/test/rtl/index.d.ts +1 -1
  37. package/lib/test/rtl/index.js +8 -1
  38. package/optimize/es/components/avatar/avatar.js +8 -3
  39. package/optimize/es/components/avatar/avatar.styles.js +46 -9
  40. package/optimize/es/components/form/form.styles.js +2 -2
  41. package/optimize/es/components/loading/index.js +0 -1
  42. package/optimize/es/components/page/page_header/page_header_content.js +10 -11
  43. package/optimize/es/components/search_bar/query/ast_to_es_query_dsl.js +2 -2
  44. package/optimize/es/components/skeleton/skeleton_circle.js +8 -2
  45. package/optimize/es/components/skeleton/skeleton_loading.js +11 -5
  46. package/optimize/es/components/skeleton/skeleton_rectangle.js +8 -2
  47. package/optimize/es/components/skeleton/skeleton_text.js +8 -2
  48. package/optimize/es/components/skeleton/skeleton_title.js +8 -2
  49. package/optimize/es/test/rtl/custom_render.js +11 -1
  50. package/optimize/es/test/rtl/index.d.ts +1 -1
  51. package/optimize/es/test/rtl/index.js +1 -1
  52. package/optimize/lib/components/avatar/avatar.js +10 -4
  53. package/optimize/lib/components/avatar/avatar.styles.js +46 -9
  54. package/optimize/lib/components/form/form.styles.js +2 -2
  55. package/optimize/lib/components/loading/index.js +0 -7
  56. package/optimize/lib/components/page/page_header/page_header_content.js +10 -11
  57. package/optimize/lib/components/search_bar/query/ast_to_es_query_dsl.js +2 -2
  58. package/optimize/lib/components/skeleton/skeleton_circle.js +8 -2
  59. package/optimize/lib/components/skeleton/skeleton_loading.js +11 -5
  60. package/optimize/lib/components/skeleton/skeleton_rectangle.js +8 -2
  61. package/optimize/lib/components/skeleton/skeleton_text.js +8 -2
  62. package/optimize/lib/components/skeleton/skeleton_title.js +8 -2
  63. package/optimize/lib/test/rtl/custom_render.js +11 -2
  64. package/optimize/lib/test/rtl/index.d.ts +1 -1
  65. package/optimize/lib/test/rtl/index.js +8 -1
  66. package/package.json +2 -2
  67. package/src/components/form/switch/_switch.scss +30 -26
  68. package/src/global_styling/variables/_form.scss +2 -2
  69. package/test-env/components/avatar/avatar.js +17 -4
  70. package/test-env/components/avatar/avatar.styles.js +46 -9
  71. package/test-env/components/form/form.styles.js +2 -2
  72. package/test-env/components/loading/index.js +0 -7
  73. package/test-env/components/page/page_header/page_header_content.js +10 -11
  74. package/test-env/components/search_bar/query/ast_to_es_query_dsl.js +2 -2
  75. package/test-env/components/selectable/selectable_templates/selectable_template_sitewide.js +7 -0
  76. package/test-env/components/skeleton/skeleton_circle.js +24 -3
  77. package/test-env/components/skeleton/skeleton_loading.js +11 -5
  78. package/test-env/components/skeleton/skeleton_rectangle.js +24 -3
  79. package/test-env/components/skeleton/skeleton_text.js +24 -3
  80. package/test-env/components/skeleton/skeleton_title.js +24 -3
  81. package/test-env/test/rtl/custom_render.js +11 -2
  82. package/test-env/test/rtl/index.js +8 -1
  83. package/es/components/loading/loading_content.js +0 -50
  84. package/lib/components/loading/loading_content.js +0 -54
  85. package/optimize/es/components/loading/loading_content.js +0 -21
  86. package/optimize/lib/components/loading/loading_content.js +0 -25
  87. package/test-env/components/loading/loading_content.js +0 -54
@@ -2,7 +2,8 @@ import _extends from "@babel/runtime/helpers/extends";
2
2
  import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
3
3
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
4
4
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
5
- var _excluded = ["className", "color", "imageUrl", "initials", "initialsLength", "iconType", "iconSize", "iconColor", "name", "size", "type", "isDisabled", "style"];
5
+ var _excluded = ["className", "color", "imageUrl", "initials", "initialsLength", "iconType", "iconSize", "iconColor", "name", "size", "type", "isDisabled", "style"],
6
+ _excluded2 = ["casing"];
6
7
  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; }
7
8
  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) { _defineProperty(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; }
8
9
  /*
@@ -22,6 +23,7 @@ import { euiAvatarStyles } from './avatar.styles';
22
23
  import { jsx as ___EmotionJSX } from "@emotion/react";
23
24
  export var SIZES = ['s', 'm', 'l', 'xl'];
24
25
  export var TYPES = ['space', 'user'];
26
+ export var CASING = ['capitalize', 'uppercase', 'lowercase', 'none'];
25
27
  export var EuiAvatar = function EuiAvatar(_ref) {
26
28
  var _classNames;
27
29
  var className = _ref.className,
@@ -40,14 +42,17 @@ export var EuiAvatar = function EuiAvatar(_ref) {
40
42
  _ref$isDisabled = _ref.isDisabled,
41
43
  isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
42
44
  style = _ref.style,
43
- rest = _objectWithoutProperties(_ref, _excluded);
45
+ props = _objectWithoutProperties(_ref, _excluded);
46
+ var _props$casing = props.casing,
47
+ casing = _props$casing === void 0 ? type === 'space' ? 'none' : 'uppercase' : _props$casing,
48
+ rest = _objectWithoutProperties(props, _excluded2);
44
49
  var euiTheme = useEuiTheme();
45
50
  var styles = euiAvatarStyles(euiTheme);
46
51
  var visColors = euiPaletteColorBlindBehindText();
47
52
  var isPlain = color === 'plain';
48
53
  var isSubdued = color === 'subdued';
49
54
  var classes = classNames('euiAvatar', (_classNames = {}, _defineProperty(_classNames, "euiAvatar--".concat(size), size), _defineProperty(_classNames, "euiAvatar--".concat(type), type), _defineProperty(_classNames, 'euiAvatar-isDisabled', isDisabled), _classNames), className);
50
- var cssStyles = [styles.euiAvatar, styles[size], styles[type], isPlain && styles.plain, isSubdued && styles.subdued, isDisabled && styles.isDisabled];
55
+ var cssStyles = [styles.euiAvatar, styles[type], styles[size], styles[casing], isPlain && styles.plain, isSubdued && styles.subdued, isDisabled && styles.isDisabled];
51
56
  checkValidInitials(initials);
52
57
  var avatarStyle = _objectSpread({}, style);
53
58
  var iconCustomColor = iconColor;
@@ -9,12 +9,44 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
9
9
 
10
10
  import { css } from '@emotion/react';
11
11
  import { logicalCSS, logicalTextAlignCSS } from '../../global_styling';
12
- var _avatarSize = function _avatarSize(_ref3) {
13
- var size = _ref3.size,
14
- fontSize = _ref3.fontSize;
12
+ var _avatarSize = function _avatarSize(_ref7) {
13
+ var size = _ref7.size,
14
+ fontSize = _ref7.fontSize;
15
15
  return "\n ".concat(logicalCSS('width', size), ";\n ").concat(logicalCSS('height', size), ";\n line-height: ").concat(size, ";\n font-size: ").concat(fontSize, ";\n ");
16
16
  };
17
17
  var _ref = process.env.NODE_ENV === "production" ? {
18
+ name: "4wfy2n-none",
19
+ styles: "text-transform:none;label:none;"
20
+ } : {
21
+ name: "4wfy2n-none",
22
+ styles: "text-transform:none;label:none;",
23
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
24
+ };
25
+ var _ref2 = process.env.NODE_ENV === "production" ? {
26
+ name: "5xhpzh-lowercase",
27
+ styles: "text-transform:lowercase;label:lowercase;"
28
+ } : {
29
+ name: "5xhpzh-lowercase",
30
+ styles: "text-transform:lowercase;label:lowercase;",
31
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
32
+ };
33
+ var _ref3 = process.env.NODE_ENV === "production" ? {
34
+ name: "1x2qsb1-uppercase",
35
+ styles: "text-transform:uppercase;label:uppercase;"
36
+ } : {
37
+ name: "1x2qsb1-uppercase",
38
+ styles: "text-transform:uppercase;label:uppercase;",
39
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
40
+ };
41
+ var _ref4 = process.env.NODE_ENV === "production" ? {
42
+ name: "mxeh3g-capitalize",
43
+ styles: "text-transform:capitalize;label:capitalize;"
44
+ } : {
45
+ name: "mxeh3g-capitalize",
46
+ styles: "text-transform:capitalize;label:capitalize;",
47
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
48
+ };
49
+ var _ref5 = process.env.NODE_ENV === "production" ? {
18
50
  name: "14sj6wh-isDisabled",
19
51
  styles: "cursor:not-allowed;filter:grayscale(100%);label:isDisabled;"
20
52
  } : {
@@ -22,7 +54,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
22
54
  styles: "cursor:not-allowed;filter:grayscale(100%);label:isDisabled;",
23
55
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
24
56
  };
25
- var _ref2 = process.env.NODE_ENV === "production" ? {
57
+ var _ref6 = process.env.NODE_ENV === "production" ? {
26
58
  name: "ont6vs-user",
27
59
  styles: "border-radius:50%;label:user;"
28
60
  } : {
@@ -30,18 +62,18 @@ var _ref2 = process.env.NODE_ENV === "production" ? {
30
62
  styles: "border-radius:50%;label:user;",
31
63
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
32
64
  };
33
- export var euiAvatarStyles = function euiAvatarStyles(_ref4) {
34
- var euiTheme = _ref4.euiTheme;
65
+ export var euiAvatarStyles = function euiAvatarStyles(_ref8) {
66
+ var euiTheme = _ref8.euiTheme;
35
67
  return {
36
68
  // Base
37
69
  euiAvatar: /*#__PURE__*/css("flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;background-size:cover;", logicalTextAlignCSS('center'), ";", logicalCSS('overflow-x', 'hidden'), "font-weight:", euiTheme.font.weight.medium, ";;label:euiAvatar;"),
38
70
  // Variants
39
71
  plain: /*#__PURE__*/css("background-color:", euiTheme.colors.emptyShade, ";;label:plain;"),
40
72
  subdued: /*#__PURE__*/css("background-color:", euiTheme.colors.lightestShade, ";;label:subdued;"),
41
- user: _ref2,
73
+ user: _ref6,
42
74
  space: /*#__PURE__*/css("border-radius:", euiTheme.border.radius.medium, ";;label:space;"),
43
75
  // States
44
- isDisabled: _ref,
76
+ isDisabled: _ref5,
45
77
  // Sizes
46
78
  s: /*#__PURE__*/css(_avatarSize({
47
79
  size: euiTheme.size.l,
@@ -58,6 +90,11 @@ export var euiAvatarStyles = function euiAvatarStyles(_ref4) {
58
90
  xl: /*#__PURE__*/css(_avatarSize({
59
91
  size: "calc(".concat(euiTheme.size.base, " * 4)"),
60
92
  fontSize: "calc(".concat(euiTheme.size.xl, " * 0.8)")
61
- }), ";label:xl;")
93
+ }), ";label:xl;"),
94
+ // Casing
95
+ capitalize: _ref4,
96
+ uppercase: _ref3,
97
+ lowercase: _ref2,
98
+ none: _ref
62
99
  };
63
100
  };
@@ -42,10 +42,10 @@ export var euiFormVariables = function euiFormVariables(euiThemeContext) {
42
42
  inputGroupBorder: 'none'
43
43
  };
44
44
 
45
- // Colors - specific for checkboxes and radios
45
+ // Colors - specific to checkboxes, radios, switches, and range thumbs
46
46
  var customControlColors = {
47
47
  customControlDisabledIconColor: isColorDark ? shade(euiTheme.colors.mediumShade, 0.38) : tint(euiTheme.colors.mediumShade, 0.485),
48
- customControlBorderColor: isColorDark ? shade(euiTheme.colors.lightestShade, 0.18) : tint(euiTheme.colors.lightestShade, 0.3)
48
+ customControlBorderColor: isColorDark ? shade(euiTheme.colors.lightestShade, 0.4) : tint(euiTheme.colors.lightestShade, 0.31)
49
49
  };
50
50
  var controlLayout = {
51
51
  controlLayoutGroupInputHeight: mathWithUnits(controlHeight, function (x) {
@@ -8,6 +8,5 @@
8
8
 
9
9
  export { EuiLoadingElastic } from './loading_elastic';
10
10
  export { EuiLoadingChart } from './loading_chart';
11
- export { EuiLoadingContent } from './loading_content';
12
11
  export { EuiLoadingSpinner } from './loading_spinner';
13
12
  export { EuiLoadingLogo } from './loading_logo';
@@ -1,3 +1,4 @@
1
+ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
1
2
  import _extends from "@babel/runtime/helpers/extends";
2
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
4
  var _excluded = ["className", "pageTitle", "pageTitleProps", "iconType", "iconProps", "tabs", "tabsProps", "description", "breadcrumbs", "breadcrumbProps", "alignItems", "responsive", "rightSideItems", "rightSideGroupProps", "children", "restrictWidth", "paddingSize", "bottomBorder", "style"],
@@ -156,21 +157,19 @@ export var EuiPageHeaderContent = function EuiPageHeaderContent(_ref) {
156
157
  }
157
158
  var rightSideFlexItem;
158
159
  if (rightSideItems && rightSideItems.length) {
159
- var wrapWithFlex = function wrapWithFlex() {
160
- return rightSideItems.map(function (item, index) {
161
- return ___EmotionJSX(EuiFlexItem, {
162
- grow: false,
163
- key: index
164
- }, item);
165
- });
166
- };
160
+ var itemsToRender = isResponsiveBreakpoint ? rightSideItems : _toConsumableArray(rightSideItems).reverse();
161
+ var rightSideFlexItems = itemsToRender.map(function (item, index) {
162
+ return ___EmotionJSX(EuiFlexItem, {
163
+ grow: false,
164
+ key: index
165
+ }, item);
166
+ });
167
167
  rightSideFlexItem = ___EmotionJSX(EuiFlexItem, {
168
168
  grow: false
169
169
  }, ___EmotionJSX(EuiFlexGroup, _extends({
170
170
  wrap: true,
171
- responsive: false,
172
- direction: isResponsiveBreakpoint ? undefined : 'rowReverse'
173
- }, rightSideGroupProps), wrapWithFlex()));
171
+ responsive: false
172
+ }, rightSideGroupProps), rightSideFlexItems));
174
173
  }
175
174
  return alignItems === 'top' || isResponsiveBreakpoint ? ___EmotionJSX("div", _extends({
176
175
  className: classes,
@@ -62,9 +62,9 @@ export var _termValuesToQuery = function _termValuesToQuery(values, options) {
62
62
  var body = {
63
63
  query: values.map(function (value) {
64
64
  if (isString(value) && value.match(/\s/)) {
65
- return "\"".concat(value, "\"");
65
+ return "+\"".concat(value, "\"");
66
66
  }
67
- return value;
67
+ return "+".concat(value);
68
68
  }).join(' ')
69
69
  };
70
70
  if (body.query === '') {
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["isLoading", "size", "className", "contentAriaLabel", "ariaWrapperProps", "children"];
3
+ var _excluded = ["isLoading", "size", "className", "contentAriaLabel", "announceLoadingStatus", "announceLoadedStatus", "ariaLiveProps", "ariaWrapperProps", "children"];
4
4
  /*
5
5
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
6
6
  * or more contributor license agreements. Licensed under the Elastic License
@@ -23,6 +23,9 @@ export var EuiSkeletonCircle = function EuiSkeletonCircle(_ref) {
23
23
  size = _ref$size === void 0 ? 'm' : _ref$size,
24
24
  className = _ref.className,
25
25
  contentAriaLabel = _ref.contentAriaLabel,
26
+ announceLoadingStatus = _ref.announceLoadingStatus,
27
+ announceLoadedStatus = _ref.announceLoadedStatus,
28
+ ariaLiveProps = _ref.ariaLiveProps,
26
29
  ariaWrapperProps = _ref.ariaWrapperProps,
27
30
  children = _ref.children,
28
31
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -36,6 +39,9 @@ export var EuiSkeletonCircle = function EuiSkeletonCircle(_ref) {
36
39
  css: cssStyles
37
40
  }, rest)),
38
41
  loadedContent: children || '',
39
- contentAriaLabel: contentAriaLabel
42
+ contentAriaLabel: contentAriaLabel,
43
+ announceLoadingStatus: announceLoadingStatus,
44
+ announceLoadedStatus: announceLoadedStatus,
45
+ ariaLiveProps: ariaLiveProps
40
46
  }, ariaWrapperProps));
41
47
  };
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["isLoading", "contentAriaLabel", "loadingContent", "loadedContent"];
3
+ var _excluded = ["isLoading", "contentAriaLabel", "loadingContent", "loadedContent", "announceLoadingStatus", "announceLoadedStatus", "ariaLiveProps"];
4
4
  /*
5
5
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
6
6
  * or more contributor license agreements. Licensed under the Elastic License
@@ -17,21 +17,27 @@ export var EuiSkeletonLoading = function EuiSkeletonLoading(_ref) {
17
17
  var _ref$isLoading = _ref.isLoading,
18
18
  isLoading = _ref$isLoading === void 0 ? true : _ref$isLoading,
19
19
  contentAriaLabel = _ref.contentAriaLabel,
20
- loadingContent = _ref.loadingContent,
20
+ _loadingContent = _ref.loadingContent,
21
21
  loadedContent = _ref.loadedContent,
22
+ _ref$announceLoadingS = _ref.announceLoadingStatus,
23
+ announceLoadingStatus = _ref$announceLoadingS === void 0 ? false : _ref$announceLoadingS,
24
+ _ref$announceLoadedSt = _ref.announceLoadedStatus,
25
+ announceLoadedStatus = _ref$announceLoadedSt === void 0 ? true : _ref$announceLoadedSt,
26
+ ariaLiveProps = _ref.ariaLiveProps,
22
27
  rest = _objectWithoutProperties(_ref, _excluded);
23
- var loadingAriaLabel = useEuiI18n('euiSkeletonLoading.loadingAriaText', 'Loading {contentAriaLabel}', {
28
+ var loadedAriaLive = useEuiI18n('euiSkeletonLoading.loadedAriaText', 'Loaded {contentAriaLabel}', {
24
29
  contentAriaLabel: contentAriaLabel
25
30
  });
26
- var loadedAriaLive = useEuiI18n('euiSkeletonLoading.loadedAriaText', 'Loaded {contentAriaLabel}', {
31
+ var loadingAriaLabel = useEuiI18n('euiSkeletonLoading.loadingAriaText', 'Loading {contentAriaLabel}', {
27
32
  contentAriaLabel: contentAriaLabel
28
33
  });
29
34
  var loadingProps = {
30
35
  'aria-label': loadingAriaLabel,
31
36
  role: 'progressbar'
32
37
  };
38
+ var loadingContent = /*#__PURE__*/React.cloneElement(_loadingContent, loadingProps);
33
39
  return ___EmotionJSX("div", _extends({
34
40
  "aria-busy": isLoading,
35
41
  "data-test-subj": "euiSkeletonLoadingAriaWrapper"
36
- }, rest), isLoading ? /*#__PURE__*/React.cloneElement(loadingContent, loadingProps) : ___EmotionJSX(React.Fragment, null, ___EmotionJSX(EuiScreenReaderLive, null, loadedAriaLive), loadedContent));
42
+ }, rest), isLoading ? ___EmotionJSX(React.Fragment, null, announceLoadingStatus && ___EmotionJSX(EuiScreenReaderLive, ariaLiveProps, loadingAriaLabel), loadingContent) : ___EmotionJSX(React.Fragment, null, announceLoadedStatus && ___EmotionJSX(EuiScreenReaderLive, ariaLiveProps, loadedAriaLive), loadedContent));
37
43
  };
@@ -1,7 +1,7 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
4
- var _excluded = ["isLoading", "borderRadius", "width", "height", "style", "className", "contentAriaLabel", "ariaWrapperProps", "children"];
4
+ var _excluded = ["isLoading", "borderRadius", "width", "height", "style", "className", "contentAriaLabel", "announceLoadingStatus", "announceLoadedStatus", "ariaLiveProps", "ariaWrapperProps", "children"];
5
5
  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; }
6
6
  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) { _defineProperty(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; }
7
7
  /*
@@ -32,6 +32,9 @@ export var EuiSkeletonRectangle = function EuiSkeletonRectangle(_ref) {
32
32
  style = _ref.style,
33
33
  className = _ref.className,
34
34
  contentAriaLabel = _ref.contentAriaLabel,
35
+ announceLoadingStatus = _ref.announceLoadingStatus,
36
+ announceLoadedStatus = _ref.announceLoadedStatus,
37
+ ariaLiveProps = _ref.ariaLiveProps,
35
38
  ariaWrapperProps = _ref.ariaWrapperProps,
36
39
  children = _ref.children,
37
40
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -49,6 +52,9 @@ export var EuiSkeletonRectangle = function EuiSkeletonRectangle(_ref) {
49
52
  }))
50
53
  }, rest)),
51
54
  loadedContent: children || '',
52
- contentAriaLabel: contentAriaLabel
55
+ contentAriaLabel: contentAriaLabel,
56
+ announceLoadingStatus: announceLoadingStatus,
57
+ announceLoadedStatus: announceLoadedStatus,
58
+ ariaLiveProps: ariaLiveProps
53
59
  }, ariaWrapperProps));
54
60
  };
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["isLoading", "lines", "size", "className", "contentAriaLabel", "ariaWrapperProps", "children"];
3
+ var _excluded = ["isLoading", "lines", "size", "className", "contentAriaLabel", "announceLoadingStatus", "announceLoadedStatus", "ariaLiveProps", "ariaWrapperProps", "children"];
4
4
  /*
5
5
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
6
6
  * or more contributor license agreements. Licensed under the Elastic License
@@ -25,6 +25,9 @@ export var EuiSkeletonText = function EuiSkeletonText(_ref) {
25
25
  size = _ref$size === void 0 ? 'm' : _ref$size,
26
26
  className = _ref.className,
27
27
  contentAriaLabel = _ref.contentAriaLabel,
28
+ announceLoadingStatus = _ref.announceLoadingStatus,
29
+ announceLoadedStatus = _ref.announceLoadedStatus,
30
+ ariaLiveProps = _ref.ariaLiveProps,
28
31
  ariaWrapperProps = _ref.ariaWrapperProps,
29
32
  children = _ref.children,
30
33
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -44,6 +47,9 @@ export var EuiSkeletonText = function EuiSkeletonText(_ref) {
44
47
  className: classNames('euiSkeletonText', className)
45
48
  }, rest), lineElements),
46
49
  loadedContent: children || '',
47
- contentAriaLabel: contentAriaLabel
50
+ contentAriaLabel: contentAriaLabel,
51
+ announceLoadingStatus: announceLoadingStatus,
52
+ announceLoadedStatus: announceLoadedStatus,
53
+ ariaLiveProps: ariaLiveProps
48
54
  }, ariaWrapperProps));
49
55
  };
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
3
- var _excluded = ["isLoading", "size", "className", "contentAriaLabel", "ariaWrapperProps", "children"];
3
+ var _excluded = ["isLoading", "size", "className", "contentAriaLabel", "announceLoadingStatus", "announceLoadedStatus", "ariaLiveProps", "ariaWrapperProps", "children"];
4
4
  /*
5
5
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
6
6
  * or more contributor license agreements. Licensed under the Elastic License
@@ -22,6 +22,9 @@ export var EuiSkeletonTitle = function EuiSkeletonTitle(_ref) {
22
22
  size = _ref$size === void 0 ? 'm' : _ref$size,
23
23
  className = _ref.className,
24
24
  contentAriaLabel = _ref.contentAriaLabel,
25
+ announceLoadingStatus = _ref.announceLoadingStatus,
26
+ announceLoadedStatus = _ref.announceLoadedStatus,
27
+ ariaLiveProps = _ref.ariaLiveProps,
25
28
  ariaWrapperProps = _ref.ariaWrapperProps,
26
29
  children = _ref.children,
27
30
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -35,6 +38,9 @@ export var EuiSkeletonTitle = function EuiSkeletonTitle(_ref) {
35
38
  css: cssStyles
36
39
  }, rest)),
37
40
  loadedContent: children || '',
38
- contentAriaLabel: contentAriaLabel
41
+ contentAriaLabel: contentAriaLabel,
42
+ announceLoadingStatus: announceLoadingStatus,
43
+ announceLoadedStatus: announceLoadedStatus,
44
+ ariaLiveProps: ariaLiveProps
39
45
  }, ariaWrapperProps));
40
46
  };
@@ -40,4 +40,14 @@ export { customRender as render };
40
40
  * @see https://github.com/testing-library/dom-testing-library/issues/516
41
41
  */
42
42
  var customScreen = _objectSpread(_objectSpread({}, screen), within(document.body, dataTestSubjQueries));
43
- export { customScreen as screen };
43
+ export { customScreen as screen };
44
+
45
+ /**
46
+ * Custom within util with EUI query helpers
47
+ *
48
+ * @see https://testing-library.com/docs/dom-testing-library/api-within/
49
+ */
50
+ var customWithin = function customWithin(element) {
51
+ return within(element, _objectSpread(_objectSpread({}, queries), dataTestSubjQueries));
52
+ };
53
+ export { customWithin as within };
@@ -1,3 +1,3 @@
1
1
  export * from './component_helpers';
2
2
  export { queryByTestSubject, queryAllByTestSubject, getByTestSubject, getAllByTestSubject, findAllByTestSubject, findByTestSubject, } from './data_test_subj_queries';
3
- export { render, screen } from './custom_render';
3
+ export { render, screen, within } from './custom_render';
@@ -8,4 +8,4 @@
8
8
 
9
9
  export * from './component_helpers';
10
10
  export { queryByTestSubject, queryAllByTestSubject, getByTestSubject, getAllByTestSubject, findAllByTestSubject, findByTestSubject } from './data_test_subj_queries';
11
- export { render, screen } from './custom_render';
11
+ export { render, screen, within } from './custom_render';
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.checkValidColor = exports.TYPES = exports.SIZES = exports.EuiAvatar = void 0;
7
+ exports.checkValidColor = exports.TYPES = exports.SIZES = exports.EuiAvatar = exports.CASING = void 0;
8
8
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
9
  var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
10
10
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
@@ -16,13 +16,16 @@ var _services = require("../../services");
16
16
  var _icon = require("../icon");
17
17
  var _avatar = require("./avatar.styles");
18
18
  var _react2 = require("@emotion/react");
19
- var _excluded = ["className", "color", "imageUrl", "initials", "initialsLength", "iconType", "iconSize", "iconColor", "name", "size", "type", "isDisabled", "style"];
19
+ var _excluded = ["className", "color", "imageUrl", "initials", "initialsLength", "iconType", "iconSize", "iconColor", "name", "size", "type", "isDisabled", "style"],
20
+ _excluded2 = ["casing"];
20
21
  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; }
21
22
  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; }
22
23
  var SIZES = ['s', 'm', 'l', 'xl'];
23
24
  exports.SIZES = SIZES;
24
25
  var TYPES = ['space', 'user'];
25
26
  exports.TYPES = TYPES;
27
+ var CASING = ['capitalize', 'uppercase', 'lowercase', 'none'];
28
+ exports.CASING = CASING;
26
29
  var EuiAvatar = function EuiAvatar(_ref) {
27
30
  var _classNames;
28
31
  var className = _ref.className,
@@ -41,14 +44,17 @@ var EuiAvatar = function EuiAvatar(_ref) {
41
44
  _ref$isDisabled = _ref.isDisabled,
42
45
  isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled,
43
46
  style = _ref.style,
44
- rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
47
+ props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
48
+ var _props$casing = props.casing,
49
+ casing = _props$casing === void 0 ? type === 'space' ? 'none' : 'uppercase' : _props$casing,
50
+ rest = (0, _objectWithoutProperties2.default)(props, _excluded2);
45
51
  var euiTheme = (0, _services.useEuiTheme)();
46
52
  var styles = (0, _avatar.euiAvatarStyles)(euiTheme);
47
53
  var visColors = (0, _services.euiPaletteColorBlindBehindText)();
48
54
  var isPlain = color === 'plain';
49
55
  var isSubdued = color === 'subdued';
50
56
  var classes = (0, _classnames.default)('euiAvatar', (_classNames = {}, (0, _defineProperty2.default)(_classNames, "euiAvatar--".concat(size), size), (0, _defineProperty2.default)(_classNames, "euiAvatar--".concat(type), type), (0, _defineProperty2.default)(_classNames, 'euiAvatar-isDisabled', isDisabled), _classNames), className);
51
- var cssStyles = [styles.euiAvatar, styles[size], styles[type], isPlain && styles.plain, isSubdued && styles.subdued, isDisabled && styles.isDisabled];
57
+ var cssStyles = [styles.euiAvatar, styles[type], styles[size], styles[casing], isPlain && styles.plain, isSubdued && styles.subdued, isDisabled && styles.isDisabled];
52
58
  checkValidInitials(initials);
53
59
  var avatarStyle = _objectSpread({}, style);
54
60
  var iconCustomColor = iconColor;
@@ -7,12 +7,44 @@ exports.euiAvatarStyles = void 0;
7
7
  var _react = require("@emotion/react");
8
8
  var _global_styling = require("../../global_styling");
9
9
  function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
10
- var _avatarSize = function _avatarSize(_ref3) {
11
- var size = _ref3.size,
12
- fontSize = _ref3.fontSize;
10
+ var _avatarSize = function _avatarSize(_ref7) {
11
+ var size = _ref7.size,
12
+ fontSize = _ref7.fontSize;
13
13
  return "\n ".concat((0, _global_styling.logicalCSS)('width', size), ";\n ").concat((0, _global_styling.logicalCSS)('height', size), ";\n line-height: ").concat(size, ";\n font-size: ").concat(fontSize, ";\n ");
14
14
  };
15
15
  var _ref = process.env.NODE_ENV === "production" ? {
16
+ name: "4wfy2n-none",
17
+ styles: "text-transform:none;label:none;"
18
+ } : {
19
+ name: "4wfy2n-none",
20
+ styles: "text-transform:none;label:none;",
21
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
22
+ };
23
+ var _ref2 = process.env.NODE_ENV === "production" ? {
24
+ name: "5xhpzh-lowercase",
25
+ styles: "text-transform:lowercase;label:lowercase;"
26
+ } : {
27
+ name: "5xhpzh-lowercase",
28
+ styles: "text-transform:lowercase;label:lowercase;",
29
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
30
+ };
31
+ var _ref3 = process.env.NODE_ENV === "production" ? {
32
+ name: "1x2qsb1-uppercase",
33
+ styles: "text-transform:uppercase;label:uppercase;"
34
+ } : {
35
+ name: "1x2qsb1-uppercase",
36
+ styles: "text-transform:uppercase;label:uppercase;",
37
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
38
+ };
39
+ var _ref4 = process.env.NODE_ENV === "production" ? {
40
+ name: "mxeh3g-capitalize",
41
+ styles: "text-transform:capitalize;label:capitalize;"
42
+ } : {
43
+ name: "mxeh3g-capitalize",
44
+ styles: "text-transform:capitalize;label:capitalize;",
45
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
46
+ };
47
+ var _ref5 = process.env.NODE_ENV === "production" ? {
16
48
  name: "14sj6wh-isDisabled",
17
49
  styles: "cursor:not-allowed;filter:grayscale(100%);label:isDisabled;"
18
50
  } : {
@@ -20,7 +52,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
20
52
  styles: "cursor:not-allowed;filter:grayscale(100%);label:isDisabled;",
21
53
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
22
54
  };
23
- var _ref2 = process.env.NODE_ENV === "production" ? {
55
+ var _ref6 = process.env.NODE_ENV === "production" ? {
24
56
  name: "ont6vs-user",
25
57
  styles: "border-radius:50%;label:user;"
26
58
  } : {
@@ -28,18 +60,18 @@ var _ref2 = process.env.NODE_ENV === "production" ? {
28
60
  styles: "border-radius:50%;label:user;",
29
61
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
30
62
  };
31
- var euiAvatarStyles = function euiAvatarStyles(_ref4) {
32
- var euiTheme = _ref4.euiTheme;
63
+ var euiAvatarStyles = function euiAvatarStyles(_ref8) {
64
+ var euiTheme = _ref8.euiTheme;
33
65
  return {
34
66
  // Base
35
67
  euiAvatar: /*#__PURE__*/(0, _react.css)("flex-shrink:0;display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;background-size:cover;", (0, _global_styling.logicalTextAlignCSS)('center'), ";", (0, _global_styling.logicalCSS)('overflow-x', 'hidden'), "font-weight:", euiTheme.font.weight.medium, ";;label:euiAvatar;"),
36
68
  // Variants
37
69
  plain: /*#__PURE__*/(0, _react.css)("background-color:", euiTheme.colors.emptyShade, ";;label:plain;"),
38
70
  subdued: /*#__PURE__*/(0, _react.css)("background-color:", euiTheme.colors.lightestShade, ";;label:subdued;"),
39
- user: _ref2,
71
+ user: _ref6,
40
72
  space: /*#__PURE__*/(0, _react.css)("border-radius:", euiTheme.border.radius.medium, ";;label:space;"),
41
73
  // States
42
- isDisabled: _ref,
74
+ isDisabled: _ref5,
43
75
  // Sizes
44
76
  s: /*#__PURE__*/(0, _react.css)(_avatarSize({
45
77
  size: euiTheme.size.l,
@@ -56,7 +88,12 @@ var euiAvatarStyles = function euiAvatarStyles(_ref4) {
56
88
  xl: /*#__PURE__*/(0, _react.css)(_avatarSize({
57
89
  size: "calc(".concat(euiTheme.size.base, " * 4)"),
58
90
  fontSize: "calc(".concat(euiTheme.size.xl, " * 0.8)")
59
- }), ";label:xl;")
91
+ }), ";label:xl;"),
92
+ // Casing
93
+ capitalize: _ref4,
94
+ uppercase: _ref3,
95
+ lowercase: _ref2,
96
+ none: _ref
60
97
  };
61
98
  };
62
99
  exports.euiAvatarStyles = euiAvatarStyles;
@@ -41,10 +41,10 @@ var euiFormVariables = function euiFormVariables(euiThemeContext) {
41
41
  inputGroupBorder: 'none'
42
42
  };
43
43
 
44
- // Colors - specific for checkboxes and radios
44
+ // Colors - specific to checkboxes, radios, switches, and range thumbs
45
45
  var customControlColors = {
46
46
  customControlDisabledIconColor: isColorDark ? (0, _services.shade)(euiTheme.colors.mediumShade, 0.38) : (0, _services.tint)(euiTheme.colors.mediumShade, 0.485),
47
- customControlBorderColor: isColorDark ? (0, _services.shade)(euiTheme.colors.lightestShade, 0.18) : (0, _services.tint)(euiTheme.colors.lightestShade, 0.3)
47
+ customControlBorderColor: isColorDark ? (0, _services.shade)(euiTheme.colors.lightestShade, 0.4) : (0, _services.tint)(euiTheme.colors.lightestShade, 0.31)
48
48
  };
49
49
  var controlLayout = {
50
50
  controlLayoutGroupInputHeight: (0, _global_styling.mathWithUnits)(controlHeight, function (x) {
@@ -9,12 +9,6 @@ Object.defineProperty(exports, "EuiLoadingChart", {
9
9
  return _loading_chart.EuiLoadingChart;
10
10
  }
11
11
  });
12
- Object.defineProperty(exports, "EuiLoadingContent", {
13
- enumerable: true,
14
- get: function get() {
15
- return _loading_content.EuiLoadingContent;
16
- }
17
- });
18
12
  Object.defineProperty(exports, "EuiLoadingElastic", {
19
13
  enumerable: true,
20
14
  get: function get() {
@@ -35,6 +29,5 @@ Object.defineProperty(exports, "EuiLoadingSpinner", {
35
29
  });
36
30
  var _loading_elastic = require("./loading_elastic");
37
31
  var _loading_chart = require("./loading_chart");
38
- var _loading_content = require("./loading_content");
39
32
  var _loading_spinner = require("./loading_spinner");
40
33
  var _loading_logo = require("./loading_logo");
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
7
  exports.EuiPageHeaderContent = exports.ALIGN_ITEMS = void 0;
8
+ var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
8
9
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
10
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
10
11
  var _react = _interopRequireDefault(require("react"));
@@ -155,21 +156,19 @@ var EuiPageHeaderContent = function EuiPageHeaderContent(_ref) {
155
156
  }
156
157
  var rightSideFlexItem;
157
158
  if (rightSideItems && rightSideItems.length) {
158
- var wrapWithFlex = function wrapWithFlex() {
159
- return rightSideItems.map(function (item, index) {
160
- return (0, _react2.jsx)(_flex.EuiFlexItem, {
161
- grow: false,
162
- key: index
163
- }, item);
164
- });
165
- };
159
+ var itemsToRender = isResponsiveBreakpoint ? rightSideItems : (0, _toConsumableArray2.default)(rightSideItems).reverse();
160
+ var rightSideFlexItems = itemsToRender.map(function (item, index) {
161
+ return (0, _react2.jsx)(_flex.EuiFlexItem, {
162
+ grow: false,
163
+ key: index
164
+ }, item);
165
+ });
166
166
  rightSideFlexItem = (0, _react2.jsx)(_flex.EuiFlexItem, {
167
167
  grow: false
168
168
  }, (0, _react2.jsx)(_flex.EuiFlexGroup, (0, _extends2.default)({
169
169
  wrap: true,
170
- responsive: false,
171
- direction: isResponsiveBreakpoint ? undefined : 'rowReverse'
172
- }, rightSideGroupProps), wrapWithFlex()));
170
+ responsive: false
171
+ }, rightSideGroupProps), rightSideFlexItems));
173
172
  }
174
173
  return alignItems === 'top' || isResponsiveBreakpoint ? (0, _react2.jsx)("div", (0, _extends2.default)({
175
174
  className: classes,
@@ -61,9 +61,9 @@ var _termValuesToQuery = function _termValuesToQuery(values, options) {
61
61
  var body = {
62
62
  query: values.map(function (value) {
63
63
  if ((0, _predicate.isString)(value) && value.match(/\s/)) {
64
- return "\"".concat(value, "\"");
64
+ return "+\"".concat(value, "\"");
65
65
  }
66
- return value;
66
+ return "+".concat(value);
67
67
  }).join(' ')
68
68
  };
69
69
  if (body.query === '') {