@elastic/eui 113.1.0 → 113.2.0

package/optimize/lib/components/combo_box/combo_box_input/combo_box_input.js

@@ -238,7 +238,7 @@ var EuiComboBoxInput = exports.EuiComboBoxInput = /*#__PURE__*/function (_Compon
           onClick: isListOpen && !isDisabled ? onCloseListClick : onOpenListClick,
           side: 'right',
           tabIndex: -1,
-          type: 'arrowDown'
+          type: 'chevronSingleDown'
         };
       }
       var wrapClasses = (0, _classnames.default)('euiComboBox__inputWrap', {

package/optimize/lib/components/combo_box/combo_box_options_list/combo_box_options_list.js

@@ -50,7 +50,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 var hitEnterBadge = (0, _react2.jsx)(_badge.EuiBadge, {
   className: "euiComboBoxOption__enterBadge",
   color: "hollow",
-  iconType: "returnKey",
+  iconType: "return",
   "aria-hidden": "true"
 });
 var EuiComboBoxOptionsList = exports.EuiComboBoxOptionsList = /*#__PURE__*/function (_Component) {

package/optimize/lib/components/context_menu/context_menu_item.js

@@ -65,7 +65,7 @@ var EuiContextMenuItem = exports.EuiContextMenuItem = function EuiContextMenuIte
     css: styles.euiContextMenu__icon
   }));
   var arrow = hasPanel && (0, _react2.jsx)(_icon.EuiIcon, {
-    type: "arrowRight",
+    type: "chevronSingleRight",
     size: "m",
     className: "euiContextMenu__arrow",
     css: styles.euiContextMenuItem__arrow

package/optimize/lib/components/context_menu/context_menu_panel.js

@@ -354,7 +354,7 @@ var EuiContextMenuPanelClass = exports.EuiContextMenuPanelClass = /*#__PURE__*/f
           if (onClose) _this3.backButton = node;
         },
         "data-test-subj": onClose ? 'contextMenuPanelTitleButton' : 'contextMenuPanelTitle',
-        icon: onClose && 'arrowLeft'
+        icon: onClose && 'chevronSingleLeft'
       }, title);
       var content = items && items.length ? items.map(function (MenuItem) {
         var cloneProps = {};

package/optimize/lib/components/datagrid/body/cell/data_grid_cell_actions.js

@@ -53,7 +53,7 @@ var EuiDataGridCellActions = exports.EuiDataGridCellActions = function EuiDataGr
         display: "fill",
         color: "primary",
         iconSize: "s",
-        iconType: "expand",
+        iconType: "maximize",
         "aria-hidden": true,
         onClick: onExpandClick,
         title: expandButtonTitle

package/optimize/lib/components/datagrid/body/header/column_actions.js

@@ -292,7 +292,7 @@ var getHideColumnAction = exports.getHideColumnAction = function getHideColumnAc
       default: "Hide column"
     }),
     onClick: onClickHideColumn,
-    iconType: 'eyeClosed',
+    iconType: 'eyeSlash',
     size: 'xs',
     color: 'text'
   };

package/optimize/lib/components/datagrid/body/header/data_grid_header_cell.js

@@ -106,7 +106,7 @@ var EuiDataGridHeaderCell = exports.EuiDataGridHeaderCell = /*#__PURE__*/(0, _re
       return (0, _react2.jsx)(_react.default.Fragment, null, !canDragAndDropColumns && columnResizer, canDragAndDropColumns && (0, _react2.jsx)("span", {
         className: "euiDataGridHeaderCell__draggableIcon"
       }, (0, _react2.jsx)(_icon.EuiIcon, {
-        type: "grabOmnidirectional",
+        type: "drag",
         size: "s",
         css: [styles.euiDataGridHeaderCell__actions.action, styles.euiDataGridHeaderCell__actions.start, ";label:EuiDataGridHeaderCell;"]
       })), (0, _react2.jsx)("div", {

package/optimize/lib/components/datagrid/controls/column_selector.js

@@ -152,7 +152,7 @@ var useDataGridColumnSelector = exports.useDataGridColumnSelector = function use
       panelPaddingSize: "none",
       button: (0, _react2.jsx)(_data_grid_toolbar_control.EuiDataGridToolbarControl, {
         badgeContent: numberOfHiddenFields > 0 ? "".concat(orderedVisibleColumns.length, "/").concat(sortedColumns.length) : sortedColumns.length,
-        iconType: "tableDensityNormal",
+        iconType: "table",
         "data-test-subj": "dataGridColumnSelectorButton",
         onClick: function onClick() {
           return setIsOpen(!isOpen);
@@ -237,7 +237,7 @@ var useDataGridColumnSelector = exports.useDataGridColumnSelector = function use
         }, provided.dragHandleProps, {
           "aria-label": "".concat(label, " ").concat(dragHandleAriaLabel)
         }), (0, _react2.jsx)(_icon.EuiIcon, {
-          type: "grab",
+          type: "dragVertical",
           color: "subdued"
         }))));
       });

