@elastic/eui 95.7.0 → 95.8.0-backport.0

package/eui.d.ts

@@ -986,7 +986,7 @@ declare module '@elastic/eui/src/services/emotion/clone_element' {
 	 * `css` prop - as a result, we need to use `jsx()` to manually clone the element
 	 * See https://github.com/emotion-js/emotion/issues/1404
 	 */
-	export const cloneElementWithCss: (element: any, props: any) => React.ReactElement;
+	export const cloneElementWithCss: (element: any, props: any, cssOrder?: 'before' | 'after') => React.ReactElement;
 
 }
 declare module '@elastic/eui/src/services/emotion/prefixer' {
@@ -4124,8 +4124,6 @@ declare module '@elastic/eui/src/components/form/form.styles' {
 	        xl: string;
 	        xxl: string;
 	    };
-	    customControlDisabledIconColor: string;
-	    customControlBorderColor: string;
 	    textColor: string;
 	    backgroundColor: string;
 	    backgroundDisabledColor: string;
@@ -4134,8 +4132,7 @@ declare module '@elastic/eui/src/components/form/form.styles' {
 	    controlDisabledColor: string;
 	    controlBoxShadow: string;
 	    controlPlaceholderText: string;
-	    inputGroupLabelBackground: string;
-	    inputGroupBorder: string;
+	    appendPrependBackground: string;
 	    maxWidth: string;
 	    controlHeight: string;
 	    controlCompressedHeight: string;
@@ -4159,17 +4156,62 @@ declare module '@elastic/eui/src/components/form/form.styles' {
 	    readOnly: string;
 	    autoFill: string;
 	};
-	export const euiCustomControl: (euiThemeContext: UseEuiTheme, options?: {
-	    type?: 'round' | 'square';
-	    size?: string;
-	}) => string;
 	export const euiFormControlText: (euiThemeContext: UseEuiTheme) => string;
-	export const euiFormControlDefaultShadow: (euiThemeContext: UseEuiTheme) => string;
+	export const euiFormControlDefaultShadow: (euiThemeContext: UseEuiTheme, { withBorder, withBackground, withBackgroundColor, withBackgroundAnimation, }?: {
+	    withBorder?: boolean | undefined;
+	    withBackground?: boolean | undefined;
+	    withBackgroundColor?: boolean | undefined;
+	    withBackgroundAnimation?: boolean | undefined;
+	}) => string;
 	export const euiFormControlFocusStyles: ({ euiTheme, colorMode, }: UseEuiTheme) => string;
 	export const euiFormControlInvalidStyles: ({ euiTheme }: UseEuiTheme) => string;
 	export const euiFormControlDisabledStyles: (euiThemeContext: UseEuiTheme) => string;
 	export const euiFormControlReadOnlyStyles: (euiThemeContext: UseEuiTheme) => string;
 	export const euiFormControlAutoFillStyles: (euiThemeContext: UseEuiTheme) => string;
+	/**
+	 * Selection custom controls - checkboxes, radios, and switches
+	 */
+	export const euiFormCustomControlVariables: (euiThemeContext: UseEuiTheme) => {
+	    sizes: {
+	        control: string;
+	        lineHeight: string;
+	        labelGap: string;
+	    };
+	    colors: {
+	        unselected: string;
+	        unselectedBorder: string;
+	        selected: string;
+	        selectedIcon: string;
+	        disabled: string;
+	        disabledIcon: string;
+	        disabledLabel: string;
+	    };
+	    animation: {
+	        speed: import("csstype").Property.AnimationDuration<string & {}> | undefined;
+	        easing: string;
+	    };
+	};
+	export const euiFormCustomControlStyles: (euiThemeContext: UseEuiTheme) => {
+	    wrapper: string;
+	    input: {
+	        fauxInput: string;
+	        enabled: {
+	            selected: string;
+	            unselected: string;
+	        };
+	        disabled: {
+	            selected: string;
+	            unselected: string;
+	        };
+	        icon: string;
+	        hiddenInput: string;
+	    };
+	    label: {
+	        label: string;
+	        enabled: string;
+	        disabled: string;
+	    };
+	};
 
 }
 declare module '@elastic/eui/src/components/button/button_group/button_group_button.styles' {
@@ -6120,21 +6162,84 @@ declare module '@elastic/eui/src/components/popover' {
 	export type { EuiWrappingPopoverProps } from '@elastic/eui/src/components/popover/wrapping_popover';
 	export { EuiWrappingPopover } from '@elastic/eui/src/components/popover/wrapping_popover';
 
+}
+declare module '@elastic/eui/src/components/form/form_label/form_label.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFormLabel: (euiThemeContext: UseEuiTheme) => string;
+	export const euiFormLabelStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFormLabel: import("@emotion/utils").SerializedStyles;
+	    notDisabled: string;
+	    invalid: import("@emotion/utils").SerializedStyles;
+	    focused: import("@emotion/utils").SerializedStyles;
+	};
+
+}
+declare module '@elastic/eui/src/components/form/form_label/form_label' {
+	import { FunctionComponent, LabelHTMLAttributes, HTMLAttributes } from 'react';
+	import { CommonProps, ExclusiveUnion } from '@elastic/eui/src/components/common';
+	interface EuiFormLabelCommonProps {
+	    isFocused?: boolean;
+	    isInvalid?: boolean;
+	    /**
+	     * Changes `cursor` to `default`.
+	     */
+	    isDisabled?: boolean;
+	    /**
+	     * Default type is a `label` but can be changed to a `legend`
+	     * if using inside a `fieldset`.
+	     */
+	    type?: 'label' | 'legend';
+	}
+	export type _EuiFormLabelProps = {
+	    type?: 'label';
+	} & EuiFormLabelCommonProps & CommonProps & LabelHTMLAttributes<HTMLLabelElement>;
+	export type _EuiFormLegendProps = {
+	    type: 'legend';
+	} & EuiFormLabelCommonProps & CommonProps & HTMLAttributes<HTMLLegendElement>;
+	export type EuiFormLabelProps = ExclusiveUnion<_EuiFormLabelProps, _EuiFormLegendProps>;
+	export const EuiFormLabel: FunctionComponent<EuiFormLabelProps>;
+	export {};
+
+}
+declare module '@elastic/eui/src/components/form/form_label' {
+	export type { EuiFormLabelProps } from '@elastic/eui/src/components/form/form_label/form_label';
+	export { EuiFormLabel } from '@elastic/eui/src/components/form/form_label/form_label';
+
+}
+declare module '@elastic/eui/src/components/form/eui_form_context' {
+	import React from 'react';
+	export interface FormContextValue {
+	    defaultFullWidth: boolean;
+	}
+	export const FormContext: React.Context<FormContextValue>;
+	export function useFormContext(): FormContextValue;
+
+}
+declare module '@elastic/eui/src/components/form/form_control_layout/form_control_layout_clear_button.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const EuiFormControlLayoutClearButtonStyles: ({ euiTheme, colorMode, }: UseEuiTheme) => {
+	    euiFormControlLayoutClearButton: import("@emotion/utils").SerializedStyles;
+	    euiFormControlLayoutClearButton__icon: import("@emotion/utils").SerializedStyles;
+	    size: {
+	        s: import("@emotion/utils").SerializedStyles;
+	        m: import("@emotion/utils").SerializedStyles;
+	    };
+	};
+
 }
 declare module '@elastic/eui/src/components/form/form_control_layout/form_control_layout_clear_button' {
 	import { FunctionComponent, ButtonHTMLAttributes } from 'react';
 	import { CommonProps } from '@elastic/eui/src/components/common';
-	export const SIZES: ("s" | "m")[];
 	export type EuiFormControlLayoutClearButtonProps = CommonProps & ButtonHTMLAttributes<HTMLButtonElement> & {
-	    size?: (typeof SIZES)[number];
+	    size?: 's' | 'm';
 	};
 	export const EuiFormControlLayoutClearButton: FunctionComponent<EuiFormControlLayoutClearButtonProps>;
 
 }
 declare module '@elastic/eui/src/components/form/form_control_layout/form_control_layout_custom_icon' {
 	import { ButtonHTMLAttributes, FunctionComponent, HTMLAttributes } from 'react';
-	import { EuiIconProps, IconType } from '@elastic/eui/src/components/icon';
 	import { CommonProps, ExclusiveUnion } from '@elastic/eui/src/components/common';
+	import { EuiIconProps, IconType } from '@elastic/eui/src/components/icon';
 	export type EuiFormControlLayoutCustomIconProps = CommonProps & ExclusiveUnion<Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'type'>, HTMLAttributes<HTMLSpanElement>> & {
 	    type: IconType;
 	    size?: EuiIconProps['size'];
@@ -6142,13 +6247,41 @@ declare module '@elastic/eui/src/components/form/form_control_layout/form_contro
 	};
 	export const EuiFormControlLayoutCustomIcon: FunctionComponent<EuiFormControlLayoutCustomIconProps>;
 
+}
+declare module '@elastic/eui/src/components/form/form_control_layout/form_control_layout_icons.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFormControlLayoutIconsStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFormControlLayoutIcons: import("@emotion/utils").SerializedStyles;
+	    uncompressed: string;
+	    compressed: import("@emotion/utils").SerializedStyles;
+	    disabled: import("@emotion/utils").SerializedStyles;
+	    position: {
+	        absolute: {
+	            absolute: import("@emotion/utils").SerializedStyles;
+	            uncompressed: {
+	                left: import("@emotion/utils").SerializedStyles;
+	                right: import("@emotion/utils").SerializedStyles;
+	            };
+	            compressed: {
+	                left: import("@emotion/utils").SerializedStyles;
+	                right: import("@emotion/utils").SerializedStyles;
+	            };
+	        };
+	        static: {
+	            static: import("@emotion/utils").SerializedStyles;
+	            uncompressed: string;
+	            compressed: string;
+	        };
+	    };
+	};
+
 }
 declare module '@elastic/eui/src/components/form/form_control_layout/form_control_layout_icons' {
 	import React, { Component } from 'react';
+	import { DistributiveOmit } from '@elastic/eui/src/components/common';
+	import { IconColor, IconType } from '@elastic/eui/src/components/icon';
 	import { EuiFormControlLayoutClearButtonProps } from '@elastic/eui/src/components/form/form_control_layout/form_control_layout_clear_button';
 	import { EuiFormControlLayoutCustomIconProps } from '@elastic/eui/src/components/form/form_control_layout/form_control_layout_custom_icon';
-	import { IconColor, IconType } from '@elastic/eui/src/components/icon';
-	import { DistributiveOmit } from '@elastic/eui/src/components/common';
 	export const ICON_SIDES: readonly ["left", "right"];
 	export type IconShape = DistributiveOmit<EuiFormControlLayoutCustomIconProps, 'type' | 'iconRef'> & {
 	    type: IconType;
@@ -6166,6 +6299,7 @@ declare module '@elastic/eui/src/components/form/form_control_layout/form_contro
 	    isInvalid?: boolean;
 	    isDropdown?: boolean;
 	    compressed?: boolean;
+	    isDisabled?: boolean;
 	}
 	export class EuiFormControlLayoutIcons extends Component<EuiFormControlLayoutIconsProps> {
 	    render(): React.JSX.Element;
@@ -6179,25 +6313,6 @@ declare module '@elastic/eui/src/components/form/form_control_layout/form_contro
 }
 declare module '@elastic/eui/src/components/form/form_control_layout/_num_icons' {
 	import { type EuiFormControlLayoutIconsProps } from '@elastic/eui/src/components/form/form_control_layout/form_control_layout_icons';
-	/**
-	 * The `getFormControlClassNameForIconCount` function helps setup the className appendum
-	 * depending on the form control's current settings/state.
-	 *
-	 * @param icon {boolean} Does it contain a static icon like arrowDown
-	 * @param clear {boolean} Is it currently clearable
-	 * @param isLoading {boolean} Is is currently loading
-	 * @param isInvalid {boolean} It is currently invalid
-	 * @param isDropdown {boolean} It is as dropdown
-	 * @returns {string | undefined} Returns the string to append to the base className of the form control; or `undefined` if all evaluate to false
-	 */
-	export type _EuiFormControlLayoutNumIcons = {
-	    icon?: boolean;
-	    clear?: boolean;
-	    isLoading?: boolean;
-	    isInvalid?: boolean;
-	    isDropdown?: boolean;
-	};
-	export const getFormControlClassNameForIconCount: ({ icon, clear, isLoading, isInvalid, isDropdown, }: _EuiFormControlLayoutNumIcons) => string | undefined;
 	export const isRightSideIcon: (icon?: EuiFormControlLayoutIconsProps['icon']) => boolean;
 	export const getIconAffordanceStyles: ({ icon, clear, isLoading, isInvalid, isDropdown, }: {
 	    icon?: EuiFormControlLayoutIconsProps['icon'];
@@ -6210,51 +6325,39 @@ declare module '@elastic/eui/src/components/form/form_control_layout/_num_icons'
 	} | undefined;
 
 }
-declare module '@elastic/eui/src/components/form/form_label/form_label' {
-	import { FunctionComponent, LabelHTMLAttributes, HTMLAttributes } from 'react';
-	import { CommonProps, ExclusiveUnion } from '@elastic/eui/src/components/common';
-	interface EuiFormLabelCommonProps {
-	    isFocused?: boolean;
-	    isInvalid?: boolean;
-	    /**
-	     * Changes `cursor` to `default`.
-	     */
-	    isDisabled?: boolean;
-	    /**
-	     * Default type is a `label` but can be changed to a `legend`
-	     * if using inside a `fieldset`.
-	     */
-	    type?: 'label' | 'legend';
-	}
-	export type _EuiFormLabelProps = {
-	    type?: 'label';
-	} & EuiFormLabelCommonProps & CommonProps & LabelHTMLAttributes<HTMLLabelElement>;
-	export type _EuiFormLegendProps = {
-	    type: 'legend';
-	} & EuiFormLabelCommonProps & CommonProps & HTMLAttributes<HTMLLegendElement>;
-	export type EuiFormLabelProps = ExclusiveUnion<_EuiFormLabelProps, _EuiFormLegendProps>;
-	export const EuiFormLabel: FunctionComponent<EuiFormLabelProps>;
-	export {};
-
-}
-declare module '@elastic/eui/src/components/form/form_label' {
-	export type { EuiFormLabelProps } from '@elastic/eui/src/components/form/form_label/form_label';
-	export { EuiFormLabel } from '@elastic/eui/src/components/form/form_label/form_label';
-
-}
-declare module '@elastic/eui/src/components/form/eui_form_context' {
-	import React from 'react';
-	export interface FormContextValue {
-	    defaultFullWidth: boolean;
-	}
-	export const FormContext: React.Context<FormContextValue>;
-	export function useFormContext(): FormContextValue;
+declare module '@elastic/eui/src/components/form/form_control_layout/form_control_layout.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFormControlLayoutStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFormControlLayout: import("@emotion/utils").SerializedStyles;
+	    uncompressed: string;
+	    compressed: import("@emotion/utils").SerializedStyles;
+	    formWidth: string;
+	    fullWidth: import("@emotion/utils").SerializedStyles;
+	    group: {
+	        group: import("@emotion/utils").SerializedStyles;
+	        uncompressed: string;
+	        compressed: string;
+	    };
+	    children: {
+	        euiFormControlLayout__childrenWrapper: import("@emotion/utils").SerializedStyles;
+	        inGroup: import("@emotion/utils").SerializedStyles;
+	        prependOnly: import("@emotion/utils").SerializedStyles;
+	        appendOnly: import("@emotion/utils").SerializedStyles;
+	    };
+	};
+	export const euiFormControlLayoutSideNodeStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFormControlLayout__side: import("@emotion/utils").SerializedStyles;
+	    append: import("@emotion/utils").SerializedStyles;
+	    prepend: import("@emotion/utils").SerializedStyles;
+	    uncompressed: string;
+	    compressed: import("@emotion/utils").SerializedStyles;
+	};
 
 }
 declare module '@elastic/eui/src/components/form/form_control_layout/form_control_layout' {
 	import { FunctionComponent, HTMLAttributes, ReactElement, ReactNode } from 'react';
-	import { EuiFormControlLayoutIconsProps } from '@elastic/eui/src/components/form/form_control_layout/form_control_layout_icons';
-	import { CommonProps } from '@elastic/eui/src/components/common'; type StringOrReactElement = string | ReactElement; type PrependAppendType = StringOrReactElement | StringOrReactElement[];
+	import { CommonProps } from '@elastic/eui/src/components/common';
+	import { EuiFormControlLayoutIconsProps } from '@elastic/eui/src/components/form/form_control_layout/form_control_layout_icons'; type StringOrReactElement = string | ReactElement; type PrependAppendType = StringOrReactElement | StringOrReactElement[];
 	export type EuiFormControlLayoutProps = CommonProps & HTMLAttributes<HTMLDivElement> & {
 	    /**
 	     * Creates an input group with element(s) coming before children.
@@ -6295,10 +6398,31 @@ declare module '@elastic/eui/src/components/form/form_control_layout/form_contro
 	     * Connects the prepend and append labels to the input
 	     */
 	    inputId?: string;
+	    /**
+	     * Allows passing optional additional props to `.euiFormControlLayout__childrenWrapper`
+	     */
+	    wrapperProps?: CommonProps & HTMLAttributes<HTMLDivElement>;
 	};
-	export const EuiFormControlLayout: FunctionComponent<EuiFormControlLayoutProps>;
+	export const EuiFormControlLayout: FunctionComponent<EuiFormControlLayoutProps & {
+	    isDelimited?: boolean;
+	}>;
 	export {};
 
+}
+declare module '@elastic/eui/src/components/form/form_control_layout/form_control_layout_delimited.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFormControlLayoutDelimitedStyles: (euiThemeContext: UseEuiTheme) => {
+	    delimited: import("@emotion/utils").SerializedStyles;
+	    disabled: import("@emotion/utils").SerializedStyles;
+	    readOnly: import("@emotion/utils").SerializedStyles;
+	    childrenWrapper: {
+	        delimited: import("@emotion/utils").SerializedStyles;
+	        invalid: import("@emotion/utils").SerializedStyles;
+	    };
+	};
+	export const euiFormControlLayoutDelimited__delimiter: import("@emotion/utils").SerializedStyles;
+	export const euiFormControlLayoutDelimited__input: import("@emotion/utils").SerializedStyles;
+
 }
 declare module '@elastic/eui/src/components/form/form_control_layout/form_control_layout_delimited' {
 	import { FunctionComponent, ReactElement, ReactNode } from 'react';
@@ -8887,6 +9011,37 @@ declare module '@elastic/eui/src/components/card/card' {
 	export const EuiCard: FunctionComponent<EuiCardProps>;
 	export {};
 
+}
+declare module '@elastic/eui/src/components/form/checkbox/checkbox.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiCheckboxStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiCheckbox: import("@emotion/utils").SerializedStyles;
+	    input: {
+	        euiCheckbox__square: import("@emotion/utils").SerializedStyles;
+	        enabled: {
+	            selected: import("@emotion/utils").SerializedStyles;
+	            unselected: import("@emotion/utils").SerializedStyles;
+	        };
+	        disabled: {
+	            selected: import("@emotion/utils").SerializedStyles;
+	            unselected: import("@emotion/utils").SerializedStyles;
+	        };
+	        readOnly: import("@emotion/utils").SerializedStyles;
+	        icon: {
+	            euiCheckbox__icon: import("@emotion/utils").SerializedStyles;
+	            check: import("@emotion/utils").SerializedStyles;
+	            indeterminate: import("@emotion/utils").SerializedStyles;
+	        };
+	        euiCheckbox__input: import("@emotion/utils").SerializedStyles;
+	    };
+	    label: {
+	        euiCheckbox__label: import("@emotion/utils").SerializedStyles;
+	        enabled: string;
+	        disabled: import("@emotion/utils").SerializedStyles;
+	        readOnly: import("@emotion/utils").SerializedStyles;
+	    };
+	};
+
 }
 declare module '@elastic/eui/src/components/form/checkbox/checkbox' {
 	import { FunctionComponent, ChangeEventHandler, ReactNode, InputHTMLAttributes, LabelHTMLAttributes } from 'react';
@@ -8906,6 +9061,15 @@ declare module '@elastic/eui/src/components/form/checkbox/checkbox' {
 	}
 	export const EuiCheckbox: FunctionComponent<EuiCheckboxProps>;
 
+}
+declare module '@elastic/eui/src/components/form/form_fieldset/form_legend.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFormLegendStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFormLegend: import("@emotion/utils").SerializedStyles;
+	    uncompressed: string;
+	    compressed: import("@emotion/utils").SerializedStyles;
+	};
+
 }
 declare module '@elastic/eui/src/components/form/form_fieldset/form_legend' {
 	import { HTMLAttributes, FunctionComponent, ReactNode } from 'react';
@@ -8994,6 +9158,18 @@ declare module '@elastic/eui/src/components/form/checkbox' {
 	export type { EuiCheckboxGroupProps, EuiCheckboxGroupOption, } from '@elastic/eui/src/components/form/checkbox/checkbox_group';
 	export { EuiCheckboxGroup } from '@elastic/eui/src/components/form/checkbox/checkbox_group';
 
+}
+declare module '@elastic/eui/src/components/form/described_form_group/described_form_group.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiDescribedFormGroupStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiDescribedFormGroup: import("@emotion/utils").SerializedStyles;
+	    formWidth: string;
+	    fullWidth: import("@emotion/utils").SerializedStyles;
+	    euiDescribedFormGroup__descriptionColumn: import("@emotion/utils").SerializedStyles;
+	    euiDescribedFormGroup__description: import("@emotion/utils").SerializedStyles;
+	    euiDescribedFormGroup__fields: import("@emotion/utils").SerializedStyles;
+	};
+
 }
 declare module '@elastic/eui/src/components/form/described_form_group/described_form_group' {
 	import { FunctionComponent, ReactNode, HTMLAttributes } from 'react';
@@ -9245,8 +9421,8 @@ declare module '@elastic/eui/src/components/form/field_search/field_search.style
 }
 declare module '@elastic/eui/src/components/form/field_search/field_search' {
 	import React, { Component, InputHTMLAttributes, KeyboardEvent } from 'react';
-	import { CommonProps } from '@elastic/eui/src/components/common';
 	import { WithEuiStylesMemoizerProps } from '@elastic/eui/src/services';
+	import { CommonProps } from '@elastic/eui/src/components/common';
 	import { EuiFormControlLayoutProps } from '@elastic/eui/src/components/form/form_control_layout';
 	import { FormContextValue } from '@elastic/eui/src/components/form/eui_form_context';
 	export interface EuiFieldSearchProps extends CommonProps, InputHTMLAttributes<HTMLInputElement> {
@@ -9612,6 +9788,13 @@ declare module '@elastic/eui/src/components/form/form' {
 	};
 	export const EuiForm: React.ForwardRefExoticComponent<EuiFormProps & React.RefAttributes<HTMLElement>>;
 
+}
+declare module '@elastic/eui/src/components/form/form_error_text/form_error_text.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFormErrorTextStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFormErrorText: import("@emotion/utils").SerializedStyles;
+	};
+
 }
 declare module '@elastic/eui/src/components/form/form_error_text/form_error_text' {
 	import { FunctionComponent, HTMLAttributes } from 'react';
@@ -9624,6 +9807,13 @@ declare module '@elastic/eui/src/components/form/form_error_text' {
 	export type { EuiFormErrorTextProps } from '@elastic/eui/src/components/form/form_error_text/form_error_text';
 	export { EuiFormErrorText } from '@elastic/eui/src/components/form/form_error_text/form_error_text';
 
+}
+declare module '@elastic/eui/src/components/form/form_help_text/form_help_text.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFormHelpTextStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFormHelpText: import("@emotion/utils").SerializedStyles;
+	};
+
 }
 declare module '@elastic/eui/src/components/form/form_help_text/form_help_text' {
 	import { FunctionComponent, HTMLAttributes } from 'react';
@@ -9636,34 +9826,39 @@ declare module '@elastic/eui/src/components/form/form_help_text' {
 	export type { EuiFormHelpTextProps } from '@elastic/eui/src/components/form/form_help_text/form_help_text';
 	export { EuiFormHelpText } from '@elastic/eui/src/components/form/form_help_text/form_help_text';
 
+}
+declare module '@elastic/eui/src/components/form/form_row/form_row.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFormRowStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFormRow: import("@emotion/utils").SerializedStyles;
+	    formWidth: string;
+	    fullWidth: import("@emotion/utils").SerializedStyles;
+	    row: string;
+	    readonly rowCompressed: string;
+	    columnCompressed: import("@emotion/utils").SerializedStyles;
+	    readonly columnCompressedSwitch: import("@emotion/utils").SerializedStyles;
+	    centerDisplayCss: (compressed: boolean) => string;
+	    readonly center: import("@emotion/utils").SerializedStyles;
+	    readonly centerCompressed: import("@emotion/utils").SerializedStyles;
+	};
+
 }
 declare module '@elastic/eui/src/components/form/form_row/form_row' {
-	import React, { Component, HTMLAttributes, ReactElement, ReactNode } from 'react';
+	import { FunctionComponent, HTMLAttributes, ReactElement, ReactNode } from 'react';
 	import { ExclusiveUnion, CommonProps } from '@elastic/eui/src/components/common';
-	import { FormContextValue } from '@elastic/eui/src/components/form/eui_form_context'; const displayToClassNameMap: {
-	    row: null;
-	    rowCompressed: string;
-	    columnCompressed: string;
-	    center: null;
-	    centerCompressed: string;
-	    columnCompressedSwitch: string;
-	};
-	export const DISPLAYS: ("center" | "row" | "rowCompressed" | "columnCompressed" | "centerCompressed" | "columnCompressedSwitch")[];
-	export type EuiFormRowDisplayKeys = keyof typeof displayToClassNameMap;
-	interface EuiFormRowState {
-	    isFocused: boolean;
-	    id: string;
-	} type EuiFormRowCommonProps = CommonProps & {
+	export const DISPLAYS: readonly ["row", "columnCompressed", "center", "centerCompressed", "columnCompressedSwitch", "rowCompressed"];
+	export type EuiFormRowDisplayKeys = (typeof DISPLAYS)[number]; type EuiFormRowCommonProps = CommonProps & {
 	    /**
-	     * When `rowCompressed`, just tightens up the spacing;
-	     * Set to `columnCompressed` if compressed
-	     * and horizontal layout is needed.
-	     * Set to `center` or `centerCompressed` to align non-input
-	     * content better with inline rows.
-	     * Set to `columnCompressedSwitch` if the form control being passed
-	     * as the child is a switch.
+	     * - `columnCompressed` creates a compressed and horizontal layout
+	     * - `columnCompressedSwitch` - **deprecated**, use `columnCompressed` instead
+	     * - `center`/`centerCompressed` helps align non-input content better with inline form layouts
+	     * - `rowCompressed` - **deprecated**, does not currently affect styling
 	     */
 	    display?: EuiFormRowDisplayKeys;
+	    /**
+	     * Useful for inline form layouts, primarily for content that
+	     * needs to be aligned with inputs but does not need a label
+	     */
 	    hasEmptyLabelSpace?: boolean;
 	    /**
 	     * Expand to fill 100% of the parent.
@@ -9711,14 +9906,7 @@ declare module '@elastic/eui/src/components/form/form_row/form_row' {
 	    labelType?: 'legend';
 	} & EuiFormRowCommonProps & Omit<HTMLAttributes<HTMLFieldSetElement>, 'disabled'>;
 	export type EuiFormRowProps = ExclusiveUnion<LabelProps, LegendProps>;
-	export class EuiFormRow extends Component<EuiFormRowProps, EuiFormRowState> {
-	    static contextType: React.Context<FormContextValue>;
-	    static defaultProps: Partial<EuiFormRowProps>;
-	    state: EuiFormRowState;
-	    onFocus: (...args: any[]) => void;
-	    onBlur: (...args: any[]) => void;
-	    render(): React.JSX.Element;
-	}
+	export const EuiFormRow: FunctionComponent<EuiFormRowProps>;
 	export {};
 
 }
@@ -9726,6 +9914,31 @@ declare module '@elastic/eui/src/components/form/form_row' {
 	export type { EuiFormRowProps } from '@elastic/eui/src/components/form/form_row/form_row';
 	export { EuiFormRow } from '@elastic/eui/src/components/form/form_row/form_row';
 
+}
+declare module '@elastic/eui/src/components/form/radio/radio.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiRadioStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiRadio: import("@emotion/utils").SerializedStyles;
+	    input: {
+	        euiRadio__circle: import("@emotion/utils").SerializedStyles;
+	        enabled: {
+	            selected: import("@emotion/utils").SerializedStyles;
+	            unselected: import("@emotion/utils").SerializedStyles;
+	        };
+	        disabled: {
+	            selected: import("@emotion/utils").SerializedStyles;
+	            unselected: import("@emotion/utils").SerializedStyles;
+	        };
+	        euiRadio__icon: import("@emotion/utils").SerializedStyles;
+	        euiRadio__input: import("@emotion/utils").SerializedStyles;
+	    };
+	    label: {
+	        euiRadio__label: import("@emotion/utils").SerializedStyles;
+	        enabled: string;
+	        disabled: import("@emotion/utils").SerializedStyles;
+	    };
+	};
+
 }
 declare module '@elastic/eui/src/components/form/radio/radio' {
 	import { FunctionComponent, ChangeEventHandler, HTMLAttributes, LabelHTMLAttributes, ReactNode } from 'react';
@@ -10498,6 +10711,66 @@ declare module '@elastic/eui/src/components/form/select' {
 	export type { EuiSelectProps, EuiSelectOption } from '@elastic/eui/src/components/form/select/select';
 	export { EuiSelect } from '@elastic/eui/src/components/form/select/select';
 
+}
+declare module '@elastic/eui/src/components/form/switch/switch.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiSwitchStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiSwitch: import("@emotion/utils").SerializedStyles;
+	    enabled: string;
+	    disabled: import("@emotion/utils").SerializedStyles;
+	    button: {
+	        euiSwitch__button: import("@emotion/utils").SerializedStyles;
+	        uncompressed: string;
+	        compressed: import("@emotion/utils").SerializedStyles;
+	        mini: import("@emotion/utils").SerializedStyles;
+	    };
+	    body: {
+	        euiSwitch__body: import("@emotion/utils").SerializedStyles;
+	        on: import("@emotion/utils").SerializedStyles;
+	        off: import("@emotion/utils").SerializedStyles;
+	        disabled: {
+	            uncompressed: import("@emotion/utils").SerializedStyles;
+	            compressed: import("@emotion/utils").SerializedStyles;
+	            mini: import("@emotion/utils").SerializedStyles;
+	        };
+	    };
+	    icons: {
+	        euiSwitch__icons: import("@emotion/utils").SerializedStyles;
+	        on: import("@emotion/utils").SerializedStyles;
+	        off: import("@emotion/utils").SerializedStyles;
+	        enabled: import("@emotion/utils").SerializedStyles;
+	        disabled: import("@emotion/utils").SerializedStyles;
+	    };
+	    thumb: {
+	        euiSwitch__thumb: import("@emotion/utils").SerializedStyles;
+	        off: import("@emotion/utils").SerializedStyles;
+	        readonly on: {
+	            uncompressed: import("@emotion/utils").SerializedStyles;
+	            compressed: import("@emotion/utils").SerializedStyles;
+	            mini: import("@emotion/utils").SerializedStyles;
+	        };
+	        enabled: {
+	            enabled: string;
+	            uncompressed: string;
+	            compressed: string;
+	            mini: string;
+	        };
+	        disabled: {
+	            disabled: import("@emotion/utils").SerializedStyles;
+	            uncompressed: string;
+	            compressed: string;
+	            mini: string;
+	        };
+	    };
+	    label: {
+	        euiSwitch__label: import("@emotion/utils").SerializedStyles;
+	        uncompressed: string;
+	        compressed: import("@emotion/utils").SerializedStyles;
+	        mini: import("@emotion/utils").SerializedStyles;
+	        disabled: import("@emotion/utils").SerializedStyles;
+	    };
+	};
+
 }
 declare module '@elastic/eui/src/components/form/switch/switch' {
 	import React, { ButtonHTMLAttributes, HTMLAttributes, FunctionComponent, ReactNode } from 'react';
@@ -10517,13 +10790,22 @@ declare module '@elastic/eui/src/components/form/switch/switch' {
 	    checked: boolean;
 	    onChange: (event: EuiSwitchEvent) => void;
 	    disabled?: boolean;
+	    /**
+	     * Compressed switches are smaller and contain no icon signifiers
+	     */
 	    compressed?: boolean;
 	    /**
 	     * Object of props passed to the label's `<span />`
 	     */
 	    labelProps?: CommonProps & HTMLAttributes<HTMLSpanElement>;
 	};
-	export const EuiSwitch: FunctionComponent<EuiSwitchProps>;
+	export const EuiSwitch: FunctionComponent<EuiSwitchProps & {
+	    /**
+	     * Mini styling is similar to compressed, but even smaller.
+	     * It's undocumented because it has very specific uses.
+	     */
+	    mini?: boolean;
+	}>;
 
 }
 declare module '@elastic/eui/src/components/form/switch' {
@@ -13119,8 +13401,6 @@ declare module '@elastic/eui/src/components/combo_box/combo_box_input/combo_box_
 	    formLayout: {
 	        euiComboBox__formControlLayout: import("@emotion/utils").SerializedStyles;
 	        multiSelect: import("@emotion/utils").SerializedStyles;
-	        prependOnly: import("@emotion/utils").SerializedStyles;
-	        appendOnly: import("@emotion/utils").SerializedStyles;
 	    };
 	};
 
@@ -16272,8 +16552,14 @@ declare module '@elastic/eui/src/components/date_picker/date_picker.styles' {
 	import { UseEuiTheme } from '@elastic/eui/src/services';
 	export const euiDatePickerStyles: (euiThemeContext: UseEuiTheme) => {
 	    euiDatePicker: import("@emotion/utils").SerializedStyles;
-	    inline: import("@emotion/utils").SerializedStyles;
-	    shadow: import("@emotion/utils").SerializedStyles;
+	    inline: {
+	        inline: import("@emotion/utils").SerializedStyles;
+	        noShadow: string;
+	        shadow: import("@emotion/utils").SerializedStyles;
+	        invalid: import("@emotion/utils").SerializedStyles;
+	        disabled: import("@emotion/utils").SerializedStyles;
+	        readOnly: import("@emotion/utils").SerializedStyles;
+	    };
 	};
 
 }
@@ -17053,6 +17339,10 @@ declare module '@elastic/eui/src/components/date_picker/date_picker_range.styles
 	    responsive: import("@emotion/utils").SerializedStyles;
 	    responsiveWithTimeSelect: import("@emotion/utils").SerializedStyles;
 	    shadow: import("@emotion/utils").SerializedStyles;
+	    formLayout: {
+	        noShadow: import("@emotion/utils").SerializedStyles;
+	        shadow: import("@emotion/utils").SerializedStyles;
+	    };
 	};
 
 }
@@ -30370,6 +30660,7 @@ declare module '@elastic/eui' {
 "euiFlyout.screenReaderFixedHeaders": any;
 "euiFieldPassword.showPassword": any;
 "euiFieldPassword.maskPassword": any;
+"euiFieldSearch.clearSearchButtonLabel": any;
 "euiFilePicker.promptText": any;
 "euiFilePicker.filesSelected": any;
 "euiFilePicker.removeSelectedAriaLabel": any;