@elastic/eui 99.3.0 → 99.4.0

package/es/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item.styles.js

@@ -60,7 +60,9 @@ export var euiCollapsibleNavSubItemsStyles = function euiCollapsibleNavSubItemsS
   return {
     euiCollapsibleNavItem__items: /*#__PURE__*/css(";label:euiCollapsibleNavItem__items;"),
     isTopItem: /*#__PURE__*/css(logicalCSS('padding-top', euiTheme.size.xs), " ", logicalCSS('padding-left', euiTheme.size.xl), ";;label:isTopItem;"),
-    isSubItem: /*#__PURE__*/css(logicalCSS('border-left', euiTheme.border.thin), " ", logicalCSS('margin-left', euiTheme.size.s), " ", logicalCSS('padding-left', mathWithUnits([euiTheme.size.s, euiTheme.border.width.thin], function (x, y) {
+    isSubItem: /*#__PURE__*/css(logicalCSS('border-left', euiTheme.border.thin), " ", logicalCSS('margin-left', mathWithUnits([euiTheme.size.xs], function (x) {
+      return x * 4;
+    })), " ", logicalCSS('padding-left', mathWithUnits([euiTheme.size.s, euiTheme.border.width.thin], function (x, y) {
       return x - y;
     })), ";;label:isSubItem;")
   };
@@ -71,10 +73,10 @@ export var euiCollapsibleNavSubItemsStyles = function euiCollapsibleNavSubItemsS
  */
 
 export var euiCollapsibleNavTopItemStyles = function euiCollapsibleNavTopItemStyles(_ref2) {
-  var euiTheme = _ref2.euiTheme;
+  var _euiTheme = _ref2.euiTheme;
   return {
-    // If this is the only top-level item in the list, assume it's a solution nav and
-    // reduce its default left padding + increase its relative icon size
-    euiCollapsibleNavTopItem: /*#__PURE__*/css("&:only-child{.euiCollapsibleNavItem__items{", logicalCSS('padding-left', euiTheme.size.s), ";}.euiCollapsibleNavItem__icon{transform:scale(1.25);}};label:euiCollapsibleNavTopItem;")
+    // If this is the only top-level item in the list, assume the nav is showing a single solution and
+    // use no left padding + increase its relative icon size
+    euiCollapsibleNavTopItem: /*#__PURE__*/css("&:only-child{.euiCollapsibleNavItem__items{", logicalCSS('padding-left', 0), ";}.euiCollapsibleNavItem__icon{transform:scale(1.25);}};label:euiCollapsibleNavTopItem;")
   };
 };

package/es/components/combo_box/combo_box.js

@@ -565,7 +565,11 @@ export var EuiComboBox = /*#__PURE__*/function (_Component) {
             closeOnScroll: true
           }, inputPopoverProps, {
             isOpen: isListOpen,
-            closePopover: _this2.closeList,
+            closePopover: _this2.closeList
+            /* we don't want content changes to be announced via aria-live 
+            because ComboBox uses a virtualized list that updates itself
+            on scroll and would result in unexpected screen reader output */,
+            "aria-live": "off",
             input: ___EmotionJSX(EuiComboBoxInput, {
               compressed: compressed,
               focusedOptionId: _this2.hasActiveOption() ? _this2.rootId("_option-".concat(_this2.state.activeOptionIndex)) : undefined,

package/es/components/combo_box/combo_box_input/combo_box_input.js

@@ -281,6 +281,7 @@ export var EuiComboBoxInput = /*#__PURE__*/function (_Component) {
           "aria-label": ariaLabel,
           "aria-labelledby": ariaLabelledby,
           "aria-invalid": isInvalid,
+          "aria-haspopup": "listbox",
           css: styles.euiComboBoxInput,
           className: "euiComboBox__input",
           "data-test-subj": "comboBoxSearchInput",

package/es/components/combo_box/combo_box_options_list/combo_box_options_list.js

@@ -96,7 +96,9 @@ export var EuiComboBoxOptionsList = /*#__PURE__*/function (_Component) {
         activeOptionIndex = _this$props.activeOptionIndex,
         renderOption = _this$props.renderOption,
         searchValue = _this$props.searchValue,
-        rootId = _this$props.rootId;
+        rootId = _this$props.rootId,
+        matchingOptions = _this$props.matchingOptions;
+      var optionIndex = matchingOptions.indexOf(option);
       var hasTruncationProps = _this.props.truncationProps || _truncationProps;
       var truncationProps = hasTruncationProps ? // Individual truncation settings should override component prop
       _objectSpread(_objectSpread({}, _this.props.truncationProps), _truncationProps) : undefined;
@@ -124,7 +126,9 @@ export var EuiComboBoxOptionsList = /*#__PURE__*/function (_Component) {
         checked: checked,
         showIcons: singleSelection ? true : false,
         id: rootId("_option-".concat(index)),
-        title: label
+        title: label,
+        "aria-setsize": matchingOptions.length,
+        "aria-posinset": optionIndex + 1
       }, rest), ___EmotionJSX("span", {
         className: "euiComboBoxOption__contentWrapper"
       }, ___EmotionJSX(EuiComboBoxOptionAppendPrepend, {

package/es/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.js

@@ -1,5 +1,12 @@
-var _excluded = ["applyTime"];
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["applyTime", "buttonProps"],
+  _excluded2 = ["contentProps", "onClick"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 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."); }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -32,7 +39,12 @@ import { EuiRefreshInterval } from '../../auto_refresh/refresh_interval';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export var EuiQuickSelectPopover = function EuiQuickSelectPopover(_ref) {
   var _applyTime = _ref.applyTime,
+    _ref$buttonProps = _ref.buttonProps,
+    buttonProps = _ref$buttonProps === void 0 ? {} : _ref$buttonProps,
     props = _objectWithoutProperties(_ref, _excluded);
+  var buttonContentProps = buttonProps.contentProps,
+    buttonOnClick = buttonProps.onClick,
+    quickSelectButtonProps = _objectWithoutProperties(buttonProps, _excluded2);
   var _useState = useState(),
     _useState2 = _slicedToArray(_useState, 2),
     prevQuickSelect = _useState2[0],
@@ -68,12 +80,16 @@ export var EuiQuickSelectPopover = function EuiQuickSelectPopover(_ref) {
   }, [_applyTime, closePopover]);
   var buttonlabel = useEuiI18n('euiQuickSelectPopover.buttonLabel', 'Date quick select');
   var styles = useEuiMemoizedStyles(euiQuickSelectPopoverStyles);
-  var quickSelectButton = ___EmotionJSX(EuiButtonEmpty, {
+  var quickSelectButtonOnClick = function quickSelectButtonOnClick(e) {
+    togglePopover();
+    buttonOnClick === null || buttonOnClick === void 0 || buttonOnClick(e);
+  };
+  var quickSelectButton = ___EmotionJSX(EuiButtonEmpty, _extends({
     css: styles.euiQuickSelectPopoverButton,
-    contentProps: {
+    contentProps: _objectSpread({
       css: styles.euiQuickSelectPopoverButton__content
-    },
-    onClick: togglePopover,
+    }, buttonContentProps),
+    onClick: quickSelectButtonOnClick,
     "aria-label": buttonlabel,
     title: buttonlabel,
     size: "xs",
@@ -81,7 +97,7 @@ export var EuiQuickSelectPopover = function EuiQuickSelectPopover(_ref) {
     iconSide: "right",
     isDisabled: props.isDisabled,
     "data-test-subj": "superDatePickerToggleQuickMenuButton"
-  }, ___EmotionJSX(EuiIcon, {
+  }, quickSelectButtonProps), ___EmotionJSX(EuiIcon, {
     type: "calendar"
   }));
   return ___EmotionJSX(EuiPopover, {
@@ -134,7 +150,8 @@ EuiQuickSelectPopover.propTypes = {
       label: PropTypes.string,
       start: PropTypes.oneOfType([PropTypes.oneOf(["now"]), PropTypes.string.isRequired]).isRequired
     }).isRequired).isRequired
-  }).isRequired
+  }).isRequired,
+  buttonProps: PropTypes.any
 };
 export var EuiQuickSelectPanels = function EuiQuickSelectPanels(_ref3) {
   var start = _ref3.start,
@@ -205,6 +222,45 @@ export var EuiQuickSelectPanels = function EuiQuickSelectPanels(_ref3) {
   }) : ___EmotionJSX(React.Fragment, null, quickSelectElement, commonlyUsedElement, recentlyUsedElement, refreshIntervalElement, customQuickSelectPanelsElement));
 };
 EuiQuickSelectPanels.propTypes = {
+  applyRefreshInterval: PropTypes.func,
+  applyTime: PropTypes.func.isRequired,
+  commonlyUsedRanges: PropTypes.arrayOf(PropTypes.shape({
+    end: PropTypes.oneOfType([PropTypes.oneOf(["now"]), PropTypes.string.isRequired]).isRequired,
+    label: PropTypes.string,
+    start: PropTypes.oneOfType([PropTypes.oneOf(["now"]), PropTypes.string.isRequired]).isRequired
+  }).isRequired).isRequired,
+  customQuickSelectPanels: PropTypes.arrayOf(PropTypes.shape({
+    title: PropTypes.string.isRequired,
+    content: PropTypes.element.isRequired
+  }).isRequired),
+  customQuickSelectRender: PropTypes.func,
+  dateFormat: PropTypes.string.isRequired,
+  end: PropTypes.string.isRequired,
+  isPaused: PropTypes.bool.isRequired,
+  recentlyUsedRanges: PropTypes.arrayOf(PropTypes.shape({
+    end: PropTypes.oneOfType([PropTypes.oneOf(["now"]), PropTypes.string.isRequired]).isRequired,
+    label: PropTypes.string,
+    start: PropTypes.oneOfType([PropTypes.oneOf(["now"]), PropTypes.string.isRequired]).isRequired
+  }).isRequired).isRequired,
+  refreshInterval: PropTypes.number.isRequired,
+  refreshMinInterval: PropTypes.number,
+  intervalUnits: PropTypes.any,
+  start: PropTypes.string.isRequired,
+  timeOptions: PropTypes.shape({
+    timeTenseOptions: PropTypes.arrayOf(PropTypes.any.isRequired).isRequired,
+    timeUnitsOptions: PropTypes.arrayOf(PropTypes.any.isRequired).isRequired,
+    relativeOptions: PropTypes.arrayOf(PropTypes.shape({
+      text: PropTypes.string.isRequired,
+      value: PropTypes.oneOfType([PropTypes.oneOf(["s", "m", "h", "d", "w", "M", "y"]).isRequired, PropTypes.oneOf(["s+", "m+", "h+", "d+", "w+", "M+", "y+"]).isRequired]).isRequired
+    }).isRequired).isRequired,
+    relativeRoundingLabels: PropTypes.any.isRequired,
+    refreshUnitsOptions: PropTypes.arrayOf(PropTypes.any.isRequired).isRequired,
+    commonDurationRanges: PropTypes.arrayOf(PropTypes.shape({
+      end: PropTypes.oneOfType([PropTypes.oneOf(["now"]), PropTypes.string.isRequired]).isRequired,
+      label: PropTypes.string,
+      start: PropTypes.oneOfType([PropTypes.oneOf(["now"]), PropTypes.string.isRequired]).isRequired
+    }).isRequired).isRequired
+  }).isRequired,
   prevQuickSelect: PropTypes.shape({
     timeTense: PropTypes.string.isRequired,
     timeValue: PropTypes.number.isRequired,

package/es/components/date_picker/super_date_picker/super_date_picker.js

@@ -226,7 +226,8 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
         refreshMinInterval = _this$props2.refreshMinInterval,
         refreshIntervalUnits = _this$props2.refreshIntervalUnits,
         isPaused = _this$props2.isPaused,
-        isDisabled = _this$props2.isDisabled;
+        isDisabled = _this$props2.isDisabled,
+        quickSelectButtonProps = _this$props2.quickSelectButtonProps;
       return ___EmotionJSX(EuiQuickSelectPopover, {
         applyRefreshInterval: onRefreshChange ? _this.onRefreshChange : undefined,
         applyTime: _this.applyQuickTime,
@@ -242,7 +243,8 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
         refreshMinInterval: refreshMinInterval,
         intervalUnits: refreshIntervalUnits,
         start: start,
-        timeOptions: timeOptions
+        timeOptions: timeOptions,
+        buttonProps: quickSelectButtonProps
       });
     });
     _defineProperty(_this, "renderDatePickerRange", function () {
@@ -663,6 +665,10 @@ EuiSuperDatePickerInternal.propTypes = {
        */
     responsive: PropTypes.oneOfType([PropTypes.oneOf([false]), PropTypes.arrayOf(PropTypes.any.isRequired).isRequired])
   }),
+  /**
+     * Props passed to the quick select button #EuiQuickSelectButtonProps
+     */
+  quickSelectButtonProps: PropTypes.any,
   /**
      * By default, relative units will be rounded up to next largest unit of time
      * (for example, 90 minutes will become ~ 2 hours).
@@ -834,6 +840,10 @@ EuiSuperDatePicker.propTypes = {
     iconOnly: PropTypes.bool,
     responsive: PropTypes.oneOfType([PropTypes.oneOf([false]), PropTypes.arrayOf(PropTypes.any.isRequired).isRequired])
   }),
+  /**
+     * Props passed to the quick select button #EuiQuickSelectButtonProps
+     */
+  quickSelectButtonProps: PropTypes.any,
   /**
      * By default, relative units will be rounded up to next largest unit of time
      * (for example, 90 minutes will become ~ 2 hours).

package/es/components/filter_group/filter_select_item.js

@@ -141,7 +141,7 @@ export var EuiFilterSelectItemClass = /*#__PURE__*/function (_Component) {
         },
         role: "option",
         type: "button",
-        "aria-selected": isFocused,
+        "aria-selected": checked === 'on',
         className: classes,
         css: cssStyles,
         disabled: disabled,

package/es/components/header/header.styles.js

@@ -7,7 +7,7 @@
  */
 
 import { css } from '@emotion/react';
-import { euiShadowSmall } from '../../themes/amsterdam/global_styling/mixins';
+import { euiShadowXSmall } from '../../themes/amsterdam/global_styling/mixins';
 import { logicalCSS } from '../../global_styling';
 import { shade, transparentize, makeHighContrastColor } from '../../services';
 export var euiHeaderVariables = function euiHeaderVariables(euiThemeContext) {
@@ -24,10 +24,10 @@ export var euiHeaderStyles = function euiHeaderStyles(euiThemeContext) {
     height = _euiHeaderVariables.height,
     padding = _euiHeaderVariables.padding;
   return {
-    euiHeader: /*#__PURE__*/css("display:flex;justify-content:space-between;", logicalCSS('height', height), " ", logicalCSS('padding-horizontal', padding), " ", logicalCSS('border-bottom', euiTheme.border.thin), " ", euiShadowSmall(euiThemeContext), ";;label:euiHeader;"),
+    euiHeader: /*#__PURE__*/css("display:flex;justify-content:space-between;", logicalCSS('height', height), " ", logicalCSS('padding-horizontal', padding), " ", logicalCSS('border-bottom', euiTheme.border.thin), " ", euiShadowXSmall(euiThemeContext), ";;label:euiHeader;"),
     // Position
     static: /*#__PURE__*/css("z-index:", Number(euiTheme.levels.header) - 1, ";position:relative;;label:static;"),
-    fixed: /*#__PURE__*/css("z-index:", euiTheme.levels.header, ";position:fixed;", logicalCSS('top', 0), " ", logicalCSS('horizontal', 0), ";;label:fixed;"),
+    fixed: /*#__PURE__*/css("z-index:", Number(euiTheme.levels.header) + 1, ";position:fixed;", logicalCSS('top', 0), " ", logicalCSS('horizontal', 0), ";;label:fixed;"),
     // Theme
     default: /*#__PURE__*/css("background-color:", euiTheme.colors.emptyShade, ";;label:default;"),
     dark: /*#__PURE__*/css(euiHeaderDarkStyles(euiThemeContext), ";label:dark;")

package/es/components/popover/popover.js

@@ -1,5 +1,5 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["anchorPosition", "button", "insert", "isOpen", "ownFocus", "children", "className", "closePopover", "panelClassName", "panelPaddingSize", "panelProps", "panelRef", "panelStyle", "popoverScreenReaderText", "popoverRef", "hasArrow", "arrowChildren", "repositionOnScroll", "repositionToCrossAxis", "zIndex", "attachToAnchor", "display", "offset", "onPositionChange", "buffer", "aria-label", "aria-labelledby", "container", "focusTrapProps", "initialFocus", "tabIndex"];
+var _excluded = ["anchorPosition", "button", "insert", "isOpen", "ownFocus", "children", "className", "closePopover", "panelClassName", "panelPaddingSize", "panelProps", "panelRef", "panelStyle", "popoverScreenReaderText", "popoverRef", "hasArrow", "arrowChildren", "repositionOnScroll", "repositionToCrossAxis", "zIndex", "attachToAnchor", "display", "offset", "onPositionChange", "buffer", "aria-label", "aria-labelledby", "aria-live", "container", "focusTrapProps", "initialFocus", "tabIndex"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.indexOf(n) >= 0) continue; t[n] = r[n]; } return t; }
@@ -393,6 +393,7 @@ export var EuiPopover = /*#__PURE__*/function (_Component) {
         buffer = _this$props.buffer,
         ariaLabel = _this$props['aria-label'],
         ariaLabelledBy = _this$props['aria-labelledby'],
+        ariaLiveProp = _this$props['aria-live'],
         container = _this$props.container,
         focusTrapProps = _this$props.focusTrapProps,
         initialFocusProp = _this$props.initialFocus,
@@ -425,7 +426,7 @@ export var EuiPopover = /*#__PURE__*/function (_Component) {
             };
           }
         } else {
-          ariaLive = 'assertive';
+          ariaLive = ariaLiveProp !== null && ariaLiveProp !== void 0 ? ariaLiveProp : 'assertive';
         }
         var focusTrapScreenReaderText;
         if (ownFocus || popoverScreenReaderText) {

package/eui.d.ts

@@ -5289,6 +5289,7 @@ declare module '@elastic/eui/src/components/basic_table/table_types' {
 	    items: T[];
 	    pagination?: Pagination;
 	}
+	/** Allows adding an icon with a tooltip to column names */
 	export type EuiTableColumnNameTooltipProps = {
 	    /** The main content of the tooltip */
 	    content: ReactNode;
@@ -12886,7 +12887,7 @@ declare module '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav
 	/**
 	 * Top-level item only styles
 	 */
-	export const euiCollapsibleNavTopItemStyles: ({ euiTheme }: UseEuiTheme) => {
+	export const euiCollapsibleNavTopItemStyles: ({ euiTheme: _euiTheme, }: UseEuiTheme) => {
 	    euiCollapsibleNavTopItem: import("@emotion/utils").SerializedStyles;
 	};
 
@@ -13012,7 +13013,7 @@ declare module '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav
 declare module '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_group' {
 	import { FunctionComponent, ReactNode } from 'react';
 	import { type _SharedEuiCollapsibleNavItemProps, type _EuiCollapsibleNavItemDisplayProps, type EuiCollapsibleNavItemProps } from '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item'; type EuiCollapsibleNavGroupProps = _SharedEuiCollapsibleNavItemProps & _EuiCollapsibleNavItemDisplayProps & Required<Pick<EuiCollapsibleNavItemProps, 'items'>> & {
-	    header: ReactNode;
+	    header?: ReactNode;
 	};
 	/**
 	 * Internal nav group. Should look the same as an open accordion,
@@ -13039,7 +13040,7 @@ declare module '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav
 	     */
 	    isSelected?: boolean;
 	};
-	export type EuiCollapsibleNavItemProps = _SharedEuiCollapsibleNavItemProps & {
+	export type EuiCollapsibleNavItemProps = _SharedEuiCollapsibleNavItemProps & ExclusiveUnion<{
 	    /**
 	     * Required text to render as the nav item title
 	     */
@@ -13058,7 +13059,7 @@ declare module '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav
 	     * Optional props to pass to the title icon
 	     */
 	    iconProps?: Partial<EuiIconProps>;
-	} & ExclusiveUnion<{
+	}, {}> & ExclusiveUnion<{
 	    /**
 	     * The nav item link.
 	     *
@@ -18165,12 +18166,14 @@ declare module '@elastic/eui/src/components/date_picker/auto_refresh/refresh_int
 }
 declare module '@elastic/eui/src/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover' {
 	import { FunctionComponent, ReactNode, ReactElement } from 'react';
+	import { EuiButtonEmptyPropsForButton } from '@elastic/eui/src/components/button/button_empty/button_empty';
 	import { EuiQuickSelect } from '@elastic/eui/src/components/date_picker/super_date_picker/quick_select_popover/quick_select';
 	import { EuiCommonlyUsedTimeRanges } from '@elastic/eui/src/components/date_picker/super_date_picker/quick_select_popover/commonly_used_time_ranges';
 	import { EuiRecentlyUsed } from '@elastic/eui/src/components/date_picker/super_date_picker/quick_select_popover/recently_used';
 	import { EuiRefreshInterval } from '@elastic/eui/src/components/date_picker/auto_refresh/refresh_interval';
 	import { TimeOptions } from '@elastic/eui/src/components/date_picker/super_date_picker/time_options';
 	import { DurationRange, ApplyRefreshInterval, RefreshUnitsOptions, ApplyTime, QuickSelect, QuickSelectPanel, Milliseconds } from '@elastic/eui/src/components/date_picker/types';
+	export type EuiQuickSelectButtonProps = Partial<Omit<EuiButtonEmptyPropsForButton, 'children' | 'isDisabled' | 'isLoading'>>;
 	export type CustomQuickSelectRenderOptions = {
 	    quickSelect: ReactElement<typeof EuiQuickSelect>;
 	    commonlyUsedRanges: ReactElement<typeof EuiCommonlyUsedTimeRanges>;
@@ -18194,9 +18197,10 @@ declare module '@elastic/eui/src/components/date_picker/super_date_picker/quick_
 	    intervalUnits?: RefreshUnitsOptions;
 	    start: string;
 	    timeOptions: TimeOptions;
+	    buttonProps?: EuiQuickSelectButtonProps;
 	}
 	export const EuiQuickSelectPopover: FunctionComponent<EuiQuickSelectPopoverProps>;
-	export const EuiQuickSelectPanels: FunctionComponent<Omit<EuiQuickSelectPopoverProps, 'isDisabled'> & {
+	export const EuiQuickSelectPanels: FunctionComponent<Omit<EuiQuickSelectPopoverProps, 'isDisabled' | 'buttonProps'> & {
 	    prevQuickSelect?: QuickSelect;
 	}>;
 
@@ -18438,7 +18442,7 @@ declare module '@elastic/eui/src/components/date_picker/super_date_picker/super_
 	import { TimeOptions } from '@elastic/eui/src/components/date_picker/super_date_picker/time_options';
 	import { AsyncInterval } from '@elastic/eui/src/components/date_picker/super_date_picker/async_interval';
 	import { EuiSuperUpdateButtonProps } from '@elastic/eui/src/components/date_picker/super_date_picker/super_update_button';
-	import { CustomQuickSelectRenderOptions } from '@elastic/eui/src/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover';
+	import { CustomQuickSelectRenderOptions, EuiQuickSelectButtonProps } from '@elastic/eui/src/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover';
 	import { EuiDatePopoverContentProps } from '@elastic/eui/src/components/date_picker/super_date_picker/date_popover/date_popover_content';
 	import { euiSuperDatePickerStyles } from '@elastic/eui/src/components/date_picker/super_date_picker/super_date_picker.styles';
 	export interface OnTimeChangeProps extends DurationRange {
@@ -18570,6 +18574,10 @@ declare module '@elastic/eui/src/components/date_picker/super_date_picker/super_
 	     * Props passed to the update button #EuiSuperUpdateButtonProps
 	     */
 	    updateButtonProps?: EuiSuperUpdateButtonProps;
+	    /**
+	     * Props passed to the quick select button #EuiQuickSelectButtonProps
+	     */
+	    quickSelectButtonProps?: EuiQuickSelectButtonProps;
 	    /**
 	     * By default, relative units will be rounded up to next largest unit of time
 	     * (for example, 90 minutes will become ~ 2 hours).

package/i18ntokens.json

@@ -905,14 +905,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 347,
+        "line": 352,
         "column": 12,
-        "index": 9757
+        "index": 9924
       },
       "end": {
-        "line": 350,
+        "line": 355,
         "column": 14,
-        "index": 9880
+        "index": 10047
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -923,14 +923,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 360,
+        "line": 365,
         "column": 16,
-        "index": 10319
+        "index": 10486
       },
       "end": {
-        "line": 364,
+        "line": 369,
         "column": 18,
-        "index": 10550
+        "index": 10717
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -941,14 +941,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 379,
+        "line": 384,
         "column": 16,
-        "index": 10979
+        "index": 11146
       },
       "end": {
-        "line": 385,
+        "line": 390,
         "column": 18,
-        "index": 11252
+        "index": 11419
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -959,14 +959,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 414,
+        "line": 419,
         "column": 20,
-        "index": 12243
+        "index": 12410
       },
       "end": {
-        "line": 420,
+        "line": 425,
         "column": 22,
-        "index": 12541
+        "index": 12708
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -977,14 +977,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 431,
+        "line": 436,
         "column": 12,
-        "index": 12745
+        "index": 12912
       },
       "end": {
-        "line": 435,
+        "line": 440,
         "column": 14,
-        "index": 12966
+        "index": 13133
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -995,14 +995,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 442,
+        "line": 447,
         "column": 10,
-        "index": 13085
+        "index": 13252
       },
       "end": {
-        "line": 445,
+        "line": 450,
         "column": 12,
-        "index": 13225
+        "index": 13392
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -1013,14 +1013,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 451,
+        "line": 456,
         "column": 10,
-        "index": 13338
+        "index": 13505
       },
       "end": {
-        "line": 454,
+        "line": 459,
         "column": 12,
-        "index": 13481
+        "index": 13648
       }
     },
     "filepath": "src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx"
@@ -3803,14 +3803,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 90,
+        "line": 103,
         "column": 22,
-        "index": 2948
+        "index": 3370
       },
       "end": {
-        "line": 93,
+        "line": 106,
         "column": 3,
-        "index": 3028
+        "index": 3450
       }
     },
     "filepath": "src/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.tsx"
@@ -5945,14 +5945,14 @@
     "highlighting": "string",
     "loc": {
       "start": {
-        "line": 692,
+        "line": 693,
         "column": 16,
-        "index": 20560
+        "index": 20609
       },
       "end": {
-        "line": 695,
+        "line": 696,
         "column": 18,
-        "index": 20754
+        "index": 20803
       }
     },
     "filepath": "src/components/popover/popover.tsx"

package/lib/components/accordion/accordion_trigger/accordion_trigger.js

@@ -60,6 +60,7 @@ var EuiAccordionTrigger = exports.EuiAccordionTrigger = function EuiAccordionTri
     "aria-controls": ariaControlsId,
     "aria-expanded": isOpen,
     "aria-labelledby": buttonId,
+    "aria-hidden": buttonIsInteractive ? 'true' : 'false',
     tabIndex: buttonIsInteractive ? -1 : 0
   });
   var button = (0, _react2.jsx)(_accordion_button.EuiAccordionButton, {

package/lib/components/collapsible_nav_beta/collapsible_nav_item/collapsed/collapsed_nav_button.js

@@ -84,19 +84,19 @@ EuiCollapsedNavButton.propTypes = {
        */
   isSelected: _propTypes.default.bool,
   /**
-     * Required text to render as the nav item title
-     */
-  title: _propTypes.default.string.isRequired,
+         * Required text to render as the nav item title
+         */
+  title: _propTypes.default.string,
   /**
-     * Allows customizing the title element.
-     * Consider using a heading element for better accessibility.
-     * Defaults to an unsemantic `span` or `div`, depending on context.
-     */
+         * Allows customizing the title element.
+         * Consider using a heading element for better accessibility.
+         * Defaults to an unsemantic `span` or `div`, depending on context.
+         */
   titleElement: _propTypes.default.oneOf(["h2", "h3", "h4", "h5", "h6", "span", "div"]),
   icon: _propTypes.default.oneOfType([_propTypes.default.oneOf(["accessibility", "addDataApp", "advancedSettingsApp", "agentApp", "aggregate", "analyzeEvent", "annotation", "anomalyChart", "anomalySwimLane", "apmApp", "apmTrace", "appSearchApp", "apps", "arrowDown", "arrowLeft", "arrowRight", "arrowUp", "arrowStart", "arrowEnd", "article", "asterisk", "at", "auditbeatApp", "beaker", "bell", "bellSlash", "beta", "bolt", "boxesHorizontal", "boxesVertical", "branch", "branchUser", "broom", "brush", "bug", "bullseye", "calendar", "canvasApp", "casesApp", "changePointDetection", "check", "checkInCircleFilled", "cheer", "classificationJob", "clickLeft", "clickRight", "clock", "clockCounter", "cloudDrizzle", "cloudStormy", "cloudSunny", "cluster", "codeApp", "color", "compute", "console", "consoleApp", "container", "continuityAbove", "continuityAboveBelow", "continuityBelow", "continuityWithin", "contrast", "contrastHigh", "controlsHorizontal", "controlsVertical", "copy", "copyClipboard", "createAdvancedJob", "createGenericJob", "createGeoJob", "createMultiMetricJob", "createPopulationJob", "createSingleMetricJob", "cross", "crossClusterReplicationApp", "crossInCircle", "crosshairs", "currency", "cut", "dashboardApp", "dataVisualizer", "database", "desktop", "devToolsApp", "diff", "discoverApp", "discuss", "document", "documentEdit", "documentation", "documents", "dot", "dotInCircle", "doubleArrowLeft", "doubleArrowRight", "download", "editorAlignCenter", "editorAlignLeft", "editorAlignRight", "editorBold", "editorChecklist", "editorCodeBlock", "editorComment", "editorDistributeHorizontal", "editorDistributeVertical", "editorHeading", "editorItalic", "editorItemAlignBottom", "editorItemAlignCenter", "editorItemAlignLeft", "editorItemAlignMiddle", "editorItemAlignRight", "editorItemAlignTop", "editorLink", "editorOrderedList", "editorPositionBottomLeft", "editorPositionBottomRight", "editorPositionTopLeft", "editorPositionTopRight", "editorRedo", "editorStrike", "editorTable", "editorUnderline", "editorUndo", "editorUnorderedList", "email", "empty", "emsApp", "endpoint", "eql", "eraser", "error", "errorFilled", "esqlVis", "exit", "expand", "expandMini", "exportAction", "eye", "eyeClosed", "faceHappy", "faceNeutral", "faceSad", "fieldStatistics", "filebeatApp", "filter", "filterExclude", "filterIgnore", "filterInclude", "filterInCircle", "flag", "fleetApp", "fold", "folderCheck", "folderClosed", "folderExclamation", "folderOpen", "frameNext", "framePrevious", "fullScreen", "fullScreenExit", "function", "gear", "gisApp", "glasses", "globe", "grab", "grabHorizontal", "grabOmnidirectional", "gradient", "graphApp", "grid", "grokApp", "heart", "heartbeatApp", "heatmap", "help", "home", "iInCircle", "image", "importAction", "index", "indexClose", "indexEdit", "indexFlush", "indexManagementApp", "indexMapping", "indexOpen", "indexPatternApp", "indexRollupApp", "indexRuntime", "indexSettings", "indexTemporary", "infinity", "inputOutput", "inspect", "invert", "ip", "key", "keyboard", "kqlField", "kqlFunction", "kqlOperand", "kqlSelector", "kqlValue", "kubernetesNode", "kubernetesPod", "launch", "layers", "lensApp", "lettering", "lineDashed", "lineDotted", "lineSolid", "link", "list", "listAdd", "lock", "lockOpen", "logPatternAnalysis", "logRateAnalysis", "logoAWS", "logoAWSMono", "logoAerospike", "logoApache", "logoAppSearch", "logoAzure", "logoAzureMono", "logoBeats", "logoBusinessAnalytics", "logoCeph", "logoCloud", "logoCloudEnterprise", "logoCode", "logoCodesandbox", "logoCouchbase", "logoDocker", "logoDropwizard", "logoElastic", "logoElasticStack", "logoElasticsearch", "logoEnterpriseSearch", "logoEtcd", "logoGCP", "logoGCPMono", "logoGithub", "logoGmail", "logoGolang", "logoGoogleG", "logoHAproxy", "logoIBM", "logoIBMMono", "logoKafka", "logoKibana", "logoKubernetes", "logoLogging", "logoLogstash", "logoMaps", "logoMemcached", "logoMetrics", "logoMongodb", "logoMySQL", "logoNginx", "logoObservability", "logoOsquery", "logoPhp", "logoPostgres", "logoPrometheus", "logoRabbitmq", "logoRedis", "logoSecurity", "logoSiteSearch", "logoSketch", "logoSlack", "logoUptime", "logoVulnerabilityManagement", "logoWebhook", "logoWindows", "logoWorkplaceSearch", "logsApp", "logstashFilter", "logstashIf", "logstashInput", "logstashOutput", "logstashQueue", "machineLearningApp", "magnet", "magnifyWithExclamation", "magnifyWithMinus", "magnifyWithPlus", "managementApp", "mapMarker", "memory", "menu", "menuDown", "menuLeft", "menuRight", "menuUp", "merge", "metricbeatApp", "metricsApp", "minimize", "minus", "minusInCircle", "minusInCircleFilled", "minusInSquare", "mobile", "monitoringApp", "moon", "move", "namespace", "nested", "newChat", "node", "notebookApp", "number", "offline", "online", "outlierDetectionJob", "package", "packetbeatApp", "pageSelect", "pagesSelect", "palette", "paperClip", "partial", "pause", "payment", "pencil", "percent", "pin", "pinFilled", "pipeBreaks", "pipelineApp", "pipeNoBreaks", "pivot", "play", "playFilled", "plugs", "plus", "plusInCircle", "plusInCircleFilled", "plusInSquare", "popout", "push", "questionInCircle", "quote", "recentlyViewedApp", "refresh", "regressionJob", "reporter", "reportingApp", "returnKey", "save", "savedObjectsApp", "scale", "search", "searchProfilerApp", "section", "securityAnalyticsApp", "securityApp", "securitySignal", "securitySignalDetected", "securitySignalResolved", "sessionViewer", "shard", "share", "singleMetricViewer", "snowflake", "sortAscending", "sortDescending", "sortDown", "sortLeft", "sortRight", "sortUp", "sortable", "spaces", "spacesApp", "sparkles", "sqlApp", "starEmpty", "starEmptySpace", "starFilled", "starFilledSpace", "starMinusEmpty", "starMinusFilled", "starPlusEmpty", "starPlusFilled", "stats", "stop", "stopFilled", "stopSlash", "storage", "string", "submodule", "sun", "swatchInput", "symlink", "tableDensityCompact", "tableDensityExpanded", "tableDensityNormal", "tableOfContents", "tag", "tear", "temperature", "timeline", "timelineWithArrow", "timelionApp", "timeRefresh", "timeslider", "training", "transitionLeftIn", "transitionLeftOut", "transitionTopIn", "transitionTopOut", "trash", "unfold", "unlink", "upgradeAssistantApp", "uptimeApp", "user", "userAvatar", "users", "usersRolesApp", "vector", "videoPlayer", "visArea", "visAreaStacked", "visBarHorizontal", "visBarHorizontalStacked", "visBarVertical", "visBarVerticalStacked", "visGauge", "visGoal", "visLine", "visMapCoordinate", "visMapRegion", "visMetric", "visPie", "visTable", "visTagCloud", "visText", "visTimelion", "visVega", "visVisualBuilder", "visualizeApp", "vulnerabilityManagementApp", "warning", "warningFilled", "alert", "watchesApp", "web", "wordWrap", "wordWrapDisabled", "workplaceSearchApp", "wrench", "tokenAlias", "tokenAnnotation", "tokenArray", "tokenBinary", "tokenBoolean", "tokenClass", "tokenCompletionSuggester", "tokenConstant", "tokenDate", "tokenDimension", "tokenElement", "tokenEnum", "tokenEnumMember", "tokenEvent", "tokenException", "tokenField", "tokenFile", "tokenFlattened", "tokenFunction", "tokenGeo", "tokenHistogram", "tokenInterface", "tokenIP", "tokenJoin", "tokenKey", "tokenKeyword", "tokenMethod", "tokenMetricCounter", "tokenMetricGauge", "tokenModule", "tokenNamespace", "tokenNested", "tokenNull", "tokenNumber", "tokenObject", "tokenOperator", "tokenPackage", "tokenParameter", "tokenPercolator", "tokenProperty", "tokenRange", "tokenRankFeature", "tokenRankFeatures", "tokenRepo", "tokenSearchType", "tokenSemanticText", "tokenShape", "tokenString", "tokenStruct", "tokenSymbol", "tokenTag", "tokenText", "tokenTokenCount", "tokenVariable", "tokenVectorDense", "tokenDenseVector", "tokenVectorSparse"]).isRequired, _propTypes.default.string.isRequired, _propTypes.default.elementType.isRequired]),
   /**
-     * Optional props to pass to the title icon
-     */
+         * Optional props to pass to the title icon
+         */
   iconProps: _propTypes.default.any,
   /**
          * The nav item link.