@elastic/eui 108.0.0 → 109.1.0-snapshot.1763390960850

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

@@ -11,7 +11,7 @@ import dateMath from '@elastic/datemath';
 import moment from 'moment'; // eslint-disable-line import/named
 import { useEuiI18n } from '../../i18n';
 import { getDateMode, DATE_MODES } from './date_modes';
-import { parseRelativeParts } from './relative_utils';
+import { parseRelativeParts, isRelativeToNow } from './relative_utils';
 import { useI18nTimeOptions } from './time_options';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 /**
@@ -272,13 +272,6 @@ var hasRangeMatch = function hasRangeMatch(timeFrom, timeTo, ranges) {
     return timeFrom === start && timeTo === end;
   });
 };
-var isRelativeToNow = function isRelativeToNow(timeFrom, timeTo) {
-  var fromDateMode = getDateMode(timeFrom);
-  var toDateMode = getDateMode(timeTo);
-  var isLast = fromDateMode === DATE_MODES.RELATIVE && toDateMode === DATE_MODES.NOW;
-  var isNext = fromDateMode === DATE_MODES.NOW && toDateMode === DATE_MODES.RELATIVE;
-  return isLast || isNext;
-};
 export var showPrettyDuration = function showPrettyDuration(timeFrom, timeTo, quickRanges) {
   if (hasRangeMatch(timeFrom, timeTo, quickRanges)) {
     return true;

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

@@ -13,6 +13,7 @@ import dateMath from '@elastic/datemath';
 import moment from 'moment';
 import { get } from '../../../services/objects';
 import { isString } from '../../../services/predicate';
+import { getDateMode, DATE_MODES } from './date_modes';
 var ROUND_DELIMETER = '/';
 export var relativeUnitsFromLargestToSmallest = ['y', 'M', 'w', 'd', 'h', 'm', 's'];
 export function parseRelativeParts(value) {
@@ -62,4 +63,11 @@ export var toRelativeStringFromParts = function toRelativeStringFromParts(relati
   var operator = matches && matches[2] ? matches[2] : '-';
   var round = isRounded ? "".concat(ROUND_DELIMETER).concat(unit) : '';
   return "now".concat(operator).concat(count).concat(unit).concat(round);
+};
+export var isRelativeToNow = function isRelativeToNow(timeFrom, timeTo) {
+  var fromDateMode = getDateMode(timeFrom);
+  var toDateMode = getDateMode(timeTo);
+  var isLast = fromDateMode === DATE_MODES.RELATIVE && toDateMode === DATE_MODES.NOW;
+  var isNext = fromDateMode === DATE_MODES.NOW && toDateMode === DATE_MODES.RELATIVE;
+  return isLast || isNext;
 };

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

@@ -30,6 +30,7 @@ import { EuiDatePickerRange } from '../date_picker_range';
 import { EuiFormControlButton, EuiFormControlLayout } from '../../form';
 import { RenderI18nTimeOptions } from './time_options';
 import { PrettyDuration, showPrettyDuration } from './pretty_duration';
+import { EuiTimeWindowButtons } from './time_window_buttons';
 import { AsyncInterval } from './async_interval';
 import { EuiSuperUpdateButton } from './super_update_button';
 import { EuiQuickSelectPopover } from './quick_select_popover/quick_select_popover';
@@ -268,7 +269,9 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
         maxDate = _this$props3.maxDate,
         compressed = _this$props3.compressed,
         onFocus = _this$props3.onFocus,
-        styles = _this$props3.memoizedStyles;
+        styles = _this$props3.memoizedStyles,
+        _this$props3$timeZone = _this$props3.timeZoneDisplayProps,
+        timeZoneDisplayProps = _this$props3$timeZone === void 0 ? {} : _this$props3$timeZone;
       var autoRefreshAppend = !isPaused ? ___EmotionJSX(EuiAutoRefreshButton, {
         refreshInterval: refreshInterval,
         minInterval: refreshMinInterval,
@@ -345,7 +348,8 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
             timeOptions: timeOptions,
             buttonProps: {
               onFocus: onFocus
-            }
+            },
+            timeZoneDisplayProps: timeZoneDisplayProps
           }),
           endDateControl: isQuickSelectOnly ? undefined : ___EmotionJSX(EuiDatePopoverButton, {
             css: styles.euiSuperDatePicker__rangeInput,
@@ -370,7 +374,8 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
             timeOptions: timeOptions,
             buttonProps: {
               onFocus: onFocus
-            }
+            },
+            timeZoneDisplayProps: timeZoneDisplayProps
           })
         }));
       });
@@ -390,13 +395,32 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
         _this.applyTime();
       }
     });
-    _defineProperty(_this, "renderUpdateButton", function () {
+    _defineProperty(_this, "renderTimeWindowButtons", function () {
+      if (!_this.props.showTimeWindowButtons || _this.props.isAutoRefreshOnly) {
+        return null;
+      }
       var _this$props5 = _this.props,
-        isLoading = _this$props5.isLoading,
-        isDisabled = _this$props5.isDisabled,
-        updateButtonProps = _this$props5.updateButtonProps,
-        showUpdateButton = _this$props5.showUpdateButton,
-        compressed = _this$props5.compressed;
+        start = _this$props5.start,
+        end = _this$props5.end,
+        showTimeWindowButtons = _this$props5.showTimeWindowButtons,
+        compressed = _this$props5.compressed,
+        isDisabled = _this$props5.isDisabled;
+      var config = typeof showTimeWindowButtons === 'boolean' ? {} : showTimeWindowButtons;
+      return ___EmotionJSX(EuiTimeWindowButtons, _extends({
+        applyTime: _this.applyQuickTime,
+        start: start,
+        end: end,
+        compressed: compressed,
+        isDisabled: !!isDisabled || _this.state.isInvalid
+      }, config));
+    });
+    _defineProperty(_this, "renderUpdateButton", function () {
+      var _this$props6 = _this.props,
+        isLoading = _this$props6.isLoading,
+        isDisabled = _this$props6.isDisabled,
+        updateButtonProps = _this$props6.updateButtonProps,
+        showUpdateButton = _this$props6.showUpdateButton,
+        compressed = _this$props6.compressed;
       if (!showUpdateButton) return null;
       return ___EmotionJSX(EuiSuperUpdateButton, _extends({
         needsUpdate: _this.state.hasChanged,
@@ -415,21 +439,21 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
   return _createClass(EuiSuperDatePickerInternal, [{
     key: "render",
     value: function render() {
-      var _this$props6 = this.props,
-        isAutoRefreshOnly = _this$props6.isAutoRefreshOnly,
-        isDisabled = _this$props6.isDisabled,
-        isPaused = _this$props6.isPaused,
-        onRefreshChange = _this$props6.onRefreshChange,
-        refreshInterval = _this$props6.refreshInterval,
-        refreshMinInterval = _this$props6.refreshMinInterval,
-        refreshIntervalUnits = _this$props6.refreshIntervalUnits,
-        showUpdateButton = _this$props6.showUpdateButton,
-        dataTestSubj = _this$props6['data-test-subj'],
-        _width = _this$props6.width,
-        isQuickSelectOnly = _this$props6.isQuickSelectOnly,
-        compressed = _this$props6.compressed,
-        className = _this$props6.className,
-        styles = _this$props6.memoizedStyles;
+      var _this$props7 = this.props,
+        isAutoRefreshOnly = _this$props7.isAutoRefreshOnly,
+        isDisabled = _this$props7.isDisabled,
+        isPaused = _this$props7.isPaused,
+        onRefreshChange = _this$props7.onRefreshChange,
+        refreshInterval = _this$props7.refreshInterval,
+        refreshMinInterval = _this$props7.refreshMinInterval,
+        refreshIntervalUnits = _this$props7.refreshIntervalUnits,
+        showUpdateButton = _this$props7.showUpdateButton,
+        dataTestSubj = _this$props7['data-test-subj'],
+        _width = _this$props7.width,
+        isQuickSelectOnly = _this$props7.isQuickSelectOnly,
+        compressed = _this$props7.compressed,
+        className = _this$props7.className,
+        styles = _this$props7.memoizedStyles;
       var _this$state2 = this.state,
         hasChanged = _this$state2.hasChanged,
         isInvalid = _this$state2.isInvalid;
@@ -454,7 +478,7 @@ export var EuiSuperDatePickerInternal = /*#__PURE__*/function (_Component) {
         compressed: compressed,
         isDisabled: !!isDisabled,
         className: className
-      }) : ___EmotionJSX(React.Fragment, null, this.renderDatePickerRange(), this.renderUpdateButton()));
+      }) : ___EmotionJSX(React.Fragment, null, this.renderDatePickerRange(), this.renderTimeWindowButtons(), this.renderUpdateButton()));
     }
   }], [{
     key: "getDerivedStateFromProps",

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

@@ -0,0 +1,185 @@
+/*
+ * 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 from 'react';
+import dateMath from '@elastic/datemath';
+import moment from 'moment';
+import { usePrettyInterval } from './pretty_interval';
+import { isRelativeToNow } from './relative_utils';
+import { EuiButtonGroupButton } from '../../button/button_group/button_group_button';
+import { euiButtonGroupButtonsStyles } from '../../button/button_group/button_group.styles';
+import { useEuiMemoizedStyles, useGeneratedHtmlId } from '../../../services';
+import { useEuiI18n } from '../../i18n';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var ZOOM_FACTOR_DEFAULT = 0.5;
+/**
+ * Button group with time window controls for shifting the time window
+ * forwards and backwards, and zooming out.
+ */
+export var EuiTimeWindowButtons = function EuiTimeWindowButtons(_ref) {
+  var applyTime = _ref.applyTime,
+    start = _ref.start,
+    end = _ref.end,
+    compressed = _ref.compressed,
+    isDisabled = _ref.isDisabled,
+    _ref$showZoomOut = _ref.showZoomOut,
+    showZoomOut = _ref$showZoomOut === void 0 ? true : _ref$showZoomOut,
+    _ref$showShiftArrows = _ref.showShiftArrows,
+    showShiftArrows = _ref$showShiftArrows === void 0 ? true : _ref$showShiftArrows,
+    _ref$zoomFactor = _ref.zoomFactor,
+    zoomFactor = _ref$zoomFactor === void 0 ? ZOOM_FACTOR_DEFAULT : _ref$zoomFactor;
+  var buttonColor = 'text';
+  var buttonSize = compressed ? 's' : 'm';
+  var iconSize = compressed ? 's' : 'm';
+  var styles = useEuiMemoizedStyles(euiButtonGroupButtonsStyles);
+  var _useEuiTimeWindow = useEuiTimeWindow(start, end, applyTime, {
+      zoomFactor: zoomFactor
+    }),
+    displayInterval = _useEuiTimeWindow.displayInterval,
+    isInvalid = _useEuiTimeWindow.isInvalid,
+    stepForward = _useEuiTimeWindow.stepForward,
+    stepBackward = _useEuiTimeWindow.stepBackward,
+    expandWindow = _useEuiTimeWindow.expandWindow;
+  var invalidShiftDescription = useEuiI18n('euiTimeWindowButtons.invalidShiftLabel', 'Cannot shift invalid time window');
+  var invalidZoomOutDescription = useEuiI18n('euiTimeWindowButtons.invalidZoomOutLabel', 'Cannot zoom out invalid time window');
+  var previousId = useGeneratedHtmlId({
+    prefix: 'previous'
+  });
+  var previousLabel = useEuiI18n('euiTimeWindowButtons.previousLabel', 'Previous');
+  var previousTooltipContent = useEuiI18n('euiTimeWindowButtons.previousDescription', 'Previous {displayInterval}', {
+    displayInterval: displayInterval
+  });
+  var zoomOutId = useGeneratedHtmlId({
+    prefix: 'zoom_out'
+  });
+  var zoomOutLabel = useEuiI18n('euiTimeWindowButtons.zoomOutLabel', 'Zoom out');
+  var zoomOutTooltipContent = isInvalid ? invalidZoomOutDescription : zoomOutLabel;
+  var nextId = useGeneratedHtmlId({
+    prefix: 'next'
+  });
+  var nextLabel = useEuiI18n('euiTimeWindowButtons.nextLabel', 'Next');
+  var nextTooltipContent = useEuiI18n('euiTimeWindowButtons.nextDescription', 'Next {displayInterval}', {
+    displayInterval: displayInterval
+  });
+  if (!showZoomOut && !showShiftArrows) return null;
+  return ___EmotionJSX("div", {
+    className: "euiSuperDatePicker__timeWindowButtons",
+    css: [styles.euiButtonGroup__buttons, styles[buttonSize], ";label:EuiTimeWindowButtons;"],
+    "data-test-subj": "timeWindowButtons"
+  }, showShiftArrows && ___EmotionJSX(EuiButtonGroupButton, {
+    id: previousId,
+    "data-test-subj": "timeWindowButtonsPrevious",
+    label: previousLabel,
+    title: "",
+    toolTipContent: !isDisabled && (isInvalid ? invalidShiftDescription : previousTooltipContent),
+    color: buttonColor,
+    size: buttonSize,
+    iconType: "arrowLeft",
+    iconSize: iconSize,
+    isIconOnly: true,
+    isSelected: false,
+    isDisabled: isDisabled,
+    onClick: stepBackward
+  }), showZoomOut && ___EmotionJSX(EuiButtonGroupButton, {
+    id: zoomOutId,
+    "data-test-subj": "timeWindowButtonsZoomOut",
+    label: zoomOutLabel,
+    title: "",
+    toolTipContent: !isDisabled && zoomOutTooltipContent,
+    toolTipProps: {
+      disableScreenReaderOutput: zoomOutLabel === zoomOutTooltipContent
+    },
+    color: buttonColor,
+    size: buttonSize,
+    iconType: "magnifyWithMinus",
+    iconSize: iconSize,
+    isIconOnly: true,
+    isSelected: false,
+    isDisabled: isDisabled,
+    onClick: expandWindow
+  }), showShiftArrows && ___EmotionJSX(EuiButtonGroupButton, {
+    id: nextId,
+    "data-test-subj": "timeWindowButtonsNext",
+    label: nextLabel,
+    title: "",
+    toolTipContent: !isDisabled && (isInvalid ? invalidShiftDescription : nextTooltipContent),
+    color: buttonColor,
+    size: buttonSize,
+    iconType: "arrowRight",
+    iconSize: iconSize,
+    isIconOnly: true,
+    isSelected: false,
+    isDisabled: isDisabled,
+    onClick: stepForward
+  }));
+};
+
+/**
+ * Partly adapted from date_picker/super_date_picker/quick_select_popover/quick_select.tsx
+ */
+export function useEuiTimeWindow(start, end, apply, options) {
+  var _options$zoomFactor;
+  var min = dateMath.parse(start);
+  var max = dateMath.parse(end, {
+    roundUp: true
+  });
+  var isInvalid = !min || !min.isValid() || !max || !max.isValid();
+  var windowDuration = isInvalid ? 1 : max.diff(min);
+  var zoomFactor = getPercentageMultiplier((_options$zoomFactor = options === null || options === void 0 ? void 0 : options.zoomFactor) !== null && _options$zoomFactor !== void 0 ? _options$zoomFactor : ZOOM_FACTOR_DEFAULT);
+  var zoomAddition = windowDuration * (zoomFactor / 2); // Gets added to each end, that's why it's split in half
+  var prettyInterval = usePrettyInterval(false, windowDuration);
+  var displayInterval = isInvalid ? '' : prettyInterval;
+  if (!isInvalid && !isRelativeToNow(start, end) && !isExactMinuteRange(windowDuration)) {
+    displayInterval = "~".concat(displayInterval);
+  }
+  return {
+    displayInterval: displayInterval,
+    isInvalid: isInvalid,
+    stepForward: stepForward,
+    stepBackward: stepBackward,
+    expandWindow: expandWindow
+  };
+  function stepForward() {
+    if (isInvalid) return;
+    apply({
+      start: moment(max).toISOString(),
+      end: moment(max).add(windowDuration, 'ms').toISOString()
+    });
+  }
+  function stepBackward() {
+    if (isInvalid) return;
+    apply({
+      start: moment(min).subtract(windowDuration, 'ms').toISOString(),
+      end: moment(min).toISOString()
+    });
+  }
+  function expandWindow() {
+    if (isInvalid) return;
+    apply({
+      start: moment(min).subtract(zoomAddition, 'ms').toISOString(),
+      end: moment(max).add(zoomAddition, 'ms').toISOString()
+    });
+  }
+}
+
+/**
+ * Get a number out of either 0.2 or "20%"
+ */
+function getPercentageMultiplier(value) {
+  var result = typeof value === 'number' ? value : parseFloat(String(value).replace('%', '').trim());
+  if (isNaN(result)) throw new TypeError('Please provide a valid number or percentage string e.g. "25%"');
+  return result > 1 ? result / 100 : result;
+}
+
+/**
+ * Useful to determine whether to show the tilde in the display
+ */
+function isExactMinuteRange(diffMs) {
+  // 60 * 1000 = ms per minute
+  return diffMs % (60 * 1000) === 0;
+}

package/optimize/es/components/flyout/flyout.js

@@ -16,7 +16,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 
 import React, { useEffect, useRef, useMemo, useCallback, useState, forwardRef } from 'react';
 import classnames from 'classnames';
-import { keys, EuiWindowEvent, useCombinedRefs, useIsWithinMinBreakpoint, useEuiMemoizedStyles, useGeneratedHtmlId, useEuiThemeCSSVariables } from '../../services';
+import { keys, EuiWindowEvent, useCombinedRefs, useIsWithinMinBreakpoint, useEuiMemoizedStyles, useGeneratedHtmlId, useEuiThemeCSSVariables, focusTrapPubSub } from '../../services';
 import { logicalStyle } from '../../global_styling';
 import { EuiFocusTrap } from '../focus_trap';
 import { EuiOverlayMask } from '../overlay_mask';
@@ -210,20 +210,28 @@ export var EuiFlyout = /*#__PURE__*/forwardRef(function (props, ref) {
     }
     return selectors;
   }, [includeSelectorInFocusTrap, includeFixedHeadersInFocusTrap]);
-  useEffect(function () {
+
+  /**
+   * Finds the shards to include in the focus trap by querying by `focusTrapSelectors`.
+   *
+   * @param shouldAutoFocus Whether to auto-focus the flyout wrapper when the focus trap is activated.
+   * This is necessary because when a flyout is toggled from within a shard, the focus trap's `autoFocus`
+   * feature doesn't work. This logic manually focuses the flyout as a workaround.
+   */
+  var findShards = useCallback(function () {
+    var shouldAutoFocus = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
     if (focusTrapSelectors.length > 0) {
       var shardsEls = focusTrapSelectors.flatMap(function (selector) {
         return Array.from(document.querySelectorAll(selector));
       });
       setFocusTrapShards(Array.from(shardsEls));
-
-      // Flyouts that are toggled from shards do not have working
-      // focus trap autoFocus, so we need to focus the flyout wrapper ourselves
-      shardsEls.forEach(function (shard) {
-        if (shard.contains(flyoutToggle.current)) {
-          resizeRef === null || resizeRef === void 0 || resizeRef.focus();
-        }
-      });
+      if (shouldAutoFocus) {
+        shardsEls.forEach(function (shard) {
+          if (shard.contains(flyoutToggle.current)) {
+            resizeRef === null || resizeRef === void 0 || resizeRef.focus();
+          }
+        });
+      }
     } else {
       // Clear existing shards if necessary, e.g. switching to `false`
       setFocusTrapShards(function (shards) {
@@ -231,6 +239,15 @@ export var EuiFlyout = /*#__PURE__*/forwardRef(function (props, ref) {
       });
     }
   }, [focusTrapSelectors, resizeRef]);
+  useEffect(function () {
+    // Auto-focus should only happen on initial flyout mount (or when the dependencies change)
+    // because it snaps focus to the flyout wrapper, which steals it from subsequently focused elements.
+    findShards(true);
+    var unsubscribe = focusTrapPubSub.subscribe(function () {
+      return findShards();
+    });
+    return unsubscribe;
+  }, [findShards]);
   var focusTrapProps = useMemo(function () {
     return _objectSpread(_objectSpread({}, _focusTrapProps), {}, {
       shards: [].concat(_toConsumableArray(focusTrapShards), _toConsumableArray((_focusTrapProps === null || _focusTrapProps === void 0 ? void 0 : _focusTrapProps.shards) || []))

package/optimize/es/components/form/file_picker/file_picker.styles.js

@@ -43,7 +43,7 @@ export var euiFilePickerStyles = function euiFilePickerStyles(euiThemeContext) {
     fontSize = _euiFontSize.fontSize,
     lineHeight = _euiFontSize.lineHeight;
   return {
-    euiFilePicker: /*#__PURE__*/css("--euiFormControlLeftIconsCount:1;position:relative;border-radius:", formVariables.controlBorderRadius, ";&:has(input:focus){--euiFormControlStateColor:", formVariables.borderFocused, ";}&:hover{--euiFormControlStateColor:", highContrastMode ? euiTheme.border.color : formVariables.borderHovered, ";--euiFormControlStateStyle:solid;}&:focus-within{", highContrastModeStyles(euiThemeContext, {
+    euiFilePicker: /*#__PURE__*/css("--euiFormControlLeftIconsCount:1;position:relative;border-radius:", formVariables.controlBorderRadius, ";&:has(input:focus){--euiFormControlStateColor:", formVariables.borderFocused, ";}&:hover{--euiFormControlStateColor:", highContrastMode ? euiTheme.border.color : euiTheme.colors.borderInteractiveFormsHoverProminent, ";--euiFormControlStateStyle:", highContrastMode ? 'solid' : 'dashed', ";}&:focus-within{", highContrastModeStyles(euiThemeContext, {
       forced: "\n              ".concat(euiFormControlShowBackgroundLine(euiThemeContext, formVariables.borderFocused), "\n            ")
     }), ";};label:euiFilePicker;"),
     isDroppingFile: /*#__PURE__*/css("--euiFormControlStateColor:", euiTheme.colors.borderStrongSuccess, ";--euiFormControlStateStyle:", highContrastMode === 'forced' ? 'solid' : 'dashed', ";background-color:", euiTheme.components.forms.backgroundDropping, ";;label:isDroppingFile;"),
@@ -62,8 +62,8 @@ export var euiFilePickerStyles = function euiFilePickerStyles(euiThemeContext) {
         forced: "\n                  text-decoration: underline;\n                "
       }), ";}.euiFilePicker__icon{transform:scale(1.05);}}};label:largeInteractive;")
     },
-    euiFilePicker__prompt: /*#__PURE__*/css("pointer-events:none;font-size:", fontSize, ";line-height:1;", euiTextTruncate(), " color:", euiTheme.colors.textParagraph, ";border:", euiTheme.border.width.thin, " var(--euiFormControlStateStyle, dashed) var(--euiFormControlStateColor, ", formVariables.borderColor, ");", euiCanAnimate, "{transition:border-color ", euiTheme.animation.fast, " ease-in,background-color ", euiTheme.animation.fast, " ease-in;};label:euiFilePicker__prompt;"),
-    disabled: /*#__PURE__*/css(formStyles.disabled, ";label:disabled;"),
+    euiFilePicker__prompt: /*#__PURE__*/css("pointer-events:none;font-size:", fontSize, ";line-height:1;", euiTextTruncate(), " color:", euiTheme.colors.textParagraph, ";border:", euiTheme.border.width.thin, " var(--euiFormControlStateStyle, dashed) var(--euiFormControlStateColor, ", euiTheme.colors.borderBaseProminent, ");", euiCanAnimate, "{transition:border-color ", euiTheme.animation.fast, " ease-in,background-color ", euiTheme.animation.fast, " ease-in;};label:euiFilePicker__prompt;"),
+    disabled: /*#__PURE__*/css(formStyles.disabled, "--euiFormControlStateColor:transparent;;label:disabled;"),
     // Skip the css() on the default height to avoid generating a className
     uncompressed: formStyles.uncompressed,
     compressed: /*#__PURE__*/css(formStyles.compressed, ";label:compressed;"),

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

@@ -26,7 +26,7 @@ var EuiIconBoxesVertical = function EuiIconBoxesVertical(_ref) {
   }, props), title ? ___EmotionJSX("title", {
     id: titleId
   }, title) : null, ___EmotionJSX("path", {
-    d: "M8 12a2 2 0 1 1 0 4 2 2 0 0 1 0-4Zm0-6a2 2 0 1 1 0 4 2 2 0 0 1 0-4Zm0-6a2 2 0 1 1 0 4 2 2 0 0 1 0-4Z"
+    d: "M6 3a2 2 0 1 1 4 0 2 2 0 0 1-4 0Zm2-1a1 1 0 1 0 0 2 1 1 0 0 0 0-2ZM6 8a2 2 0 1 1 4 0 2 2 0 0 1-4 0Zm2-1a1 1 0 1 0 0 2 1 1 0 0 0 0-2Zm0 4a2 2 0 1 0 0 4 2 2 0 0 0 0-4Zm-1 2a1 1 0 1 1 2 0 1 1 0 0 1-2 0Z"
   }));
 };
 export var icon = EuiIconBoxesVertical;

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

@@ -26,8 +26,7 @@ var EuiIconCheckInCircleFilled = function EuiIconCheckInCircleFilled(_ref) {
   }, props), title ? ___EmotionJSX("title", {
     id: titleId
   }, title) : null, ___EmotionJSX("path", {
-    fillRule: "evenodd",
-    d: "M8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16Zm3.65-10.857L6.91 9.8 4.35 7.286a.5.5 0 0 0-.7.714l2.909 2.857a.5.5 0 0 0 .7 0l5.091-5a.5.5 0 1 0-.7-.714Z"
+    d: "M8 1a7 7 0 1 1 0 14A7 7 0 0 1 8 1ZM7 9.293 5.354 7.646l-.708.708L7 10.707l4.354-4.353-.707-.708L7 9.293Z"
   }));
 };
 export var icon = EuiIconCheckInCircleFilled;

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

@@ -26,8 +26,7 @@ var EuiIconErrorFilled = function EuiIconErrorFilled(_ref) {
   }, props), title ? ___EmotionJSX("title", {
     id: titleId
   }, title) : null, ___EmotionJSX("path", {
-    fillRule: "evenodd",
-    d: "M10 1a1 1 0 0 1 .707.293l4 4A1 1 0 0 1 15 6v5a1 1 0 0 1-.293.707l-4 4A1 1 0 0 1 10 16H5a1 1 0 0 1-.707-.293l-4-4A1 1 0 0 1 0 11V6a1 1 0 0 1 .293-.707l4-4A1 1 0 0 1 5 1h5ZM4.146 5.146a.5.5 0 0 1 .708 0L7.5 7.793l2.646-2.647a.5.5 0 0 1 .708.708L8.207 8.5l2.647 2.646a.5.5 0 0 1-.708.708L7.5 9.207l-2.646 2.647a.5.5 0 0 1-.708-.708L6.793 8.5 4.146 5.854a.5.5 0 0 1 0-.708Z"
+    d: "M10.392 1.005a1 1 0 0 1 .608.288L14.707 5a1 1 0 0 1 .293.707v4.586a1 1 0 0 1-.293.707L11 14.707a1 1 0 0 1-.707.293H5.707a1 1 0 0 1-.634-.227L5 14.707 1.293 11a1 1 0 0 1-.288-.608L1 10.293V5.707A1 1 0 0 1 1.293 5L5 1.293A1 1 0 0 1 5.707 1h4.586l.099.005ZM8 7.293 5.354 4.646l-.708.708L7.293 8l-2.647 2.646.708.707L8 8.707l2.646 2.646.707-.707L8.707 8l2.646-2.646-.707-.708L8 7.293Z"
   }));
 };
 export var icon = EuiIconErrorFilled;

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

@@ -26,7 +26,7 @@ var EuiIconPaperClip = function EuiIconPaperClip(_ref) {
   }, props), title ? ___EmotionJSX("title", {
     id: titleId
   }, title) : null, ___EmotionJSX("path", {
-    d: "M9.84 2.019 3.046 8.57c-.987.952-1.133 2.517-.199 3.516.951 1.021 2.58 1.106 3.64.19.034-.03.068-.061.1-.092l5.655-5.452a.484.484 0 0 0 0-.703.53.53 0 0 0-.729 0L5.92 11.421c-.572.551-1.505.657-2.131.163a1.455 1.455 0 0 1-.118-2.211l6.899-6.651a2.646 2.646 0 0 1 3.644 0 2.422 2.422 0 0 1 0 3.513L7.3 12.901c-1.333 1.285-3.497 1.493-4.95.336-1.54-1.22-1.764-3.411-.5-4.897a3.33 3.33 0 0 1 .238-.252l5.78-5.572a.484.484 0 0 0 0-.703.53.53 0 0 0-.73 0l-5.78 5.572a4.36 4.36 0 0 0 0 6.324c2.188 2.109 5.202 1.31 6.66-.095l6.925-6.676a3.39 3.39 0 0 0 0-4.92C13.534.66 11.25.66 9.841 2.019z"
+    d: "M7 11c0 .423.105.648.229.771.123.124.348.229.771.229.423 0 .648-.105.771-.229.124-.123.229-.348.229-.771V5h1v6c0 .577-.145 1.102-.521 1.479C9.102 12.854 8.577 13 8 13c-.577 0-1.102-.145-1.479-.521C6.145 12.101 6 11.577 6 11V4c0-.719.215-1.468.716-2.046C7.226 1.364 7.996 1 9 1c1.005 0 1.773.365 2.284.954.5.578.716 1.327.716 2.046v7c0 1.103-.345 2.11-1.043 2.845C10.255 14.583 9.242 15 8 15c-1.242 0-2.255-.417-2.957-1.155C4.345 13.11 4 12.103 4 11V4h1v7c0 .897.279 1.64.768 2.155C6.253 13.666 6.99 14 8 14c1.01 0 1.747-.334 2.232-.845.49-.515.768-1.258.768-2.155V4c0-.531-.16-1.032-.472-1.392C10.227 2.26 9.745 2 9 2s-1.227.26-1.528.608C7.16 2.968 7 3.47 7 4v7Z"
   }));
 };
 export var icon = EuiIconPaperClip;

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

