@elastic/eui 67.0.0 → 67.1.0

package/es/components/search_bar/query/ast.js

@@ -543,6 +543,18 @@ export var _AST = /*#__PURE__*/function () {
         return !Is.isInstance(clause) || clause.flag !== flag;
       }));
     }
+  }, {
+    key: "removeIsClauses",
+    value: function removeIsClauses() {
+      return new _AST(this._clauses.filter(function (clause) {
+        return !Is.isInstance(clause);
+      }));
+    }
+  }, {
+    key: "removeAllClauses",
+    value: function removeAllClauses() {
+      return new _AST();
+    }
   }, {
     key: "getGroupClauses",
     value: function getGroupClauses() {

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

@@ -1,5 +1,7 @@
 function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
 
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -12,8 +14,6 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 /*
  * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
  * or more contributor license agreements. Licensed under the Elastic License
@@ -21,11 +21,11 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-import { printIso8601 } from './date_format';
-import { isDateValue, dateValue } from './date_value';
-import { AST } from './ast';
 import { isArray, isDateLike, isString } from '../../../services/predicate';
 import { keysOf } from '../../common';
+import { AST } from './ast';
+import { printIso8601 } from './date_format';
+import { dateValue, isDateValue } from './date_value';
 
 var processDateOperation = function processDateOperation(value, operator) {
   var granularity = value.granularity,
@@ -115,12 +115,17 @@ export var _fieldValuesToQuery = function _fieldValuesToQuery(field, operations,
           }
         });
 
-        if (_terms.length > 0) {
+        if (_terms.length > 1) {
+          queries.push({
+            bool: _defineProperty({}, andOr === 'and' ? 'must' : 'should', _toConsumableArray(_terms.map(function (value) {
+              return {
+                match: _defineProperty({}, field, value)
+              };
+            })))
+          });
+        } else if (_terms.length === 1) {
           queries.push({
-            match: _defineProperty({}, field, {
-              query: _terms.join(' '),
-              operator: andOr
-            })
+            match: _defineProperty({}, field, _terms[0])
           });
         }
 

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

@@ -44,6 +44,11 @@ export var Query = /*#__PURE__*/function () {
   }
 
   _createClass(Query, [{
+    key: "hasClauses",
+    value: function hasClauses() {
+      return this.ast.clauses.length > 0;
+    }
+  }, {
     key: "hasSimpleFieldClause",
     value: function hasSimpleFieldClause(field, value) {
       return this.ast.hasSimpleFieldClause(field, value);
@@ -103,6 +108,12 @@ export var Query = /*#__PURE__*/function () {
       var ast = this.ast.removeOrFieldClauses(field);
       return new Query(ast, this.syntax);
     }
+  }, {
+    key: "removeAllClauses",
+    value: function removeAllClauses() {
+      var ast = this.ast.removeAllClauses();
+      return new Query(ast, this.syntax);
+    }
   }, {
     key: "hasIsClause",
     value: function hasIsClause(flag) {
@@ -131,6 +142,12 @@ export var Query = /*#__PURE__*/function () {
       var ast = this.ast.removeIsClause(flag);
       return new Query(ast, this.syntax);
     }
+  }, {
+    key: "removeIsClauses",
+    value: function removeIsClauses() {
+      var ast = this.ast.removeIsClauses();
+      return new Query(ast, this.syntax);
+    }
     /**
      * Executes this query over the given iterable item and returns
      * an new array of all items that matched this query. Options:

package/es/components/search_bar/search_bar.js

@@ -412,6 +412,10 @@ EuiSearchBar.propTypes = {
       operator: PropTypes.oneOf(["eq", "exact", "gt", "gte", "lt", "lte"])
     }).isRequired).isRequired,
     available: PropTypes.func
+  }).isRequired, PropTypes.shape({
+    type: PropTypes.oneOf(["custom_component"]).isRequired,
+    component: PropTypes.elementType.isRequired,
+    available: PropTypes.func
   }).isRequired]).isRequired),
 
   /**

package/es/components/search_bar/search_filters.js

@@ -156,5 +156,9 @@ EuiSearchFilters.propTypes = {
       operator: PropTypes.oneOf(["eq", "exact", "gt", "gte", "lt", "lte"])
     }).isRequired).isRequired,
     available: PropTypes.func
+  }).isRequired, PropTypes.shape({
+    type: PropTypes.oneOf(["custom_component"]).isRequired,
+    component: PropTypes.elementType.isRequired,
+    available: PropTypes.func
   }).isRequired]).isRequired).isRequired
 };

package/es/components/selectable/selectable_list/selectable_list.js

@@ -438,12 +438,12 @@ EuiSelectableList.propTypes = {
     /**
        * The side of the badge the icon should sit
        */
-    iconSide: PropTypes.oneOf(["left", "right"]),
+    iconSide: PropTypes.any,
 
     /**
        * Accepts either our palette colors (primary, success ..etc) or a hex value `#FFFFFF`, `#000`.
        */
-    color: PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.any.isRequired]),
+    color: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.string.isRequired]),
 
     /**
        * Will override any color passed through the `color` prop.

package/es/components/selectable/selectable_list/selectable_list_item.js

@@ -272,12 +272,12 @@ EuiSelectableListItem.propTypes = {
     /**
        * The side of the badge the icon should sit
        */
-    iconSide: PropTypes.oneOf(["left", "right"]),
+    iconSide: PropTypes.any,
 
     /**
        * Accepts either our palette colors (primary, success ..etc) or a hex value `#FFFFFF`, `#000`.
        */
-    color: PropTypes.oneOfType([PropTypes.string.isRequired, PropTypes.any.isRequired]),
+    color: PropTypes.oneOfType([PropTypes.any.isRequired, PropTypes.string.isRequired]),
 
     /**
        * Will override any color passed through the `color` prop.

package/es/services/color/contrast.js

@@ -10,6 +10,8 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 import chroma from 'chroma-js';
 import { shade, tint, lightness as getLightness } from './manipulation';
 import { getOn } from '../theme/utils';
+export var wcagContrastMin = 4.5; // WCAG AA minimum contrast ratio for normal (non-large) text
+
 /**
  * Creates a new color that meets or exceeds WCAG level AA
  * @param foreground - Color to manipulate

package/es/services/index.js

@@ -11,7 +11,7 @@ export { keys };
 export { accessibleClickKeys, cascadingMenuKeys, comboBoxKeys, htmlIdGenerator, useGeneratedHtmlId } from './accessibility';
 export { LEFT_ALIGNMENT, RIGHT_ALIGNMENT, CENTER_ALIGNMENT } from './alignment';
 export { useIsWithinBreakpoints, useIsWithinMaxBreakpoint, useIsWithinMinBreakpoint, CurrentEuiBreakpointContext, CurrentEuiBreakpointProvider, useCurrentEuiBreakpoint } from './breakpoint';
-export { isColorDark, isValidHex, calculateContrast, calculateLuminance, hexToHsv, hexToRgb, hsvToHex, hsvToRgb, rgbToHex, rgbToHsv, VISUALIZATION_COLORS, DEFAULT_VISUALIZATION_COLOR, colorPalette, euiPaletteForLightBackground, euiPaletteForDarkBackground, euiPaletteColorBlind, euiPaletteColorBlindBehindText, euiPaletteForStatus, euiPaletteForTemperature, euiPaletteComplimentary, euiPaletteNegative, euiPalettePositive, euiPaletteCool, euiPaletteWarm, euiPaletteGray, getSteppedGradient, transparentize, tint, shade, tintOrShade, shadeOrTint, saturate, desaturate, lightness, makeHighContrastColor, makeDisabledContrastColor } from './color';
+export { isColorDark, isValidHex, calculateContrast, calculateLuminance, hexToHsv, hexToRgb, hsvToHex, hsvToRgb, rgbToHex, rgbToHsv, VISUALIZATION_COLORS, DEFAULT_VISUALIZATION_COLOR, colorPalette, euiPaletteForLightBackground, euiPaletteForDarkBackground, euiPaletteColorBlind, euiPaletteColorBlindBehindText, euiPaletteForStatus, euiPaletteForTemperature, euiPaletteComplimentary, euiPaletteNegative, euiPalettePositive, euiPaletteCool, euiPaletteWarm, euiPaletteGray, getSteppedGradient, transparentize, tint, shade, tintOrShade, shadeOrTint, saturate, desaturate, lightness, makeHighContrastColor, makeDisabledContrastColor, wcagContrastMin } from './color';
 export { useColorPickerState, useColorStopsState } from './color_picker';
 export * from './console';
 export { copyToClipboard } from './copy_to_clipboard';

package/es/services/theme/context.js

@@ -11,4 +11,5 @@ import { DEFAULT_COLOR_MODE, getComputed } from './utils';
 export var EuiSystemContext = /*#__PURE__*/createContext(EuiThemeAmsterdam);
 export var EuiModificationsContext = /*#__PURE__*/createContext({});
 export var EuiColorModeContext = /*#__PURE__*/createContext(DEFAULT_COLOR_MODE);
-export var EuiThemeContext = /*#__PURE__*/createContext(getComputed(EuiThemeAmsterdam, {}, DEFAULT_COLOR_MODE));
+export var defaultComputedTheme = getComputed(EuiThemeAmsterdam, {}, DEFAULT_COLOR_MODE);
+export var EuiThemeContext = /*#__PURE__*/createContext(defaultComputedTheme);

package/es/services/theme/hooks.js

@@ -8,12 +8,38 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
  * Side Public License, v 1.
  */
 import React, { forwardRef, useContext, useMemo } from 'react';
-import { EuiThemeContext, EuiModificationsContext, EuiColorModeContext } from './context';
+import { EuiThemeContext, EuiModificationsContext, EuiColorModeContext, defaultComputedTheme } from './context';
+import { getEuiDevProviderWarning } from './provider';
 import { jsx as ___EmotionJSX } from "@emotion/react";
+var providerMessage = "`EuiProvider` is missing which can result in negative effects.\nWrap your component in `EuiProvider`: https://ela.st/euiprovider.";
 export var useEuiTheme = function useEuiTheme() {
   var theme = useContext(EuiThemeContext);
   var colorMode = useContext(EuiColorModeContext);
   var modifications = useContext(EuiModificationsContext);
+
+  if (process.env.NODE_ENV !== 'production') {
+    var isFallback = theme === defaultComputedTheme;
+    var warningLevel = getEuiDevProviderWarning();
+
+    if (isFallback && typeof warningLevel !== 'undefined') {
+      switch (warningLevel) {
+        case 'log':
+          console.log(providerMessage);
+          break;
+
+        case 'warn':
+          console.warn(providerMessage);
+          break;
+
+        case 'error':
+          throw new Error(providerMessage);
+
+        default:
+          break;
+      }
+    }
+  }
+
   var assembledTheme = useMemo(function () {
     return {
       euiTheme: theme,

package/es/services/theme/index.js

@@ -7,6 +7,6 @@
  */
 export { EuiSystemContext, EuiThemeContext, EuiModificationsContext, EuiColorModeContext } from './context';
 export { useEuiTheme, withEuiTheme } from './hooks';
-export { EuiThemeProvider } from './provider';
+export { EuiThemeProvider, getEuiDevProviderWarning, setEuiDevProviderWarning } from './provider';
 export { buildTheme, computed, isInverseColorMode, getColorMode, getComputed, getOn, mergeDeep, setOn, Computed } from './utils';
 export { COLOR_MODES_STANDARD } from './types';

package/es/services/theme/provider.js

@@ -1,3 +1,9 @@
+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) { _defineProperty(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; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -22,6 +28,13 @@ import isEqual from 'lodash/isEqual';
 import { EuiSystemContext, EuiThemeContext, EuiModificationsContext, EuiColorModeContext } from './context';
 import { buildTheme, getColorMode, getComputed, mergeDeep } from './utils';
 import { jsx as ___EmotionJSX } from "@emotion/react";
+var providerWarning = undefined;
+export var setEuiDevProviderWarning = function setEuiDevProviderWarning(level) {
+  return providerWarning = level;
+};
+export var getEuiDevProviderWarning = function getEuiDevProviderWarning() {
+  return providerWarning;
+};
 export var EuiThemeProvider = function EuiThemeProvider(_ref) {
   var _system = _ref.theme,
       _colorMode = _ref.colorMode,
@@ -54,7 +67,8 @@ export var EuiThemeProvider = function EuiThemeProvider(_ref) {
   var prevColorMode = useRef(colorMode);
   var isParentTheme = useRef(prevSystemKey.current === parentSystem.key && colorMode === parentColorMode && isEqual(parentModifications, modifications));
 
-  var _useState7 = useState(isParentTheme.current && Object.keys(parentTheme).length ? parentTheme : getComputed(system, buildTheme(modifications, "_".concat(system.key)), colorMode)),
+  var _useState7 = useState(isParentTheme.current && Object.keys(parentTheme).length ? _objectSpread({}, parentTheme) // Intentionally create a new object to break referential equality
+  : getComputed(system, buildTheme(modifications, "_".concat(system.key)), colorMode)),
       _useState8 = _slicedToArray(_useState7, 2),
       theme = _useState8[0],
       setTheme = _useState8[1];

package/eui.d.ts

@@ -1886,7 +1886,7 @@ declare module '@elastic/eui/src/themes/amsterdam/global_styling/mixins/button'
 declare module '@elastic/eui/src/components/button/button_display/_button_display.styles' {
 	import { UseEuiTheme } from '@elastic/eui/src/services';
 	export const euiButtonBaseCSS: () => string;
-	export const euiButtonDisplayStyles: (euiThemeContext: UseEuiTheme, minWidth: string) => {
+	export const euiButtonDisplayStyles: (euiThemeContext: UseEuiTheme) => {
 	    euiButtonDisplay: import("@emotion/utils").SerializedStyles;
 	    isDisabled: import("@emotion/utils").SerializedStyles;
 	    fullWidth: import("@emotion/utils").SerializedStyles;
@@ -1904,6 +1904,8 @@ declare module '@elastic/eui/src/components/button/button_display/_button_displa
 	    right: import("@emotion/utils").SerializedStyles;
 	    euiButtonDisplayContent__spinner: import("@emotion/utils").SerializedStyles;
 	    euiButtonDisplayContent__icon: import("@emotion/utils").SerializedStyles;
+	    s: import("@emotion/utils").SerializedStyles;
+	    m: import("@emotion/utils").SerializedStyles;
 	};
 
 }
@@ -1911,7 +1913,10 @@ declare module '@elastic/eui/src/components/button/button_display/_button_displa
 	import { HTMLAttributes, FunctionComponent, Ref } from 'react';
 	import { CommonProps } from '@elastic/eui/src/components/common';
 	import { IconType } from '@elastic/eui/src/components/icon';
-	export type ButtonContentIconSide = 'left' | 'right' | undefined;
+	export const ICON_SIZES: readonly ["s", "m"];
+	export type ButtonContentIconSize = typeof ICON_SIZES[number];
+	export const ICON_SIDES: readonly ["left", "right"];
+	export type ButtonContentIconSide = typeof ICON_SIDES[number] | undefined;
 	export type EuiButtonDisplayContentType = HTMLAttributes<HTMLSpanElement>;
 	/**
 	 * *INTERNAL ONLY*
@@ -1934,7 +1939,7 @@ declare module '@elastic/eui/src/components/button/button_display/_button_displa
 	        ref?: Ref<HTMLSpanElement>;
 	        'data-text'?: string;
 	    };
-	    iconSize?: 's' | 'm';
+	    iconSize?: ButtonContentIconSize;
 	    isDisabled?: boolean;
 	}
 	export const EuiButtonDisplayContent: FunctionComponent<EuiButtonDisplayContentType & EuiButtonDisplayContentProps>;
@@ -4645,10 +4650,17 @@ declare module '@elastic/eui/src/components/popover/input_popover' {
 
 }
 declare module '@elastic/eui/src/components/popover/popover_title.styles' {
-	import { EuiPaddingSize } from '@elastic/eui/src/global_styling';
 	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiPopoverTitleStyles: (euiThemeContext: UseEuiTheme, panelPadding: EuiPaddingSize) => {
+	export const euiPopoverTitleStyles: (euiThemeContext: UseEuiTheme) => {
 	    euiPopoverTitle: import("@emotion/utils").SerializedStyles;
+	    panelPaddingSizes: {
+	        none: import("@emotion/utils").SerializedStyles;
+	        xs: import("@emotion/utils").SerializedStyles;
+	        s: import("@emotion/utils").SerializedStyles;
+	        m: import("@emotion/utils").SerializedStyles;
+	        l: import("@emotion/utils").SerializedStyles;
+	        xl: import("@emotion/utils").SerializedStyles;
+	    };
 	};
 
 }
@@ -6178,6 +6190,7 @@ declare module '@elastic/eui/src/services/color/manipulation' {
 
 }
 declare module '@elastic/eui/src/services/color/contrast' {
+	export const wcagContrastMin = 4.5;
 	/**
 	 * Creates a new color that meets or exceeds WCAG level AA
 	 * @param foreground - Color to manipulate
@@ -6422,6 +6435,21 @@ declare module '@elastic/eui/src/global_styling/functions/size' {
 	    base: number;
 	}) => string;
 
+}
+declare module '@elastic/eui/src/services/theme/provider' {
+	import React, { PropsWithChildren } from 'react';
+	import { EuiThemeColorMode, EuiThemeSystem, EuiThemeModifications } from '@elastic/eui/src/services/theme/types'; type LEVELS = 'log' | 'warn' | 'error';
+	export const setEuiDevProviderWarning: (level: LEVELS) => LEVELS;
+	export const getEuiDevProviderWarning: () => LEVELS | undefined;
+	export interface EuiThemeProviderProps<T> {
+	    theme?: EuiThemeSystem<T>;
+	    colorMode?: EuiThemeColorMode;
+	    modify?: EuiThemeModifications<T>;
+	    children: any;
+	}
+	export const EuiThemeProvider: <T extends {} = {}>({ theme: _system, colorMode: _colorMode, modify: _modifications, children, }: React.PropsWithChildren<EuiThemeProviderProps<T>>) => JSX.Element;
+	export {};
+
 }
 declare module '@elastic/eui/src/services/theme/hooks' {
 	import React from 'react';
@@ -6432,7 +6460,7 @@ declare module '@elastic/eui/src/services/theme/hooks' {
 	    modifications: EuiThemeModifications<T>;
 	}
 	export const useEuiTheme: <T extends {} = {}>() => UseEuiTheme<T>;
-	export interface WithEuiThemeProps<P = {}> {
+	export interface WithEuiThemeProps<P extends {} = {}> {
 	    theme: UseEuiTheme<P>;
 	}
 	export const withEuiTheme: <T extends {} = {}, U extends {} = {}>(Component: React.ComponentType<T & WithEuiThemeProps<U>>) => React.ForwardRefExoticComponent<React.PropsWithoutRef<Omit<T, "theme">> & React.RefAttributes<Omit<T, "theme">>>;
@@ -6535,27 +6563,16 @@ declare module '@elastic/eui/src/services/theme/context' {
 	export const EuiSystemContext: import("react").Context<EuiThemeSystem<{}>>;
 	export const EuiModificationsContext: import("react").Context<import ("@elastic/eui").RecursivePartial<import ("@elastic/eui/src/services/theme/types").EuiThemeShape>>;
 	export const EuiColorModeContext: import("react").Context<EuiThemeColorModeStandard>;
+	export const defaultComputedTheme: EuiThemeComputed<import ("@elastic/eui/src/services/theme/types").EuiThemeShape>;
 	export const EuiThemeContext: import("react").Context<EuiThemeComputed<{}>>;
 
-}
-declare module '@elastic/eui/src/services/theme/provider' {
-	import React, { PropsWithChildren } from 'react';
-	import { EuiThemeColorMode, EuiThemeSystem, EuiThemeModifications } from '@elastic/eui/src/services/theme/types';
-	export interface EuiThemeProviderProps<T> {
-	    theme?: EuiThemeSystem<T>;
-	    colorMode?: EuiThemeColorMode;
-	    modify?: EuiThemeModifications<T>;
-	    children: any;
-	}
-	export const EuiThemeProvider: <T extends {} = {}>({ theme: _system, colorMode: _colorMode, modify: _modifications, children, }: React.PropsWithChildren<EuiThemeProviderProps<T>>) => JSX.Element;
-
 }
 declare module '@elastic/eui/src/services/theme' {
 	export { EuiSystemContext, EuiThemeContext, EuiModificationsContext, EuiColorModeContext, } from '@elastic/eui/src/services/theme/context';
 	export type { UseEuiTheme, WithEuiThemeProps } from '@elastic/eui/src/services/theme/hooks';
 	export { useEuiTheme, withEuiTheme } from '@elastic/eui/src/services/theme/hooks';
 	export type { EuiThemeProviderProps } from '@elastic/eui/src/services/theme/provider';
-	export { EuiThemeProvider } from '@elastic/eui/src/services/theme/provider';
+	export { EuiThemeProvider, getEuiDevProviderWarning, setEuiDevProviderWarning, } from '@elastic/eui/src/services/theme/provider';
 	export { buildTheme, computed, isInverseColorMode, getColorMode, getComputed, getOn, mergeDeep, setOn, Computed, } from '@elastic/eui/src/services/theme/utils';
 	export type { ComputedThemeShape, EuiThemeColorMode, EuiThemeColorModeStandard, EuiThemeComputed, EuiThemeModifications, EuiThemeShape, EuiThemeSystem, } from '@elastic/eui/src/services/theme/types';
 	export { COLOR_MODES_STANDARD } from '@elastic/eui/src/services/theme/types';
@@ -7073,7 +7090,7 @@ declare module '@elastic/eui/src/services' {
 	export type { EuiBreakpointSize } from '@elastic/eui/src/services/breakpoint';
 	export { useIsWithinBreakpoints, useIsWithinMaxBreakpoint, useIsWithinMinBreakpoint, CurrentEuiBreakpointContext, CurrentEuiBreakpointProvider, useCurrentEuiBreakpoint, } from '@elastic/eui/src/services/breakpoint';
 	export type { HSV } from '@elastic/eui/src/services/color';
-	export { isColorDark, isValidHex, calculateContrast, calculateLuminance, hexToHsv, hexToRgb, hsvToHex, hsvToRgb, rgbToHex, rgbToHsv, VISUALIZATION_COLORS, DEFAULT_VISUALIZATION_COLOR, colorPalette, euiPaletteForLightBackground, euiPaletteForDarkBackground, euiPaletteColorBlind, euiPaletteColorBlindBehindText, euiPaletteForStatus, euiPaletteForTemperature, euiPaletteComplimentary, euiPaletteNegative, euiPalettePositive, euiPaletteCool, euiPaletteWarm, euiPaletteGray, getSteppedGradient, transparentize, tint, shade, tintOrShade, shadeOrTint, saturate, desaturate, lightness, makeHighContrastColor, makeDisabledContrastColor, } from '@elastic/eui/src/services/color';
+	export { isColorDark, isValidHex, calculateContrast, calculateLuminance, hexToHsv, hexToRgb, hsvToHex, hsvToRgb, rgbToHex, rgbToHsv, VISUALIZATION_COLORS, DEFAULT_VISUALIZATION_COLOR, colorPalette, euiPaletteForLightBackground, euiPaletteForDarkBackground, euiPaletteColorBlind, euiPaletteColorBlindBehindText, euiPaletteForStatus, euiPaletteForTemperature, euiPaletteComplimentary, euiPaletteNegative, euiPalettePositive, euiPaletteCool, euiPaletteWarm, euiPaletteGray, getSteppedGradient, transparentize, tint, shade, tintOrShade, shadeOrTint, saturate, desaturate, lightness, makeHighContrastColor, makeDisabledContrastColor, wcagContrastMin, } from '@elastic/eui/src/services/color';
 	export type { EuiSetColorMethod } from '@elastic/eui/src/services/color_picker';
 	export { useColorPickerState, useColorStopsState } from '@elastic/eui/src/services/color_picker';
 	export * from '@elastic/eui/src/services/console';
@@ -7699,11 +7716,39 @@ declare module '@elastic/eui/src/components/avatar' {
 	export type { EuiAvatarProps } from '@elastic/eui/src/components/avatar/avatar';
 	export { EuiAvatar, checkValidColor } from '@elastic/eui/src/components/avatar/avatar';
 
+}
+declare module '@elastic/eui/src/components/badge/badge.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiBadgeStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiBadge: import("@emotion/utils").SerializedStyles;
+	    clickable: import("@emotion/utils").SerializedStyles;
+	    disabled: import("@emotion/utils").SerializedStyles;
+	    hollow: import("@emotion/utils").SerializedStyles;
+	    euiBadge__content: import("@emotion/utils").SerializedStyles;
+	    text: {
+	        euiBadge__text: import("@emotion/utils").SerializedStyles;
+	        clickable: import("@emotion/utils").SerializedStyles;
+	    };
+	    icon: {
+	        euiBadge__icon: import("@emotion/utils").SerializedStyles;
+	        right: import("@emotion/utils").SerializedStyles;
+	        left: import("@emotion/utils").SerializedStyles;
+	    };
+	    iconButton: {
+	        euiBadge__iconButton: import("@emotion/utils").SerializedStyles;
+	        right: import("@emotion/utils").SerializedStyles;
+	        left: import("@emotion/utils").SerializedStyles;
+	    };
+	    euiBadge__childButton: import("@emotion/utils").SerializedStyles;
+	};
+
 }
 declare module '@elastic/eui/src/components/badge/badge' {
 	import { AriaAttributes, FunctionComponent, HTMLAttributes, MouseEventHandler } from 'react';
 	import { CommonProps, ExclusiveUnion, PropsOf } from '@elastic/eui/src/components/common';
-	import { EuiIcon, IconColor, IconType } from '@elastic/eui/src/components/icon'; type IconSide = 'left' | 'right'; type WithButtonProps = {
+	import { EuiIcon, IconType } from '@elastic/eui/src/components/icon';
+	export const ICON_SIDES: readonly ["left", "right"]; type IconSide = typeof ICON_SIDES[number];
+	export const COLORS: readonly ["default", "hollow", "primary", "success", "accent", "warning", "danger"]; type BadgeColor = typeof COLORS[number]; type WithButtonProps = {
 	    /**
 	     * Will apply an onclick to the badge itself
 	     */
@@ -7739,7 +7784,7 @@ declare module '@elastic/eui/src/components/badge/badge' {
 	    /**
 	     * Accepts either our palette colors (primary, success ..etc) or a hex value `#FFFFFF`, `#000`.
 	     */
-	    color?: IconColor;
+	    color?: BadgeColor | string;
 	    /**
 	     * Will override any color passed through the `color` prop.
 	     */
@@ -7749,8 +7794,6 @@ declare module '@elastic/eui/src/components/badge/badge' {
 	     */
 	    closeButtonProps?: Partial<PropsOf<typeof EuiIcon>>;
 	} & CommonProps & ExclusiveUnion<WithIconOnClick, {}> & ExclusiveUnion<ExclusiveUnion<WithButtonProps, WithAnchorProps>, WithSpanProps>;
-	export const COLORS: string[];
-	export const ICON_SIDES: IconSide[];
 	export const EuiBadge: FunctionComponent<EuiBadgeProps>;
 	export {};
 
@@ -8209,7 +8252,7 @@ declare module '@elastic/eui/src/components/card/card.styles' {
 	 * 3. Horizontal layouts should always top left align no matter the textAlign prop
 	 * 4. Ensures the contents always stretch no matter the flex layout
 	 */
-	export const euiCardStyles: (euiThemeContext: UseEuiTheme, paddingSize: EuiCardProps['paddingSize'], color: EuiCardProps['display']) => {
+	export const euiCardStyles: (euiThemeContext: UseEuiTheme, paddingSize: EuiCardProps['paddingSize']) => {
 	    card: {
 	        euiCard: import("@emotion/utils").SerializedStyles;
 	        aligned: {
@@ -8241,7 +8284,10 @@ declare module '@elastic/eui/src/components/card/card.styles' {
 	        };
 	        disabled: import("@emotion/utils").SerializedStyles;
 	    };
-	    euiCard__image: import("@emotion/utils").SerializedStyles;
+	    image: {
+	        euiCard__image: import("@emotion/utils").SerializedStyles;
+	        transparent: import("@emotion/utils").SerializedStyles;
+	    };
 	    icon: {
 	        euiCard__icon: import("@emotion/utils").SerializedStyles;
 	        withImage: import("@emotion/utils").SerializedStyles;
@@ -16186,6 +16232,8 @@ declare module '@elastic/eui/src/components/search_bar/query/ast' {
 	    getIsClauses(): IsClause[];
 	    getIsClause(flag: string): IsClause;
 	    removeIsClause(flag: string): _AST;
+	    removeIsClauses(): _AST;
+	    removeAllClauses(): _AST;
 	    getGroupClauses(): GroupClause[];
 	    /**
 	     * Creates and returns a new AST with the given clause added to the current clauses. If
@@ -16429,7 +16477,7 @@ declare module '@elastic/eui/src/components/search_bar/query/execute_ast' {
 
 }
 declare module '@elastic/eui/src/components/search_bar/query/ast_to_es_query_dsl' {
-	import { _AST, OperatorType, Value } from '@elastic/eui/src/components/search_bar/query/ast';
+	import { OperatorType, Value, _AST } from '@elastic/eui/src/components/search_bar/query/ast';
 	export interface QueryContainer {
 	    bool?: BoolQuery;
 	    match_all?: {};
@@ -16498,6 +16546,7 @@ declare module '@elastic/eui/src/components/search_bar/query/query' {
 	    text: string;
 	    private syntax;
 	    constructor(ast: _AST, syntax?: Syntax, text?: string);
+	    hasClauses(): boolean;
 	    hasSimpleFieldClause(field: string, value?: string): boolean;
 	    getSimpleFieldClause(field: string, value?: Value): import ("@elastic/eui/src/components/search_bar/query/ast").FieldClause | undefined;
 	    removeSimpleFieldClauses(field: string): Query;
@@ -16508,11 +16557,13 @@ declare module '@elastic/eui/src/components/search_bar/query/query' {
 	    addOrFieldValue(field: string, value: Value, must?: boolean, operator?: OperatorType): Query;
 	    removeOrFieldValue(field: string, value: Value): Query;
 	    removeOrFieldClauses(field: string): Query;
+	    removeAllClauses(): Query;
 	    hasIsClause(flag: string): boolean;
 	    getIsClause(flag: string): import ("@elastic/eui/src/components/search_bar/query/ast").IsClause;
 	    addMustIsClause(flag: string): Query;
 	    addMustNotIsClause(flag: string): Query;
 	    removeIsClause(flag: string): Query;
+	    removeIsClauses(): Query;
 	    /**
 	     * Executes this query over the given iterable item and returns
 	     * an new array of all items that matched this query. Options:
@@ -17289,6 +17340,30 @@ declare module '@elastic/eui/src/components/search_bar/filters/field_value_toggl
 	    render(): JSX.Element[];
 	}
 
+}
+declare module '@elastic/eui/src/components/search_bar/filters/custom_component_filter' {
+	import React, { FC } from 'react';
+	import { Query } from '@elastic/eui/src/components/search_bar/query';
+	/**
+	 * The props that are passed down to the custom component
+	 */
+	export interface CustomComponentProps {
+	    query: Query;
+	    onChange?: (query: Query) => void;
+	}
+	export interface CustomComponentFilterConfigType<T extends CustomComponentProps = CustomComponentProps> {
+	    type: 'custom_component';
+	    component: React.ComponentType<T>;
+	    available?: () => boolean;
+	}
+	export interface CustomComponentFilterProps<T extends CustomComponentProps = CustomComponentProps> {
+	    index: number;
+	    config: CustomComponentFilterConfigType<T>;
+	    query: Query;
+	    onChange?: (query: Query) => void;
+	}
+	export const CustomComponentFilter: FC<CustomComponentFilterProps>;
+
 }
 declare module '@elastic/eui/src/components/search_bar/filters/filters' {
 	
@@ -17296,9 +17371,10 @@ declare module '@elastic/eui/src/components/search_bar/filters/filters' {
 	import { FieldValueSelectionFilterConfigType } from '@elastic/eui/src/components/search_bar/filters/field_value_selection_filter';
 	import { FieldValueToggleFilterConfigType } from '@elastic/eui/src/components/search_bar/filters/field_value_toggle_filter';
 	import { FieldValueToggleGroupFilterConfigType } from '@elastic/eui/src/components/search_bar/filters/field_value_toggle_group_filter';
+	import { CustomComponentFilterConfigType } from '@elastic/eui/src/components/search_bar/filters/custom_component_filter';
 	import { Query } from '@elastic/eui/src/components/search_bar/query';
 	export const createFilter: (index: number, config: SearchFilterConfig, query: Query, onChange: (query: Query) => void) => JSX.Element;
-	export type SearchFilterConfig = IsFilterConfigType | FieldValueSelectionFilterConfigType | FieldValueToggleFilterConfigType | FieldValueToggleGroupFilterConfigType;
+	export type SearchFilterConfig = IsFilterConfigType | FieldValueSelectionFilterConfigType | FieldValueToggleFilterConfigType | FieldValueToggleGroupFilterConfigType | CustomComponentFilterConfigType;
 
 }
 declare module '@elastic/eui/src/components/search_bar/filters' {