package/optimize/lib/components/datagrid/controls/column_sorting.js

@@ -192,7 +192,7 @@ var DataGridSortingControl = exports.DataGridSortingControl = /*#__PURE__*/(0, _
     button: (0, _react2.jsx)(_button.EuiButtonEmpty, {
       size: "xs",
       flush: "left",
-      iconType: "arrowDown",
+      iconType: "chevronSingleDown",
       iconSide: "right",
       "data-test-subj": "dataGridColumnSortingSelectionButton",
       onClick: function onClick() {

package/optimize/lib/components/datagrid/controls/column_sorting_draggable.js

@@ -169,7 +169,7 @@ var EuiDataGridColumnSortingDraggable = exports.EuiDataGridColumnSortingDraggabl
     }, provided.dragHandleProps, {
       "aria-label": dragHandleAriaLabel
     }), (0, _react2.jsx)(_icon.EuiIcon, {
-      type: "grab",
+      type: "dragVertical",
       color: "subdued"
     })));
   });

package/optimize/lib/components/datagrid/data_grid.a11y.js

@@ -146,7 +146,7 @@ var DataGrid = function DataGrid() {
       },
       sortTextAsc: 'Alma to Debian',
       sortTextDesc: 'Debian to Alma',
-      icon: 'starFilled',
+      icon: 'starFill',
       color: '#800080'
     }]
   });

package/optimize/lib/components/datagrid/data_grid.stories.utils.js

@@ -110,7 +110,7 @@ var columns = [{
       onClick: function onClick() {
         return alert(value);
       },
-      iconType: "email",
+      iconType: "mail",
       "aria-label": "Send email to ".concat(value)
     }, "Send email");
   }]
@@ -126,7 +126,7 @@ var columns = [{
     additional: [{
       label: 'Custom action',
       onClick: function onClick() {},
-      iconType: 'cheer',
+      iconType: 'popper',
       size: 'xs',
       color: 'text'
     }]
@@ -204,7 +204,7 @@ var defaultStorybookArgs = exports.defaultStorybookArgs = {
         iconType: "indexEdit",
         "aria-label": "Edit row"
       }), (0, _react2.jsx)(_button.EuiButtonIcon, {
-        iconType: "boxesHorizontal",
+        iconType: "boxesVertical",
         "aria-label": "Open actions popover"
       }));
     }

package/optimize/lib/components/datagrid/utils/data_grid_schema.js

