@elastic/eui 91.3.0 → 92.0.0-backport.0

package/optimize/lib/components/index.js

@@ -223,17 +223,6 @@ Object.keys(_context_menu).forEach(function (key) {
     }
   });
 });
-var _control_bar = require("./control_bar");
-Object.keys(_control_bar).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _control_bar[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _control_bar[key];
-    }
-  });
-});
 var _copy = require("./copy");
 Object.keys(_copy).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
@@ -597,17 +586,6 @@ Object.keys(_mutation_observer).forEach(function (key) {
     }
   });
 });
-var _notification = require("./notification");
-Object.keys(_notification).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _notification[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _notification[key];
-    }
-  });
-});
 var _outside_click_detector = require("./outside_click_detector");
 Object.keys(_outside_click_detector).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/optimize/lib/components/markdown_editor/markdown_editor.js

@@ -266,20 +266,19 @@ var EuiMarkdownEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref)
     setEditorToolbarHeight(editorToolbarRef.current.offsetHeight);
   }, [setEditorToolbarHeight]);
   (0, _react.useEffect)(function () {
-    if (isPreviewing && autoExpandPreview && height !== 'full') {
-      if (previewRef.current.scrollHeight > currentHeight) {
-        // scrollHeight does not include the border or margin
-        // so we ask for the computed value for those,
-        // which is always in pixels because getComputedValue
-        // returns the resolved values
-        var elementComputedStyle = window.getComputedStyle(previewRef.current);
-        var borderWidth = parseFloat(elementComputedStyle.borderTopWidth) + parseFloat(elementComputedStyle.borderBottomWidth);
-        var marginWidth = parseFloat(elementComputedStyle.marginTop) + parseFloat(elementComputedStyle.marginBottom);
+    if (height === 'full' || currentHeight === 'full') return;
+    if (isPreviewing && autoExpandPreview && previewRef.current.scrollHeight > currentHeight) {
+      // scrollHeight does not include the border or margin
+      // so we ask for the computed value for those,
+      // which is always in pixels because getComputedValue
+      // returns the resolved values
+      var elementComputedStyle = window.getComputedStyle(previewRef.current);
+      var borderWidth = parseFloat(elementComputedStyle.borderTopWidth) + parseFloat(elementComputedStyle.borderBottomWidth);
+      var marginWidth = parseFloat(elementComputedStyle.marginTop) + parseFloat(elementComputedStyle.marginBottom);
 
-        // then add an extra pixel for safety and because the scrollHeight value is rounded
-        var extraHeight = borderWidth + marginWidth + 1;
-        setCurrentHeight(previewRef.current.scrollHeight + extraHeight);
-      }
+      // then add an extra pixel for safety and because the scrollHeight value is rounded
+      var extraHeight = borderWidth + marginWidth + 1;
+      setCurrentHeight(previewRef.current.scrollHeight + extraHeight);
     }
   }, [currentHeight, isPreviewing, height, autoExpandPreview]);
   var previewHeight = height === 'full' ? "calc(100% - ".concat(editorFooterHeight, "px)") : currentHeight;

package/optimize/lib/components/page_template/bottom_bar/page_bottom_bar.js

@@ -62,7 +62,7 @@ var _EuiPageBottomBar = function _EuiPageBottomBar(_ref2) {
     // Hide the overflow in case of larger flex margins than padding
     ,
     css: _ref
-    // Using unknown here because of the possible conflict with overriding props and position `sticky`
+    // Using object here because of the possible conflict with overriding props and position `sticky`
   }, rest), (0, _react.jsx)(_page_section.EuiPageSection, {
     paddingSize: paddingSize,
     restrictWidth: restrictWidth

package/optimize/lib/components/selectable/selectable_list/selectable_list_item.js

@@ -217,7 +217,7 @@ var EuiSelectableListItem = /*#__PURE__*/function (_Component) {
           onFocusBadgeNode = (0, _react2.jsx)(_badge.EuiBadge, (0, _extends2.default)({
             className: "euiSelectableListItem__onFocusBadge"
           }, defaultOnFocusBadgeProps));
-        } else if (!!onFocusBadge && onFocusBadge !== false) {
+        } else if (typeof onFocusBadge !== 'boolean' && !!onFocusBadge) {
           var _children = onFocusBadge.children,
             _className = onFocusBadge.className,
             restBadgeProps = (0, _objectWithoutProperties2.default)(onFocusBadge, _excluded2);

package/optimize/lib/components/steps/step_number.styles.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.euiStepNumberStyles = exports.euiStepNumberContentStyles = void 0;
 var _react = require("@emotion/react");
 var _global_styling = require("../../global_styling");
-var _services = require("../../services");
 var _step = require("./step.styles");
 var _mixins = require("../../themes/amsterdam/global_styling/mixins");
 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)."; } /*
@@ -46,12 +45,12 @@ var euiStepNumberStyles = function euiStepNumberStyles(euiThemeContext) {
     xs: /*#__PURE__*/(0, _react.css)(createStepsNumber(euiStep.numberXSSize, (0, _global_styling.euiFontSizeFromScale)('xs', euiTheme)), ";;label:xs;"),
     // status
     incomplete: /*#__PURE__*/(0, _react.css)("background-color:transparent;color:", euiTheme.colors.text, ";border:", euiTheme.border.thick, ";;label:incomplete;"),
-    disabled: /*#__PURE__*/(0, _react.css)("background-color:", (0, _mixins.euiButtonFillColor)(euiThemeContext, 'disabled').backgroundColor, ";color:", (0, _services.makeHighContrastColor)(euiTheme.colors.disabledText)((0, _mixins.euiButtonFillColor)(euiThemeContext, 'disabled').backgroundColor), ";;label:disabled;"),
+    disabled: /*#__PURE__*/(0, _react.css)((0, _mixins.euiButtonFillColor)(euiThemeContext, 'disabled'), ";;label:disabled;"),
     loading: _ref,
-    warning: /*#__PURE__*/(0, _react.css)("color:", (0, _mixins.euiButtonFillColor)(euiThemeContext, 'warning').color, ";background-color:", (0, _mixins.euiButtonFillColor)(euiThemeContext, 'warning').backgroundColor, ";", _global_styling.euiCanAnimate, "{animation:", _global_styling.euiAnimScale, " ", euiTheme.animation.fast, " ", euiTheme.animation.bounce, ";};label:warning;"),
-    danger: /*#__PURE__*/(0, _react.css)("color:", (0, _mixins.euiButtonFillColor)(euiThemeContext, 'danger').color, ";background-color:", (0, _mixins.euiButtonFillColor)(euiThemeContext, 'danger').backgroundColor, ";", _global_styling.euiCanAnimate, "{animation:", _global_styling.euiAnimScale, " ", euiTheme.animation.fast, " ", euiTheme.animation.bounce, ";};label:danger;"),
-    complete: /*#__PURE__*/(0, _react.css)("color:", (0, _mixins.euiButtonFillColor)(euiThemeContext, 'success').color, ";background-color:", (0, _mixins.euiButtonFillColor)(euiThemeContext, 'success').backgroundColor, ";", _global_styling.euiCanAnimate, "{animation:", _global_styling.euiAnimScale, " ", euiTheme.animation.fast, " ", euiTheme.animation.bounce, ";};label:complete;"),
-    current: /*#__PURE__*/(0, _react.css)("border:2px solid ", euiTheme.colors.body, ";box-shadow:0 0 0 2px ", euiTheme.colors.primary, ";.euiStepNumber__number{display:inline-block;transform:translateY(-2px);};label:current;")
+    warning: /*#__PURE__*/(0, _react.css)((0, _mixins.euiButtonFillColor)(euiThemeContext, 'warning'), " ", _global_styling.euiCanAnimate, "{animation:", _global_styling.euiAnimScale, " ", euiTheme.animation.fast, " ", euiTheme.animation.bounce, ";};label:warning;"),
+    danger: /*#__PURE__*/(0, _react.css)((0, _mixins.euiButtonFillColor)(euiThemeContext, 'danger'), " ", _global_styling.euiCanAnimate, "{animation:", _global_styling.euiAnimScale, " ", euiTheme.animation.fast, " ", euiTheme.animation.bounce, ";};label:danger;"),
+    complete: /*#__PURE__*/(0, _react.css)((0, _mixins.euiButtonFillColor)(euiThemeContext, 'success'), " ", _global_styling.euiCanAnimate, "{animation:", _global_styling.euiAnimScale, " ", euiTheme.animation.fast, " ", euiTheme.animation.bounce, ";};label:complete;"),
+    current: /*#__PURE__*/(0, _react.css)("border:", euiTheme.border.width.thick, " solid ", euiTheme.colors.body, ";box-shadow:0 0 0 ", euiTheme.border.width.thick, " ", euiTheme.colors.primary, ";;label:current;")
   };
 };
 exports.euiStepNumberStyles = euiStepNumberStyles;
@@ -72,7 +71,7 @@ var euiStepNumberContentStyles = function euiStepNumberContentStyles(_ref3) {
     incomplete: /*#__PURE__*/(0, _react.css)("display:unset;position:relative;inset-block-start:-", euiTheme.border.width.thick, ";;label:incomplete;"),
     loading: /*#__PURE__*/(0, _react.css)(";label:loading;"),
     disabled: /*#__PURE__*/(0, _react.css)(";label:disabled;"),
-    current: /*#__PURE__*/(0, _react.css)(";label:current;")
+    current: /*#__PURE__*/(0, _react.css)("display:inline-block;transform:translateY(-", euiTheme.border.width.thick, ");;label:current;")
   };
 };
 exports.euiStepNumberContentStyles = euiStepNumberContentStyles;

