@elastic/eui 63.0.1 → 64.0.0

package/eui.d.ts

@@ -189,13 +189,21 @@ declare module '@elastic/eui/src/services/alignment' {
 	export const CENTER_ALIGNMENT = "center";
 	export type HorizontalAlignment = 'left' | 'right' | 'center';
 
+}
+declare module '@elastic/eui/src/global_styling/variables/breakpoint' {
+	export const EuiThemeBreakpoints: readonly ["xs", "s", "m", "l", "xl"];
+	export type _EuiThemeBreakpoint = string;
+	export type _EuiThemeBreakpoints = Record<_EuiThemeBreakpoint, number>;
+
 }
 declare module '@elastic/eui/src/components/common' {
 	import { AnchorHTMLAttributes, ButtonHTMLAttributes, ComponentProps, Component, FunctionComponent, JSXElementConstructor, MouseEventHandler, SFC } from 'react';
+	import { Interpolation, Theme } from '@emotion/react';
 	export interface CommonProps {
 	    className?: string;
 	    'aria-label'?: string;
 	    'data-test-subj'?: string;
+	    css?: Interpolation<Theme>;
 	}
 	export type NoArgCallback<T> = () => T;
 	export const assertNever: (x: never) => never;
@@ -300,14 +308,6 @@ declare module '@elastic/eui/src/components/common' {
 	}; type NonAny = number | boolean | string | symbol | null;
 	export {};
 
-}
-declare module '@elastic/eui/src/global_styling/variables/breakpoint' {
-	export const EuiThemeBreakpoints: readonly ["xs", "s", "m", "l", "xl"];
-	export type _EuiThemeBreakpoint = typeof EuiThemeBreakpoints[number];
-	export type _EuiThemeBreakpoints = {
-	    [key in _EuiThemeBreakpoint]: number;
-	};
-
 }
 declare module '@elastic/eui/src/global_styling/variables/animations' {
 	import { CSSProperties } from 'react';
@@ -335,6 +335,62 @@ declare module '@elastic/eui/src/global_styling/variables/animations' {
 	export type _EuiThemeAnimationEasings = Record<_EuiThemeAnimationEasing, CSSProperties['animationTimingFunction']>;
 	export type _EuiThemeAnimation = _EuiThemeAnimationEasings & _EuiThemeAnimationSpeeds;
 
+}
+declare module '@elastic/eui/src/global_styling/variables/borders' {
+	import { CSSProperties } from 'react';
+	import { ColorModeSwitch } from '@elastic/eui/src/services/theme/types';
+	export interface _EuiThemeBorderWidthValues {
+	    /**
+	     * Thinnest width for border
+	     */
+	    thin: CSSProperties['borderWidth'];
+	    /**
+	     * Thickest width for border
+	     */
+	    thick: CSSProperties['borderWidth'];
+	}
+	export interface _EuiThemeBorderRadiusValues {
+	    /**
+	     * Primary corner radius size
+	     */
+	    medium: CSSProperties['borderRadius'];
+	    /**
+	     * Small corner radius size
+	     */
+	    small: CSSProperties['borderRadius'];
+	}
+	export interface _EuiThemeBorderColorValues {
+	    /**
+	     * Color for all borders; Default is `colors.lightShade`
+	     */
+	    color: ColorModeSwitch;
+	}
+	export interface _EuiThemeBorderValues extends _EuiThemeBorderColorValues {
+	    /**
+	     * Varied thicknesses for borders
+	     */
+	    width: _EuiThemeBorderWidthValues;
+	    /**
+	     * Varied border radii
+	     */
+	    radius: _EuiThemeBorderRadiusValues;
+	}
+	export interface _EuiThemeBorderTypes {
+	    /**
+	     * Full `border` property string computed using `border.width.thin` and `border.color`
+	     */
+	    thin: CSSProperties['border'];
+	    /**
+	     * Full `border` property string computed using `border.width.thick` and `border.color`
+	     */
+	    thick: CSSProperties['border'];
+	    /**
+	     * Full editable style `border` property string computed using `border.width.thick` and `border.color`
+	     */
+	    editable: CSSProperties['border'];
+	}
+	export type _EuiThemeBorder = _EuiThemeBorderValues & _EuiThemeBorderTypes;
+
 }
 declare module '@elastic/eui/src/global_styling/variables/colors' {
 	import { ColorModeSwitch, StrictColorModeSwitch } from '@elastic/eui/src/services/theme/types';
@@ -649,143 +705,6 @@ declare module '@elastic/eui/src/services/theme/types' {
 	    themeName: string;
 	};
 
-}
-declare module '@elastic/eui/src/global_styling/variables/borders' {
-	import { CSSProperties } from 'react';
-	import { ColorModeSwitch } from '@elastic/eui/src/services/theme/types';
-	export interface _EuiThemeBorderWidthValues {
-	    /**
-	     * Thinnest width for border
-	     */
-	    thin: CSSProperties['borderWidth'];
-	    /**
-	     * Thickest width for border
-	     */
-	    thick: CSSProperties['borderWidth'];
-	}
-	export interface _EuiThemeBorderRadiusValues {
-	    /**
-	     * Primary corner radius size
-	     */
-	    medium: CSSProperties['borderRadius'];
-	    /**
-	     * Small corner radius size
-	     */
-	    small: CSSProperties['borderRadius'];
-	}
-	export interface _EuiThemeBorderColorValues {
-	    /**
-	     * Color for all borders; Default is `colors.lightShade`
-	     */
-	    color: ColorModeSwitch;
-	}
-	export interface _EuiThemeBorderValues extends _EuiThemeBorderColorValues {
-	    /**
-	     * Varied thicknesses for borders
-	     */
-	    width: _EuiThemeBorderWidthValues;
-	    /**
-	     * Varied border radii
-	     */
-	    radius: _EuiThemeBorderRadiusValues;
-	}
-	export interface _EuiThemeBorderTypes {
-	    /**
-	     * Full `border` property string computed using `border.width.thin` and `border.color`
-	     */
-	    thin: CSSProperties['border'];
-	    /**
-	     * Full `border` property string computed using `border.width.thick` and `border.color`
-	     */
-	    thick: CSSProperties['border'];
-	    /**
-	     * Full editable style `border` property string computed using `border.width.thick` and `border.color`
-	     */
-	    editable: CSSProperties['border'];
-	}
-	export type _EuiThemeBorder = _EuiThemeBorderValues & _EuiThemeBorderTypes;
-
-}
-declare module '@elastic/eui/src/global_styling/variables/shadow' {
-	export const EuiThemeShadowSizes: readonly ["xs", "s", "m", "l", "xl"];
-	export type _EuiThemeShadowSize = typeof EuiThemeShadowSizes[number];
-	/**
-	 * Shadow t-shirt sizes descriptions
-	 */
-	export const _EuiShadowSizesDescriptions: Record<_EuiThemeShadowSize, string>;
-	export interface _EuiThemeShadowCustomColor {
-	    color?: string;
-	    property?: 'box-shadow' | 'filter';
-	}
-
-}
-declare module '@elastic/eui/src/global_styling/variables' {
-	export * from '@elastic/eui/src/global_styling/variables/animations';
-	export * from '@elastic/eui/src/global_styling/variables/borders';
-	export * from '@elastic/eui/src/global_styling/variables/breakpoint';
-	export * from '@elastic/eui/src/global_styling/variables/colors';
-	export * from '@elastic/eui/src/global_styling/variables/levels';
-	export * from '@elastic/eui/src/global_styling/variables/size';
-	export * from '@elastic/eui/src/global_styling/variables/shadow';
-	export * from '@elastic/eui/src/global_styling/variables/states';
-	export * from '@elastic/eui/src/global_styling/variables/typography';
-
-}
-declare module '@elastic/eui/src/themes/amsterdam/global_styling/variables/_breakpoint' {
-	import { _EuiThemeBreakpoints } from '@elastic/eui/src/global_styling/variables';
-	export const breakpoint: _EuiThemeBreakpoints;
-
-}
-declare module '@elastic/eui/src/services/breakpoint/breakpoint' {
-	import { _EuiThemeBreakpoint, _EuiThemeBreakpoints } from '@elastic/eui/src/global_styling/variables/breakpoint';
-	export type EuiBreakpointSize = _EuiThemeBreakpoint;
-	export type EuiBreakpoints = _EuiThemeBreakpoints;
-	export const BREAKPOINTS: _EuiThemeBreakpoints;
-	export const BREAKPOINT_KEYS: ("s" | "xs" | "m" | "l" | "xl")[];
-	/**
-	 * Given the current `width` and an object of `EuiBreakpoints`,
-	 * this function returns the string that is the name of the breakpoint key
-	 * that is less than or equal to the width
-	 *
-	 * @param {number} width Can either be the full window width or any width
-	 * @param {EuiBreakpoints} breakpoints An object with keys for sizing and values for minimum width
-	 * @returns {string | undefined} Name of the breakpoint key or `undefined` if a key doesn't exist
-	 */
-	export function getBreakpoint(width: number, breakpoints?: EuiBreakpoints): EuiBreakpointSize | undefined;
-	/**
-	 * Given the current `width` and a max breakpoint key,
-	 * this function returns true or false if the `width` falls within the max
-	 * breakpoint or any breakpoints below
-	 *
-	 * @param {number} width Can either be the full window width or any width
-	 * @param {EuiBreakpointSize | number} max The named breakpoint or custom number to check against
-	 * @param {EuiBreakpoints} breakpoints An object with keys for sizing and values for minimum width
-	 * @returns {boolean} Will return `false` if it can't find a value for the `max` breakpoint
-	 */
-	export function isWithinMaxBreakpoint(width: number, max: EuiBreakpointSize | number, breakpoints?: EuiBreakpoints): boolean;
-	/**
-	 * Given the current `width` and a min breakpoint key,
-	 * this function returns true or false if the `width` falls within the min
-	 * breakpoint or any breakpoints above
-	 *
-	 * @param {number} width Can either be the full window width or any width
-	 * @param {EuiBreakpointSize | number} min The named breakpoint or custom number to check against
-	 * @param {EuiBreakpoints} breakpoints An object with keys for sizing and values for minimum width
-	 * @returns {boolean} Will return `false` if it can't find a value for the `min` breakpoint
-	 */
-	export function isWithinMinBreakpoint(width: number, min: EuiBreakpointSize | number, breakpoints?: EuiBreakpoints): boolean;
-	/**
-	 * Given the current `width` and an array of breakpoint keys,
-	 * this function returns true or false if the `width` falls within
-	 * any of the named breakpoints
-	 *
-	 * @param {number} width Can either be the full window width or any width
-	 * @param {EuiBreakpointSize[]} sizes An array of named breakpoints
-	 * @param {EuiBreakpoints} breakpoints An object with keys for sizing and values for minimum width
-	 * @returns {boolean} Returns `true` if current breakpoint name is included in `sizes`
-	 */
-	export function isWithinBreakpoints(width: number, sizes: EuiBreakpointSize[], breakpoints?: EuiBreakpoints): boolean;
-
 }
 declare module '@elastic/eui/src/services/theme/utils' {
 	import { EuiThemeColorMode, EuiThemeColorModeStandard, EuiThemeSystem, EuiThemeShape, EuiThemeComputed } from '@elastic/eui/src/services/theme/types';
@@ -1840,7 +1759,7 @@ declare module '@elastic/eui/src/global_styling/functions/typography' {
 	 * this mixin will ensure that the sizing is dependent on the boldest
 	 * weight so it doesn't shift sibling content.
 	 */
-	export const euiTextShift: (fontWeight: "bold" | "light" | "regular" | "medium" | "semiBold" | undefined, attribute: string | undefined, euiTheme: UseEuiTheme['euiTheme']) => string;
+	export const euiTextShift: (fontWeight: "bold" | "medium" | "light" | "regular" | "semiBold" | undefined, attribute: string | undefined, euiTheme: UseEuiTheme['euiTheme']) => string;
 
 }
 declare module '@elastic/eui/src/global_styling/functions' {
@@ -1912,18 +1831,55 @@ declare module '@elastic/eui/src/global_styling/mixins/_typography' {
 	export const euiNumberFormat: ({ euiTheme }: UseEuiTheme) => string;
 	export const useEuiNumberFormat: () => string;
 
+}
+declare module '@elastic/eui/src/services/breakpoint/_sorting' {
+	import { _EuiThemeBreakpoints } from '@elastic/eui/src/global_styling/variables/breakpoint';
+	export const sortMapByLargeToSmallValues: (breakpointsMap: _EuiThemeBreakpoints) => {
+	    [k: string]: number;
+	};
+	export const sortMapBySmallToLargeValues: (breakpointsMap: _EuiThemeBreakpoints) => {
+	    [k: string]: number;
+	};
+
+}
+declare module '@elastic/eui/src/global_styling/variables/shadow' {
+	export const EuiThemeShadowSizes: readonly ["xs", "s", "m", "l", "xl"];
+	export type _EuiThemeShadowSize = typeof EuiThemeShadowSizes[number];
+	/**
+	 * Shadow t-shirt sizes descriptions
+	 */
+	export const _EuiShadowSizesDescriptions: Record<_EuiThemeShadowSize, string>;
+	export interface _EuiThemeShadowCustomColor {
+	    color?: string;
+	    property?: 'box-shadow' | 'filter';
+	}
+
+}
+declare module '@elastic/eui/src/global_styling/variables' {
+	export * from '@elastic/eui/src/global_styling/variables/animations';
+	export * from '@elastic/eui/src/global_styling/variables/borders';
+	export * from '@elastic/eui/src/global_styling/variables/breakpoint';
+	export * from '@elastic/eui/src/global_styling/variables/colors';
+	export * from '@elastic/eui/src/global_styling/variables/levels';
+	export * from '@elastic/eui/src/global_styling/variables/size';
+	export * from '@elastic/eui/src/global_styling/variables/shadow';
+	export * from '@elastic/eui/src/global_styling/variables/states';
+	export * from '@elastic/eui/src/global_styling/variables/typography';
+
 }
 declare module '@elastic/eui/src/global_styling/mixins/_responsive' {
 	import { UseEuiTheme } from '@elastic/eui/src/services/theme/hooks';
 	import { _EuiThemeBreakpoint } from '@elastic/eui/src/global_styling/variables';
 	/**
 	 * Generates a CSS media query rule string based on the input breakpoint ranges.
-	 * Examples:
+	 * Examples with default theme breakpoints:
+	 *
 	 * euiBreakpoint(['s']) becomes `@media only screen and (min-width: 575px) and (max-width: 767px)`
 	 * euiBreakpoint(['s', 'l']) becomes `@media only screen and (min-width: 575px) and (max-width: 1199px)`
 	 *
-	 * Use the `xs` and `xl` sizes to generate media queries with only min/max-width.
-	 * Examples:
+	 * Use the smallest and largest sizes to generate media queries with only min/max-width.
+	 * Examples with default theme breakpoints:
+	 *
 	 * euiBreakpoint(['xs', 'm']) becomes `@media only screen and (max-width: 991px)`
 	 * euiBreakpoint(['l', 'xl']) becomes `@media only screen and (min-width: 992px)`
 	 */
@@ -4528,7 +4484,7 @@ declare module '@elastic/eui/src/services/popover/popover_positioning' {
 	interface FindPopoverPositionResult {
 	    top: number;
 	    left: number;
-	    position: 'top' | 'right' | 'bottom' | 'left';
+	    position: EuiPopoverPosition;
 	    fit: number;
 	    arrow?: {
 	        left: number;
@@ -4727,6 +4683,7 @@ declare module '@elastic/eui/src/components/popover/popover.styles' {
 }
 declare module '@elastic/eui/src/components/popover/popover_panel/_popover_panel.styles' {
 	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const openAnimationTiming = "slow";
 	/**
 	 * 1. Can expand further, but it looks weird if it's smaller than the originating button.
 	 * 2. Animation happens on the panel. But don't animate position when using the attached mode like for inputs
@@ -4915,6 +4872,10 @@ declare module '@elastic/eui/src/components/popover/popover' {
 	     * Usually takes the `id` of the popover title
 	     */
 	    'aria-labelledby'?: string;
+	    /**
+	     * Function callback for when the popover positon changes
+	     */
+	    onPositionChange?: (position: EuiPopoverPosition) => void;
 	}
 	export function getPopoverPositionFromAnchorPosition(anchorPosition: PopoverAnchorPosition): EuiPopoverPosition;
 	export function getPopoverAlignFromAnchorPosition(anchorPosition: PopoverAnchorPosition): EuiPopoverPosition;
@@ -6578,6 +6539,11 @@ declare module '@elastic/eui/src/themes/amsterdam/global_styling/variables/_anim
 	export const animation_ease: _EuiThemeAnimationEasings;
 	export const animation: _EuiThemeAnimation;
 
+}
+declare module '@elastic/eui/src/themes/amsterdam/global_styling/variables/_breakpoint' {
+	import { _EuiThemeBreakpoints } from '@elastic/eui/src/global_styling/variables';
+	export const breakpoint: _EuiThemeBreakpoints;
+
 }
 declare module '@elastic/eui/src/themes/amsterdam/global_styling/variables/_size' {
 	import { _EuiThemeBase, _EuiThemeSizes } from '@elastic/eui/src/global_styling/variables';
@@ -6674,29 +6640,47 @@ declare module '@elastic/eui/src/services/breakpoint/current_breakpoint_hook' {
 	 * This hook is in its own separate file to make mocking it
 	 * as a testenv easy for Jest unit tests
 	 */
-	export const useCurrentEuiBreakpoint: () => "s" | "xs" | "m" | "l" | "xl" | undefined;
+	export const useCurrentEuiBreakpoint: () => string | undefined;
 
 }
-declare module '@elastic/eui/src/services/breakpoint/useIsWithinBreakpoints' {
+declare module '@elastic/eui/src/services/breakpoint/is_within_hooks' {
 	import { _EuiThemeBreakpoint } from '@elastic/eui/src/global_styling/variables/breakpoint';
 	/**
-	 * Given the current window.innerWidth and an array of breakpoint keys,
-	 * this hook stores state and returns true or false if the window.innerWidth
-	 * falls within any of the named breakpoints.
+	 * Given an array of breakpoint keys, this hook returns true or false
+	 * if the breakpoint size of the current window width falls within
+	 * any of the named breakpoints.
 	 *
-	 * @param {_EuiThemeBreakpoint[]} sizes An array of named EUI breakpoints
+	 * @param {EuiThemeBreakpoint[]} sizes An array of named EUI breakpoints
 	 * @param {boolean} isResponsive Some components have the option to turn off responsive behavior.
 	 *   Since hooks can't be called conditionally, it's easier to pass the condition into the hook
 	 * @returns {boolean} Returns `true` if current breakpoint name is included in `sizes`
 	 */
 	export const useIsWithinBreakpoints: (sizes: _EuiThemeBreakpoint[], isResponsive?: boolean) => boolean;
+	/**
+	 * Given a max breakpoint key, this hook returns true if the breakpoint size
+	 * of the current window width falls within the max breakpoint or any below,
+	 * and false otherwise
+	 *
+	 * @param {EuiThemeBreakpoint} max The named max breakpoint to check against
+	 * @returns {boolean} Will return `false` if it can't find a value for the `max` breakpoint
+	 */
+	export function useIsWithinMaxBreakpoint(max: _EuiThemeBreakpoint): boolean;
+	/**
+	 * Given a min breakpoint key, this hook returns true if the breakpoint size
+	 * of the current window width falls within the min breakpoint or any above,
+	 * and false otherwise
+	 *
+	 * @param {EuiThemeBreakpoint} min The named min breakpoint to check against
+	 * @returns {boolean} Will return `false` if it can't find a value for the `min` breakpoint
+	 */
+	export function useIsWithinMinBreakpoint(min: _EuiThemeBreakpoint): boolean;
 
 }
 declare module '@elastic/eui/src/services/breakpoint' {
-	export * from '@elastic/eui/src/services/breakpoint/breakpoint';
+	export type { _EuiThemeBreakpoint as EuiBreakpointSize } from '@elastic/eui/src/global_styling/variables/breakpoint';
 	export * from '@elastic/eui/src/services/breakpoint/current_breakpoint';
 	export * from '@elastic/eui/src/services/breakpoint/current_breakpoint_hook';
-	export * from '@elastic/eui/src/services/breakpoint/useIsWithinBreakpoints';
+	export * from '@elastic/eui/src/services/breakpoint/is_within_hooks';
 
 }
 declare module '@elastic/eui/src/services/color_picker/color_picker' {
@@ -7133,7 +7117,7 @@ declare module '@elastic/eui/src/services' {
 	export type { HorizontalAlignment } from '@elastic/eui/src/services/alignment';
 	export { LEFT_ALIGNMENT, RIGHT_ALIGNMENT, CENTER_ALIGNMENT } from '@elastic/eui/src/services/alignment';
 	export type { EuiBreakpointSize } from '@elastic/eui/src/services/breakpoint';
-	export { BREAKPOINTS, BREAKPOINT_KEYS, getBreakpoint, isWithinBreakpoints, useIsWithinBreakpoints, isWithinMaxBreakpoint, isWithinMinBreakpoint, CurrentEuiBreakpointContext, CurrentEuiBreakpointProvider, useCurrentEuiBreakpoint, } 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 type { EuiSetColorMethod } from '@elastic/eui/src/services/color_picker';
@@ -7220,6 +7204,7 @@ declare module '@elastic/eui/src/components/accordion/accordion.styles' {
 	import { UseEuiTheme } from '@elastic/eui/src/services';
 	export const euiAccordionButtonStyles: (euiThemeContext: UseEuiTheme) => {
 	    euiAccordion__button: import("@emotion/utils").SerializedStyles;
+	    disabled: import("@emotion/utils").SerializedStyles;
 	};
 	export const euiAccordionChildrenStyles: ({ euiTheme }: UseEuiTheme) => {
 	    euiAccordion__children: import("@emotion/utils").SerializedStyles;
@@ -7328,6 +7313,10 @@ declare module '@elastic/eui/src/components/accordion/accordion' {
 	     * Choose whether the loading message replaces the content. Customize the message by passing a node
 	     */
 	    isLoadingMessage?: boolean | ReactNode;
+	    /**
+	     * Disable the open/close interaction and visually subdues the trigger
+	     */
+	    isDisabled?: boolean;
 	};
 	export class EuiAccordionClass extends Component<WithEuiThemeProps & EuiAccordionProps, {
 	    isOpen: boolean;
@@ -7337,6 +7326,7 @@ declare module '@elastic/eui/src/components/accordion/accordion' {
 	        paddingSize: "none";
 	        arrowDisplay: "left";
 	        isLoading: boolean;
+	        isDisabled: boolean;
 	        isLoadingMessage: boolean;
 	        element: "div";
 	        buttonElement: "button";
@@ -8447,9 +8437,9 @@ declare module '@elastic/eui/src/components/flyout/flyout' {
 	     */
 	    role?: null | string;
 	    /**
-	     * Named breakpoint or pixel value for customizing the minimum window width to enable the `push` type
+	     * Named breakpoint (`xs` through `xl`) for customizing the minimum window width to enable the `push` type
 	     */
-	    pushMinBreakpoint?: EuiBreakpointSize | number;
+	    pushMinBreakpoint?: EuiBreakpointSize;
 	    style?: CSSProperties;
 	    /**
 	     * Object of props passed to EuiFocusTrap.
@@ -8524,7 +8514,7 @@ declare module '@elastic/eui/src/components/collapsible_nav/collapsible_nav' {
 	     */
 	    isDocked?: boolean;
 	    /**
-	     * Named breakpoint or pixel value for customizing the minimum window width to enable docking
+	     * Named breakpoint (`xs` through `xl`) for customizing the minimum window width to enable docking
 	     */
 	    dockedBreakpoint?: EuiFlyoutProps['pushMinBreakpoint'];
 	    /**
@@ -12507,7 +12497,7 @@ declare module '@elastic/eui/src/components/date_picker/super_date_picker/async_
 
 }
 declare module '@elastic/eui/src/components/date_picker/date_picker_range' {
-	import { FunctionComponent, ReactNode, ReactElement } from 'react';
+	import { FocusEventHandler, FunctionComponent, ReactNode, ReactElement } from 'react';
 	import { IconType } from '@elastic/eui/src/components/icon';
 	import { CommonProps } from '@elastic/eui/src/components/common';
 	export type EuiDatePickerRangeProps = CommonProps & {
@@ -12543,7 +12533,18 @@ declare module '@elastic/eui/src/components/date_picker/date_picker_range' {
 	     * Passes through to each control
 	     */
 	    readOnly?: boolean;
+	    /**
+	     * Passes through to each control
+	     */
 	    fullWidth?: boolean;
+	    /**
+	     * Triggered whenever the start or end controls are blurred
+	     */
+	    onBlur?: FocusEventHandler<HTMLInputElement>;
+	    /**
+	     * Triggered whenever the start or end controls are focused
+	     */
+	    onFocus?: FocusEventHandler<HTMLInputElement>;
 	};
 	export const EuiDatePickerRange: FunctionComponent<EuiDatePickerRangeProps>;
 
@@ -13009,10 +13010,9 @@ declare module '@elastic/eui/src/components/description_list/description_list_co
 declare module '@elastic/eui/src/components/description_list/description_list_title' {
 	import { HTMLAttributes, FunctionComponent } from 'react';
 	import { CommonProps } from '@elastic/eui/src/components/common';
-	interface EuiDescriptionListTitleProps extends CommonProps, HTMLAttributes<HTMLElement> {
+	export interface EuiDescriptionListTitleProps extends CommonProps, HTMLAttributes<HTMLElement> {
 	}
 	export const EuiDescriptionListTitle: FunctionComponent<EuiDescriptionListTitleProps>;
-	export {};
 
 }
 declare module '@elastic/eui/src/components/description_list/description_list_description.styles' {
@@ -13039,10 +13039,9 @@ declare module '@elastic/eui/src/components/description_list/description_list_de
 declare module '@elastic/eui/src/components/description_list/description_list_description' {
 	import { HTMLAttributes, FunctionComponent } from 'react';
 	import { CommonProps } from '@elastic/eui/src/components/common';
-	interface EuiDescriptionListDescriptionProps extends CommonProps, HTMLAttributes<HTMLElement> {
+	export interface EuiDescriptionListDescriptionProps extends CommonProps, HTMLAttributes<HTMLElement> {
 	}
 	export const EuiDescriptionListDescription: FunctionComponent<EuiDescriptionListDescriptionProps>;
-	export {};
 
 }
 declare module '@elastic/eui/src/components/description_list/description_list.styles' {
@@ -15649,7 +15648,7 @@ declare module '@elastic/eui/src/components/provider/cache/cache_provider' {
 	import { PropsWithChildren } from 'react';
 	import { EmotionCache } from '@emotion/cache';
 	export interface EuiCacheProviderProps {
-	    cache?: false | EmotionCache;
+	    cache?: EmotionCache;
 	}
 	export const EuiCacheProvider: ({ cache, children, }: PropsWithChildren<EuiCacheProviderProps>) => JSX.Element;
 
@@ -18039,19 +18038,35 @@ declare module '@elastic/eui/src/components/table' {
 }
 declare module '@elastic/eui/src/components/tour/tour_step_indicator' {
 	import { FunctionComponent, HTMLAttributes } from 'react';
-	import { CommonProps } from '@elastic/eui/src/components/common'; const statusToClassNameMap: {
-	    complete: string;
-	    incomplete: string;
-	    active: string;
-	};
-	export const STATUS: ("active" | "incomplete" | "complete")[];
-	export type EuiTourStepStatus = keyof typeof statusToClassNameMap;
+	import { CommonProps } from '@elastic/eui/src/components/common';
+	export type EuiTourStepStatus = 'complete' | 'incomplete' | 'active';
 	export interface EuiTourStepIndicatorProps extends CommonProps, HTMLAttributes<HTMLLIElement> {
 	    number: number;
 	    status: EuiTourStepStatus;
 	}
 	export const EuiTourStepIndicator: FunctionComponent<EuiTourStepIndicatorProps>;
-	export {};
+
+}
+declare module '@elastic/eui/src/components/tour/tour.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiTourStyles: ({ euiTheme, colorMode }: UseEuiTheme) => {
+	    euiTour: import("@emotion/utils").SerializedStyles;
+	};
+	export const euiTourBeaconStyles: ({ euiTheme }: UseEuiTheme) => {
+	    euiTourBeacon: import("@emotion/utils").SerializedStyles;
+	    right: import("@emotion/utils").SerializedStyles;
+	    left: import("@emotion/utils").SerializedStyles;
+	    top: import("@emotion/utils").SerializedStyles;
+	    bottom: import("@emotion/utils").SerializedStyles;
+	};
+	export const euiTourHeaderStyles: ({ euiTheme }: UseEuiTheme) => {
+	    euiTourHeader: import("@emotion/utils").SerializedStyles;
+	    euiTourHeader__title: import("@emotion/utils").SerializedStyles;
+	    euiTourHeader__subtitle: import("@emotion/utils").SerializedStyles;
+	};
+	export const euiTourFooterStyles: ({ euiTheme, colorMode }: UseEuiTheme) => {
+	    euiTourFooter: import("@emotion/utils").SerializedStyles;
+	};
 
 }
 declare module '@elastic/eui/src/components/tour/tour_step' {
@@ -18170,17 +18185,18 @@ declare module '@elastic/eui/src/components/tour/useEuiTour' {
 	import { EuiTourStepProps } from '@elastic/eui/src/components/tour/tour_step';
 	import { EuiTourActions, EuiTourState } from '@elastic/eui/src/components/tour/types';
 	export type EuiStatelessTourStep = EuiTourStepProps & Partial<EuiTourState>;
-	export const useEuiTour: (stepsArray: EuiStatelessTourStep[], initialState: EuiTourState) => [EuiTourStepProps[], EuiTourActions, EuiTourState];
+	export type EuiStatelessTourSteps = Array<Exclude<EuiStatelessTourStep, 'onFinish'>>;
+	export const useEuiTour: (stepsArray: EuiStatelessTourSteps, initialState: EuiTourState) => [EuiTourStepProps[], EuiTourActions, EuiTourState];
 
 }
 declare module '@elastic/eui/src/components/tour/tour' {
 	import { FunctionComponent, ReactElement } from 'react';
-	import { EuiStatelessTourStep } from '@elastic/eui/src/components/tour/useEuiTour';
+	import { EuiStatelessTourSteps } from '@elastic/eui/src/components/tour/useEuiTour';
 	import { EuiTourStepProps } from '@elastic/eui/src/components/tour/tour_step';
 	import { EuiTourActions, EuiTourState } from '@elastic/eui/src/components/tour/types';
 	export interface EuiTourProps {
 	    children: (steps: EuiTourStepProps[], actions: EuiTourActions, state: EuiTourState) => ReactElement;
-	    steps: EuiStatelessTourStep[];
+	    steps: EuiStatelessTourSteps;
 	    initialState: EuiTourState;
 	}
 	export const EuiTour: FunctionComponent<EuiTourProps>;
@@ -18193,7 +18209,7 @@ declare module '@elastic/eui/src/components/tour' {
 	export { EuiTourStep } from '@elastic/eui/src/components/tour/tour_step';
 	export type { EuiTourStepIndicatorProps } from '@elastic/eui/src/components/tour/tour_step_indicator';
 	export { EuiTourStepIndicator } from '@elastic/eui/src/components/tour/tour_step_indicator';
-	export type { EuiStatelessTourStep } from '@elastic/eui/src/components/tour/useEuiTour';
+	export type { EuiStatelessTourStep, EuiStatelessTourSteps } from '@elastic/eui/src/components/tour/useEuiTour';
 	export { useEuiTour } from '@elastic/eui/src/components/tour/useEuiTour';
 	export * from '@elastic/eui/src/components/tour/types';
 
@@ -19442,56 +19458,6 @@ declare module '@elastic/eui' {
 	export * from '@elastic/eui/src/themes';
 	export * from '@elastic/eui/src/global_styling';
 
-}
-declare module '@elastic/eui/src/test/internal/render_with_styles' {
-	import { ReactElement } from 'react';
-	/**
-	 * Use this function to add the `@emotion` Jest serializer to a single test.
-	 * The resulting snapshot will include the styles of elements in the component that use `@emotion` for styling.
-	 *
-	 * This function must be run outside of a `test` block:
-	 
-	  ```
-	  describe('EuiMark', () => {
-	    renderWithStyles(<EuiMark>Marked</EuiMark>);
-
-	    test('is rendered', () => {});
-	  });
-	  ```
-	 */
-	export const renderWithStyles: (component: ReactElement) => never;
-
-}
-declare module '@elastic/eui/src/test/internal/render_custom_styles' {
-	import { ReactElement } from 'react';
-	/**
-	 * Use this test helper to quickly check that the component supports custom
-	 * `className`, `css`, and `style` properties.
-	 *
-	 * Example usage:
-	 *
-	 * shouldRenderCustomStyles(<EuiMark {...requiredProps} />Marked</EuiMark>);
-	 */
-	export const shouldRenderCustomStyles: (component: ReactElement) => void;
-
-}
-declare module '@elastic/eui/src/test/internal/test_custom_hook' {
-	
-	export const HookWrapper: (props: {
-	    hook?: Function;
-	}) => JSX.Element;
-	export const testCustomHook: <T>(hook?: Function | undefined, args?: unknown) => {
-	    return: T;
-	    getUpdatedState: () => T;
-	    updateHookArgs: (args: unknown) => void;
-	};
-
-}
-declare module '@elastic/eui/src/test/internal' {
-	export * from '@elastic/eui/src/test/internal/render_with_styles';
-	export * from '@elastic/eui/src/test/internal/render_custom_styles';
-	export * from '@elastic/eui/src/test/internal/test_custom_hook';
-
 }
 declare module '@elastic/eui/src/components/icon/assets/videoPlayer' {
 	import * as React from 'react';
@@ -24036,96 +24002,6 @@ declare module 'mdast-util-to-hast/lib/all' {
   const all: (h: H, node: Node) => Node[];
   export = all;
 }
-declare module '@elastic/eui/src/test/rtl/component_helpers' {
-	import '@testing-library/jest-dom';
-	/**
-	 * Ensure the EuiPopover being tested is open/closed before continuing
-	 * Note: Because EuiPopover is portalled, we want to query `document`
-	 * instead of the `container` returned by RTL's render()
-	 */
-	export const waitForEuiPopoverOpen: () => Promise<void>;
-	export const waitForEuiPopoverClose: () => Promise<void>;
-	/**
-	 * Ensure the EuiToolTip being tested is open and visible before continuing
-	 */
-	export const waitForEuiToolTipVisible: () => Promise<void>;
-	export const waitForEuiToolTipHidden: () => Promise<void>;
-
-}
-declare module '@elastic/eui/src/test/rtl/data_test_subj_queries' {
-	import { queryHelpers, Matcher, MatcherOptions } from '@testing-library/react'; const queryAllByTestSubject: (container: HTMLElement, id: Matcher, options?: MatcherOptions | undefined) => HTMLElement[]; const queryByTestSubject: queryHelpers.QueryBy<[Matcher]>, getAllByTestSubject: queryHelpers.GetAllBy<[Matcher]>, getByTestSubject: queryHelpers.GetBy<[Matcher]>, findAllByTestSubject: queryHelpers.FindAllBy<[Matcher]>, findByTestSubject: queryHelpers.FindBy<[Matcher]>;
-	export { queryByTestSubject, queryAllByTestSubject, getByTestSubject, getAllByTestSubject, findAllByTestSubject, findByTestSubject, };
-
-}
-declare module '@elastic/eui/src/test/rtl/custom_render' {
-	import { ReactElement } from 'react';
-	import { queries, RenderOptions, Screen } from '@testing-library/react';
-	import * as dataTestSubjQueries from '@elastic/eui/src/test/rtl/data_test_subj_queries'; const customRender: (ui: ReactElement, { queries: renderQueries, ...options }?: RenderOptions) => import("@testing-library/react").RenderResult<{
-	    getByLabelText: typeof queries.getByLabelText;
-	    getAllByLabelText: typeof queries.getAllByLabelText;
-	    queryByLabelText: typeof queries.queryByLabelText;
-	    queryAllByLabelText: typeof queries.queryAllByLabelText;
-	    findByLabelText: typeof queries.findByLabelText;
-	    findAllByLabelText: typeof queries.findAllByLabelText;
-	    getByPlaceholderText: typeof queries.getByPlaceholderText;
-	    getAllByPlaceholderText: typeof queries.getAllByPlaceholderText;
-	    queryByPlaceholderText: typeof queries.queryByPlaceholderText;
-	    queryAllByPlaceholderText: typeof queries.queryAllByPlaceholderText;
-	    findByPlaceholderText: typeof queries.findByPlaceholderText;
-	    findAllByPlaceholderText: typeof queries.findAllByPlaceholderText;
-	    getByText: typeof queries.getByText;
-	    getAllByText: typeof queries.getAllByText;
-	    queryByText: typeof queries.queryByText;
-	    queryAllByText: typeof queries.queryAllByText;
-	    findByText: typeof queries.findByText;
-	    findAllByText: typeof queries.findAllByText;
-	    getByAltText: typeof queries.getByAltText;
-	    getAllByAltText: typeof queries.getAllByAltText;
-	    queryByAltText: typeof queries.queryByAltText;
-	    queryAllByAltText: typeof queries.queryAllByAltText;
-	    findByAltText: typeof queries.findByAltText;
-	    findAllByAltText: typeof queries.findAllByAltText;
-	    getByTitle: typeof queries.getByTitle;
-	    getAllByTitle: typeof queries.getAllByTitle;
-	    queryByTitle: typeof queries.queryByTitle;
-	    queryAllByTitle: typeof queries.queryAllByTitle;
-	    findByTitle: typeof queries.findByTitle;
-	    findAllByTitle: typeof queries.findAllByTitle;
-	    getByDisplayValue: typeof queries.getByDisplayValue;
-	    getAllByDisplayValue: typeof queries.getAllByDisplayValue;
-	    queryByDisplayValue: typeof queries.queryByDisplayValue;
-	    queryAllByDisplayValue: typeof queries.queryAllByDisplayValue;
-	    findByDisplayValue: typeof queries.findByDisplayValue;
-	    findAllByDisplayValue: typeof queries.findAllByDisplayValue;
-	    getByRole: typeof queries.getByRole;
-	    getAllByRole: typeof queries.getAllByRole;
-	    queryByRole: typeof queries.queryByRole;
-	    queryAllByRole: typeof queries.queryAllByRole;
-	    findByRole: typeof queries.findByRole;
-	    findAllByRole: typeof queries.findAllByRole;
-	    getByTestId: typeof queries.getByTestId;
-	    getAllByTestId: typeof queries.getAllByTestId;
-	    queryByTestId: typeof queries.queryByTestId;
-	    queryAllByTestId: typeof queries.queryAllByTestId;
-	    findByTestId: typeof queries.findByTestId;
-	    findAllByTestId: typeof queries.findAllByTestId;
-	    queryByTestSubject: import("@testing-library/react").QueryBy<[import("@testing-library/react").Matcher]>;
-	    queryAllByTestSubject: (container: HTMLElement, id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
-	    getByTestSubject: import("@testing-library/react").GetBy<[import("@testing-library/react").Matcher]>;
-	    getAllByTestSubject: import("@testing-library/react").GetAllBy<[import("@testing-library/react").Matcher]>;
-	    findAllByTestSubject: import("@testing-library/react").FindAllBy<[import("@testing-library/react").Matcher]>;
-	    findByTestSubject: import("@testing-library/react").FindBy<[import("@testing-library/react").Matcher]>;
-	}, HTMLElement, HTMLElement>;
-	export { customRender as render }; const customScreen: Screen<typeof queries & typeof dataTestSubjQueries>;
-	export { customScreen as screen };
-
-}
-declare module '@elastic/eui/src/test/rtl' {
-	export * from '@elastic/eui/src/test/rtl/component_helpers';
-	export { queryByTestSubject, queryAllByTestSubject, getByTestSubject, getAllByTestSubject, findAllByTestSubject, findByTestSubject, } from '@elastic/eui/src/test/rtl/data_test_subj_queries';
-	export { render, screen } from '@elastic/eui/src/test/rtl/custom_render';
-
-}
 declare module '@elastic/eui/src/components/table/mobile' {
 	export { EuiTableHeaderMobile } from '@elastic/eui/src/components/table/mobile/table_header_mobile';
 	export type { EuiTableSortMobileProps } from '@elastic/eui/src/components/table/mobile/table_sort_mobile';