@@ -73,7 +73,7 @@ var schemaDetectors = exports.schemaDetectors = [{
     if (aValue > bValue) return direction === 'asc' ? 1 : -1;
     return 0;
   },
-  icon: 'currency',
+  icon: 'money',
   color: 'euiColorVis0',
   sortTextAsc: (0, _react2.jsx)(_i18n.EuiI18n, {
     token: "euiDataGridSchema.currencySortTextAsc",

package/optimize/lib/components/date_picker/auto_refresh/auto_refresh.js

@@ -63,7 +63,7 @@ var EuiAutoRefresh = exports.EuiAutoRefresh = function EuiAutoRefresh(_ref) {
         className: "euiFormControlLayout__prepend",
         element: "button",
         label: (0, _react2.jsx)("strong", null, autoRefeshLabel),
-        iconLeft: "timeRefresh",
+        iconLeft: "refreshTime",
         isDisabled: isDisabled,
         onClick: function onClick() {
           return setIsPopoverOpen(function (isOpen) {
@@ -128,7 +128,7 @@ var EuiAutoRefreshButton = exports.EuiAutoRefreshButton = function EuiAutoRefres
       className: classes,
       size: size,
       color: color,
-      iconType: "timeRefresh",
+      iconType: "refreshTime",
       title: isPaused ? autoRefeshLabelOff : autoRefeshLabelOn,
       isDisabled: isDisabled
     }, rest), (0, _pretty_interval.usePrettyInterval)(Boolean(isPaused), refreshInterval, {

package/optimize/lib/components/date_picker/react-datepicker/src/month_dropdown.js

@@ -108,7 +108,7 @@ var MonthDropdown = exports.default = /*#__PURE__*/function (_React$Component) {
       }, (0, _react2.jsx)("span", {
         className: "react-datepicker__month-read-view--selected-month"
       }, monthNames[_this.props.month]), (0, _react2.jsx)(_icon.EuiIcon, {
-        type: "arrowDown",
+        type: "chevronSingleDown",
         size: "s",
         color: "subdued",
         className: "react-datepicker__month-read-view--down-arrow"

package/optimize/lib/components/date_picker/react-datepicker/src/month_year_dropdown.js

@@ -120,7 +120,7 @@ var MonthYearDropdown = exports.default = /*#__PURE__*/function (_React$Componen
       }, (0, _react2.jsx)("span", {
         className: "react-datepicker__month-year-read-view--selected-month-year"
       }, yearMonth), (0, _react2.jsx)(_icon.EuiIcon, {
-        type: "arrowDown",
+        type: "chevronSingleDown",
         size: "s",
         color: "subdued",
         className: "react-datepicker__month-year-read-view--down-arrow"

package/optimize/lib/components/date_picker/react-datepicker/src/year_dropdown.js

@@ -118,7 +118,7 @@ var YearDropdown = exports.default = /*#__PURE__*/function (_React$Component) {
       }, (0, _react2.jsx)("span", {
         className: "react-datepicker__year-read-view--selected-year"
       }, _this.props.year), (0, _react2.jsx)(_icon.EuiIcon, {
-        type: "arrowDown",
+        type: "chevronSingleDown",
         size: "s",
         color: "subdued",
         className: "react-datepicker__year-read-view--down-arrow"

package/optimize/lib/components/date_picker/super_date_picker/quick_select_popover/quick_select.js

@@ -189,7 +189,7 @@ var EuiQuickSelect = exports.EuiQuickSelect = /*#__PURE__*/function (_Component)
           disableScreenReaderOutput: true
         }, (0, _react2.jsx)(_button.EuiButtonIcon, {
           "aria-label": previousLabel,
-          iconType: "arrowLeft",
+          iconType: "chevronSingleLeft",
           onClick: _this2.stepBackward
         }));
       })), (0, _react2.jsx)(_flex.EuiFlexItem, {
@@ -203,7 +203,7 @@ var EuiQuickSelect = exports.EuiQuickSelect = /*#__PURE__*/function (_Component)
           disableScreenReaderOutput: true
         }, (0, _react2.jsx)(_button.EuiButtonIcon, {
           "aria-label": nextLabel,
-          iconType: "arrowRight",
+          iconType: "chevronSingleRight",
           onClick: _this2.stepForward
         }));
       }))), (0, _react2.jsx)(_flex.EuiFlexGroup, {

package/optimize/lib/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.js

@@ -80,7 +80,7 @@ var EuiQuickSelectPopover = exports.EuiQuickSelectPopover = function EuiQuickSel
   var quickSelectButton = (0, _react2.jsx)(_form.EuiFormPrepend, (0, _extends2.default)({
     element: "button",
     iconLeft: "calendar",
-    iconRight: "arrowDown",
+    iconRight: "chevronSingleDown",
     isDisabled: props.isDisabled,
     onClick: quickSelectButtonOnClick,
     "aria-label": buttonlabel,

package/optimize/lib/components/date_picker/super_date_picker/time_window_buttons.js

@@ -101,7 +101,7 @@ var EuiTimeWindowButtons = exports.EuiTimeWindowButtons = function EuiTimeWindow
     toolTipContent: !isDisabled && previousTooltipContent,
     color: buttonColor,
     size: buttonSize,
-    iconType: "arrowLeft",
+    iconType: "chevronSingleLeft",
     iconSize: iconSize,
     isIconOnly: true,
     isDisabled: isWindowDurationZero || isDisabled,
@@ -117,7 +117,7 @@ var EuiTimeWindowButtons = exports.EuiTimeWindowButtons = function EuiTimeWindow
     },
     color: buttonColor,
     size: buttonSize,
-    iconType: "magnifyWithPlus",
+    iconType: "magnifyPlus",
     iconSize: iconSize,
     isIconOnly: true,
     isDisabled: isWindowDurationZero || isDisabled,
@@ -133,7 +133,7 @@ var EuiTimeWindowButtons = exports.EuiTimeWindowButtons = function EuiTimeWindow
     },
     color: buttonColor,
     size: buttonSize,
-    iconType: "magnifyWithMinus",
+    iconType: "magnifyMinus",
     iconSize: iconSize,
     isIconOnly: true,
     isDisabled: isDisabled,
@@ -146,7 +146,7 @@ var EuiTimeWindowButtons = exports.EuiTimeWindowButtons = function EuiTimeWindow
     toolTipContent: !isDisabled && nextTooltipContent,
     color: buttonColor,
     size: buttonSize,
-    iconType: "arrowRight",
+    iconType: "chevronSingleRight",
     iconSize: iconSize,
     isIconOnly: true,
     isDisabled: isWindowDurationZero || isDisabled,

package/optimize/lib/components/filter_group/filter_button.js

@@ -64,7 +64,7 @@ var EuiFilterButton = exports.EuiFilterButton = function EuiFilterButton(_ref) {
 
   // assumption about type of usage based on icon usage
   // requires manual override to apply correct aria attributes for more custom usages
-  var isCollapsible = !isToggle && iconType === 'arrowDown';
+  var isCollapsible = !isToggle && iconType === 'chevronSingleDown';
   var isExpanded = isCollapsible && (isSelected !== null && isSelected !== void 0 ? isSelected : hasActiveFilters);
   var styles = (0, _services.useEuiMemoizedStyles)(_filter_button.euiFilterButtonStyles);
   var focusColorStyles = (0, _services.useEuiMemoizedStyles)(_button_group_button2._compressedButtonFocusColors);

package/optimize/lib/components/filter_group/filter_group.a11y.js

@@ -175,7 +175,7 @@ describe('EuiFilterGroup multiselect example', function () {
       items = _useState16[0],
       setItems = _useState16[1];
     var button = (0, _react2.jsx)(_index.EuiFilterButton, {
-      iconType: "arrowDown",
+      iconType: "chevronSingleDown",
       onClick: onButtonClick,
       isSelected: isPopoverOpen,
       numFilters: items.filter(function (item) {

package/optimize/lib/components/flyout/_flyout_overlay.js

@@ -41,11 +41,14 @@ var getEuiFlyoutOverlayStyles = function getEuiFlyoutOverlayStyles(zIndex) {
  * @internal
  */
 var EuiFlyoutOverlay = exports.EuiFlyoutOverlay = function EuiFlyoutOverlay(_ref) {
+  var _maskProps$headerZind;
   var children = _ref.children,
     isPushed = _ref.isPushed,
     maskProps = _ref.maskProps,
     hasOverlayMask = _ref.hasOverlayMask,
-    maskZIndex = _ref.maskZIndex;
+    maskZIndex = _ref.maskZIndex,
+    _ref$headerZindexLoca = _ref.headerZindexLocation,
+    headerZindexLocation = _ref$headerZindexLoca === void 0 ? 'below' : _ref$headerZindexLoca;
   var styles = (0, _react.useMemo)(function () {
     return getEuiFlyoutOverlayStyles(maskZIndex);
   }, [maskZIndex]);
@@ -55,7 +58,7 @@ var EuiFlyoutOverlay = exports.EuiFlyoutOverlay = function EuiFlyoutOverlay(_ref
   }
   var classes = (0, _css.cx)(maskProps === null || maskProps === void 0 ? void 0 : maskProps.className, styles);
   return (0, _react2.jsx)(_react.default.Fragment, null, hasOverlayMask && (0, _react2.jsx)(_overlay_mask.EuiOverlayMask, (0, _extends2.default)({
-    headerZindexLocation: "below"
+    headerZindexLocation: (_maskProps$headerZind = maskProps === null || maskProps === void 0 ? void 0 : maskProps.headerZindexLocation) !== null && _maskProps$headerZind !== void 0 ? _maskProps$headerZind : headerZindexLocation
   }, maskProps, {
     className: classes
   })), content);