@@ -21,17 +21,18 @@ var EuiIconStreamsWired = function EuiIconStreamsWired(_ref) {
     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: "M13.5 1a1.5 1.5 0 1 1-1.413 2H11.5A1.5 1.5 0 0 0 10 4.5v1c0 .564-.19 1.082-.504 1.5H9.5l-.048.06a2.58 2.58 0 0 1-.352.36c-.01.01-.021.017-.032.025a2.501 2.501 0 0 1-.142.108l-.043.03c-.055.036-.11.07-.168.103l-.047.024c-.057.03-.115.06-.175.085-.018.008-.036.014-.055.021A2.475 2.475 0 0 1 7.5 8h-.504c.315.418.504.936.504 1.5v1A1.5 1.5 0 0 0 9 12h3.087a1.5 1.5 0 1 1 0 1H9a2.5 2.5 0 0 1-2.5-2.5v-1A1.5 1.5 0 0 0 5 8H3.913a1.5 1.5 0 1 1 0-1H7.5A1.5 1.5 0 0 0 9 5.5v-1A2.5 2.5 0 0 1 11.5 2h.587A1.5 1.5 0 0 1 13.5 1Zm0 11a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm-11-5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm11-5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
+    d: "M13.5 1a1.5 1.5 0 1 1-1.413 2H11.5A1.5 1.5 0 0 0 10 4.5V6a2.49 2.49 0 0 1-.504 1.5H9.5l-.048.06a2.58 2.58 0 0 1-.352.36c-.01.01-.021.017-.032.025a2.496 2.496 0 0 1-.142.108l-.043.03c-.055.036-.11.07-.168.103l-.047.024c-.057.03-.115.06-.175.085-.018.008-.036.014-.055.021A2.475 2.475 0 0 1 7.5 8.5h-.504c.315.418.504.936.504 1.5v1.5A1.5 1.5 0 0 0 9 13h3.087a1.5 1.5 0 1 1 0 1H9a2.5 2.5 0 0 1-2.5-2.5V10A1.5 1.5 0 0 0 5 8.5H3.913a1.5 1.5 0 1 1 0-1H7.5A1.5 1.5 0 0 0 9 6V4.5A2.5 2.5 0 0 1 11.5 2h.587A1.5 1.5 0 0 1 13.5 1Zm0 12a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm-11-5.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Zm11-5.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
     clipRule: "evenodd"
   }), ___EmotionJSX("path", {
     fillRule: "evenodd",
-    d: "M13.5 6a1.5 1.5 0 1 1-1.413 2H9.948c.293-.287.536-.625.714-1h1.425A1.5 1.5 0 0 1 13.5 6Zm0 1a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
+    d: "M13.5 6.5a1.5 1.5 0 1 1-1.413 2H9.948c.293-.287.536-.625.714-1h1.425a1.5 1.5 0 0 1 1.413-1Zm0 1a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1Z",
     clipRule: "evenodd"
   }));
 };

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