package/optimize/lib/components/tree_view/tree_view.js

@@ -40,7 +40,9 @@ var EuiTreeViewContext = /*#__PURE__*/(0, _react.createContext)('');
 function hasAriaLabel(x) {
   return x.hasOwnProperty('aria-label');
 }
-function getTreeId(propId, contextId, idGenerator) {
+function getTreeId(propId) {
+  var contextId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+  var idGenerator = arguments.length > 2 ? arguments[2] : undefined;
   return propId !== null && propId !== void 0 ? propId : contextId === '' ? idGenerator() : contextId;
 }
 var displayToClassNameMap = {
@@ -50,34 +52,17 @@ var displayToClassNameMap = {
 var EuiTreeView = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(EuiTreeView, _Component);
   var _super = _createSuper(EuiTreeView);
-  function EuiTreeView() {
+  function EuiTreeView(props,
+  // Without the optional ? typing, TS will throw errors on JSX component errors
+  // @see https://github.com/facebook/react/issues/13944#issuecomment-1183693239
+  context) {
     var _this;
     (0, _classCallCheck2.default)(this, EuiTreeView);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _super.call.apply(_super, [this].concat(args));
+    // TODO: context in constructor has been deprecated.
+    // We should likely convert this to a function component
+    _this = _super.call(this, props, context);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "treeIdGenerator", (0, _services.htmlIdGenerator)('euiTreeView'));
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isNested", !!_this.context);
-    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
-      openItems: _this.props.expandByDefault ? _this.props.items.map(function (_ref) {
-        var id = _ref.id,
-          children = _ref.children;
-        return children ? id : null;
-      }).filter(function (x) {
-        return x != null;
-      }) : _this.props.items.map(function (_ref2) {
-        var id = _ref2.id,
-          children = _ref2.children,
-          isExpanded = _ref2.isExpanded;
-        return children && isExpanded ? id : null;
-      }).filter(function (x) {
-        return x != null;
-      }),
-      activeItem: '',
-      treeID: getTreeId(_this.props.id, _this.context, _this.treeIdGenerator),
-      expandChildNodes: _this.props.expandByDefault || false
-    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "isNested", void 0);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "buttonRef", []);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setButtonRef", function (ref, index) {
       _this.buttonRef[index] = ref;
@@ -172,6 +157,26 @@ var EuiTreeView = /*#__PURE__*/function (_Component) {
         _this.buttonRef[index].focus();
       }
     });
