@elastic/eui 116.2.0 → 116.3.0

package/lib/components/table/table_header_cell_checkbox.js

@@ -1,15 +1,19 @@
 "use strict";
 
+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); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.EuiTableHeaderCellCheckbox = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _services = require("../../services");
+var _html_id_generator = require("../../services/accessibility/html_id_generator");
 var _utils = require("./utils");
 var _table_cells_shared = require("./table_cells_shared.styles");
+var _provider = require("./store/provider");
+var _sticky_header = require("./sticky_header");
 var _react2 = require("@emotion/react");
 var _excluded = ["children", "className", "scope", "style", "width", "minWidth", "maxWidth", "append"];
 /*
@@ -20,35 +24,68 @@ var _excluded = ["children", "className", "scope", "style", "width", "minWidth",
  * Side Public License, v 1.
  */
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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; }
-var EuiTableHeaderCellCheckbox = exports.EuiTableHeaderCellCheckbox = function EuiTableHeaderCellCheckbox(_ref) {
-  var children = _ref.children,
-    className = _ref.className,
-    _ref$scope = _ref.scope,
-    scope = _ref$scope === void 0 ? 'col' : _ref$scope,
-    _style = _ref.style,
-    width = _ref.width,
-    minWidth = _ref.minWidth,
-    maxWidth = _ref.maxWidth,
-    append = _ref.append,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var classes = (0, _classnames.default)('euiTableHeaderCellCheckbox', className);
+var EuiTableHeaderCellCheckbox = exports.EuiTableHeaderCellCheckbox = function EuiTableHeaderCellCheckbox(props) {
+  var children = props.children,
+    className = props.className,
+    _props$scope = props.scope,
+    scope = _props$scope === void 0 ? 'col' : _props$scope,
+    _style = props.style,
+    width = props.width,
+    minWidth = props.minWidth,
+    maxWidth = props.maxWidth,
+    append = props.append,
+    rest = _objectWithoutProperties(props, _excluded);
+  var internalCellId = (0, _html_id_generator.useGeneratedHtmlId)();
+  var store = (0, _provider.useEuiTableColumnDataStore)();
+  var isWithinStickyHeader = (0, _sticky_header.useEuiTableWithinStickyHeader)();
   var styles = (0, _services.useEuiMemoizedStyles)(_table_cells_shared.euiTableCellCheckboxStyles);
-  var style = (0, _utils.resolveWidthPropsAsStyle)(_style, {
-    width: width,
-    minWidth: minWidth,
-    maxWidth: maxWidth
+  var renderHeaderCellRef = (0, _react.useRef)();
+  renderHeaderCellRef.current = function (extraProps) {
+    var classes = (0, _classnames.default)('euiTableHeaderCellCheckbox', className);
+    var style = (0, _utils.resolveWidthPropsAsStyle)(_style, {
+      width: width,
+      minWidth: minWidth,
+      maxWidth: maxWidth
+    });
+    return (0, _react2.jsx)("th", _extends({
+      css: styles.euiTableHeaderCellCheckbox,
+      className: classes,
+      scope: scope,
+      style: style
+    }, rest, extraProps), (0, _react2.jsx)("div", {
+      className: "euiTableCellContent"
+    }, children), append);
+  };
+  (0, _react.useEffect)(function () {
+    // Don't register the column inside the sticky header as the original
+    // column is already registered. This would cause an infinite loop.
+    if (isWithinStickyHeader) {
+      return;
+    }
+    var unregisterColumn = store.registerColumn(internalCellId, {
+      renderHeaderCellRef: renderHeaderCellRef
+    });
+    return function () {
+      unregisterColumn();
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [store, internalCellId, isWithinStickyHeader]);
+  (0, _react.useEffect)(function () {
+    // Notify the store on every render so the sticky header stays in sync.
+    // React's reconciliation will efficiently handle any duplicate renders.
+    if (isWithinStickyHeader) {
+      return;
+    }
+    store.updateColumn(internalCellId, {
+      renderHeaderCellRef: renderHeaderCellRef
+    });
   });
-  return (0, _react2.jsx)("th", _extends({
-    css: styles.euiTableHeaderCellCheckbox,
-    className: classes,
-    scope: scope,
-    style: style
-  }, rest), (0, _react2.jsx)("div", {
-    className: "euiTableCellContent"
-  }, children), append);
+  return renderHeaderCellRef.current({});
 };
 EuiTableHeaderCellCheckbox.propTypes = {
   className: _propTypes.default.string,

package/lib/components/text_truncate/text_truncate.js

@@ -10,6 +10,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _services = require("../../services");
 var _resize_observer = require("../observer/resize_observer");
+var _tool_tip = require("../tool_tip");
 var _utils = require("./utils");
 var _text_truncate = require("./text_truncate.styles");
 var _react2 = require("@emotion/react");
@@ -213,11 +214,10 @@ var EuiTextTruncateWithWidth = function EuiTextTruncateWithWidth(_ref2) {
   }, [ready, width, text, truncation, truncationOffset, truncationPosition, ellipsis, containerEl]);
   var isTruncating = truncatedText !== text;
   var styles = (0, _services.useEuiMemoizedStyles)(_text_truncate.euiTextTruncateStyles);
-  return (0, _react2.jsx)("div", _extends({
+  var content = (0, _react2.jsx)("div", _extends({
     className: (0, _classnames.default)('euiTextTruncate', className),
     css: styles.euiTextTruncate,
-    ref: refs,
-    title: isTruncating ? text : undefined
+    ref: refs
   }, rest), isTruncating ? (0, _react2.jsx)(_react.default.Fragment, null, (0, _react2.jsx)("span", {
     className: "euiTextTruncate__truncatedText",
     css: styles.euiTextTruncate__truncatedText,
@@ -231,6 +231,11 @@ var EuiTextTruncateWithWidth = function EuiTextTruncateWithWidth(_ref2) {
     className: "euiTextTruncate__fullText",
     "data-test-subj": "fullText"
   }, children ? children(text) : text));
+  return isTruncating ? (0, _react2.jsx)(_tool_tip.EuiToolTip, {
+    content: text,
+    disableScreenReaderOutput: true,
+    display: "block"
+  }, content) : content;
 };
 EuiTextTruncateWithWidth.propTypes = {
   width: _propTypes.default.number.isRequired,

package/lib/components/tool_tip/tool_tip.js

@@ -39,7 +39,7 @@ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 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; }
 var POSITIONS = exports.POSITIONS = ['top', 'right', 'bottom', 'left'];
-var DISPLAYS = ['inlineBlock', 'block'];
+var DISPLAYS = ['inlineBlock', 'block', 'flex'];
 var DEFAULT_TOOLTIP_OFFSET = exports.DEFAULT_TOOLTIP_OFFSET = 16;
 
 /**

package/lib/components/tool_tip/tool_tip.styles.js

@@ -47,6 +47,14 @@ var euiToolTipStyles = exports.euiToolTipStyles = function euiToolTipStyles(euiT
   };
 };
 var _ref = process.env.NODE_ENV === "production" ? {
+  name: "1cjglks-flex",
+  styles: "display:flex;label:flex;"
+} : {
+  name: "1cjglks-flex",
+  styles: "display:flex;label:flex;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+var _ref2 = process.env.NODE_ENV === "production" ? {
   name: "fzilnk-inlineBlock",
   styles: "display:inline-block;label:inlineBlock;"
 } : {
@@ -54,7 +62,7 @@ var _ref = process.env.NODE_ENV === "production" ? {
   styles: "display:inline-block;label:inlineBlock;",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
-var _ref2 = process.env.NODE_ENV === "production" ? {
+var _ref3 = process.env.NODE_ENV === "production" ? {
   name: "14aceuy-block",
   styles: "display:block;label:block;"
 } : {
@@ -62,7 +70,7 @@ var _ref2 = process.env.NODE_ENV === "production" ? {
   styles: "display:block;label:block;",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
-var _ref3 = process.env.NODE_ENV === "production" ? {
+var _ref4 = process.env.NODE_ENV === "production" ? {
   name: "1s3i3p5-euiToolTipAnchor",
   styles: "*[disabled]{pointer-events:none;};label:euiToolTipAnchor;"
 } : {
@@ -73,9 +81,10 @@ var _ref3 = process.env.NODE_ENV === "production" ? {
 var euiToolTipAnchorStyles = exports.euiToolTipAnchorStyles = function euiToolTipAnchorStyles() {
   return {
     // Elements
-    euiToolTipAnchor: _ref3,
+    euiToolTipAnchor: _ref4,
     // Variants
-    block: _ref2,
-    inlineBlock: _ref
+    block: _ref3,
+    inlineBlock: _ref2,
+    flex: _ref
   };
 };

package/lib/utils/publisher.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createPublisher = void 0;
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
+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; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+/**
+ * @internal
+ */
+
+/**
+ * @internal
+ */
+
+/**
+ * @internal
+ */
+var createPublisher = exports.createPublisher = function createPublisher() {
+  var subscribers = new Set();
+  var unsubscribe = function unsubscribe(subscriber) {
+    subscribers.delete(subscriber);
+  };
+  var subscribe = function subscribe(subscriber) {
+    subscribers.add(subscriber);
+    return function () {
+      return unsubscribe(subscriber);
+    };
+  };
+  var notify = function notify(subject) {
+    var _iterator = _createForOfIteratorHelper(subscribers),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var _subscriber = _step.value;
+        _subscriber(subject);
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+  };
+  return {
+    subscribe: subscribe,
+    unsubscribe: unsubscribe,
+    notify: notify
+  };
+};

package/optimize/es/components/avatar/avatar.js

@@ -20,6 +20,7 @@ import { warnIfContrastBelowMin, wcagContrastMin } from '../../services/color/co
 import { isColorDark, hexToRgb, isValidHex, useEuiPaletteColorBlindBehindText } from '../../services/color';
 import { toInitials, useEuiMemoizedStyles, useEuiTheme } from '../../services';
 import { EuiIcon } from '../icon';
+import { EuiToolTip } from '../tool_tip';
 import { euiAvatarStyles } from './avatar.styles';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export var SIZES = ['s', 'm', 'l', 'xl'];
@@ -98,21 +99,28 @@ export var EuiAvatar = function EuiAvatar(_ref) {
     // Fall back to the adjusted text color if it exists
     return avatarStyle === null || avatarStyle === void 0 ? void 0 : avatarStyle.color;
   }, [iconColor, avatarStyle === null || avatarStyle === void 0 ? void 0 : avatarStyle.color, isForcedColors, euiTheme]);
-  return ___EmotionJSX("div", _extends({
+  var avatarNode = ___EmotionJSX("div", _extends({
     css: cssStyles,
     className: classes,
     style: _objectSpread(_objectSpread(_objectSpread({}, style), avatarStyle), highContrastBorder),
     "aria-label": isDisabled ? undefined : name,
-    role: isDisabled ? 'presentation' : 'img',
-    title: name
+    role: isDisabled ? 'presentation' : 'img'
   }, rest), !imageUrl && (iconType ? ___EmotionJSX(EuiIcon, {
     className: "euiAvatar__icon",
     size: iconSize || size,
     type: iconType,
-    color: iconCustomColor
+    color: iconCustomColor,
+    "aria-hidden": true
   }) : ___EmotionJSX("span", {
     "aria-hidden": "true"
   }, toInitials(name, initialsLength, initials))));
+
+  // `EuiAvatar` is not interactive so we don't need to add a `tabIndex`.
+  // It already has `aria-label`, the tooltip is only visual.
+  return name ? ___EmotionJSX(EuiToolTip, {
+    content: name,
+    disableScreenReaderOutput: true
+  }, avatarNode) : avatarNode;
 };
 
 // TODO: Migrate to a service

package/optimize/es/components/banner/banner.js

@@ -0,0 +1,112 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["title", "headingElement", "text", "size", "color", "actionProps", "media", "onDismiss", "dismissButtonProps", "children", "className", "announceOnMount", "data-test-subj"];
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import React, { forwardRef } from 'react';
+import classNames from 'classnames';
+import { useEuiMemoizedStyles } from '../../services';
+import { useEuiBackgroundColorCSS } from '../../global_styling';
+import { useEuiI18n } from '../i18n';
+import { EuiTitle } from '../title';
+import { EuiButton, EuiButtonEmpty, EuiButtonIcon } from '../button';
+import { EuiText } from '../text';
+import { EuiLiveAnnouncer } from '../accessibility';
+import { euiBannerStyles } from './banner.styles';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var EuiBanner = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var title = _ref.title,
+    _ref$headingElement = _ref.headingElement,
+    headingElement = _ref$headingElement === void 0 ? 'h2' : _ref$headingElement,
+    text = _ref.text,
+    _ref$size = _ref.size,
+    size = _ref$size === void 0 ? 'm' : _ref$size,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? 'highlighted' : _ref$color,
+    actionProps = _ref.actionProps,
+    media = _ref.media,
+    onDismiss = _ref.onDismiss,
+    dismissButtonProps = _ref.dismissButtonProps,
+    children = _ref.children,
+    className = _ref.className,
+    _ref$announceOnMount = _ref.announceOnMount,
+    announceOnMount = _ref$announceOnMount === void 0 ? false : _ref$announceOnMount,
+    _ref$dataTestSubj = _ref['data-test-subj'],
+    dataTestSubj = _ref$dataTestSubj === void 0 ? 'euiBanner' : _ref$dataTestSubj,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var styles = useEuiMemoizedStyles(euiBannerStyles);
+  var dismissAriaLabel = useEuiI18n('euiBanner.dismissAriaLabel', 'Dismiss "{title}" announcement', {
+    title: title
+  });
+  var Heading = headingElement;
+  var headingSize = size === 's' ? 'xxs' : 'xs';
+  var primaryActionProps = actionProps === null || actionProps === void 0 ? void 0 : actionProps.primary;
+  var secondaryActionProps = actionProps === null || actionProps === void 0 ? void 0 : actionProps.secondary;
+  // a standalone secondary action is not supported
+  var hasActions = Boolean(primaryActionProps);
+  var componentClass = 'euiBanner';
+  var classes = classNames(componentClass, className);
+  var backgroundColorStyles = useEuiBackgroundColorCSS()[color];
+  var cssStyles = [styles.euiBanner, backgroundColorStyles];
+  var containerCssStyles = [styles.container, onDismiss && styles.hasDismiss];
+  return ___EmotionJSX("div", _extends({
+    ref: ref,
+    className: classes,
+    css: cssStyles,
+    "data-size": size,
+    "data-color": color,
+    "data-test-subj": dataTestSubj
+  }, rest), ___EmotionJSX("div", {
+    className: "".concat(componentClass, "__container"),
+    css: containerCssStyles
+  }, media ? ___EmotionJSX("div", {
+    className: "".concat(componentClass, "__media"),
+    css: styles.media,
+    "data-test-subj": "".concat(dataTestSubj, "-media")
+  }, media) : null, ___EmotionJSX("div", {
+    className: "".concat(componentClass, "__body"),
+    css: styles.body
+  }, ___EmotionJSX("div", {
+    className: "".concat(componentClass, "__content"),
+    css: styles.content
+  }, ___EmotionJSX(EuiTitle, {
+    size: headingSize
+  }, ___EmotionJSX(Heading, {
+    css: styles.title,
+    "data-test-subj": "".concat(dataTestSubj, "-title")
+  }, title)), onDismiss ? ___EmotionJSX(EuiButtonIcon, _extends({
+    iconType: "cross",
+    color: "text",
+    "aria-label": dismissAriaLabel,
+    "data-test-subj": "".concat(dataTestSubj, "-dismiss")
+  }, dismissButtonProps, {
+    css: [styles.dismiss, dismissButtonProps === null || dismissButtonProps === void 0 ? void 0 : dismissButtonProps.css, ";label:EuiBanner;"],
+    onClick: onDismiss
+  })) : null, text ? ___EmotionJSX(EuiText, {
+    css: styles.text,
+    size: "s",
+    color: "subdued",
+    "data-test-subj": "".concat(dataTestSubj, "-text")
+  }, text) : null, children && children), hasActions ? ___EmotionJSX("div", {
+    className: "".concat(componentClass, "__actions"),
+    css: styles.actions,
+    "data-test-subj": "".concat(dataTestSubj, "-actions")
+  }, primaryActionProps ? ___EmotionJSX(EuiButton, _extends({
+    "data-test-subj": "".concat(dataTestSubj, "-primaryAction")
+  }, primaryActionProps, {
+    color: "primary",
+    size: "s"
+  })) : null, secondaryActionProps ? ___EmotionJSX(EuiButtonEmpty, _extends({
+    "data-test-subj": "".concat(dataTestSubj, "-secondaryAction")
+  }, secondaryActionProps, {
+    color: "primary",
+    size: "s"
+  })) : null) : null)), announceOnMount && ___EmotionJSX(EuiLiveAnnouncer, null, title && title, title && text && ",\xA0", text && text, (title || text) && children && ",\xA0", children && children));
+});
+EuiBanner.displayName = 'EuiBanner';

package/optimize/es/components/banner/banner.styles.js

@@ -0,0 +1,76 @@
+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)."; }
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+import { css } from '@emotion/react';
+var CONTAINER_NAME = 'euiBanner';
+var CQC_LAYOUTS = ['narrow', 'wide'];
+var CQC_BREAKPOINTS = {
+  s: {
+    narrow: '(min-width: 401px)',
+    wide: '(min-width: 800px)'
+  },
+  m: {
+    narrow: '(min-width: 601px)',
+    wide: '(min-width: 1000px)'
+  }
+};
+var CQC_BREAKPOINT_NARROWEST = '(max-width: 400px)';
+
+/** Maximum reading width for `text` and `children` slots. */
+var TEXT_MAX_WIDTH = 1200;
+var withContainerQuery = function withContainerQuery(_ref2) {
+  var layout = _ref2.layout,
+    styles = _ref2.styles;
+  return Object.keys(CQC_BREAKPOINTS).map(function (sizeKey) {
+    return "\n        @container ".concat(CONTAINER_NAME, "--").concat(sizeKey, " ").concat(CQC_BREAKPOINTS[sizeKey][layout], " {\n          ").concat(styles, "\n        }\n      ");
+  }).join('\n');
+};
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "qd171g-title",
+  styles: "[data-size='s'] &{display:inline;};label:title;"
+} : {
+  name: "qd171g-title",
+  styles: "[data-size='s'] &{display:inline;};label:title;",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+export var euiBannerStyles = function euiBannerStyles(_ref3) {
+  var euiTheme = _ref3.euiTheme;
+  return {
+    euiBanner: /*#__PURE__*/css("container-name:", CONTAINER_NAME, ";container-type:inline-size;position:relative;border:", euiTheme.border.thin, ";border-radius:", euiTheme.border.radius.medium, ";&[data-size='s']{container-name:", CONTAINER_NAME, " ", CONTAINER_NAME, "--s;}&[data-size='m']{container-name:", CONTAINER_NAME, " ", CONTAINER_NAME, "--m;};label:euiBanner;"),
+    container: /*#__PURE__*/css("display:flex;flex-direction:column;align-items:stretch;gap:", euiTheme.size.m, ";padding-inline-start:", euiTheme.size.base, ";padding-inline-end:", euiTheme.size.base, ";[data-size='m'] &{padding-block:", euiTheme.size.base, ";}[data-size='s'] &{padding-block:", euiTheme.size.m, ";}", withContainerQuery({
+      layout: 'narrow',
+      styles: "\n        flex-direction: row;\n        align-items: flex-start;\n        gap: ".concat(euiTheme.size.base, ";\n      ")
+    }), ";;label:container;"),
+    media: /*#__PURE__*/css("--euiBannerMediaSize:", "calc(".concat(euiTheme.size.base, " * 5)"), ";flex-shrink:0;inline-size:var(--euiBannerMediaSize);block-size:var(--euiBannerMediaSize);aspect-ratio:1/1;[data-size='s'] &{--euiBannerMediaSize:", "calc(".concat(euiTheme.size.base, " * 2)"), ";}", withContainerQuery({
+      layout: 'wide',
+      styles: "\n        align-self: center;\n      "
+    }), " img,svg{block-size:100%;inline-size:100%;};label:media;"),
+    body: /*#__PURE__*/css("flex:1 1 auto;min-inline-size:0;display:flex;flex-direction:column;align-self:flex-start;inline-size:100%;gap:", euiTheme.size.m, ";", withContainerQuery({
+      layout: 'narrow',
+      styles: "\n        align-self: center;\n        inline-size: auto;\n      "
+    }), " ", withContainerQuery({
+      layout: 'wide',
+      styles: "\n        flex-direction: row;\n        align-items: center;\n        /* stretch to match the media's height so align-items has space to work */\n        align-self: stretch;\n        justify-content: space-between;\n        gap: ".concat(euiTheme.size.xxl, ";\n      ")
+    }), ";;label:body;"),
+    // At size `s` the content slot becomes a block container so the title and
+    // text flow inline. Other sizes keep the flex column with a fixed gap.
+    content: /*#__PURE__*/css("flex:1 1 auto;min-inline-size:0;max-inline-size:", TEXT_MAX_WIDTH, "px;display:flex;flex-direction:column;gap:", euiTheme.size.xs, ";[data-size='s'] &{display:block;>*+*:not(.euiButtonIcon){margin-block-start:", euiTheme.size.s, ";}};label:content;"),
+    title: _ref,
+    text: /*#__PURE__*/css("[data-size='s'] &{display:inline;&::before{content:'\xB7';display:inline-block;inline-size:calc(", euiTheme.size.s, " + ", euiTheme.size.xxs, ");text-align:center;color:", euiTheme.colors.textHeading, ";}};label:text;"),
+    actions: /*#__PURE__*/css("display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;gap:", euiTheme.size.s, ";@container ", CONTAINER_NAME, " ", CQC_BREAKPOINT_NARROWEST, "{flex-wrap:wrap;>*{inline-size:100%;}}", withContainerQuery({
+      layout: 'wide',
+      styles: "\n        /* Reverses source order so primary appears last (rightmost). */\n        flex-direction: row-reverse;\n        flex-shrink: 0;\n        align-self: center;\n      "
+    }), ";;label:actions;"),
+    hasDismiss: /*#__PURE__*/css(withContainerQuery({
+      layout: 'narrow',
+      styles: "\n        padding-inline-end: calc(".concat(euiTheme.size.s, " * 5);\n      ")
+    }), ";;label:hasDismiss;"),
+    dismiss: /*#__PURE__*/css("position:absolute;inset-block-start:", euiTheme.size.s, ";inset-inline-end:", euiTheme.size.s, ";color:", euiTheme.colors.textSubdued, ";;label:dismiss;")
+  };
+};

package/optimize/es/components/banner/index.js

@@ -0,0 +1,9 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0 and the Server Side Public License, v 1; you may not use this file except
+ * in compliance with, at your election, the Elastic License 2.0 or the Server
+ * Side Public License, v 1.
+ */
+
+export { EuiBanner } from './banner';

package/optimize/es/components/basic_table/basic_table.js

@@ -8,7 +8,7 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstruct
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["className", "loading", "items", "itemId", "columns", "pagination", "sorting", "selection", "onChange", "error", "noItemsMessage", "compressed", "itemIdToExpandedRowMap", "responsiveBreakpoint", "rowProps", "cellProps", "tableCaption", "rowHeader", "tableLayout", "hasBackground", "scrollableInline", "stickyScrollbar"],
+var _excluded = ["className", "loading", "items", "itemId", "columns", "pagination", "sorting", "selection", "onChange", "error", "noItemsMessage", "compressed", "itemIdToExpandedRowMap", "responsiveBreakpoint", "rowProps", "cellProps", "tableCaption", "rowHeader", "tableLayout", "hasBackground", "scrollableInline", "stickyScrollbar", "stickyHeader"],
   _excluded2 = ["align", "render", "dataType", "isExpander", "textOnly", "name", "field", "description", "sortable", "footer", "mobileOptions", "nameTooltip"];
 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; }
@@ -41,6 +41,7 @@ import { EuiI18n } from '../i18n';
 import { EuiDelayRender } from '../delay_render';
 import { htmlIdGenerator } from '../../services/accessibility';
 import { euiBasicTableBodyLoading, safariLoadingWorkaround } from './basic_table.styles';
+import { EuiToolTip } from '../tool_tip';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var dataTypesProfiles = {
   auto: {
@@ -155,7 +156,11 @@ export var EuiBasicTable = /*#__PURE__*/function (_Component) {
         var _ref4 = _slicedToArray(_ref3, 2),
           selectAllRows = _ref4[0],
           deselectRows = _ref4[1];
-        return ___EmotionJSX(EuiCheckbox, {
+        return ___EmotionJSX(EuiToolTip, {
+          content: checked || indeterminate ? deselectRows : selectAllRows,
+          display: "block",
+          disableScreenReaderOutput: true
+        }, ___EmotionJSX(EuiCheckbox, {
           id: _this.selectAllIdGenerator(),
           checked: checked,
           indeterminate: indeterminate,
@@ -163,9 +168,8 @@ export var EuiBasicTable = /*#__PURE__*/function (_Component) {
           onChange: onChange,
           "data-test-subj": "checkboxSelectAll",
           "aria-label": checked || indeterminate ? deselectRows : selectAllRows,
-          title: checked || indeterminate ? deselectRows : selectAllRows,
           label: isMobile ? selectAllRows : null
-        });
+        }));
       });
     });
     _defineProperty(_this, "renderCopyChar", function (columnIndex) {
@@ -355,6 +359,7 @@ export var EuiBasicTable = /*#__PURE__*/function (_Component) {
         hasBackground = _this$props2.hasBackground,
         scrollableInline = _this$props2.scrollableInline,
         stickyScrollbar = _this$props2.stickyScrollbar,
+        stickyHeader = _this$props2.stickyHeader,
         rest = _objectWithoutProperties(_this$props2, _excluded);
       var classes = classNames('euiBasicTable', {
         'euiBasicTable-loading': loading
@@ -375,7 +380,8 @@ export var EuiBasicTable = /*#__PURE__*/function (_Component) {
         hasBackground = _this$props3.hasBackground,
         loading = _this$props3.loading,
         scrollableInline = _this$props3.scrollableInline,
-        stickyScrollbar = _this$props3.stickyScrollbar;
+        stickyScrollbar = _this$props3.stickyScrollbar,
+        stickyHeader = _this$props3.stickyHeader;
       return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(EuiTableHeaderMobile, {
         responsiveBreakpoint: responsiveBreakpoint
       }, this.renderSelectAll(true), this.renderTableMobileSort()), ___EmotionJSX(OverrideCopiedTabularContent, null, ___EmotionJSX(EuiTable, {
@@ -386,6 +392,7 @@ export var EuiBasicTable = /*#__PURE__*/function (_Component) {
         hasBackground: hasBackground,
         scrollableInline: scrollableInline,
         stickyScrollbar: stickyScrollbar,
+        stickyHeader: stickyHeader,
         css: loading && safariLoadingWorkaround
       }, this.renderTableCaption(), this.renderTableHead(), this.renderTableBody(), this.renderTableFooter())));
     }
@@ -654,8 +661,9 @@ export var EuiBasicTable = /*#__PURE__*/function (_Component) {
         }
       }, ___EmotionJSX(EuiIcon, {
         type: "minusCircle",
-        color: "danger"
-      }), " ", error));
+        color: "danger",
+        "aria-hidden": true
+      }), ' ', error));
     }
   }, {
     key: "renderEmptyMessage",
@@ -782,15 +790,18 @@ export var EuiBasicTable = /*#__PURE__*/function (_Component) {
           index: displayedRowIndex + 1
         }
       }, function (selectThisRow) {
-        return ___EmotionJSX(EuiCheckbox, {
+        return ___EmotionJSX(EuiToolTip, {
+          content: title || selectThisRow,
+          display: "block",
+          disableScreenReaderOutput: true
+        }, ___EmotionJSX(EuiCheckbox, {
           id: "".concat(_this6.tableId).concat(key, "-checkbox"),
           disabled: disabled,
           checked: checked,
           onChange: onChange,
-          title: title || selectThisRow,
           "aria-label": title || selectThisRow,
           "data-test-subj": "checkboxSelectRow-".concat(itemId)
-        });
+        }));
       })), disabled];
     }
   }, {

package/optimize/es/components/basic_table/collapsed_item_actions.js

@@ -90,10 +90,10 @@ export var CollapsedItemActions = function CollapsedItemActions(_ref) {
   var popoverButton = ___EmotionJSX(EuiButtonIcon, {
     className: className,
     "aria-label": actionsDisabled ? allActionsButtonDisabledAriaLabel : allActionsButtonAriaLabel,
-    title: actionsDisabled ? allActionsButtonDisabledAriaLabel : undefined,
     iconType: "boxesVertical",
     color: "text",
     isDisabled: actionsDisabled,
+    hasAriaDisabled: actionsDisabled,
     onClick: function onClick() {
       return setPopoverOpen(function (isOpen) {
         return !isOpen;
@@ -101,14 +101,15 @@ export var CollapsedItemActions = function CollapsedItemActions(_ref) {
     },
     "data-test-subj": "euiCollapsedItemActionsButton"
   });
-  var withTooltip = !actionsDisabled && ___EmotionJSX(EuiToolTip, {
-    content: allActionsTooltip
+  var withTooltip = ___EmotionJSX(EuiToolTip, {
+    content: actionsDisabled ? allActionsButtonDisabledAriaLabel : allActionsTooltip,
+    disableScreenReaderOutput: true
   }, popoverButton);
   return ___EmotionJSX(EuiPopover, {
     className: className,
     id: "".concat(itemId, "-actions"),
     isOpen: popoverOpen,
-    button: withTooltip || popoverButton,
+    button: withTooltip,
     closePopover: closePopover,
     panelPaddingSize: "none",
     anchorPosition: "leftCenter"