@elastic/eui 75.1.2 → 76.0.0

package/optimize/es/components/datagrid/body/{data_grid_footer_row.js → footer/data_grid_footer_row.js}

@@ -11,9 +11,14 @@ var _excluded = ["leadingControlColumns", "trailingControlColumns", "columns", "
  */
 import classnames from 'classnames';
 import React, { forwardRef, memo, useContext } from 'react';
-import { EuiDataGridCell } from './data_grid_cell';
-import { DataGridCellPopoverContext } from './data_grid_cell_popover';
+import { EuiDataGridCell } from '../data_grid_cell';
+import { DataGridCellPopoverContext } from '../data_grid_cell_popover';
 import { jsx as ___EmotionJSX } from "@emotion/react";
+
+var renderEmpty = function renderEmpty() {
+  return null;
+};
+
 var EuiDataGridFooterRow = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, ref) {
   var leadingControlColumns = _ref.leadingControlColumns,
       trailingControlColumns = _ref.trailingControlColumns,
@@ -40,7 +45,6 @@ var EuiDataGridFooterRow = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (
     rowIndex: rowIndex,
     visibleRowIndex: visibleRowIndex,
     interactiveCellId: interactiveCellId,
-    isExpandable: true,
     popoverContext: popoverContext
   };
   return ___EmotionJSX("div", _extends({
@@ -50,16 +54,17 @@ var EuiDataGridFooterRow = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (
     "data-test-subj": dataTestSubj
   }, rest), leadingControlColumns.map(function (_ref2, i) {
     var id = _ref2.id,
-        width = _ref2.width;
-    return ___EmotionJSX(EuiDataGridCell, _extends({}, sharedCellProps, {
+        width = _ref2.width,
+        footerCellRender = _ref2.footerCellRender,
+        footerCellProps = _ref2.footerCellProps;
+    return ___EmotionJSX(EuiDataGridCell, _extends({}, footerCellProps, sharedCellProps, {
       key: "".concat(id, "-").concat(rowIndex),
       colIndex: i,
       columnId: id,
       width: width,
-      renderCellValue: function renderCellValue() {
-        return null;
-      },
-      className: "euiDataGridFooterCell euiDataGridRowCell--controlColumn"
+      renderCellValue: footerCellRender !== null && footerCellRender !== void 0 ? footerCellRender : renderEmpty,
+      isExpandable: false,
+      className: classnames('euiDataGridFooterCell', 'euiDataGridRowCell--controlColumn', footerCellProps === null || footerCellProps === void 0 ? void 0 : footerCellProps.className)
     }));
   }), columns.map(function (_ref3, i) {
     var id = _ref3.id;
@@ -75,21 +80,23 @@ var EuiDataGridFooterRow = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (
       width: width || undefined,
       renderCellValue: renderCellValue,
       renderCellPopover: renderCellPopover,
+      isExpandable: true,
       className: "euiDataGridFooterCell"
     }));
   }), trailingControlColumns.map(function (_ref4, i) {
     var id = _ref4.id,
-        width = _ref4.width;
+        width = _ref4.width,
+        footerCellRender = _ref4.footerCellRender,
+        footerCellProps = _ref4.footerCellProps;
     var colIndex = i + columns.length + leadingControlColumns.length;
-    return ___EmotionJSX(EuiDataGridCell, _extends({}, sharedCellProps, {
+    return ___EmotionJSX(EuiDataGridCell, _extends({}, footerCellProps, sharedCellProps, {
       key: "".concat(id, "-").concat(rowIndex),
       colIndex: colIndex,
       columnId: id,
       width: width,
-      renderCellValue: function renderCellValue() {
-        return null;
-      },
-      className: "euiDataGridFooterCell euiDataGridRowCell--controlColumn"
+      renderCellValue: footerCellRender !== null && footerCellRender !== void 0 ? footerCellRender : renderEmpty,
+      isExpandable: false,
+      className: classnames('euiDataGridFooterCell', 'euiDataGridRowCell--controlColumn', footerCellProps === null || footerCellProps === void 0 ? void 0 : footerCellProps.className)
     }));
   }));
 }));

package/optimize/es/components/datagrid/body/footer/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 { EuiDataGridFooterRow } from './data_grid_footer_row';
+export { useDataGridFooter } from './use_data_grid_footer';

package/optimize/es/components/datagrid/body/footer/use_data_grid_footer.js

@@ -0,0 +1,45 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+var _excluded = ["renderFooterCellValue"];
+
+/*
+ * 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, { useState, useMemo } from 'react';
+import { useResizeObserver } from '../../../observer/resize_observer';
+import { EuiDataGridFooterRow } from './data_grid_footer_row';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+
+/**
+ * DRY out setting up the grid footer and its refs & observers
+ */
+export var useDataGridFooter = function useDataGridFooter(props) {
+  var _useState = useState(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      footerRowRef = _useState2[0],
+      setFooterRowRef = _useState2[1];
+
+  var _useResizeObserver = useResizeObserver(footerRowRef, 'height'),
+      footerRowHeight = _useResizeObserver.height;
+
+  var footerRow = useMemo(function () {
+    var renderFooterCellValue = props.renderFooterCellValue,
+        footerProps = _objectWithoutProperties(props, _excluded);
+
+    if (renderFooterCellValue == null) return null;
+    return ___EmotionJSX(EuiDataGridFooterRow, _extends({
+      ref: setFooterRowRef,
+      renderCellValue: renderFooterCellValue
+    }, footerProps));
+  }, Object.values(props)); // eslint-disable-line react-hooks/exhaustive-deps
+
+  return {
+    footerRow: footerRow,
+    footerRowHeight: footerRowHeight
+  };
+};

package/optimize/es/components/datagrid/body/header/data_grid_control_header_cell.js

@@ -1,3 +1,5 @@
+import _extends from "@babel/runtime/helpers/extends";
+
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -6,6 +8,7 @@
  * Side Public License, v 1.
  */
 import React from 'react';
+import classNames from 'classnames';
 import { EuiDataGridHeaderCellWrapper } from './data_grid_header_cell_wrapper';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export var EuiDataGridControlHeaderCell = function EuiDataGridControlHeaderCell(_ref) {
@@ -13,15 +16,16 @@ export var EuiDataGridControlHeaderCell = function EuiDataGridControlHeaderCell(
       index = _ref.index,
       headerIsInteractive = _ref.headerIsInteractive;
   var HeaderCellRender = controlColumn.headerCellRender,
+      headerCellProps = controlColumn.headerCellProps,
       width = controlColumn.width,
       id = controlColumn.id;
-  return ___EmotionJSX(EuiDataGridHeaderCellWrapper, {
-    className: "euiDataGridHeaderCell--controlColumn",
+  return ___EmotionJSX(EuiDataGridHeaderCellWrapper, _extends({}, headerCellProps, {
+    className: classNames('euiDataGridHeaderCell--controlColumn', headerCellProps === null || headerCellProps === void 0 ? void 0 : headerCellProps.className),
     id: id,
     index: index,
     width: width,
     headerIsInteractive: headerIsInteractive
-  }, ___EmotionJSX("div", {
+  }), ___EmotionJSX("div", {
     className: "euiDataGridHeaderCell__content"
   }, ___EmotionJSX(HeaderCellRender, null)));
 };

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

@@ -39,10 +39,11 @@ export var EuiDataGridHeaderCell = function EuiDataGridHeaderCell(_ref) {
       headerIsInteractive = _ref.headerIsInteractive;
   var id = column.id,
       display = column.display,
-      displayAsText = column.displayAsText;
+      displayAsText = column.displayAsText,
+      displayHeaderCellProps = column.displayHeaderCellProps;
   var width = columnWidths[id] || defaultColumnWidth;
   var columnType = schema[id] ? schema[id].columnType : null;
-  var classes = classnames(_defineProperty({}, "euiDataGridHeaderCell--".concat(columnType), columnType));
+  var classes = classnames(_defineProperty({}, "euiDataGridHeaderCell--".concat(columnType), columnType), displayHeaderCellProps === null || displayHeaderCellProps === void 0 ? void 0 : displayHeaderCellProps.className);
 
   var _useContext = useContext(DataGridFocusContext),
       setFocusedCell = _useContext.setFocusedCell,
@@ -88,14 +89,14 @@ export var EuiDataGridHeaderCell = function EuiDataGridHeaderCell(_ref) {
     prefix: 'euiDataGridCellHeader',
     suffix: 'actions'
   });
-  return ___EmotionJSX(EuiDataGridHeaderCellWrapper, {
+  return ___EmotionJSX(EuiDataGridHeaderCellWrapper, _extends({}, displayHeaderCellProps, {
+    className: classes,
     id: id,
     index: index,
     width: width,
     headerIsInteractive: headerIsInteractive,
-    className: classes,
     "aria-sort": ariaSort
-  }, column.isResizable !== false && width != null ? ___EmotionJSX(EuiDataGridColumnResizer, {
+  }), column.isResizable !== false && width != null ? ___EmotionJSX(EuiDataGridColumnResizer, {
     columnId: id,
     columnWidth: width,
     setColumnWidth: setColumnWidth

package/optimize/es/components/datagrid/body/header/index.js

@@ -5,4 +5,5 @@
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-export { EuiDataGridHeaderRow } from './data_grid_header_row';
+export { EuiDataGridHeaderRow } from './data_grid_header_row';
+export { useDataGridHeader } from './use_data_grid_header';

package/optimize/es/components/datagrid/body/header/use_data_grid_header.js

@@ -0,0 +1,51 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["handleHeaderMutation"];
+
+/*
+ * 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, { useState, useMemo } from 'react';
+import { useMutationObserver } from '../../../observer/mutation_observer';
+import { useResizeObserver } from '../../../observer/resize_observer';
+import { useHeaderFocusWorkaround } from '../../utils/focus';
+import { EuiDataGridHeaderRow } from './data_grid_header_row';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+
+/**
+ * DRY out setting up the grid header and its refs & observers
+ */
+export var useDataGridHeader = function useDataGridHeader(_ref) {
+  var handleHeaderMutation = _ref.handleHeaderMutation,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  var _useState = useState(null),
+      _useState2 = _slicedToArray(_useState, 2),
+      headerRowRef = _useState2[0],
+      setHeaderRowRef = _useState2[1];
+
+  useMutationObserver(headerRowRef, handleHeaderMutation, {
+    subtree: true,
+    childList: true
+  });
+
+  var _useResizeObserver = useResizeObserver(headerRowRef, 'height'),
+      headerRowHeight = _useResizeObserver.height;
+
+  var headerRow = useMemo(function () {
+    return ___EmotionJSX(EuiDataGridHeaderRow, _extends({
+      ref: setHeaderRowRef
+    }, props));
+  }, Object.values(props)); // eslint-disable-line react-hooks/exhaustive-deps
+
+  useHeaderFocusWorkaround(props.headerIsInteractive);
+  return {
+    headerRow: headerRow,
+    headerRowHeight: headerRowHeight
+  };
+};

package/optimize/es/components/date_picker/date_picker_range.js

@@ -87,7 +87,7 @@ export var EuiDatePickerRange = function EuiDatePickerRange(_ref) {
     className: "euiDatePickerRange__delimeter"
   }, ___EmotionJSX(EuiIcon, {
     color: isInvalid ? 'danger' : 'subdued',
-    type: isInvalid ? 'alert' : 'sortRight'
+    type: isInvalid ? 'warning' : 'sortRight'
   }));
 
   return ___EmotionJSX("div", _extends({

package/optimize/es/components/expression/expression.js

@@ -62,7 +62,7 @@ export var EuiExpression = function EuiExpression(_ref) {
   }, descriptionStyle) : undefined;
   var invalidIcon = isInvalid ? ___EmotionJSX(EuiIcon, {
     className: "euiExpression__icon",
-    type: "alert",
+    type: "warning",
     css: cssIconStyles,
     color: calculatedColor
   }) : undefined;

package/optimize/es/components/icon/assets/pivot.js

@@ -0,0 +1,37 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["title", "titleId"];
+
+/*
+ * 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.
+ */
+// THIS IS A GENERATED FILE. DO NOT MODIFY MANUALLY. @see scripts/compile-icons.js
+import * as React from 'react';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+
+var EuiIconPivot = function EuiIconPivot(_ref) {
+  var title = _ref.title,
+      titleId = _ref.titleId,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  return ___EmotionJSX("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    fill: "none",
+    viewBox: "0 0 16 16",
+    "aria-labelledby": titleId
+  }, props), title ? ___EmotionJSX("title", {
+    id: titleId
+  }, title) : null, ___EmotionJSX("path", {
+    fillRule: "evenodd",
+    d: "M2.89 13.847L11.239 5.5a.522.522 0 00-.737-.737L2.154 13.11a.522.522 0 00.738.738zM14 6.696a.522.522 0 11-1.043 0v-3.13a.522.522 0 00-.522-.523h-3.13a.522.522 0 110-1.043h3.13C13.299 2 14 2.7 14 3.565v3.13z",
+    clipRule: "evenodd"
+  }));
+};
+
+export var icon = EuiIconPivot;

package/optimize/es/components/icon/assets/{crossInACircleFilled.js → warning.js}

@@ -13,7 +13,7 @@ var _excluded = ["title", "titleId"];
 import * as React from 'react';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 
-var EuiIconCrossInACircleFilled = function EuiIconCrossInACircleFilled(_ref) {
+var EuiIconWarning = function EuiIconWarning(_ref) {
   var title = _ref.title,
       titleId = _ref.titleId,
       props = _objectWithoutProperties(_ref, _excluded);
@@ -27,8 +27,10 @@ var EuiIconCrossInACircleFilled = function EuiIconCrossInACircleFilled(_ref) {
   }, props), title ? ___EmotionJSX("title", {
     id: titleId
   }, title) : null, ___EmotionJSX("path", {
-    d: "M8.746 8l3.1-3.1a.527.527 0 10-.746-.746L8 7.254l-3.1-3.1a.527.527 0 10-.746.746l3.1 3.1-3.1 3.1a.527.527 0 10.746.746l3.1-3.1 3.1 3.1a.527.527 0 10.746-.746L8.746 8zM8 16A8 8 0 118 0a8 8 0 010 16z"
+    d: "M8.55 9.502l.35-3.507a.905.905 0 10-1.8 0l.35 3.507a.552.552 0 001.1 0zM9 12a1 1 0 11-2 0 1 1 0 012 0z"
+  }), ___EmotionJSX("path", {
+    d: "M8.864 1.496a1 1 0 00-1.728 0l-7 12A1 1 0 001 15h14a1 1 0 00.864-1.504l-7-12zM1 14L8 2l7 12H1z"
   }));
 };
 
-export var icon = EuiIconCrossInACircleFilled;
+export var icon = EuiIconWarning;

package/optimize/es/components/icon/icon_glyphs.a11y.js

@@ -11,7 +11,7 @@ import { EuiIcon } from './icon';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 describe('EuiIcons', function () {
   describe('Automated accessibility check for glyph icons', function () {
-    var GlyphIcons = ['accessibility', 'aggregate', 'alert', 'analyzeEvent', 'annotation', 'apmTrace', 'apps', 'arrowDown', 'arrowLeft', 'arrowRight', 'arrowUp', 'arrowStart', 'arrowEnd', 'article', 'asterisk', 'beaker', 'bell', 'bellSlash', 'beta', 'bolt', 'boxesHorizontal', 'boxesVertical', 'branch', 'branchUser', 'broom', 'brush', 'bug', 'bullseye', 'calendar', 'check', 'checkInCircleFilled', 'cheer', 'clock', 'cloudDrizzle', 'cloudStormy', 'cloudSunny', 'cluster', 'color', 'compute', 'console', 'container', 'continuityAbove', 'continuityAboveBelow', 'continuityBelow', 'continuityWithin', 'controlsHorizontal', 'controlsVertical', 'copy', 'copyClipboard', 'cross', 'crosshairs', 'crossInACircleFilled', 'currency', 'cut', 'database', 'desktop', 'discuss', 'document', 'documents', 'documentEdit', 'documentation', 'dot', 'dotInCircle', 'doubleArrowLeft', 'doubleArrowRight', 'download', 'email', 'empty', 'eql', 'eraser', 'exit', 'expand', 'expandMini', 'exportAction', 'eye', 'eyeClosed', 'faceHappy', 'faceNeutral', 'faceSad', 'filter', 'filterExclude', 'filterIgnore', 'filterInclude', 'filterInCircle', 'flag', 'fold', 'folderCheck', 'folderClosed', 'folderExclamation', 'folderOpen', 'frameNext', 'framePrevious', 'fullScreen', 'fullScreenExit', 'function', 'gear', 'glasses', 'globe', 'grab', 'grabHorizontal', 'grid', 'heart', 'heatmap', 'help', 'home', 'iInCircle', 'image', 'importAction', 'indexClose', 'indexEdit', 'indexFlush', 'indexMapping', 'indexOpen', 'indexRuntime', 'indexSettings', 'indexTemporary', 'infinity', 'inputOutput', 'inspect', 'invert', 'ip', 'keyboard', 'kqlField', 'kqlFunction', 'kqlOperand', 'kqlSelector', 'kqlValue', 'kubernetesNode', 'kubernetesPod', 'launch', 'layers', 'lettering', 'lineDashed', 'lineDotted', 'lineSolid', 'link', 'list', 'listAdd', 'lock', 'lockOpen', 'logstashFilter', 'logstashIf', 'logstashInput', 'logstashOutput', 'logstashQueue', 'magnifyWithExclamation', 'magnifyWithMinus', 'magnifyWithPlus', 'magnet', 'mapMarker', 'memory', 'merge', 'menu', 'menuDown', 'menuLeft', 'menuRight', 'menuUp', 'minimize', 'minus', 'minusInCircle', 'minusInCircleFilled', 'mobile', 'moon', 'namespace', 'nested', 'node', 'number', 'offline', 'online', 'package', 'pageSelect', 'pagesSelect', 'paperClip', 'partial', 'pause', 'payment', 'pencil', 'percent', 'pin', 'pinFilled', 'play', 'playFilled', 'plus', 'plusInCircle', 'plusInCircleFilled', 'popout', 'push', 'questionInCircle', 'quote', 'refresh', 'reporter', 'returnKey', 'save', 'scale', 'search', 'securitySignal', 'securitySignalDetected', 'securitySignalResolved', 'sessionViewer', 'shard', 'share', 'snowflake', 'sortable', 'sortAscending', 'sortDescending', 'sortDown', 'sortLeft', 'sortRight', 'sortUp', 'spaces', 'starEmpty', 'starEmptySpace', 'starFilled', 'starFilledSpace', 'starMinusEmpty', 'starMinusFilled', 'starPlusEmpty', 'starPlusFilled', 'stats', 'stop', 'stopFilled', 'stopSlash', 'storage', 'string', 'submodule', 'sun', 'symlink', 'tableOfContents', 'tableDensityExpanded', 'tableDensityCompact', 'tableDensityNormal', 'tag', 'tear', 'temperature', 'timeline', 'timeRefresh', 'timeslider', 'training', 'trash', 'unfold', 'unlink', 'user', 'userAvatar', 'users', 'vector', 'videoPlayer', 'visArea', 'visAreaStacked', 'visBarHorizontal', 'visBarHorizontalStacked', 'visBarVertical', 'visBarVerticalStacked', 'visGauge', 'visGoal', 'visLine', 'visMapCoordinate', 'visMapRegion', 'visMetric', 'visPie', 'visTable', 'visTagCloud', 'visText', 'visTimelion', 'visVega', 'visVisualBuilder', 'wordWrap', 'wordWrapDisabled', 'wrench'];
+    var GlyphIcons = ['accessibility', 'aggregate', 'analyzeEvent', 'annotation', 'apmTrace', 'apps', 'arrowDown', 'arrowLeft', 'arrowRight', 'arrowUp', 'arrowStart', 'arrowEnd', 'article', 'asterisk', 'beaker', 'bell', 'bellSlash', 'beta', 'bolt', 'boxesHorizontal', 'boxesVertical', 'branch', 'branchUser', 'broom', 'brush', 'bug', 'bullseye', 'calendar', 'check', 'checkInCircleFilled', 'cheer', 'clock', 'cloudDrizzle', 'cloudStormy', 'cloudSunny', 'cluster', 'color', 'compute', 'console', 'container', 'continuityAbove', 'continuityAboveBelow', 'continuityBelow', 'continuityWithin', 'controlsHorizontal', 'controlsVertical', 'copy', 'copyClipboard', 'cross', 'crosshairs', 'currency', 'cut', 'database', 'desktop', 'discuss', 'document', 'documents', 'documentEdit', 'documentation', 'dot', 'dotInCircle', 'doubleArrowLeft', 'doubleArrowRight', 'download', 'email', 'empty', 'eql', 'eraser', 'exit', 'expand', 'expandMini', 'exportAction', 'eye', 'eyeClosed', 'faceHappy', 'faceNeutral', 'faceSad', 'filter', 'filterExclude', 'filterIgnore', 'filterInclude', 'filterInCircle', 'flag', 'fold', 'folderCheck', 'folderClosed', 'folderExclamation', 'folderOpen', 'frameNext', 'framePrevious', 'fullScreen', 'fullScreenExit', 'function', 'gear', 'glasses', 'globe', 'grab', 'grabHorizontal', 'grid', 'heart', 'heatmap', 'help', 'home', 'iInCircle', 'image', 'importAction', 'indexClose', 'indexEdit', 'indexFlush', 'indexMapping', 'indexOpen', 'indexRuntime', 'indexSettings', 'indexTemporary', 'infinity', 'inputOutput', 'inspect', 'invert', 'ip', 'keyboard', 'kqlField', 'kqlFunction', 'kqlOperand', 'kqlSelector', 'kqlValue', 'kubernetesNode', 'kubernetesPod', 'launch', 'layers', 'lettering', 'lineDashed', 'lineDotted', 'lineSolid', 'link', 'list', 'listAdd', 'lock', 'lockOpen', 'logstashFilter', 'logstashIf', 'logstashInput', 'logstashOutput', 'logstashQueue', 'magnifyWithExclamation', 'magnifyWithMinus', 'magnifyWithPlus', 'magnet', 'mapMarker', 'memory', 'merge', 'menu', 'menuDown', 'menuLeft', 'menuRight', 'menuUp', 'minimize', 'minus', 'minusInCircle', 'minusInCircleFilled', 'mobile', 'moon', 'namespace', 'nested', 'node', 'number', 'offline', 'online', 'package', 'pageSelect', 'pagesSelect', 'paperClip', 'partial', 'pause', 'payment', 'pencil', 'percent', 'pin', 'pinFilled', 'play', 'playFilled', 'plus', 'plusInCircle', 'plusInCircleFilled', 'popout', 'push', 'questionInCircle', 'quote', 'refresh', 'reporter', 'returnKey', 'save', 'scale', 'search', 'securitySignal', 'securitySignalDetected', 'securitySignalResolved', 'sessionViewer', 'shard', 'share', 'snowflake', 'sortable', 'sortAscending', 'sortDescending', 'sortDown', 'sortLeft', 'sortRight', 'sortUp', 'spaces', 'starEmpty', 'starEmptySpace', 'starFilled', 'starFilledSpace', 'starMinusEmpty', 'starMinusFilled', 'starPlusEmpty', 'starPlusFilled', 'stats', 'stop', 'stopFilled', 'stopSlash', 'storage', 'string', 'submodule', 'sun', 'symlink', 'tableOfContents', 'tableDensityExpanded', 'tableDensityCompact', 'tableDensityNormal', 'tag', 'tear', 'temperature', 'timeline', 'timeRefresh', 'timeslider', 'training', 'trash', 'unfold', 'unlink', 'user', 'userAvatar', 'users', 'vector', 'videoPlayer', 'visArea', 'visAreaStacked', 'visBarHorizontal', 'visBarHorizontalStacked', 'visBarVertical', 'visBarVerticalStacked', 'visGauge', 'visGoal', 'visLine', 'visMapCoordinate', 'visMapRegion', 'visMetric', 'visPie', 'visTable', 'visTagCloud', 'visText', 'visTimelion', 'visVega', 'visVisualBuilder', 'warning', 'wordWrap', 'wordWrapDisabled', 'wrench'];
 
     var GlyphGrid = function GlyphGrid() {
       return ___EmotionJSX("div", null, GlyphIcons.map(function (glyph) {

package/optimize/es/components/icon/icon_map.js

@@ -11,7 +11,6 @@ export var typeToPathMap = {
   advancedSettingsApp: 'app_advanced_settings',
   agentApp: 'app_fleet',
   aggregate: 'aggregate',
-  alert: 'alert',
   analyzeEvent: 'analyzeEvent',
   annotation: 'annotation',
   apmApp: 'app_apm',
@@ -72,7 +71,6 @@ export var typeToPathMap = {
   createSingleMetricJob: 'ml_create_single_metric_job',
   cross: 'cross',
   crossClusterReplicationApp: 'app_cross_cluster_replication',
-  crossInACircleFilled: 'crossInACircleFilled',
   crosshairs: 'crosshairs',
   currency: 'currency',
   cut: 'cut',
@@ -314,6 +312,7 @@ export var typeToPathMap = {
   pin: 'pin',
   pinFilled: 'pin_filled',
   pipelineApp: 'app_pipeline',
+  pivot: 'pivot',
   play: 'play',
   playFilled: 'playFilled',
   plus: 'plus',
@@ -415,6 +414,7 @@ export var typeToPathMap = {
   visVega: 'vis_vega',
   visVisualBuilder: 'vis_visual_builder',
   visualizeApp: 'app_visualize',
+  warning: 'warning',
   watchesApp: 'app_watches',
   wordWrap: 'wordWrap',
   wordWrapDisabled: 'wordWrapDisabled',

package/optimize/es/components/markdown_editor/markdown_editor_footer.js

@@ -114,7 +114,7 @@ export var EuiMarkdownEditorFooter = /*#__PURE__*/forwardRef(function (props, re
   if (errors && errors.length) {
     errorsButton = ___EmotionJSX(EuiPopover, {
       button: ___EmotionJSX(EuiButtonEmpty, {
-        iconType: "crossInACircleFilled",
+        iconType: "error",
         size: "s",
         color: "danger",
         "aria-label": ariaLabels.showSyntaxErrors,

package/optimize/es/components/steps/step_number.js

@@ -78,7 +78,7 @@ export var EuiStepNumber = function EuiStepNumber(_ref) {
       var cssIconStyles = [contentStyles.euiStepNumber__icon, contentStyles[status]];
       var iconTypeMap = {
         danger: 'cross',
-        warning: 'alert',
+        warning: 'warning',
         complete: 'check'
       };
       content = ___EmotionJSX(EuiIcon, {

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

@@ -53,7 +53,7 @@ var euiScaleText = function euiScaleText(euiThemeContext, options) {
   var blockQuoteBorderWidth = mathWithUnits(fontSize, function (x) {
     return x / 4;
   });
-  return "\n    font-size: ".concat(fontSize, ";\n    line-height: ").concat(lineHeight, ";\n\n    h1 {\n      font-size: ").concat(headings.h1.fontSize, ";\n      line-height: ").concat(headings.h1.lineHeight, ";\n    }\n    h1:not(:last-child) {\n      ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n    }\n\n    h2 {\n      font-size: ").concat(headings.h2.fontSize, ";\n      line-height: ").concat(headings.h2.lineHeight, ";\n\n      &:not(:first-child) {\n        ").concat(logicalCSS('margin-top', headingMarginTop), "\n      }\n\n      &:not(:last-child) {\n        ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n      }\n    }\n\n    h3 {\n      font-size: ").concat(headings.h3.fontSize, ";\n      line-height: ").concat(headings.h3.lineHeight, ";\n\n      &:not(:first-child) {\n        ").concat(logicalCSS('margin-top', headingMarginTop), "\n      }\n\n      &:not(:last-child) {\n        ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n      }\n    }\n\n    h4 {\n      font-size: ").concat(headings.h4.fontSize, ";\n      line-height: ").concat(headings.h4.lineHeight, ";\n\n      &:not(:first-child) {\n        ").concat(logicalCSS('margin-top', headingMarginTop), "\n      }\n\n      &:not(:last-child) {\n        ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n      }\n    }\n\n    h5 {\n      font-size: ").concat(headings.h5.fontSize, ";\n      line-height: ").concat(headings.h5.lineHeight, ";\n\n      &:not(:first-child) {\n        ").concat(logicalCSS('margin-top', headingMarginTop), "\n      }\n\n      &:not(:last-child) {\n        ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n      }\n    }\n\n    h6 {\n      font-size: ").concat(headings.h6.fontSize, ";\n      line-height: ").concat(headings.h6.lineHeight, ";\n\n      &:not(:first-child) {\n        ").concat(logicalCSS('margin-top', headingMarginTop), "\n      }\n\n      &:not(:last-child) {\n        ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n      }\n    }\n\n    p,\n    ul,\n    ol,\n    dl,\n    blockquote,\n    img,\n    pre {\n      ").concat(logicalCSS('margin-bottom', lineHeightSize), "\n    }\n\n    ul,\n    ol {\n      ").concat(logicalCSS('margin-left', lineHeightSize), "\n    }\n  \n    blockquote {\n      font-size: ").concat(fontSize, ";\n      ").concat(logicalShorthandCSS('padding', "0 ".concat(fontSize)), "\n      ").concat(logicalCSS('border-left-width', blockQuoteBorderWidth), "\n      ").concat(logicalCSS('margin-bottom', fontSize), "\n    }\n\n    dd + dt {\n      ").concat(logicalCSS('margin-top', fontSize), "\n    }\n\n    dt,\n    .eui-definitionListReverse dd {\n      font-size: ").concat(fontSize, ";\n      line-height: ").concat(lineHeight, ";\n    }\n\n    .eui-definitionListReverse dt {\n      font-size: ").concat(euiFontSize(euiThemeContext, 'xs', options).fontSize, ";\n      color: ").concat(euiTheme.colors.text, ";\n    }\n\n    small {\n      font-size: ").concat(euiFontSize(euiThemeContext, 's', options).fontSize, ";\n    }\n\n    pre:not(.euiCodeBlock__pre) {\n      padding: ").concat(lineHeightSize, ";\n    }\n\n    code:not(.euiCode):not(.euiCodeBlock__code)  {\n      font-size: .9em; // 90% of parent font size\n    }\n    ").concat( // when textSize is 'm', the 'kbd' element gets a line between the text and the border-bottom
+  return "\n    font-size: ".concat(fontSize, ";\n    line-height: ").concat(lineHeight, ";\n\n    h1 {\n      font-size: ").concat(headings.h1.fontSize, ";\n      line-height: ").concat(headings.h1.lineHeight, ";\n    }\n    h1:not(:last-child) {\n      ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n    }\n\n    h2 {\n      font-size: ").concat(headings.h2.fontSize, ";\n      line-height: ").concat(headings.h2.lineHeight, ";\n\n      &:not(:first-child) {\n        ").concat(logicalCSS('margin-top', headingMarginTop), "\n      }\n\n      &:not(:last-child) {\n        ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n      }\n    }\n\n    h3 {\n      font-size: ").concat(headings.h3.fontSize, ";\n      line-height: ").concat(headings.h3.lineHeight, ";\n\n      &:not(:first-child) {\n        ").concat(logicalCSS('margin-top', headingMarginTop), "\n      }\n\n      &:not(:last-child) {\n        ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n      }\n    }\n\n    h4 {\n      font-size: ").concat(headings.h4.fontSize, ";\n      line-height: ").concat(headings.h4.lineHeight, ";\n\n      &:not(:first-child) {\n        ").concat(logicalCSS('margin-top', headingMarginTop), "\n      }\n\n      &:not(:last-child) {\n        ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n      }\n    }\n\n    h5 {\n      font-size: ").concat(headings.h5.fontSize, ";\n      line-height: ").concat(headings.h5.lineHeight, ";\n\n      &:not(:first-child) {\n        ").concat(logicalCSS('margin-top', headingMarginTop), "\n      }\n\n      &:not(:last-child) {\n        ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n      }\n    }\n\n    h6 {\n      font-size: ").concat(headings.h6.fontSize, ";\n      line-height: ").concat(headings.h6.lineHeight, ";\n\n      &:not(:first-child) {\n        ").concat(logicalCSS('margin-top', headingMarginTop), "\n      }\n\n      &:not(:last-child) {\n        ").concat(logicalCSS('margin-bottom', headingMarginBottom), "\n      }\n    }\n\n    p,\n    dl,\n    blockquote,\n    img,\n    pre,\n    > ul,\n    > ol {\n      ").concat(logicalCSS('margin-bottom', lineHeightSize), "\n    }\n\n    ul,\n    ol {\n      ").concat(logicalCSS('margin-left', lineHeightSize), "\n    }\n\n    // The styles of the nested ordered lists follow the style of GitHub\n    // which is commonly used in Markdown or MDX formatting.\n\n    ol ol,\n    ul ol {\n      list-style-type: lower-roman;\n    }\n\n    ul ul ol,\n    ul ol ol,\n    ol ul ol,\n    ol ol ol {\n      list-style-type: lower-alpha;\n    }\n  \n    blockquote {\n      font-size: ").concat(fontSize, ";\n      ").concat(logicalShorthandCSS('padding', "0 ".concat(fontSize)), "\n      ").concat(logicalCSS('border-left-width', blockQuoteBorderWidth), "\n      ").concat(logicalCSS('margin-bottom', fontSize), "\n    }\n\n    dd + dt {\n      ").concat(logicalCSS('margin-top', fontSize), "\n    }\n\n    dt,\n    .eui-definitionListReverse dd {\n      font-size: ").concat(fontSize, ";\n      line-height: ").concat(lineHeight, ";\n    }\n\n    .eui-definitionListReverse dt {\n      font-size: ").concat(euiFontSize(euiThemeContext, 'xs', options).fontSize, ";\n      color: ").concat(euiTheme.colors.text, ";\n    }\n\n    small {\n      font-size: ").concat(euiFontSize(euiThemeContext, 's', options).fontSize, ";\n    }\n\n    pre:not(.euiCodeBlock__pre) {\n      padding: ").concat(lineHeightSize, ";\n    }\n\n    code:not(.euiCode):not(.euiCodeBlock__code)  {\n      font-size: .9em; // 90% of parent font size\n    }\n    ").concat( // when textSize is 'm', the 'kbd' element gets a line between the text and the border-bottom
   _customScale === 'm' ? "\n    kbd {\n      ".concat(logicalCSS('padding-bottom', euiTheme.size.xs), "\n      // ensures when only one character the shape looks like a square\n      ").concat(logicalCSS('min-width', euiTheme.size.l), "\n      ").concat(logicalTextAlignCSS('center'), "\n    }\n    \n    kbd::after {\n      content: '';\n      ").concat(logicalCSS('border-bottom', "".concat(euiTheme.border.width.thin, " solid ").concat(euiTheme.colors.text)), "\n      position: absolute;\n      ").concat(logicalCSS('bottom', euiTheme.size.xxs), "\n      ").concat(logicalCSS('left', 0), "\n      ").concat(logicalCSS('width', '100%'), "\n    }") : '', "\n  ");
 };
 /**

package/optimize/lib/components/accessibility/skip_link/skip_link.js

@@ -11,8 +11,6 @@ exports.POSITIONS = exports.EuiSkipLink = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
 var _react = _interopRequireWildcard(require("react"));
@@ -56,37 +54,16 @@ var EuiSkipLink = function EuiSkipLink(_ref) {
   var styles = (0, _skip_link.euiSkipLinkStyles)(euiTheme);
   var classes = (0, _classnames.default)('euiSkipLink', className);
   var cssStyles = [styles.euiSkipLink, position !== 'static' ? styles[position] : undefined];
+  var onClick = (0, _react.useCallback)(function (e) {
+    var destinationEl = null; // Check if the destination ID is valid
 
-  var _useState = (0, _react.useState)(null),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      destinationEl = _useState2[0],
-      setDestinationEl = _useState2[1];
-
-  var _useState3 = (0, _react.useState)(true),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      hasValidId = _useState4[0],
-      setHasValidId = _useState4[1];
-
-  (0, _react.useEffect)(function () {
-    var idEl = document.getElementById(destinationId);
+    destinationEl = document.getElementById(destinationId);
+    var hasValidId = !!destinationEl; // Check the fallback destination if not
 
-    if (idEl) {
-      setHasValidId(true);
-      setDestinationEl(idEl);
-      return;
+    if (!destinationEl && fallbackDestination) {
+      destinationEl = document.querySelector(fallbackDestination);
     }
 
-    setHasValidId(false); // If no valid element via ID is available, use the fallback query selectors
-
-    if (fallbackDestination) {
-      var fallbackEl = document.querySelector(fallbackDestination);
-
-      if (fallbackEl) {
-        setDestinationEl(fallbackEl);
-      }
-    }
-  }, [destinationId, fallbackDestination]);
-  var onClick = (0, _react.useCallback)(function (e) {
     if ((overrideLinkBehavior || !hasValidId) && destinationEl) {
       e.preventDefault(); // Scroll to the top of the destination content only if it's ~mostly out of view
 
@@ -101,7 +78,9 @@ var EuiSkipLink = function EuiSkipLink(_ref) {
       if (!(0, _tabbable.isTabbable)(destinationEl)) {
         destinationEl.tabIndex = -1;
         destinationEl.addEventListener('blur', function () {
-          return destinationEl.removeAttribute('tabindex');
+          var _destinationEl;
+
+          return (_destinationEl = destinationEl) === null || _destinationEl === void 0 ? void 0 : _destinationEl.removeAttribute('tabindex');
         }, {
           once: true
         });
@@ -113,7 +92,7 @@ var EuiSkipLink = function EuiSkipLink(_ref) {
     }
 
     _onClick === null || _onClick === void 0 ? void 0 : _onClick(e);
-  }, [overrideLinkBehavior, hasValidId, destinationEl, _onClick]);
+  }, [overrideLinkBehavior, destinationId, fallbackDestination, _onClick]);
   return (0, _react2.jsx)(_screen_reader_only.EuiScreenReaderOnly, {
     showOnFocus: true
   }, (0, _react2.jsx)(_button.EuiButton, (0, _extends2.default)({

package/optimize/lib/components/badge/badge_group/badge_group.styles.js

@@ -19,7 +19,7 @@ var _global_styling = require("../../../global_styling");
 var euiBadgeGroupStyles = function euiBadgeGroupStyles(_ref) {
   var euiTheme = _ref.euiTheme;
   return {
-    euiBadgeGroup: /*#__PURE__*/(0, _react.css)("display:inline-flex;flex-wrap:wrap;", (0, _global_styling.logicalCSS)('max-width', '100%'), ".euiBadge{", (0, _global_styling.logicalCSS)('margin-left', 0), ";};label:euiBadgeGroup;"),
+    euiBadgeGroup: /*#__PURE__*/(0, _react.css)("display:inline-flex;flex-wrap:wrap;", (0, _global_styling.logicalCSS)('max-width', '100%'), ".euiBadge+.euiBadge{", (0, _global_styling.logicalCSS)('margin-left', 0), ";};label:euiBadgeGroup;"),
     // Gutter sizes
     none: /*#__PURE__*/(0, _react.css)(";label:none;"),
     s: /*#__PURE__*/(0, _react.css)("gap:", euiTheme.size.s, ";;label:s;"),

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

@@ -68,7 +68,7 @@ var ControlBar = function ControlBar() {
   }, {
     controlType: 'icon',
     id: 'status_icon',
-    iconType: 'alert',
+    iconType: 'warning',
     color: 'warning',
     'aria-label': 'Repo Status'
   }, {