+    _this.isNested = !!_this.context;
+    _this.state = {
+      openItems: _this.props.expandByDefault ? _this.props.items.map(function (_ref) {
+        var id = _ref.id,
+          children = _ref.children;
+        return children ? id : null;
+      }).filter(function (x) {
+        return x != null;
+      }) : _this.props.items.map(function (_ref2) {
+        var id = _ref2.id,
+          children = _ref2.children,
+          isExpanded = _ref2.isExpanded;
+        return children && isExpanded ? id : null;
+      }).filter(function (x) {
+        return x != null;
+      }),
+      activeItem: '',
+      treeID: getTreeId(_this.props.id, context, _this.treeIdGenerator),
+      expandChildNodes: _this.props.expandByDefault || false
+    };
     return _this;
   }
   (0, _createClass2.default)(EuiTreeView, [{

package/optimize/lib/utils/prop_types/is.js

@@ -18,7 +18,7 @@ var is = function is(expectedValue) {
     var compName = componentName || 'ANONYMOUS';
     var value = props[propName];
     if (value !== expectedValue) {
-      return new Error("[".concat(propName, "] property in [").concat(compName, "] component is expected to equal [").concat(expectedValue, "] but\n         [").concat(value, "] was provided instead."));
+      return new Error("[".concat(propName.toString(), "] property in [").concat(compName, "] component is expected to equal [").concat(expectedValue, "] but\n         [").concat(value, "] was provided instead."));
     }
     return null;
   };
@@ -26,7 +26,7 @@ var is = function is(expectedValue) {
     var compName = componentName || 'ANONYMOUS';
     var value = props[propName];
     if ((0, _predicate.isNil)(value)) {
-      return new Error("[".concat(propName, "] property in [").concat(compName, "] component is required but seems to be missing"));
+      return new Error("[".concat(propName.toString(), "] property in [").concat(compName, "] component is required but seems to be missing"));
     }
     return validator(props, propName, componentName);
   };

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@elastic/eui",
   "description": "Elastic UI Component Library",
-  "version": "91.3.0",
+  "version": "92.0.0-backport.0",
   "license": "SEE LICENSE IN LICENSE.txt",
   "main": "lib",
   "module": "es",
   "types": "eui.d.ts",
-  "docker_image": "20.9.0",
+  "docker_image": "20.10.0",
   "engines": {
     "node": "16.x || 18.x || >=20.x"
   },
@@ -16,8 +16,6 @@
   ],
   "scripts": {
     "start": "cross-env BABEL_MODULES=false webpack serve --config=src-docs/webpack.config.js",
-    "test-docker": "node ./scripts/test-docker.js",
-    "test-a11y-docker": "node ./scripts/test-a11y-docker.js",
     "build-docs": "cross-env BABEL_MODULES=false cross-env NODE_ENV=production NODE_OPTIONS=--max-old-space-size=4096 webpack --config=src-docs/webpack.config.js",
     "build": "yarn extract-i18n-strings && node ./scripts/compile-clean.js && node ./scripts/compile-eui.js && yarn compile-scss",
     "build-pack": "yarn build && npm pack",
@@ -111,7 +109,7 @@
     "@cypress/react": "^7.0.3",
     "@cypress/react18": "^2.0.0",
     "@cypress/webpack-dev-server": "^1.7.0",
-    "@elastic/charts": "^59.1.0",
+    "@elastic/charts": "^61.2.0",
     "@elastic/datemath": "^5.0.3",
     "@emotion/babel-preset-css-prop": "^11.11.0",
     "@emotion/cache": "^11.11.0",

package/src/components/index.scss

@@ -2,13 +2,11 @@
 
 @import 'color_picker/index';
 @import 'combo_box/index';
-@import 'control_bar/index';
 @import 'date_picker/index';
 @import 'datagrid/index';
 @import 'empty_prompt/index';
 @import 'form/index';
 @import 'markdown_editor/index';
-@import 'notification/index';
 @import 'tree_view/index';
 @import 'side_nav/index';
 @import 'search_bar/index';

package/test-env/components/basic_table/basic_table.js

@@ -431,7 +431,7 @@ var EuiBasicTable = /*#__PURE__*/function (_Component) {
         var sortDirection = _this2.resolveColumnSortDirection(column);
         items.push({
           name: column.name,
-          key: "_data_s_".concat(column.field, "_").concat(index),
+          key: "_data_s_".concat(String(column.field), "_").concat(index),
           onSort: _this2.resolveColumnOnSort(column),
           isSorted: !!sortDirection,
           isSortAscending: sortDirection ? _services.SortDirection.isAsc(sortDirection) : undefined
@@ -584,11 +584,11 @@ var EuiBasicTable = /*#__PURE__*/function (_Component) {
           }
         }
         headers.push((0, _react2.jsx)(_table.EuiTableHeaderCell, (0, _extends2.default)({
-          key: "_data_h_".concat(field, "_").concat(index),
+          key: "_data_h_".concat(String(field), "_").concat(index),
           align: columnAlign,
           width: width,
           mobileOptions: mobileOptions,
-          "data-test-subj": "tableHeaderCell_".concat(field, "_").concat(index),
+          "data-test-subj": "tableHeaderCell_".concat(String(field), "_").concat(index),
           description: description
         }, sorting), name));
       });
@@ -625,7 +625,7 @@ var EuiBasicTable = /*#__PURE__*/function (_Component) {
 
         if (footer) {
           footers.push((0, _react2.jsx)(_table.EuiTableFooterCell, {
-            key: "footer_".concat(field, "_").concat(footers.length - 1),
+            key: "footer_".concat(String(field), "_").concat(footers.length - 1),
             align: align
           }, footer));
           hasDefinedFooter = true;
@@ -808,19 +808,22 @@ var EuiBasicTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderItemActionsCell",
     value: function renderItemActionsCell(itemId, item, column, columnIndex) {
-      var _this7 = this;
-      var actionEnabled = function actionEnabled(action) {
-        return _this7.state.selection.length === 0 && (!action.enabled || action.enabled(item));
-      };
+      // Disable all actions if any row(s) are selected
+      var allDisabled = this.state.selection.length > 0;
       var actualActions = column.actions.filter(function (action) {
         return !action.available || action.available(item);
       });
       if (actualActions.length > 2) {
-        // if any of the actions `isPrimary`, add them inline as well, but only the first 2
-        var primaryActions = actualActions.filter(function (o) {
-          return o.isPrimary;
-        });
-        actualActions = primaryActions.slice(0, 2);
+        if (allDisabled) {
+          // If all actions are disabled, do not show any actions but the popover toggle
+          actualActions = [];
+        } else {
+          // if any of the actions `isPrimary`, add them inline as well, but only the first 2
+          var primaryActions = actualActions.filter(function (o) {
+            return o.isPrimary;
+          });
+          actualActions = primaryActions.slice(0, 2);
+        }
 
         // if we have more than 1 action, we don't show them all in the cell, instead we
         // put them all in a popover tool. This effectively means we can only have a maximum
@@ -833,18 +836,18 @@ var EuiBasicTable = /*#__PURE__*/function (_Component) {
           render: function render(item) {
             return (0, _react2.jsx)(_collapsed_item_actions.CollapsedItemActions, {
               actions: column.actions,
+              actionsDisabled: allDisabled,
               itemId: itemId,
-              item: item,
-              actionEnabled: actionEnabled
+              item: item
             });
           }
         });
       }
       var tools = (0, _react2.jsx)(_expanded_item_actions.ExpandedItemActions, {
         actions: actualActions,
+        actionsDisabled: allDisabled,
         itemId: itemId,
-        item: item,
-        actionEnabled: actionEnabled
+        item: item
       });
       var key = "record_actions_".concat(itemId, "_").concat(columnIndex);
       return (0, _react2.jsx)(_table.EuiTableRowCell, {
@@ -862,7 +865,7 @@ var EuiBasicTable = /*#__PURE__*/function (_Component) {
       var field = column.field,
         render = column.render,
         dataType = column.dataType;
-      var key = "_data_column_".concat(field, "_").concat(itemId, "_").concat(columnIndex);
+      var key = "_data_column_".concat(String(field), "_").concat(itemId, "_").concat(columnIndex);
       var contentRenderer = render || this.getRendererForDataType(dataType);
       var value = (0, _objects.get)(item, field);
       var content = contentRenderer(value, item);
@@ -931,7 +934,7 @@ var EuiBasicTable = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderPaginationBar",
     value: function renderPaginationBar() {
-      var _this8 = this;
+      var _this7 = this;
       var _this$props11 = this.props,
         error = _this$props11.error,
         pagination = _this$props11.pagination,
@@ -950,9 +953,9 @@ var EuiBasicTable = /*#__PURE__*/function (_Component) {
         }, function (tablePagination) {
           return (0, _react2.jsx)(_pagination_bar.PaginationBar, {
             pagination: pagination,
-            onPageSizeChange: _this8.onPageSizeChange.bind(_this8),
-            onPageChange: _this8.onPageChange.bind(_this8),
-            "aria-controls": _this8.tableId,
+            onPageSizeChange: _this7.onPageSizeChange.bind(_this7),
+            onPageChange: _this7.onPageChange.bind(_this7),
+            "aria-controls": _this7.tableId,
             "aria-label": tablePagination
           });
         });

package/test-env/components/basic_table/collapsed_item_actions.js

@@ -30,16 +30,12 @@ var CollapsedItemActions = function CollapsedItemActions(_ref) {
   var actions = _ref.actions,
     itemId = _ref.itemId,
     item = _ref.item,
-    actionEnabled = _ref.actionEnabled,
+    actionsDisabled = _ref.actionsDisabled,
     className = _ref.className;
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     popoverOpen = _useState2[0],
     setPopoverOpen = _useState2[1];
-  var _useState3 = (0, _react.useState)(true),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    allDisabled = _useState4[0],
-    setAllDisabled = _useState4[1];
   var onClickItem = (0, _react.useCallback)(function (onClickAction) {
     setPopoverOpen(false);
     onClickAction === null || onClickAction === void 0 ? void 0 : onClickAction();
@@ -49,8 +45,7 @@ var CollapsedItemActions = function CollapsedItemActions(_ref) {
       var _action$available, _action$available2;
       var available = (_action$available = (_action$available2 = action.available) === null || _action$available2 === void 0 ? void 0 : _action$available2.call(action, item)) !== null && _action$available !== void 0 ? _action$available : true;
       if (!available) return controls;
-      var enabled = actionEnabled(action);
-      if (enabled) setAllDisabled(false);
+      var enabled = action.enabled == null || action.enabled(item);
       if ((0, _action_types.isCustomItemAction)(action)) {
         var customAction = action;
         var actionControl = customAction.render(item, enabled);
@@ -81,7 +76,7 @@ var CollapsedItemActions = function CollapsedItemActions(_ref) {
         controls.push((0, _react2.jsx)(_context_menu.EuiContextMenuItem, {
           key: index,
           className: "euiBasicTable__collapsedAction",
-          disabled: !enabled,
+          disabled: !enabled && !actionsDisabled,
           href: href,
           target: target,
           icon: icon,
@@ -99,17 +94,21 @@ var CollapsedItemActions = function CollapsedItemActions(_ref) {
       }
       return controls;
     }, []);
-  }, [actions, actionEnabled, item, onClickItem]);
+  }, [actions, actionsDisabled, item, onClickItem]);
   var popoverButton = (0, _react2.jsx)(_i18n.EuiI18n, {
-    token: "euiCollapsedItemActions.allActions",
-    default: "All actions"
-  }, function (allActions) {
+    tokens: ['euiCollapsedItemActions.allActions', 'euiCollapsedItemActions.allActionsDisabled'],
+    defaults: ['All actions', 'Individual item actions are disabled when rows are being selected.']
+  }, function (_ref2) {
+    var _ref3 = (0, _slicedToArray2.default)(_ref2, 2),
+      allActions = _ref3[0],
+      allActionsDisabled = _ref3[1];
     return (0, _react2.jsx)(_button.EuiButtonIcon, {
       className: className,
-      "aria-label": allActions,
+      "aria-label": actionsDisabled ? allActionsDisabled : allActions,
+      title: actionsDisabled ? allActionsDisabled : undefined,
       iconType: "boxesHorizontal",
       color: "text",
-      isDisabled: allDisabled,
+      isDisabled: actionsDisabled,
       onClick: function onClick() {
         return setPopoverOpen(function (isOpen) {
           return !isOpen;
@@ -118,7 +117,7 @@ var CollapsedItemActions = function CollapsedItemActions(_ref) {
       "data-test-subj": "euiCollapsedItemActionsButton"
     });
   });
-  var withTooltip = !allDisabled && (0, _react2.jsx)(_i18n.EuiI18n, {
+  var withTooltip = !actionsDisabled && (0, _react2.jsx)(_i18n.EuiI18n, {
     token: "euiCollapsedItemActions.allActions",
     default: "All actions"
   }, function (allActions) {

package/test-env/components/basic_table/expanded_item_actions.js

@@ -23,7 +23,7 @@ var ExpandedItemActions = function ExpandedItemActions(_ref) {
   var actions = _ref.actions,
     itemId = _ref.itemId,
     item = _ref.item,
-    actionEnabled = _ref.actionEnabled,
+    actionsDisabled = _ref.actionsDisabled,
     className = _ref.className;
   var moreThanThree = actions.length > 2;
   return (0, _react2.jsx)(_react.default.Fragment, null, actions.reduce(function (tools, action, index) {
@@ -31,7 +31,7 @@ var ExpandedItemActions = function ExpandedItemActions(_ref) {
     if (!available) {
       return tools;
     }
-    var enabled = actionEnabled(action);
+    var enabled = action.enabled == null || action.enabled(item);
     var key = "item_action_".concat(itemId, "_").concat(index);
     var classes = (0, _classnames.default)(className, {
       expandedItemActions__completelyHide: moreThanThree && index < 2
@@ -43,7 +43,7 @@ var ExpandedItemActions = function ExpandedItemActions(_ref) {
         className: classes,
         index: index,
         action: action,
-        enabled: enabled,
+        enabled: enabled && !actionsDisabled,
         item: item
       }));
     } else {
@@ -51,7 +51,7 @@ var ExpandedItemActions = function ExpandedItemActions(_ref) {
         key: key,
         className: classes,
         action: action,
-        enabled: enabled,
+        enabled: enabled && !actionsDisabled,
         item: item
       }));
     }

package/test-env/components/collapsible_nav_beta/collapsible_nav_body_footer.js

@@ -16,7 +16,7 @@ var _context = require("./context");
 var _collapsible_nav_body_footer = require("./collapsible_nav_body_footer.styles");
 var _react2 = require("@emotion/react");
 var _excluded = ["className"],
-  _excluded2 = ["className"];
+  _excluded2 = ["className", "children"];
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -53,6 +53,7 @@ var EuiCollapsibleNavBody = function EuiCollapsibleNavBody(_ref) {
 exports.EuiCollapsibleNavBody = EuiCollapsibleNavBody;
 var EuiCollapsibleNavFooter = function EuiCollapsibleNavFooter(_ref2) {
   var className = _ref2.className,
+    children = _ref2.children,
     props = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
   var classes = (0, _classnames.default)('euiCollapsibleNav__footer', className);
   var _useContext2 = (0, _react.useContext)(_context.EuiCollapsibleNavContext),
@@ -60,10 +61,13 @@ var EuiCollapsibleNavFooter = function EuiCollapsibleNavFooter(_ref2) {
     isPush = _useContext2.isPush;
   var euiTheme = (0, _services.useEuiTheme)();
   var styles = (0, _collapsible_nav_body_footer.euiCollapsibleNavFooterStyles)(euiTheme);
-  var cssStyles = [styles.euiCollapsibleNav__footer, isCollapsed && isPush && styles.isPushCollapsed];
+  var cssStyles = styles.euiCollapsibleNav__footer;
+  var overflowWrapperStyles = [styles.euiFlyoutFooter__overflow, isCollapsed && isPush && styles.isPushCollapsed];
   return (0, _react2.jsx)(_flyout.EuiFlyoutFooter, (0, _extends2.default)({
     className: classes,
     css: cssStyles
-  }, props));
+  }, props), (0, _react2.jsx)("div", {
+    css: overflowWrapperStyles
+  }, children));
 };
 exports.EuiCollapsibleNavFooter = EuiCollapsibleNavFooter;

package/test-env/components/collapsible_nav_beta/collapsible_nav_body_footer.styles.js

@@ -19,17 +19,17 @@ var _global_styling = require("../../global_styling");
 var hideScrollbars = "\n  scrollbar-width: none; /* Firefox */\n\n  &::-webkit-scrollbar {\n    display: none; /* Chrome, Edge, & Safari */\n  }\n";
 exports.hideScrollbars = hideScrollbars;
 var euiCollapsibleNavBodyStyles = {
-  // In case things get really dire responsively, ensure the footer doesn't overtake the body
-  euiCollapsibleNav__body: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('min-height', '50%'), ";;label:euiCollapsibleNav__body;"),
+  euiCollapsibleNav__body: /*#__PURE__*/(0, _react.css)(";label:euiCollapsibleNav__body;"),
   isPushCollapsed: /*#__PURE__*/(0, _react.css)(".euiFlyoutBody__overflow{", hideScrollbars, ";};label:isPushCollapsed;")
 };
 exports.euiCollapsibleNavBodyStyles = euiCollapsibleNavBodyStyles;
 var euiCollapsibleNavFooterStyles = function euiCollapsibleNavFooterStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiCollapsibleNav__footer: /*#__PURE__*/(0, _react.css)("background-color:", euiTheme.colors.emptyShade, ";", (0, _global_styling.logicalCSS)('border-top', euiTheme.border.thin), " ", (0, _global_styling.euiYScrollWithShadows)(euiThemeContext, {
+    euiCollapsibleNav__footer: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalCSS)('max-height', '50%'), " background-color:", euiTheme.colors.emptyShade, ";", (0, _global_styling.logicalCSS)('border-top', euiTheme.border.thin), ";;label:euiCollapsibleNav__footer;"),
+    euiFlyoutFooter__overflow: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiYScrollWithShadows)(euiThemeContext, {
       side: 'end'
-    }), ";;label:euiCollapsibleNav__footer;"),
+    }), ";;label:euiFlyoutFooter__overflow;"),
     isPushCollapsed: /*#__PURE__*/(0, _react.css)(hideScrollbars, ";;label:isPushCollapsed;")
   };
 };

package/test-env/components/datagrid/body/header/data_grid_header_cell.js

@@ -126,7 +126,8 @@ var EuiDataGridHeaderCell = function EuiDataGridHeaderCell(_ref) {
       });
     },
     "aria-describedby": "".concat(sortingAriaId, " ").concat(actionsAriaId),
-    ref: actionsButtonRef
+    ref: actionsButtonRef,
+    "data-test-subj": "dataGridHeaderCellActionButton-".concat(id)
   }, cellContent, (0, _react2.jsx)(_popover.EuiPopover, (0, _extends2.default)({
     display: "block",
     panelPaddingSize: "none",
@@ -148,8 +149,7 @@ var EuiDataGridHeaderCell = function EuiDataGridHeaderCell(_ref) {
     }, (0, _react2.jsx)(_icon.EuiIcon, {
       type: "boxesVertical",
       size: "s",
-      color: "text",
-      "data-test-subj": "dataGridHeaderCellActionButton-".concat(id)
+      color: "text"
     })),
     isOpen: isPopoverOpen,
     closePopover: function closePopover() {

package/test-env/components/drag_and_drop/drag_and_drop.a11y.js

@@ -77,7 +77,7 @@ var DragAndDrop = function DragAndDrop() {
 beforeEach(function () {
   cy.realMount((0, _react2.jsx)(DragAndDrop, null));
 });
-describe('EuiControlBar', function () {
+describe('EuiDragDrop', function () {
   describe('Automated accessibility check', function () {
     it('has zero violations on render', function () {
       cy.checkAxe();