@elastic/eui 70.3.0 → 70.4.0

package/optimize/es/components/description_list/description_list_description.styles.js

@@ -8,7 +8,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  * Side Public License, v 1.
  */
 import { css } from '@emotion/react';
-import { euiFontSize, euiBreakpoint, logicalTextAlignCSS, logicalCSS } from '../../global_styling';
+import { euiFontSize, euiMaxBreakpoint, euiMinBreakpoint, logicalTextAlignCSS, logicalCSS } from '../../global_styling';
 import { euiTitle } from '../title/title.styles';
 
 var _ref = process.env.NODE_ENV === "production" ? {
@@ -28,7 +28,7 @@ export var euiDescriptionListDescriptionStyles = function euiDescriptionListDesc
     // Types
     row: /*#__PURE__*/css(";label:row;"),
     column: /*#__PURE__*/css(columnDisplay, ";;label:column;"),
-    responsiveColumn: /*#__PURE__*/css(euiBreakpoint(euiThemeContext, ['xs', 's']), "{", logicalCSS('width', '100%'), " padding:0;}", euiBreakpoint(euiThemeContext, ['m', 'xl']), "{", columnDisplay, ";};label:responsiveColumn;"),
+    responsiveColumn: /*#__PURE__*/css(euiMaxBreakpoint(euiThemeContext, 'm'), "{", logicalCSS('width', '100%'), " padding:0;}", euiMinBreakpoint(euiThemeContext, 'm'), "{", columnDisplay, ";};label:responsiveColumn;"),
     inline: _ref,
     // This nested block handles just the font styling based on compressed and reverse
     fontStyles: {

package/optimize/es/components/description_list/description_list_title.styles.js

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 import { css } from '@emotion/react';
-import { euiFontSize, euiTextBreakWord, logicalTextAlignCSS, euiBreakpoint, logicalCSS } from '../../global_styling';
+import { euiFontSize, euiTextBreakWord, logicalTextAlignCSS, euiMaxBreakpoint, euiMinBreakpoint, logicalCSS } from '../../global_styling';
 import { tint } from '../../services';
 import { euiTitle } from '../title/title.styles';
 export var euiDescriptionListTitleStyles = function euiDescriptionListTitleStyles(euiThemeContext) {
@@ -18,7 +18,7 @@ export var euiDescriptionListTitleStyles = function euiDescriptionListTitleStyle
     // Types
     row: /*#__PURE__*/css(";label:row;"),
     column: /*#__PURE__*/css(columnDisplay, ";;label:column;"),
-    responsiveColumn: /*#__PURE__*/css(euiBreakpoint(euiThemeContext, ['xs', 's']), "{", logicalCSS('width', '100%'), " padding:0;}", euiBreakpoint(euiThemeContext, ['m', 'xl']), "{", columnDisplay, ";};label:responsiveColumn;"),
+    responsiveColumn: /*#__PURE__*/css(euiMaxBreakpoint(euiThemeContext, 'm'), "{", logicalCSS('width', '100%'), " padding:0;}", euiMinBreakpoint(euiThemeContext, 'm'), "{", columnDisplay, ";};label:responsiveColumn;"),
     inline: /*#__PURE__*/css("display:inline;border-radius:", euiTheme.border.radius.small, ";font-weight:", euiTheme.font.weight.medium, ";background-color:", colorMode === 'DARK' ? tint(euiTheme.colors.lightestShade, 0.5) : euiTheme.colors.lightestShade, ";", logicalCSS('margin-vertical', '0'), " ", logicalCSS('margin-horizontal', euiTheme.size.xs), "&:first-of-type{", logicalCSS('margin-left', '0'), ";};label:inline;"),
     // This nested block handles just the font styling based on compressed and reverse
     fontStyles: {

package/optimize/es/components/flex/flex_grid.styles.js

@@ -8,7 +8,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  * Side Public License, v 1.
  */
 import { css } from '@emotion/react';
-import { euiBreakpoint } from '../../global_styling';
+import { euiMaxBreakpoint } from '../../global_styling';
 
 var _ref = process.env.NODE_ENV === "production" ? {
   name: "nq5j9u-baseline",
@@ -108,7 +108,7 @@ export var euiFlexGridStyles = function euiFlexGridStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
     euiFlexGrid: _ref10,
-    responsive: /*#__PURE__*/css(euiBreakpoint(euiThemeContext, ['xs', 's']), "{grid-template-columns:repeat(1, 1fr);grid-auto-flow:row;};label:responsive;"),
+    responsive: /*#__PURE__*/css(euiMaxBreakpoint(euiThemeContext, 'm'), "{grid-template-columns:repeat(1, 1fr);grid-auto-flow:row;};label:responsive;"),
     direction: {
       row: /*#__PURE__*/css(";label:row;"),
       column: /*#__PURE__*/css("grid-auto-flow:column;grid-template-rows:repeat(", gridTemplateRows, ", 1fr);;label:column;")

package/optimize/es/components/flex/flex_group.styles.js

@@ -8,7 +8,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  * Side Public License, v 1.
  */
 import { css } from '@emotion/react';
-import { euiBreakpoint, logicalCSS } from '../../global_styling';
+import { euiMaxBreakpoint, logicalCSS } from '../../global_styling';
 
 var _ref = process.env.NODE_ENV === "production" ? {
   name: "n4hdkg-columnReverse",
@@ -167,7 +167,7 @@ export var euiFlexGroupStyles = function euiFlexGroupStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
     euiFlexGroup: _ref17,
-    responsive: /*#__PURE__*/css(euiBreakpoint(euiThemeContext, ['xs', 's']), "{flex-wrap:wrap;&>.euiFlexItem{", logicalCSS('width', '100%'), " flex-basis:100%;}};label:responsive;"),
+    responsive: /*#__PURE__*/css(euiMaxBreakpoint(euiThemeContext, 'm'), "{flex-wrap:wrap;&>.euiFlexItem{", logicalCSS('width', '100%'), " flex-basis:100%;}};label:responsive;"),
     wrap: _ref16,
     gutterSizes: {
       none: /*#__PURE__*/css(";label:none;"),

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

@@ -10,12 +10,12 @@ var _templateObject, _templateObject2;
  * Side Public License, v 1.
  */
 import { css, keyframes } from '@emotion/react';
-import { euiCanAnimate, euiBreakpoint, logicalCSS, mathWithUnits } from '../../global_styling';
+import { euiCanAnimate, euiMaxBreakpoint, euiMinBreakpoint, logicalCSS, mathWithUnits } from '../../global_styling';
 import { euiShadowXLarge } from '../../themes/amsterdam/global_styling/mixins';
 import { transparentize } from '../../services/color';
 import { euiFormVariables } from '../form/form.styles';
 export var euiFlyoutSlideInRight = keyframes(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  0% {\n    opacity: 0;\n    transform: translateX(100%);\n  }\n  75% {\n    opacity: 1;\n    transform: translateX(0%);\n  }\n"])));
-export var euiFlyoutSlideInLeft = keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  0% {\n    opacity: 0;\n    transform: translateX(-100%);\n  }\n  75% {\n    opacity: 1;\n    transform: translateX(0%);\n}\n"])));
+export var euiFlyoutSlideInLeft = keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  0% {\n    opacity: 0;\n    transform: translateX(-100%);\n  }\n  75% {\n    opacity: 1;\n    transform: translateX(0%);\n  }\n"])));
 export var euiFlyoutCloseButtonStyles = function euiFlyoutCloseButtonStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
@@ -25,15 +25,15 @@ export var euiFlyoutCloseButtonStyles = function euiFlyoutCloseButtonStyles(euiT
     outsideSide: {
       // `transforms` pull in close buttons a little
       // `!important` is necessary here to override the hover/focus transitions of buttons
-      right: /*#__PURE__*/css(logicalCSS('left', 0), " ", euiBreakpoint(euiThemeContext, ['m', 'xl']), "{transform:translateX(calc(-100% - ", euiTheme.size.l, "))!important;}", euiBreakpoint(euiThemeContext, ['xs', 's']), "{transform:translateX(calc(-100% - ", euiTheme.size.xs, "))!important;};label:right;"),
-      left: /*#__PURE__*/css(logicalCSS('right', 0), " ", euiBreakpoint(euiThemeContext, ['m', 'xl']), "{transform:translateX(calc(100% + ", euiTheme.size.l, "))!important;}", euiBreakpoint(euiThemeContext, ['xs', 's']), "{transform:translateX(calc(100% + ", euiTheme.size.xs, "))!important;};label:left;")
+      right: /*#__PURE__*/css(logicalCSS('left', 0), " ", euiMaxBreakpoint(euiThemeContext, 'm'), "{transform:translateX(calc(-100% - ", euiTheme.size.xs, "))!important;}", euiMinBreakpoint(euiThemeContext, 'm'), "{transform:translateX(calc(-100% - ", euiTheme.size.l, "))!important;};label:right;"),
+      left: /*#__PURE__*/css(logicalCSS('right', 0), " ", euiMaxBreakpoint(euiThemeContext, 'm'), "{transform:translateX(calc(100% + ", euiTheme.size.xs, "))!important;}", euiMinBreakpoint(euiThemeContext, 'm'), "{transform:translateX(calc(100% + ", euiTheme.size.l, "))!important;};label:left;")
     }
   };
 };
 export var euiFlyoutStyles = function euiFlyoutStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiFlyout: /*#__PURE__*/css("position:fixed;", logicalCSS('top', 0), " ", logicalCSS('bottom', 0), " ", logicalCSS('height', '100%'), " z-index:", euiTheme.levels.flyout, ";background:", euiTheme.colors.emptyShade, ";display:flex;flex-direction:column;align-items:stretch;&:focus{outline:none;}", euiBreakpoint(euiThemeContext, ['xs', 's']), "{", logicalCSS('max-width', '90vw !important'), ";};label:euiFlyout;"),
+    euiFlyout: /*#__PURE__*/css("position:fixed;", logicalCSS('top', 0), " ", logicalCSS('bottom', 0), " ", logicalCSS('height', '100%'), " z-index:", euiTheme.levels.flyout, ";background:", euiTheme.colors.emptyShade, ";display:flex;flex-direction:column;align-items:stretch;&:focus{outline:none;}", euiMaxBreakpoint(euiThemeContext, 'm'), "{", logicalCSS('max-width', '90vw !important'), ";};label:euiFlyout;"),
     // Flyout sizes
     s: /*#__PURE__*/css(composeFlyoutSizing(euiThemeContext, 's'), ";;label:s;"),
     m: /*#__PURE__*/css(composeFlyoutSizing(euiThemeContext, 'm'), ";;label:m;"),
@@ -42,7 +42,7 @@ export var euiFlyoutStyles = function euiFlyoutStyles(euiThemeContext) {
     // Side
     right: /*#__PURE__*/css("clip-path:polygon(-50% 0, 100% 0, 100% 100%, -50% 100%);", logicalCSS('right', 0), " ", euiCanAnimate, "{animation:", euiFlyoutSlideInRight, " ", euiTheme.animation.normal, " ", euiTheme.animation.resistance, ";};label:right;"),
     // Left-side flyouts should only be used for navigation
-    left: /*#__PURE__*/css(logicalCSS('left', 0), " clip-path:polygon(0 0, 150% 0, 150% 100%, 0 100%);", euiCanAnimate, "{animation:", euiFlyoutSlideInLeft, ";};label:left;"),
+    left: /*#__PURE__*/css(logicalCSS('left', 0), " clip-path:polygon(0 0, 150% 0, 150% 100%, 0 100%);", euiCanAnimate, "{animation:", euiFlyoutSlideInLeft, " ", euiTheme.animation.normal, " ", euiTheme.animation.resistance, ";};label:left;"),
     // Type
     overlay: /*#__PURE__*/css(euiShadowXLarge(euiThemeContext), ";;label:overlay;"),
     push: /*#__PURE__*/css("clip-path:none;animation-duration:0s!important;z-index:", Number(euiTheme.levels.flyout) - 1, ";;label:push;"),
@@ -86,7 +86,7 @@ var composeFlyoutSizing = function composeFlyoutSizing(euiThemeContext, size) {
       max: "".concat(euiTheme.breakpoint.l, "px")
     }
   };
-  return "\n    ".concat(logicalCSS('max-width', flyoutSizes[size].max), "\n\n    ").concat(euiBreakpoint(euiThemeContext, ['m', 'xl']), " {\n      ").concat(logicalCSS('min-width', flyoutSizes[size].min), "\n      ").concat(logicalCSS('width', flyoutSizes[size].width), "\n    }\n    ").concat(euiBreakpoint(euiThemeContext, ['xs', 's']), " {\n      ").concat(logicalCSS('min-width', 0), "\n      ").concat(logicalCSS('width', flyoutSizes[size].min), "\n    }\n  ");
+  return "\n    ".concat(logicalCSS('max-width', flyoutSizes[size].max), "\n\n    ").concat(euiMaxBreakpoint(euiThemeContext, 'm'), " {\n      ").concat(logicalCSS('min-width', 0), "\n      ").concat(logicalCSS('width', flyoutSizes[size].min), "\n    }\n    ").concat(euiMinBreakpoint(euiThemeContext, 'm'), " {\n      ").concat(logicalCSS('min-width', flyoutSizes[size].min), "\n      ").concat(logicalCSS('width', flyoutSizes[size].width), "\n    }\n  ");
 };
 
 var composeFlyoutPadding = function composeFlyoutPadding(euiThemeContext, paddingSize) {

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

@@ -0,0 +1,35 @@
+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 EuiIconFilterInCircle = function EuiIconFilterInCircle(_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,
+    viewBox: "0 0 16 16",
+    "aria-labelledby": titleId
+  }, props), title ? ___EmotionJSX("title", {
+    id: titleId
+  }, title) : null, ___EmotionJSX("path", {
+    fillRule: "evenodd",
+    d: "M7.999 15.999a8 8 0 110-16 8 8 0 010 16zM8 15A7 7 0 108 1a7 7 0 000 14zM3.5 5h9a.5.5 0 110 1h-9a.5.5 0 010-1zm2 3h5a.5.5 0 110 1h-5a.5.5 0 010-1zm2 3h1a.5.5 0 110 1h-1a.5.5 0 110-1z"
+  }));
+};
+
+export var icon = EuiIconFilterInCircle;

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

@@ -137,6 +137,7 @@ export var typeToPathMap = {
   filterExclude: 'filterExclude',
   filterIgnore: 'filterIgnore',
   filterInclude: 'filterInclude',
+  filterInCircle: 'filterInCircle',
   flag: 'flag',
   fleetApp: 'app_agent',
   fold: 'fold',

package/optimize/es/components/image/image_wrapper.styles.js

@@ -8,7 +8,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  * Side Public License, v 1.
  */
 import { css } from '@emotion/react';
-import { euiBreakpoint, logicalCSS, logicalTextAlignCSS, logicalSide } from '../../global_styling';
+import { euiMinBreakpoint, logicalCSS, logicalTextAlignCSS, logicalSide } from '../../global_styling';
 
 var _ref = process.env.NODE_ENV === "production" ? {
   name: "gacnmc-allowFullScreen",
@@ -33,8 +33,8 @@ export var euiImageWrapperStyles = function euiImageWrapperStyles(euiThemeContex
     // Floats
     // 1: Logical properties/values in `float` is currently not yet supported by all browsers w/o flags
     // @see https://caniuse.com/mdn-css_properties_float_flow_relative_values for when we can remove left/right fallbacks
-    left: /*#__PURE__*/css(euiBreakpoint(euiThemeContext, ['m', 'xl']), "{float:left;float:", logicalSide.left, ";", logicalCSS('margin-left', '0'), ";", logicalCSS('margin-top', '0'), ";};label:left;"),
-    right: /*#__PURE__*/css(euiBreakpoint(euiThemeContext, ['m', 'xl']), "{float:right;float:", logicalSide.right, ";", logicalCSS('margin-right', '0'), ";", logicalCSS('margin-top', '0'), ";};label:right;"),
+    left: /*#__PURE__*/css(euiMinBreakpoint(euiThemeContext, 'm'), "{float:left;float:", logicalSide.left, ";", logicalCSS('margin-left', '0'), ";", logicalCSS('margin-top', '0'), ";};label:left;"),
+    right: /*#__PURE__*/css(euiMinBreakpoint(euiThemeContext, 'm'), "{float:right;float:", logicalSide.right, ";", logicalCSS('margin-right', '0'), ";", logicalCSS('margin-top', '0'), ";};label:right;"),
     // Sizes
     fullWidth: /*#__PURE__*/css(logicalCSS('width', '100%'), ";;label:fullWidth;")
   };

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

@@ -7,15 +7,15 @@
  */
 import { css } from '@emotion/react';
 import { euiShadowXLarge } from '../../themes/amsterdam/global_styling/mixins';
-import { euiCanAnimate, euiBreakpoint, euiAnimSlideInUp } from '../../global_styling';
+import { euiCanAnimate, euiMaxBreakpoint, euiAnimSlideInUp } from '../../global_styling';
 import { euiFormVariables } from '../form/form.styles';
 export var euiModalStyles = function euiModalStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiModal: /*#__PURE__*/css(euiShadowXLarge(euiThemeContext), " display:flex;flex-direction:column;max-block-size:75vh;position:relative;background-color:", euiTheme.colors.emptyShade, ";border-radius:", euiTheme.border.radius.medium, ";z-index:", euiTheme.levels.modal, ";min-inline-size:", euiFormVariables(euiThemeContext).maxWidth, ";max-inline-size:calc(100vw - ", euiTheme.size.base, ");", euiCanAnimate, "{animation:", euiAnimSlideInUp(euiTheme.size.xxl), " ", euiTheme.animation.slow, " ", euiTheme.animation.bounce, ";}", euiBreakpoint(euiThemeContext, ['xs', 's']), "{position:fixed;inset:0;border-radius:0;inline-size:100vw!important;min-inline-size:0!important;max-inline-size:none!important;max-block-size:100vh!important;}&:focus{outline:none;};label:euiModal;"),
+    euiModal: /*#__PURE__*/css(euiShadowXLarge(euiThemeContext), " display:flex;flex-direction:column;max-block-size:75vh;position:relative;background-color:", euiTheme.colors.emptyShade, ";border-radius:", euiTheme.border.radius.medium, ";z-index:", euiTheme.levels.modal, ";min-inline-size:", euiFormVariables(euiThemeContext).maxWidth, ";max-inline-size:calc(100vw - ", euiTheme.size.base, ");", euiCanAnimate, "{animation:", euiAnimSlideInUp(euiTheme.size.xxl), " ", euiTheme.animation.slow, " ", euiTheme.animation.bounce, ";}", euiMaxBreakpoint(euiThemeContext, 'm'), "{position:fixed;inset:0;border-radius:0;inline-size:100vw!important;min-inline-size:0!important;max-inline-size:none!important;max-block-size:100vh!important;}&:focus{outline:none;};label:euiModal;"),
     // Variants
     defaultMaxWidth: /*#__PURE__*/css("max-inline-size:min(\n        ", euiTheme.breakpoint.m, "px,\n        calc(100vw - ", euiTheme.size.base, ")\n      );;label:defaultMaxWidth;"),
-    confirmation: /*#__PURE__*/css("min-inline-size:", euiFormVariables(euiThemeContext).maxWidth, ";", euiBreakpoint(euiThemeContext, ['xs', 's']), "{", euiShadowXLarge(euiThemeContext, {
+    confirmation: /*#__PURE__*/css("min-inline-size:", euiFormVariables(euiThemeContext).maxWidth, ";", euiMaxBreakpoint(euiThemeContext, 'm'), "{", euiShadowXLarge(euiThemeContext, {
       reverse: true
     }), " inset-block-start:auto;};label:confirmation;"),
     euiModal__closeIcon: /*#__PURE__*/css("position:absolute;inset-inline-end:", euiTheme.size.xs, ";inset-block-start:", euiTheme.size.xs, ";z-index:3;;label:euiModal__closeIcon;")

package/optimize/es/components/modal/modal_body.styles.js

@@ -6,11 +6,11 @@
  * Side Public License, v 1.
  */
 import { css } from '@emotion/react';
-import { euiYScrollWithShadows, euiBreakpoint } from '../../global_styling';
+import { euiYScrollWithShadows, euiMaxBreakpoint } from '../../global_styling';
 export var euiModalBodyStyles = function euiModalBodyStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
     euiModalBody: /*#__PURE__*/css("flex-grow:1;overflow:hidden;display:flex;flex-direction:column;&:last-of-type .euiModalBody__overflow{padding-block-end:", euiTheme.size.l, ";};label:euiModalBody;"),
-    euiModalBody__overflow: /*#__PURE__*/css(euiYScrollWithShadows(euiThemeContext), ";padding-inline:", euiTheme.size.l, ";padding-block:", euiTheme.size.s, ";", euiBreakpoint(euiThemeContext, ['xs', 's']), "{padding-block-end:", euiTheme.size.l, ";};label:euiModalBody__overflow;")
+    euiModalBody__overflow: /*#__PURE__*/css(euiYScrollWithShadows(euiThemeContext), ";padding-inline:", euiTheme.size.l, ";padding-block:", euiTheme.size.s, ";", euiMaxBreakpoint(euiThemeContext, 'm'), "{padding-block-end:", euiTheme.size.l, ";};label:euiModalBody__overflow;")
   };
 };

package/optimize/es/components/modal/modal_footer.styles.js

@@ -6,10 +6,10 @@
  * Side Public License, v 1.
  */
 import { css } from '@emotion/react';
-import { euiBreakpoint } from '../../global_styling';
+import { euiMaxBreakpoint } from '../../global_styling';
 export var euiModalFooterStyles = function euiModalFooterStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
-    euiModalFooter: /*#__PURE__*/css("display:flex;justify-content:flex-end;padding-block:", euiTheme.size.base, " ", euiTheme.size.l, ";padding-inline:", euiTheme.size.l, ";flex-grow:0;flex-shrink:0;gap:", euiTheme.size.base, ";", euiBreakpoint(euiThemeContext, ['xs', 's']), "{background:", euiTheme.colors.lightestShade, ";padding-block:", euiTheme.size.m, ";padding-inline:", euiTheme.size.l, ";justify-content:stretch;gap:", euiTheme.size.s, ";>*{flex:1;}};label:euiModalFooter;")
+    euiModalFooter: /*#__PURE__*/css("display:flex;justify-content:flex-end;padding-block:", euiTheme.size.base, " ", euiTheme.size.l, ";padding-inline:", euiTheme.size.l, ";flex-grow:0;flex-shrink:0;gap:", euiTheme.size.base, ";", euiMaxBreakpoint(euiThemeContext, 'm'), "{background:", euiTheme.colors.lightestShade, ";padding-block:", euiTheme.size.m, ";padding-inline:", euiTheme.size.l, ";justify-content:stretch;gap:", euiTheme.size.s, ";>*{flex:1;}};label:euiModalFooter;")
   };
 };

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

@@ -8,7 +8,7 @@ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringif
  * Side Public License, v 1.
  */
 import { css } from '@emotion/react';
-import { euiBreakpoint, logicalCSS } from '../../global_styling';
+import { euiMinBreakpoint, logicalCSS } from '../../global_styling';
 
 var _ref = process.env.NODE_ENV === "production" ? {
   name: "ll8kmq-column",
@@ -36,7 +36,7 @@ export var euiPageStyles = function euiPageStyles(euiThemeContext) {
     grow: _ref2,
     // Direction
     column: _ref,
-    row: /*#__PURE__*/css("flex-direction:column;", euiBreakpoint(euiThemeContext, ['m', 'xl']), "{flex-direction:row;};label:row;"),
+    row: /*#__PURE__*/css("flex-direction:column;", euiMinBreakpoint(euiThemeContext, 'm'), "{flex-direction:row;};label:row;"),
     // Max widths
     restrictWidth: /*#__PURE__*/css(logicalCSS('margin-horizontal', 'auto'), ";;label:restrictWidth;")
   };

package/optimize/es/components/search_bar/query/ast_to_es_query_dsl.js

@@ -112,13 +112,19 @@ export var _fieldValuesToQuery = function _fieldValuesToQuery(field, operations,
           queries.push({
             bool: _defineProperty({}, andOr === 'and' ? 'must' : 'should', _toConsumableArray(_terms.map(function (value) {
               return {
-                match: _defineProperty({}, field, value)
+                match: _defineProperty({}, field, {
+                  query: value,
+                  operator: andOr
+                })
               };
             })))
           });
         } else if (_terms.length === 1) {
           queries.push({
-            match: _defineProperty({}, field, _terms[0])
+            match: _defineProperty({}, field, {
+              query: _terms[0],
+              operator: andOr
+            })
           });
         }
 

package/optimize/es/components/toast/global_toast_list.styles.js

@@ -10,20 +10,20 @@ var _templateObject;
  * Side Public License, v 1.
  */
 import { css, keyframes } from '@emotion/react';
-import { euiBreakpoint, euiScrollBarStyles, logicalCSS, logicalCSSWithFallback, logicalSizeCSS } from '../../global_styling';
+import { euiMaxBreakpoint, euiMinBreakpoint, euiScrollBarStyles, logicalCSS, logicalCSSWithFallback, logicalSizeCSS } from '../../global_styling';
 export var euiGlobalToastListStyles = function euiGlobalToastListStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
-  var euiToastWidth = euiTheme.base * 20;
+  var euiToastWidth = euiTheme.base * 25;
   return {
     /**
      * 1. Allow list to expand as items are added, but cap it at the screen height.
      * 2. Allow some padding for shadow
      */
     // Base
-    euiGlobalToastList: /*#__PURE__*/css(euiScrollBarStyles(euiThemeContext), " display:flex;flex-direction:column;align-items:stretch;position:fixed;z-index:", euiTheme.levels.toast, ";", logicalCSS('bottom', 0), ";", logicalCSS('width', "".concat(euiToastWidth + euiTheme.base * 5, "px")), ";", logicalCSS('max-height', '100vh'), ";", logicalCSSWithFallback('overflow-y', 'auto'), ";scrollbar-width:none;&::-webkit-scrollbar{", logicalSizeCSS(0, 0), ";}&:not(:empty){", logicalCSS('padding-left', euiTheme.size.base), ";", logicalCSS('padding-right', euiTheme.size.base), ";", logicalCSS('padding-vertical', euiTheme.size.base), ";}", euiBreakpoint(euiThemeContext, ['xs', 's']), "{&:not(:empty){", logicalCSS('left', 0), ";", logicalCSS('width', '100%'), ";}};label:euiGlobalToastList;"),
+    euiGlobalToastList: /*#__PURE__*/css(euiScrollBarStyles(euiThemeContext), " display:flex;flex-direction:column;align-items:stretch;position:fixed;z-index:", euiTheme.levels.toast, ";", logicalCSS('bottom', 0), ";", logicalCSS('width', "".concat(euiToastWidth, "px")), ";", logicalCSS('max-height', '100vh'), ";", logicalCSSWithFallback('overflow-y', 'auto'), ";scrollbar-width:none;&::-webkit-scrollbar{", logicalSizeCSS(0, 0), ";}&:not(:empty){", logicalCSS('padding-left', euiTheme.size.base), ";", logicalCSS('padding-right', euiTheme.size.base), ";", logicalCSS('padding-vertical', euiTheme.size.base), ";}", euiMaxBreakpoint(euiThemeContext, 'm'), "{&:not(:empty){", logicalCSS('left', 0), ";", logicalCSS('width', '100%'), ";}};label:euiGlobalToastList;"),
     // Variants
-    right: /*#__PURE__*/css("&:not(:empty){", logicalCSS('right', 0), ";", logicalCSS('padding-left', "".concat(euiTheme.base * 4, "px")), ";}", euiBreakpoint(euiThemeContext, ['xs', 's']), "{&:not(:empty){", logicalCSS('padding-left', euiTheme.size.base), ";}};label:right;"),
-    left: /*#__PURE__*/css("&:not(:empty){", logicalCSS('left', 0), ";", logicalCSS('padding-right', "".concat(euiTheme.base * 4, "px")), ";}", euiBreakpoint(euiThemeContext, ['xs', 's']), "{&:not(:empty){", logicalCSS('padding-right', euiTheme.size.base), ";}};label:left;")
+    right: /*#__PURE__*/css("&:not(:empty){", logicalCSS('right', 0), ";", euiMinBreakpoint(euiThemeContext, 'm'), "{", logicalCSS('padding-left', "".concat(euiTheme.base * 4, "px")), ";}};label:right;"),
+    left: /*#__PURE__*/css("&:not(:empty){", logicalCSS('left', 0), ";", euiMinBreakpoint(euiThemeContext, 'm'), "{", logicalCSS('padding-right', "".concat(euiTheme.base * 4, "px")), ";}};label:left;")
   };
 };
 export var euiGlobalToastListItemStyles = function euiGlobalToastListItemStyles(_ref) {

package/optimize/es/components/tour/tour_step.js

@@ -104,10 +104,25 @@ export var EuiTourStep = function EuiTourStep(_ref) {
     flush: 'right',
     size: 'xs'
   };
+  var optionalFooterAction = Array.isArray(footerAction) ? ___EmotionJSX(EuiFlexGroup, {
+    gutterSize: "s",
+    alignItems: "center",
+    justifyContent: "flexEnd",
+    responsive: false,
+    wrap: true
+  }, footerAction.map(function (action, index) {
+    return ___EmotionJSX(EuiFlexItem, {
+      key: index,
+      grow: false
+    }, action);
+  })) : ___EmotionJSX(EuiFlexItem, {
+    grow: false
+  }, footerAction);
 
   var footer = ___EmotionJSX(EuiFlexGroup, {
     responsive: false,
-    justifyContent: stepsTotal > 1 ? 'spaceBetween' : 'flexEnd'
+    justifyContent: stepsTotal > 1 ? 'spaceBetween' : 'flexEnd',
+    alignItems: "center"
   }, stepsTotal > 1 && ___EmotionJSX(EuiFlexItem, {
     grow: false
   }, ___EmotionJSX("ul", {
@@ -126,9 +141,7 @@ export var EuiTourStep = function EuiTourStep(_ref) {
       number: i + 1,
       status: status
     });
-  }))), footerAction ? ___EmotionJSX(EuiFlexItem, {
-    grow: false
-  }, footerAction) : ___EmotionJSX(EuiFlexItem, {
+  }))), footerAction ? optionalFooterAction : ___EmotionJSX(EuiFlexItem, {
     grow: false
   }, ___EmotionJSX(EuiI18n, {
     tokens: ['euiTourStep.endTour', 'euiTourStep.skipTour', 'euiTourStep.closeTour'],

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

@@ -9,7 +9,7 @@ import { sortMapBySmallToLargeValues } from '../../services/breakpoint/_sorting'
 import { useEuiTheme } from '../../services/theme/hooks';
 
 /**
- * Generates a CSS media query rule string based on the input breakpoint ranges.
+ * Generates a CSS media query rule string based on the input breakpoint *ranges*.
  * Examples with default theme breakpoints:
  *
  * euiBreakpoint(['s']) becomes `@media only screen and (min-width: 575px) and (max-width: 767px)`
@@ -47,4 +47,49 @@ export var euiBreakpoint = function euiBreakpoint(_ref, sizes) {
 export var useEuiBreakpoint = function useEuiBreakpoint(sizes) {
   var euiTheme = useEuiTheme();
   return euiBreakpoint(euiTheme, sizes);
+};
+/**
+ * Min/Max width breakpoint utilities that generate only a single min/max query/bound
+ *
+ * *Unlike the above euiBreakpoint utility*, these utilities treat breakpoint
+ * sizes as a one-dimensional point, rather than a two-dimensional *screen range*.
+ * Examples with default theme breakpoints:
+ *
+ * euiMaxBreakpoint('m') becomes `@media only screen and (max-width: 767px)`
+ * euiMinBreakpoint('m') becomes `@media only screen and (min-width: 768px)`
+ *
+ * This is safer and more intentional to use than euiBreakpoint(['xs', 's']) / euiBreakpoint(['m', 'xl'])
+ * in the event that consumers add larger or smaller custom breakpoints (e.g 'xxs' or `xxl`)
+ * and if the intention of the media query is actually "m and below/above" vs. "only screens m/l/xl".
+ */
+
+export var euiMinBreakpoint = function euiMinBreakpoint(_ref2, size) {
+  var euiTheme = _ref2.euiTheme;
+  var minBreakpointSize = euiTheme.breakpoint[size];
+
+  if (minBreakpointSize) {
+    return "@media only screen and (min-width: ".concat(minBreakpointSize, "px)");
+  } else {
+    console.warn("Invalid min breakpoint size: ".concat(size));
+    return '@media only screen';
+  }
+};
+export var useEuiMinBreakpoint = function useEuiMinBreakpoint(size) {
+  var euiTheme = useEuiTheme();
+  return euiMinBreakpoint(euiTheme, size);
+};
+export var euiMaxBreakpoint = function euiMaxBreakpoint(_ref3, size) {
+  var euiTheme = _ref3.euiTheme;
+  var maxBreakpointSize = euiTheme.breakpoint[size];
+
+  if (maxBreakpointSize) {
+    return "@media only screen and (max-width: ".concat(maxBreakpointSize - 1, "px)");
+  } else {
+    console.warn("Invalid max breakpoint size: ".concat(size));
+    return '@media only screen';
+  }
+};
+export var useEuiMaxBreakpoint = function useEuiMaxBreakpoint(size) {
+  var euiTheme = useEuiTheme();
+  return euiMaxBreakpoint(euiTheme, size);
 };

package/optimize/lib/components/beacon/beacon.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.EuiBeacon = void 0;
+exports.EuiBeacon = exports.COLORS = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
@@ -19,23 +19,31 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _beacon = require("./beacon.styles");
 
+var _services = require("../../services");
+
 var _react2 = require("@emotion/react");
 
-var _excluded = ["className", "size", "style"];
+var _excluded = ["className", "size", "color", "style"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
+var COLORS = ['subdued', 'primary', 'success', 'accent', 'danger', 'warning'];
+exports.COLORS = COLORS;
+
 var EuiBeacon = function EuiBeacon(_ref) {
   var className = _ref.className,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? 12 : _ref$size,
+      _ref$color = _ref.color,
+      color = _ref$color === void 0 ? 'success' : _ref$color,
       style = _ref.style,
       rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var euiTheme = (0, _services.useEuiTheme)();
   var classes = (0, _classnames.default)('euiBeacon', className);
-  var styles = (0, _beacon.euiBeaconStyles)();
-  var cssStyles = [styles.euiBeacon];
+  var styles = (0, _beacon.euiBeaconStyles)(euiTheme);
+  var cssStyles = [styles.euiBeacon, styles[color]];
 
   var beaconStyle = _objectSpread(_objectSpread({}, style), {}, {
     height: size,

package/optimize/lib/components/beacon/beacon.styles.js

@@ -11,20 +11,28 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 
 var _react = require("@emotion/react");
 
-var _services = require("../../services");
-
 var _global_styling = require("../../global_styling");
 
 var _templateObject, _templateObject2;
 
-var visColors = (0, _services.euiPaletteColorBlind)();
+var _colorCSS = function _colorCSS(color) {
+  return "\n    background-color: ".concat(color, ";\n    &:before,\n    &:after {\n      box-shadow: 0 0 1px 1px ").concat(color, ";\n    }\n  ");
+};
+
 var euiBeaconPulseLarge = (0, _react.keyframes)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n 0% {\n    transform: scale(.1);\n    opacity: 1;\n  }\n\n  70% {\n    transform: scale(3);\n    opacity: 0;\n  }\n\n  100% {\n    opacity: 0;\n  }\n"])));
 var euiBeaconPulseSmall = (0, _react.keyframes)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n   0% {\n    transform: scale(.1);\n    opacity: 1;\n  }\n\n  70% {\n    transform: scale(2);\n    opacity: 0;\n  }\n\n  100% {\n    opacity: 0;\n  }\n"])));
 
-var euiBeaconStyles = function euiBeaconStyles() {
+var euiBeaconStyles = function euiBeaconStyles(_ref) {
+  var euiTheme = _ref.euiTheme;
   return {
     // Base
-    euiBeacon: /*#__PURE__*/(0, _react.css)("position:relative;background-color:", visColors[0], ";border-radius:50%;&:before,&:after{position:absolute;content:'';", (0, _global_styling.logicalSizeCSS)('100%', '100%'), " ", (0, _global_styling.logicalCSS)('left', 0), " ", (0, _global_styling.logicalCSS)('top', 0), " background-color:transparent;border-radius:50%;box-shadow:0 0 1px 1px ", visColors[0], ";}&:before{transform:scale(1.6);opacity:0.4;}&:after{opacity:0;}", _global_styling.euiCanAnimate, "{&:before{animation:", euiBeaconPulseLarge, " 2.5s infinite ease-out;}&:after{animation:", euiBeaconPulseSmall, " 2.5s infinite ease-out 0.25s;}};label:euiBeacon;")
+    euiBeacon: /*#__PURE__*/(0, _react.css)("position:relative;border-radius:50%;&:before,&:after{position:absolute;content:'';", (0, _global_styling.logicalSizeCSS)('100%', '100%'), " ", (0, _global_styling.logicalCSS)('left', 0), " ", (0, _global_styling.logicalCSS)('top', 0), " background-color:transparent;border-radius:50%;}&:before{transform:scale(1.6);opacity:0.4;}&:after{opacity:0;}", _global_styling.euiCanAnimate, "{&:before{animation:", euiBeaconPulseLarge, " 2.5s infinite ease-out;}&:after{animation:", euiBeaconPulseSmall, " 2.5s infinite ease-out 0.25s;}};label:euiBeacon;"),
+    subdued: /*#__PURE__*/(0, _react.css)(_colorCSS(euiTheme.colors.subduedText), ";label:subdued;"),
+    primary: /*#__PURE__*/(0, _react.css)(_colorCSS(euiTheme.colors.primary), ";label:primary;"),
+    success: /*#__PURE__*/(0, _react.css)(_colorCSS(euiTheme.colors.success), ";label:success;"),
+    warning: /*#__PURE__*/(0, _react.css)(_colorCSS(euiTheme.colors.warning), ";label:warning;"),
+    danger: /*#__PURE__*/(0, _react.css)(_colorCSS(euiTheme.colors.danger), ";label:danger;"),
+    accent: /*#__PURE__*/(0, _react.css)(_colorCSS(euiTheme.colors.accent), ";label:accent;")
   };
 };
 

package/optimize/lib/components/card/card.styles.js

@@ -58,11 +58,11 @@ var _ref5 = process.env.NODE_ENV === "production" ? {
 };
 
 var _ref6 = process.env.NODE_ENV === "production" ? {
-  name: "31kq8f-euiCard__main",
-  styles: "display:flex;inline-size:100%;label:euiCard__main;"
+  name: "1lyvdpf-euiCard__main",
+  styles: "display:flex;inline-size:100%;flex-grow:1;label:euiCard__main;"
 } : {
-  name: "31kq8f-euiCard__main",
-  styles: "display:flex;inline-size:100%;label:euiCard__main;",
+  name: "1lyvdpf-euiCard__main",
+  styles: "display:flex;inline-size:100%;flex-grow:1;label:euiCard__main;",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 };
 

package/optimize/lib/components/description_list/description_list.styles.js

@@ -26,7 +26,7 @@ var euiDescriptionListStyles = function euiDescriptionListStyles(euiThemeContext
     inline: /*#__PURE__*/(0, _react.css)(";label:inline;"),
     column: /*#__PURE__*/(0, _react.css)(columnDisplay, ";;label:column;"),
     // Responsive columns behave as a row on breakpoints xs-s
-    responsiveColumn: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiBreakpoint)(euiThemeContext, ['m', 'xl']), "{", columnDisplay, ";};label:responsiveColumn;"),
+    responsiveColumn: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiMinBreakpoint)(euiThemeContext, 'm'), "{", columnDisplay, ";};label:responsiveColumn;"),
     // Alignment
     center: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalTextAlignCSS)('center'), ";;label:center;"),
     left: /*#__PURE__*/(0, _react.css)((0, _global_styling.logicalTextAlignCSS)('left'), ";;label:left;")

package/optimize/lib/components/description_list/description_list_description.js

@@ -45,6 +45,7 @@ var EuiDescriptionListDescription = function EuiDescriptionListDescription(_ref)
       align = _useContext.align,
       gutterSize = _useContext.gutterSize;
 
+  var showResponsiveColumns = (0, _services.useIsWithinMinBreakpoint)('m');
   var theme = (0, _services.useEuiTheme)();
   var styles = (0, _description_list_description.euiDescriptionListDescriptionStyles)(theme);
   var conditionalStyles = compressed && textStyle === 'reverse' ? [styles.fontStyles.compressed] : [styles.fontStyles[textStyle]];
@@ -60,7 +61,10 @@ var EuiDescriptionListDescription = function EuiDescriptionListDescription(_ref)
         conditionalStyles.push(styles.left);
       }
 
-      conditionalStyles.push(styles[gutterSize]);
+      if (type === 'column' || showResponsiveColumns) {
+        conditionalStyles.push(styles[gutterSize]);
+      }
+
       break;
   }
 

package/optimize/lib/components/description_list/description_list_description.styles.js

@@ -30,7 +30,7 @@ var euiDescriptionListDescriptionStyles = function euiDescriptionListDescription
     // Types
     row: /*#__PURE__*/(0, _react.css)(";label:row;"),
     column: /*#__PURE__*/(0, _react.css)(columnDisplay, ";;label:column;"),
-    responsiveColumn: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiBreakpoint)(euiThemeContext, ['xs', 's']), "{", (0, _global_styling.logicalCSS)('width', '100%'), " padding:0;}", (0, _global_styling.euiBreakpoint)(euiThemeContext, ['m', 'xl']), "{", columnDisplay, ";};label:responsiveColumn;"),
+    responsiveColumn: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiMaxBreakpoint)(euiThemeContext, 'm'), "{", (0, _global_styling.logicalCSS)('width', '100%'), " padding:0;}", (0, _global_styling.euiMinBreakpoint)(euiThemeContext, 'm'), "{", columnDisplay, ";};label:responsiveColumn;"),
     inline: _ref,
     // This nested block handles just the font styling based on compressed and reverse
     fontStyles: {

package/optimize/lib/components/description_list/description_list_title.styles.js

@@ -29,7 +29,7 @@ var euiDescriptionListTitleStyles = function euiDescriptionListTitleStyles(euiTh
     // Types
     row: /*#__PURE__*/(0, _react.css)(";label:row;"),
     column: /*#__PURE__*/(0, _react.css)(columnDisplay, ";;label:column;"),
-    responsiveColumn: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiBreakpoint)(euiThemeContext, ['xs', 's']), "{", (0, _global_styling.logicalCSS)('width', '100%'), " padding:0;}", (0, _global_styling.euiBreakpoint)(euiThemeContext, ['m', 'xl']), "{", columnDisplay, ";};label:responsiveColumn;"),
+    responsiveColumn: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiMaxBreakpoint)(euiThemeContext, 'm'), "{", (0, _global_styling.logicalCSS)('width', '100%'), " padding:0;}", (0, _global_styling.euiMinBreakpoint)(euiThemeContext, 'm'), "{", columnDisplay, ";};label:responsiveColumn;"),
     inline: /*#__PURE__*/(0, _react.css)("display:inline;border-radius:", euiTheme.border.radius.small, ";font-weight:", euiTheme.font.weight.medium, ";background-color:", colorMode === 'DARK' ? (0, _services.tint)(euiTheme.colors.lightestShade, 0.5) : euiTheme.colors.lightestShade, ";", (0, _global_styling.logicalCSS)('margin-vertical', '0'), " ", (0, _global_styling.logicalCSS)('margin-horizontal', euiTheme.size.xs), "&:first-of-type{", (0, _global_styling.logicalCSS)('margin-left', '0'), ";};label:inline;"),
     // This nested block handles just the font styling based on compressed and reverse
     fontStyles: {

package/optimize/lib/components/flex/flex_grid.styles.js

@@ -109,7 +109,7 @@ var euiFlexGridStyles = function euiFlexGridStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
     euiFlexGrid: _ref10,
-    responsive: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiBreakpoint)(euiThemeContext, ['xs', 's']), "{grid-template-columns:repeat(1, 1fr);grid-auto-flow:row;};label:responsive;"),
+    responsive: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiMaxBreakpoint)(euiThemeContext, 'm'), "{grid-template-columns:repeat(1, 1fr);grid-auto-flow:row;};label:responsive;"),
     direction: {
       row: /*#__PURE__*/(0, _react.css)(";label:row;"),
       column: /*#__PURE__*/(0, _react.css)("grid-auto-flow:column;grid-template-rows:repeat(", gridTemplateRows, ", 1fr);;label:column;")

package/optimize/lib/components/flex/flex_group.styles.js

@@ -168,7 +168,7 @@ var euiFlexGroupStyles = function euiFlexGroupStyles(euiThemeContext) {
   var euiTheme = euiThemeContext.euiTheme;
   return {
     euiFlexGroup: _ref17,
-    responsive: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiBreakpoint)(euiThemeContext, ['xs', 's']), "{flex-wrap:wrap;&>.euiFlexItem{", (0, _global_styling.logicalCSS)('width', '100%'), " flex-basis:100%;}};label:responsive;"),
+    responsive: /*#__PURE__*/(0, _react.css)((0, _global_styling.euiMaxBreakpoint)(euiThemeContext, 'm'), "{flex-wrap:wrap;&>.euiFlexItem{", (0, _global_styling.logicalCSS)('width', '100%'), " flex-basis:100%;}};label:responsive;"),
     wrap: _ref16,
     gutterSizes: {
       none: /*#__PURE__*/(0, _react.css)(";label:none;"),