@@ -26,8 +26,7 @@ var EuiIconWarningFilled = function EuiIconWarningFilled(_ref) {
   }, props), title ? ___EmotionJSX("title", {
     id: titleId
   }, title) : null, ___EmotionJSX("path", {
-    fillRule: "evenodd",
-    d: "M8 1a1 1 0 0 1 .864.496l7 12A1 1 0 0 1 15 15H1a1 1 0 0 1-.864-1.504l7-12A1 1 0 0 1 8 1Zm.9 4.995-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995a.905.905 0 1 1 1.8 0ZM8 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
+    d: "M8 1a1 1 0 0 1 .863.496l7 12A1 1 0 0 1 15 15H1a1 1 0 0 1-.864-1.504l7-12A1 1 0 0 1 8 1Zm0 10a1 1 0 1 0 0 2 1 1 0 0 0 0-2Zm-.5-6v5h1V5h-1Z"
   }));
 };
 export var icon = EuiIconWarningFilled;

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

@@ -54,8 +54,7 @@ export var typeToPathMap = {
   changePointDetection: 'change_point_detection',
   check: 'check',
   checkCircle: 'checkCircle',
-  checkInCircleFilled: 'checkCircle',
-  // NOTE: To be deprecated in favor of `checkCircle`
+  checkInCircleFilled: 'checkInCircleFilled',
   cheer: 'cheer',
   classificationJob: 'ml_classification_job',
   clickLeft: 'clickLeft',
@@ -160,8 +159,7 @@ export var typeToPathMap = {
   eql: 'eql',
   eraser: 'eraser',
   error: 'error',
-  errorFilled: 'error',
-  // NOTE: To be deprecated in favor of `error`
+  errorFilled: 'errorFilled',
   esqlVis: 'esqlVis',
   exit: 'exit',
   expand: 'expand',
@@ -500,8 +498,7 @@ export var typeToPathMap = {
   visualizeApp: 'app_visualize',
   vulnerabilityManagementApp: 'app_vulnerability_management',
   warning: 'warning',
-  warningFilled: 'warning',
-  // NOTE: To be deprecated in favor of `warning`
+  warningFilled: 'warningFilled',
   watchesApp: 'app_watches',
   web: 'web',
   wordWrap: 'wordWrap',

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

@@ -12,7 +12,7 @@ export var euiOverlayMaskStyles = function euiOverlayMaskStyles(_ref) {
   var euiTheme = _ref.euiTheme,
     highContrastMode = _ref.highContrastMode;
   return {
-    euiOverlayMask: /*#__PURE__*/css("position:fixed;", logicalCSS('top', 0), " ", logicalCSS('left', 0), " ", logicalCSS('right', 0), " ", logicalCSS('bottom', 0), " display:flex;align-items:center;justify-content:center;", logicalCSS('padding-bottom', '10vh'), " animation:", euiAnimFadeIn, " ", euiTheme.animation.fast, " ease-in;background:", highContrastMode ? euiTheme.components.overlayMaskBackgroundHighContrast : euiTheme.components.overlayMaskBackground, ";;label:euiOverlayMask;"),
+    euiOverlayMask: /*#__PURE__*/css("position:fixed;", logicalCSS('top', 0), " ", logicalCSS('left', 0), " ", logicalCSS('right', 0), " ", logicalCSS('bottom', 0), " display:flex;align-items:center;justify-content:center;animation:", euiAnimFadeIn, " ", euiTheme.animation.fast, " ease-in;background:", highContrastMode ? euiTheme.components.overlayMaskBackgroundHighContrast : euiTheme.components.overlayMaskBackground, ";;label:euiOverlayMask;"),
     aboveHeader: /*#__PURE__*/css("z-index:", euiTheme.levels.mask, ";;label:aboveHeader;"),
     belowHeader: /*#__PURE__*/css("z-index:", euiTheme.levels.maskBelowHeader, ";", logicalCSS('top', 'var(--euiFixedHeadersOffset, 0)'), ";;label:belowHeader;")
   };