@elastic/eui 106.6.0 → 107.0.0

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

@@ -12,6 +12,8 @@ export var typeToPathMap = {
   advancedSettingsApp: 'app_advanced_settings',
   agentApp: 'app_fleet',
   aggregate: 'aggregate',
+  alert: 'warning',
+  // NOTE: To be deprecated in favor of `warning`
   analyzeEvent: 'analyzeEvent',
   annotation: 'annotation',
   anomalyChart: 'anomaly_chart',
@@ -30,13 +32,15 @@ export var typeToPathMap = {
   asterisk: 'asterisk',
   at: 'at',
   auditbeatApp: 'app_auditbeat',
+  backgroundTask: 'background_task',
   beaker: 'flask',
   // NOTE: To be deprecated in favor of `flask`
   bell: 'bell',
   bellSlash: 'bellSlash',
   beta: 'beta',
   bolt: 'bolt',
-  boxesHorizontal: 'boxes_horizontal',
+  boxesHorizontal: 'boxes_vertical',
+  // NOTE: To be deprecated in favor of `boxes_vertical`
   boxesVertical: 'boxes_vertical',
   branch: 'branch',
   branchUser: 'branchUser',
@@ -50,7 +54,8 @@ export var typeToPathMap = {
   changePointDetection: 'change_point_detection',
   check: 'check',
   checkCircle: 'checkCircle',
-  checkInCircleFilled: 'checkInCircleFilled',
+  checkInCircleFilled: 'checkCircle',
+  // NOTE: To be deprecated in favor of `checkCircle`
   cheer: 'cheer',
   classificationJob: 'ml_classification_job',
   clickLeft: 'clickLeft',
@@ -81,7 +86,8 @@ export var typeToPathMap = {
   controlsVertical: 'controls',
   // NOTE: To be deprecated in favor of `controls`
   copy: 'copy',
-  copyClipboard: 'copy_clipboard',
+  copyClipboard: 'copy',
+  // NOTE: To be deprecated in favor of `copy`
   createAdvancedJob: 'ml_create_advanced_job',
   createGenericJob: 'ml_create_generic_job',
   createGeoJob: 'ml_create_geo_job',
@@ -104,7 +110,8 @@ export var typeToPathMap = {
   discuss: 'comment',
   // NOTE: To be deprecated in favor of `comment`
   document: 'document',
-  documentEdit: 'documentEdit',
+  documentEdit: 'pencil',
+  // NOTE: To be deprecated in favor of `pencil`
   documentation: 'documentation',
   documents: 'documents',
   dot: 'dot',
@@ -131,7 +138,8 @@ export var typeToPathMap = {
   editorItemAlignMiddle: 'editorItemAlignMiddle',
   editorItemAlignRight: 'editorItemAlignRight',
   editorItemAlignTop: 'editorItemAlignTop',
-  editorLink: 'editor_link',
+  editorLink: 'link',
+  // NOTE: To be deprecated in favor of `link`
   editorOrderedList: 'editor_ordered_list',
   editorPositionBottomLeft: 'editorPositionBottomLeft',
   editorPositionBottomRight: 'editorPositionBottomRight',
@@ -139,10 +147,12 @@ export var typeToPathMap = {
   editorPositionTopRight: 'editorPositionTopRight',
   editorRedo: 'editor_redo',
   editorStrike: 'editor_strike',
-  editorTable: 'editor_table',
+  editorTable: 'vis_table',
+  // NOTE: To be deprecated in favor of `vis_table`
   editorUnderline: 'editor_underline',
   editorUndo: 'editor_undo',
-  editorUnorderedList: 'editor_unordered_list',
+  editorUnorderedList: 'list',
+  // NOTE: To be deprecated in favor of `list`
   email: 'email',
   empty: 'empty',
   emsApp: 'app_ems',
@@ -150,11 +160,13 @@ export var typeToPathMap = {
   eql: 'eql',
   eraser: 'eraser',
   error: 'error',
-  errorFilled: 'errorFilled',
+  errorFilled: 'error',
+  // NOTE: To be deprecated in favor of `error`
   esqlVis: 'esqlVis',
   exit: 'exit',
   expand: 'expand',
-  expandMini: 'expandMini',
+  expandMini: 'expand',
+  // NOTE: To be deprecated in favor of `expand`
   export: 'export',
   exportAction: 'export',
   // NOTE: To be deprecated in favor of `export`
@@ -169,7 +181,8 @@ export var typeToPathMap = {
   filterExclude: 'filterExclude',
   filterIgnore: 'filterIgnore',
   filterInclude: 'filterInclude',
-  filterInCircle: 'filterInCircle',
+  filterInCircle: 'filter',
+  // NOTE: To be deprecated in favor of `filter`
   flask: 'flask',
   flag: 'flag',
   fleetApp: 'app_agent',
@@ -233,13 +246,15 @@ export var typeToPathMap = {
   launch: 'launch',
   layers: 'layers',
   lensApp: 'app_lens',
-  lettering: 'lettering',
+  lettering: 'vis_text',
+  // NOTE: To be deprecated in favor of `vis_text`
   lineDashed: 'lineDashed',
   lineDotted: 'lineDotted',
   lineSolid: 'lineSolid',
   link: 'link',
   list: 'list',
-  listAdd: 'list_add',
+  listAdd: 'plus_in_circle',
+  // NOTE: To be deprecated in favor of `plus_in_circle`
   lock: 'lock',
   lockOpen: 'lockOpen',
   logPatternAnalysis: 'log_pattern_analysis',
@@ -327,7 +342,8 @@ export var typeToPathMap = {
   minimize: 'minimize',
   minus: 'minus',
   minusInCircle: 'minus_in_circle',
-  minusInCircleFilled: 'minus_in_circle_filled',
+  minusInCircleFilled: 'minus_in_circle',
+  // NOTE: To be deprecated in favor of `minus_in_circle`
   minusInSquare: 'minus_in_square',
   mobile: 'mobile',
   monitoringApp: 'app_monitoring',
@@ -335,7 +351,8 @@ export var typeToPathMap = {
   move: 'move',
   namespace: 'namespace',
   nested: 'nested',
-  newChat: 'new_chat',
+  newChat: 'plus_in_circle',
+  // NOTE: To be deprecated in favor of `plus_in_circle`
   node: 'node',
   notebookApp: 'app_notebook',
   number: 'number',
@@ -360,11 +377,13 @@ export var typeToPathMap = {
   pipeNoBreaks: 'pipeNoBreaks',
   pivot: 'pivot',
   play: 'play',
-  playFilled: 'playFilled',
+  playFilled: 'play',
+  // NOTE: To be deprecated in favor of `play`
   plugs: 'plugs',
   plus: 'plus',
   plusInCircle: 'plus_in_circle',
-  plusInCircleFilled: 'plus_in_circle_filled',
+  plusInCircleFilled: 'plus_in_circle',
+  // NOTE: To be deprecated in favor of `plus_in_circle`
   plusInSquare: 'plus_in_square',
   popout: 'popout',
   push: 'push',
@@ -417,15 +436,19 @@ export var typeToPathMap = {
   stopFilled: 'stop_filled',
   stopSlash: 'stop_slash',
   storage: 'storage',
+  streamsClassic: 'streams_classic',
+  streamsWired: 'streams_wired',
   string: 'string',
-  submodule: 'submodule',
+  submodule: 'merge',
+  // NOTE: To be deprecated in favor of `merge`
   sun: 'sun',
   swatchInput: 'swatch_input',
   // Undocumented on purpose. Has an extra stroke for EuiColorPicker
   symlink: 'symlink',
   tableDensityCompact: 'table_density_compact',
   tableDensityExpanded: 'table_density_expanded',
-  tableDensityNormal: 'table_density_normal',
+  tableDensityNormal: 'vis_table',
+  // NOTE: To be deprecated in favor of `vis_table`
   tableOfContents: 'tableOfContents',
   tag: 'tag',
   tear: 'tear',
@@ -477,13 +500,13 @@ export var typeToPathMap = {
   visualizeApp: 'app_visualize',
   vulnerabilityManagementApp: 'app_vulnerability_management',
   warning: 'warning',
-  warningFilled: 'warningFilled',
-  alert: 'warning',
-  // NOTE: This is an undocumented alias for `warning`, added for legacy compatability with Elastic Charts
+  warningFilled: 'warning',
+  // NOTE: To be deprecated in favor of `export`
   watchesApp: 'app_watches',
   web: 'web',
   wordWrap: 'wordWrap',
   wordWrapDisabled: 'wordWrapDisabled',
+  workflowsApp: 'app_workflows',
   workplaceSearchApp: 'app_workplace_search',
   wrench: 'wrench',
   // Token Icon Imports

package/optimize/es/components/page_template/inner/page_inner.styles.js

@@ -13,7 +13,9 @@ export var euiPageInnerStyles = function euiPageInnerStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
     euiPageInner: /*#__PURE__*/css("display:flex;flex-direction:column;align-items:stretch;flex:1 1 100%;", logicalCSS('max-width', '100%'), " ", logicalCSS('min-width', '0'), ";;label:euiPageInner;"),
-    panelled: /*#__PURE__*/css("background:", euiThemeContext.euiTheme.colors.backgroundBasePlain, ";", euiShadow(euiThemeContext, 'm'), ";;label:panelled;"),
+    panelled: /*#__PURE__*/css("background:", euiThemeContext.euiTheme.colors.backgroundBasePlain, ";", euiShadow(euiThemeContext, 'm', {
+      border: 'none'
+    }), ";;label:panelled;"),
     border: {
       top: /*#__PURE__*/css(logicalCSS('border-top', euiTheme.border.thin), ";;label:top;"),
       left: /*#__PURE__*/css(logicalCSS('border-left', euiTheme.border.thin), ";;label:left;")

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

@@ -8,7 +8,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  */
 
 import { css } from '@emotion/react';
-import { euiShadow } from '@elastic/eui-theme-common';
+import { euiBorderStyles, euiShadow, euiShadowHover } from '@elastic/eui-theme-common';
 import { euiCanAnimate, logicalCSS, logicalTextAlignCSS } from '../../global_styling';
 import { highContrastModeStyles } from '../../global_styling/functions/high_contrast';
 export var euiPanelBorderStyles = function euiPanelBorderStyles(euiThemeContext, options) {
@@ -23,7 +23,9 @@ export var euiPanelBorderStyles = function euiPanelBorderStyles(euiThemeContext,
    euiTheme.colors.borderBaseFloating is enough then */
   var hasVisibleBorder = hasFloatingBorder && colorMode === 'DARK';
   return highContrastModeStyles(euiThemeContext, {
-    none: "\n      /* Using a pseudo element for the border instead of floating border only \n      because the transparent border might otherwise be visible with arbitrary \n      full-width/height content in light mode. */\n      &::after {\n        content: '';\n        position: absolute;\n        /* ensure to keep on top of flush content */\n        z-index: 0;\n        inset: 0;\n        border: ".concat(euiTheme.border.width.thin, " solid\n          ").concat((borderColor !== null && borderColor !== void 0 ? borderColor : hasVisibleBorder) ? euiTheme.border.color : euiTheme.colors.borderBaseFloating, ";\n        border-radius: inherit;\n        pointer-events: none;\n      }\n    "),
+    none: "\n      /* Using a pseudo element for the border instead of floating border only\n      because the transparent border might otherwise be visible with arbitrary\n      full-width/height content in light mode. */\n      ".concat(euiBorderStyles(euiThemeContext, {
+      borderColor: (borderColor !== null && borderColor !== void 0 ? borderColor : hasVisibleBorder) ? euiTheme.border.color : euiTheme.colors.borderBaseFloating
+    }), "\n    "),
     preferred: "\n      border: ".concat(euiTheme.border.thin, ";\n    ")
   });
 };
@@ -49,9 +51,7 @@ export var euiPanelStyles = function euiPanelStyles(euiThemeContext) {
     // Base
     euiPanel: _ref2,
     grow: _ref,
-    hasShadow: /*#__PURE__*/css(euiShadow(euiThemeContext, 'm'), " ", euiPanelBorderStyles(euiThemeContext, {
-      hasFloatingBorder: false
-    }), ";;label:hasShadow;"),
+    hasShadow: /*#__PURE__*/css(euiShadow(euiThemeContext, 'm'), ";;label:hasShadow;"),
     hasBorder: /*#__PURE__*/css(euiPanelBorderStyles(euiThemeContext, {
       borderColor: euiTheme.border.color,
       hasFloatingBorder: false
@@ -62,7 +62,7 @@ export var euiPanelStyles = function euiPanelStyles(euiThemeContext) {
     },
     // Setup interactive behavior
     isClickable: /*#__PURE__*/css(euiCanAnimate, "{transition:box-shadow ", euiTheme.animation.fast, " ", euiTheme.animation.resistance, ",transform ", euiTheme.animation.fast, " ", euiTheme.animation.resistance, ";}&:enabled{display:block;", logicalCSS('width', '100%'), " ", logicalTextAlignCSS('left'), ";}&:hover,&:focus{", highContrastModeStyles(euiThemeContext, {
-      none: euiShadow(euiThemeContext, 'l'),
+      none: euiShadowHover(euiThemeContext, 'l'),
       // Windows high contrast themes ignore box-shadows - use a filter workaround instead
       preferred: "\n            &:not(.euiPanel--transparent) {\n              filter: drop-shadow(0 ".concat(euiTheme.border.width.thick, " 0 ").concat(euiTheme.border.color, ");\n            }\n          ")
     }), " transform:translateY(-2px);cursor:pointer;};label:isClickable;")

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

@@ -86,7 +86,7 @@ export var euiProgressStyles = function euiProgressStyles(euiThemeContext, isNat
     indeterminate: /*#__PURE__*/css("&::before{position:absolute;content:'';", logicalCSS('width', '100%'), " ", logicalCSS('top', 0), " ", logicalCSS('bottom', 0), " ", logicalCSS('left', 0), " transform:scaleX(0) translateX(0%);animation:", euiIndeterminateAnimation, " 1s ", euiTheme.animation.resistance, " infinite;", highContrastModeStyles(euiThemeContext, {
       // Windows high contrast themes ignore backgrounds, so use a border instead
       forced: "\n            ".concat(logicalCSS('border-top-style', 'solid'), "\n            ").concat(logicalCSS('border-top-color', 'transparent'), "\n          ")
-    }), ";", euiCantAnimate, "{animation-duration:2s;animation-timing-function:linear;}};label:indeterminate;"),
+    }), ";", euiCantAnimate, "{animation:none;transform:scaleX(1) translateX(0%);background:repeating-linear-gradient(\n            -45deg,\n            transparent,\n            transparent ", euiTheme.size.m, ",\n            rgb(0, 0, 0, 0.25) ", euiTheme.size.m, ",\n            rgb(0, 0, 0, 0.25) ", euiTheme.size.l, "\n          );}};label:indeterminate;"),
     // Sizes
     _sharedSizeCSS: function _sharedSizeCSS(size) {
       return "\n      ".concat(logicalCSS('height', size), "\n      ").concat(highContrastModeStyles(euiThemeContext, {

package/optimize/es/global_styling/mixins/_shadow.js

@@ -6,13 +6,19 @@
  * Side Public License, v 1.
  */
 
-import { euiShadowFlat, euiShadow, euiSlightShadowHover, euiShadowXSmall, euiShadowSmall, euiShadowMedium, euiShadowLarge, euiShadowXLarge } from '@elastic/eui-theme-common';
+import { euiShadowFlat, euiShadow, euiSlightShadowHover, euiShadowXSmall, euiShadowSmall, euiShadowMedium, euiShadowLarge, euiShadowXLarge, euiShadowHover } from '@elastic/eui-theme-common';
 import { useEuiTheme } from '../../services/theme';
-export { euiShadowFlat, euiShadow, euiSlightShadowHover, euiShadowXSmall, euiShadowSmall, euiShadowMedium, euiShadowLarge, euiShadowXLarge };
+export { euiShadowFlat, euiShadow, euiSlightShadowHover, euiShadowXSmall, euiShadowSmall, euiShadowMedium, euiShadowLarge, euiShadowXLarge, euiShadowHover };
+
+/** @deprecated */
+
+/** @deprecated use euiShadowHover/useEuiShadowHover instead */
 export var useEuiSlightShadowHover = function useEuiSlightShadowHover(options) {
   var euiThemeContext = useEuiTheme();
   return euiSlightShadowHover(euiThemeContext, options);
 };
+
+/** @deprecated - useEuiShadow instead */
 export var useEuiShadowFlat = function useEuiShadowFlat(options) {
   var euiThemeContext = useEuiTheme();
   return euiShadowFlat(euiThemeContext, options);
@@ -22,4 +28,10 @@ export var useEuiShadow = function useEuiShadow() {
   var options = arguments.length > 1 ? arguments[1] : undefined;
   var euiThemeContext = useEuiTheme();
   return euiShadow(euiThemeContext, size, options);
+};
+export var useEuiShadowHover = function useEuiShadowHover() {
+  var size = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'l';
+  var options = arguments.length > 1 ? arguments[1] : undefined;
+  var euiThemeContext = useEuiTheme();
+  return euiShadowHover(euiThemeContext, size, options);
 };