@elastic/eui 110.0.0 → 111.0.0

package/eui.d.ts

@@ -5827,395 +5827,1142 @@ declare module '@elastic/eui/src/components/table' {
 	export { EuiTableRowCellCheckbox } from '@elastic/eui/src/components/table/table_row_cell_checkbox';
 
 }
-declare module '@elastic/eui/src/components/overlay_mask/overlay_mask.styles' {
-	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiOverlayMaskStyles: ({ euiTheme, highContrastMode, }: UseEuiTheme) => {
-	    euiOverlayMask: string;
-	    aboveHeader: string;
-	    belowHeader: string;
-	};
+declare module '@elastic/eui/src/components/flyout/manager/const' {
+	/**
+	 * Allowed values for `session` prop to control the way the session is managed for a flyout.
+	 */
+	export const SESSION_START = "start";
+	export const SESSION_INHERIT = "inherit";
+	export const SESSION_NEVER = "never";
+	/**
+	 * Data attribute applied to a managed flyout element to help identify it as a managed flyout.
+	 */
+	export const PROPERTY_FLYOUT = "data-managed-flyout";
+	/**
+	 * Data attribute indicating whether the flyout is the `main` or `child` flyout.
+	 */
+	export const PROPERTY_LEVEL = "data-managed-flyout-level";
+	/**
+	 * Data attribute representing how multiple flyouts are laid out
+	 * (`side-by-side` or `stacked`).
+	 */
+	export const PROPERTY_LAYOUT_MODE = "data-managed-flyout-layout-mode";
+	/** Stacked layout mode where child flyouts overlay on top of the main flyout. */
+	export const LAYOUT_MODE_STACKED = "stacked";
+	/** Side-by-side layout mode where child flyouts render adjacent to the main flyout. */
+	export const LAYOUT_MODE_SIDE_BY_SIDE = "side-by-side";
+	/** The primary (parent) flyout in a session. */
+	export const LEVEL_MAIN = "main";
+	/** The secondary (child) flyout spawned by the main flyout. */
+	export const LEVEL_CHILD = "child";
+	/** Flyout is mounting and playing its opening animation. */
+	export const STAGE_OPENING = "opening";
+	/** Flyout is fully visible and interactive. */
+	export const STAGE_ACTIVE = "active";
+	/** Flyout is unmounted or not currently visible/interactable. */
+	export const STAGE_INACTIVE = "inactive";
+	/** Main flyout is transitioning behind an active session flyout. */
+	export const STAGE_BACKGROUNDING = "backgrounding";
+	/** Main flyout is backgrounded behind an active session flyout. */
+	export const STAGE_BACKGROUNDED = "backgrounded";
+	/** Flyout is returning to the foreground from a backgrounded state. */
+	export const STAGE_RETURNING = "returning";
+	/** Flyout is playing its closing animation. */
+	export const STAGE_CLOSING = "closing";
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/types' {
+	import type { Action } from '@elastic/eui/src/components/flyout/manager/actions';
+	import { STAGE_CLOSING, STAGE_OPENING, STAGE_ACTIVE, STAGE_INACTIVE, STAGE_BACKGROUNDING, STAGE_BACKGROUNDED, STAGE_RETURNING, LAYOUT_MODE_SIDE_BY_SIDE, LAYOUT_MODE_STACKED, LEVEL_CHILD, LEVEL_MAIN } from '@elastic/eui/src/components/flyout/manager/const';
+	export type EuiFlyoutLayoutMode = typeof LAYOUT_MODE_STACKED | typeof LAYOUT_MODE_SIDE_BY_SIDE;
+	export type EuiFlyoutLevel = typeof LEVEL_MAIN | typeof LEVEL_CHILD;
+	export type EuiFlyoutActivityStage = typeof STAGE_OPENING | typeof STAGE_ACTIVE | typeof STAGE_INACTIVE | typeof STAGE_BACKGROUNDING | typeof STAGE_BACKGROUNDED | typeof STAGE_RETURNING | typeof STAGE_CLOSING;
+	export interface EuiManagedFlyoutState {
+	    flyoutId: string;
+	    level: EuiFlyoutLevel;
+	    width?: number;
+	    size?: string;
+	    activityStage?: EuiFlyoutActivityStage;
+	}
+	export interface FlyoutSession {
+	    /** ID of the main flyout for this session */
+	    mainFlyoutId: string;
+	    /** ID of the child flyout for this session */
+	    childFlyoutId: string | null;
+	    /** Title of the main flyout in this session */
+	    title: string;
+	    /** z-index value to be used by the flyout session */
+	    zIndex: number;
+	}
+	export interface PushPaddingOffsets {
+	    /** Push padding applied to the left side (in pixels) */
+	    left: number;
+	    /** Push padding applied to the right side (in pixels) */
+	    right: number;
+	}
+	export interface EuiFlyoutManagerState {
+	    sessions: FlyoutSession[];
+	    flyouts: EuiManagedFlyoutState[];
+	    layoutMode: EuiFlyoutLayoutMode;
+	    /** Active push padding offsets (updated by active push flyouts) */
+	    pushPadding?: PushPaddingOffsets;
+	    currentZIndex: number;
+	    unmanagedFlyouts: string[];
+	}
+	/**
+	 * Public API surface provided through React context.
+	 * Kept intentionally decoupled from action types to avoid module cycles.
+	 */
+	export interface FlyoutManagerApi {
+	    state: EuiFlyoutManagerState;
+	    dispatch: (action: Action) => void;
+	    addFlyout: (flyoutId: string, title: string, level?: EuiFlyoutLevel, size?: string) => void;
+	    closeFlyout: (flyoutId: string) => void;
+	    setActiveFlyout: (flyoutId: string | null) => void;
+	    setFlyoutWidth: (flyoutId: string, width: number) => void;
+	    setPushPadding: (side: 'left' | 'right', width: number) => void;
+	    goBack: () => void;
+	    goToFlyout: (flyoutId: string) => void;
+	    addUnmanagedFlyout: (flyoutId: string) => void;
+	    closeUnmanagedFlyout: (flyoutId: string) => void;
+	    historyItems: Array<{
+	        title: string;
+	        onClick: () => void;
+	    }>;
+	}
 
 }
-declare module '@elastic/eui/src/components/overlay_mask/overlay_mask_body.styles' {
-	export const euiOverlayMaskBodyStyles: import("@emotion/react").SerializedStyles;
+declare module '@elastic/eui/src/components/flyout/manager/actions' {
+	import { EuiFlyoutActivityStage, EuiFlyoutLevel, EuiFlyoutLayoutMode } from '@elastic/eui/src/components/flyout/manager/types'; const PREFIX: "eui/flyoutManager";
+	interface BaseAction {
+	    type: `${typeof PREFIX}/${string}`;
+	}
+	/** Dispatched when a flyout registers itself with the manager. */
+	export const ACTION_ADD: "eui/flyoutManager/add";
+	/** Dispatched to remove a flyout from the manager (usually on close/unmount). */
+	export const ACTION_CLOSE: "eui/flyoutManager/close";
+	/** Dispatched to set which flyout is currently active within the session. */
+	export const ACTION_SET_ACTIVE: "eui/flyoutManager/setActive";
+	/** Dispatched when an active flyout's pixel width changes (for responsive layout). */
+	export const ACTION_SET_WIDTH: "eui/flyoutManager/setWidth";
+	/** Dispatched to switch layout mode between `side-by-side` and `stacked`. */
+	export const ACTION_SET_LAYOUT_MODE: "eui/flyoutManager/setLayoutMode";
+	/** Dispatched to update a flyout's activity stage (e.g., opening -> active). */
+	export const ACTION_SET_ACTIVITY_STAGE: "eui/flyoutManager/setActivityStage";
+	/** Dispatched to go back one session (remove current session). */
+	export const ACTION_GO_BACK: "eui/flyoutManager/goBack";
+	/** Dispatched to navigate to a specific flyout (remove all sessions after it). */
+	export const ACTION_GO_TO_FLYOUT: "eui/flyoutManager/goToFlyout";
+	/** Dispatched to set push padding offset for a side. */
+	export const ACTION_SET_PUSH_PADDING: "eui/flyoutManager/setPushPadding";
+	export const ACTION_ADD_UNMANAGED_FLYOUT: "eui/flyoutManager/addUnmanagedFlyout";
+	export const ACTION_CLOSE_UNMANAGED_FLYOUT: "eui/flyoutManager/closeUnmanagedFlyout";
+	/**
+	 * Add a flyout to manager state. The manager will create or update
+	 * the current session depending on the `level` provided.
+	 */
+	export interface AddFlyoutAction extends BaseAction {
+	    type: typeof ACTION_ADD;
+	    flyoutId: string;
+	    title: string;
+	    level: EuiFlyoutLevel;
+	    size?: string;
+	}
+	/** Remove a flyout from manager state. Also updates the active session. */
+	export interface CloseFlyoutAction extends BaseAction {
+	    type: typeof ACTION_CLOSE;
+	    flyoutId: string;
+	}
+	/** Set the active flyout within the current session (or clear with `null`). */
+	export interface SetActiveFlyoutAction extends BaseAction {
+	    type: typeof ACTION_SET_ACTIVE;
+	    flyoutId: string | null;
+	}
+	/** Update a flyout's measured width in pixels. */
+	export interface SetWidthAction extends BaseAction {
+	    type: typeof ACTION_SET_WIDTH;
+	    flyoutId: string;
+	    width: number;
+	}
+	/** Change how flyouts are arranged: `side-by-side` or `stacked`. */
+	export interface SetLayoutModeAction extends BaseAction {
+	    type: typeof ACTION_SET_LAYOUT_MODE;
+	    layoutMode: EuiFlyoutLayoutMode;
+	}
+	/** Set a specific flyout's activity stage. */
+	export interface SetActivityStageAction extends BaseAction {
+	    type: typeof ACTION_SET_ACTIVITY_STAGE;
+	    flyoutId: string;
+	    activityStage: EuiFlyoutActivityStage;
+	}
+	/** Go back one session (remove current session from stack). */
+	export interface GoBackAction extends BaseAction {
+	    type: typeof ACTION_GO_BACK;
+	}
+	/** Navigate to a specific flyout (remove all sessions after it). */
+	export interface GoToFlyoutAction extends BaseAction {
+	    type: typeof ACTION_GO_TO_FLYOUT;
+	    flyoutId: string;
+	}
+	/** Set push padding offset for a specific side. */
+	export interface SetPushPaddingAction extends BaseAction {
+	    type: typeof ACTION_SET_PUSH_PADDING;
+	    side: 'left' | 'right';
+	    width: number;
+	}
+	export interface AddUnmanagedFlyoutAction extends BaseAction {
+	    type: typeof ACTION_ADD_UNMANAGED_FLYOUT;
+	    flyoutId: string;
+	}
+	export interface CloseUnmanagedFlyoutAction extends BaseAction {
+	    type: typeof ACTION_CLOSE_UNMANAGED_FLYOUT;
+	    flyoutId: string;
+	}
+	/** Union of all flyout manager actions. */
+	export type Action = AddFlyoutAction | CloseFlyoutAction | SetActiveFlyoutAction | SetWidthAction | SetLayoutModeAction | SetActivityStageAction | GoBackAction | GoToFlyoutAction | SetPushPaddingAction | AddUnmanagedFlyoutAction | CloseUnmanagedFlyoutAction;
+	/**
+	 * Register a flyout with the manager.
+	 * - `title` is used for the flyout menu.
+	 * - `level` determines whether the flyout is `main` or `child`.
+	 * - Optional `size` is the named EUI size (e.g. `s`, `m`, `l`).
+	 */
+	export const addFlyout: (flyoutId: string, title: string, level?: EuiFlyoutLevel, size?: string) => AddFlyoutAction;
+	/** Unregister a flyout and update the session accordingly. */
+	export const closeFlyout: (flyoutId: string) => CloseFlyoutAction;
+	/** Set or clear the active flyout for the current session. */
+	export const setActiveFlyout: (flyoutId: string | null) => SetActiveFlyoutAction;
+	/** Record a flyout's current width in pixels. */
+	export const setFlyoutWidth: (flyoutId: string, width: number) => SetWidthAction;
+	/** Switch layout mode between `side-by-side` and `stacked`. */
+	export const setLayoutMode: (layoutMode: EuiFlyoutLayoutMode) => SetLayoutModeAction;
+	/** Update a flyout's activity stage. */
+	export const setActivityStage: (flyoutId: string, activityStage: EuiFlyoutActivityStage) => SetActivityStageAction;
+	/** Go back one session (remove current session from stack). */
+	export const goBack: () => GoBackAction;
+	/** Navigate to a specific flyout (remove all sessions after it). */
+	export const goToFlyout: (flyoutId: string) => GoToFlyoutAction;
+	/** Set push padding offset for a specific side. */
+	export const setPushPadding: (side: "left" | "right", width: number) => SetPushPaddingAction;
+	/** Register an unmanaged flyout for z-index positioning purposes */
+	export const addUnmanagedFlyout: (flyoutId: string) => AddUnmanagedFlyoutAction;
+	/** Unregister an unmanaged flyout */
+	export const closeUnmanagedFlyout: (flyoutId: string) => CloseUnmanagedFlyoutAction;
+	export {};
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/reducer' {
+	import { Action } from '@elastic/eui/src/components/flyout/manager/actions';
+	import { EuiFlyoutManagerState } from '@elastic/eui/src/components/flyout/manager/types';
+	/**
+	 * Default flyout manager state used to initialize the reducer.
+	 */
+	export const initialState: EuiFlyoutManagerState;
+	/**
+	 * Reducer handling all flyout manager actions and state transitions.
+	 */
+	export function flyoutManagerReducer(state: EuiFlyoutManagerState | undefined, action: Action): EuiFlyoutManagerState;
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/selectors' {
+	export const useSession: (flyoutId?: string | null) => import ("@elastic/eui/src/components/flyout/manager/types").FlyoutSession | null;
+	/** True when any managed flyout session is currently active. */
+	export const useHasActiveSession: () => boolean;
+	/** True if the given `flyoutId` is the main or child flyout in the latest session. */
+	export const useIsFlyoutActive: (flyoutId: string) => boolean;
+	export const useFlyout: (flyoutId?: string | null) => import ("@elastic/eui/src/components/flyout/manager/types").EuiManagedFlyoutState | null;
+	export const useIsFlyoutRegistered: (flyoutId?: string | null) => boolean;
+	/** The most recent flyout session or `null` if none. */
+	export const useCurrentSession: () => import ("@elastic/eui/src/components/flyout/manager/types").FlyoutSession | null;
+	/** The registered state of the current session's main flyout, if present. */
+	export const useCurrentMainFlyout: () => import ("@elastic/eui/src/components/flyout/manager/types").EuiManagedFlyoutState | null;
+	/** The registered state of the current session's child flyout, if present. */
+	export const useCurrentChildFlyout: () => import ("@elastic/eui/src/components/flyout/manager/types").EuiManagedFlyoutState | null;
+	/** The measured width (px) of the specified flyout, or `null` if unknown. */
+	export const useFlyoutWidth: (flyoutId?: string | null) => number | undefined;
+	/** The configured size of the parent (main) flyout for a given child flyout ID. */
+	export const useParentFlyoutSize: (childFlyoutId: string) => string | undefined;
+	/** True if the provided `flyoutId` is the main flyout and it currently has a child. */
+	export const useHasChildFlyout: (flyoutId: string) => boolean;
+	/** Get the current push padding offsets from manager state. */
+	export const usePushPaddingOffsets: () => import ("@elastic/eui/src/components/flyout/manager/types").PushPaddingOffsets;
+	/** True if there's any active push padding (left or right side). */
+	export const useHasPushPadding: () => boolean;
+	/** Get the ref for the current flyout z-index to be used */
+	export const useCurrentFlyoutZIndexRef: () => import("react").MutableRefObject<number>;
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/context' {
+	import React from 'react';
+	/**
+	 * React provider that marks descendants as being rendered inside
+	 * an EUI managed flyout. Used by hooks/components to alter behavior
+	 * (e.g., focus handling) when inside a managed flyout tree.
+	 */
+	export const EuiFlyoutIsManagedProvider: ({ isManaged, children, }: {
+	    isManaged: boolean;
+	    children: React.ReactNode;
+	}) => React.JSX.Element;
+	/**
+	 * Hook that returns `true` when called within an EUI managed flyout subtree.
+	 */
+	export const useIsInManagedFlyout: () => boolean;
 
 }
-declare module '@elastic/eui/src/components/overlay_mask/overlay_mask' {
-	import { FunctionComponent, HTMLAttributes, MutableRefObject, ReactNode, Ref } from 'react';
-	import { CommonProps } from '@elastic/eui/src/components/common';
-	export interface EuiOverlayMaskInterface {
-	    /**
-	     * ReactNode to render as this component's content
-	     */
-	    children?: ReactNode;
-	    /**
-	     * Should the mask visually sit above or below the EuiHeader (controlled by z-index)
-	     */
-	    headerZindexLocation?: 'above' | 'below';
-	    /**
-	     * React ref to be passed to the wrapping container
-	     */
-	    maskRef?: Ref<HTMLDivElement> | MutableRefObject<HTMLDivElement>;
+declare module '@elastic/eui/src/components/flyout/manager/hooks' {
+	export { useIsFlyoutActive, useHasActiveSession, useCurrentSession, useCurrentMainFlyout, useCurrentChildFlyout, useFlyoutWidth, useParentFlyoutSize, useHasChildFlyout, usePushPaddingOffsets, useHasPushPadding, } from '@elastic/eui/src/components/flyout/manager/selectors';
+	export { useFlyoutLayoutMode } from '@elastic/eui/src/components/flyout/manager/layout_mode';
+	export { useIsInManagedFlyout } from '@elastic/eui/src/components/flyout/manager/context';
+	export type { EuiFlyoutActivityStage } from '@elastic/eui/src/components/flyout/manager/types';
+	/** Access the flyout manager context (state and actions). */
+	export const useFlyoutManager: () => import ("@elastic/eui/src/components/flyout/manager/types").FlyoutManagerApi | null;
+	/**
+	 * Stable flyout ID utility. Uses the passed `id` if provided and not already registered,
+	 * otherwise generates a deterministic ID for the component's lifetime.
+	 * The ID remains stable across re-renders to maintain consistency in effects and other hooks.
+	 */
+	export const useFlyoutId: (flyoutId?: string) => string;
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/layout_mode' {
+	import { EuiFlyoutLayoutMode } from '@elastic/eui/src/components/flyout/manager/types';
+	/**
+	 * Hook to handle responsive layout mode for managed flyouts.
+	 * Decides whether to place flyouts side-by-side or stacked based on
+	 * viewport width and flyout widths/sizes.
+	 */
+	export const useApplyFlyoutLayoutMode: () => void;
+	/** Convert a flyout `size` value to a pixel width using theme breakpoints. */
+	export const getWidthFromSize: (size: string | number) => number;
+	/** Current layout mode for managed flyouts (`side-by-side` or `stacked`). */
+	export const useFlyoutLayoutMode: () => EuiFlyoutLayoutMode;
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/store' {
+	import type { EuiFlyoutLevel, EuiFlyoutManagerState } from '@elastic/eui/src/components/flyout/manager/types';
+	import type { Action } from '@elastic/eui/src/components/flyout/manager/actions';
+	type Listener = () => void;
+	export interface FlyoutManagerStore {
+	    getState: () => EuiFlyoutManagerState;
+	    subscribe: (listener: Listener) => () => void;
+	    dispatch: (action: Action) => void;
+	    addFlyout: (flyoutId: string, title: string, level?: EuiFlyoutLevel, size?: string) => void;
+	    closeFlyout: (flyoutId: string) => void;
+	    setActiveFlyout: (flyoutId: string | null) => void;
+	    setFlyoutWidth: (flyoutId: string, width: number) => void;
+	    setPushPadding: (side: 'left' | 'right', width: number) => void;
+	    goBack: () => void;
+	    goToFlyout: (flyoutId: string) => void;
+	    addUnmanagedFlyout: (flyoutId: string) => void;
+	    closeUnmanagedFlyout: (flyoutId: string) => void;
+	    historyItems: Array<{
+	        title: string;
+	        onClick: () => void;
+	    }>;
 	}
-	export type EuiOverlayMaskProps = Omit<CommonProps, 'css'> & Omit<Partial<Record<keyof HTMLAttributes<HTMLDivElement>, string>>, keyof EuiOverlayMaskInterface> & EuiOverlayMaskInterface;
-	export const EuiOverlayMask: FunctionComponent<EuiOverlayMaskProps>;
+	/**
+	 * Returns a singleton store instance shared across all React roots within the same JS context.
+	 * Uses module-level singleton to ensure deduplication even if modules are loaded twice.
+	 */
+	export function getFlyoutManagerStore(): FlyoutManagerStore;
+	/**
+	 * For testing purposes - allows resetting the store
+	 */
+	export function _resetFlyoutManagerStore(): void;
+	export {};
 
 }
-declare module '@elastic/eui/src/components/overlay_mask' {
-	export type { EuiOverlayMaskProps } from '@elastic/eui/src/components/overlay_mask/overlay_mask';
-	export { EuiOverlayMask } from '@elastic/eui/src/components/overlay_mask/overlay_mask';
+declare module '@elastic/eui/src/components/flyout/manager/provider' {
+	import React from 'react';
+	import { FlyoutManagerApi } from '@elastic/eui/src/components/flyout/manager/types';
+	/**
+	 * React context that exposes the Flyout Manager API (state + actions).
+	 */
+	export const EuiFlyoutManagerContext: React.Context<FlyoutManagerApi | null>;
+	/**
+	 * Provides the Flyout Manager API via context and runs layout-mode logic.
+	 */
+	export const EuiFlyoutManager: React.FC<{
+	    children: React.ReactNode;
+	}>;
+	/** Hook to access the Flyout Manager API from context. */
+	export const useFlyoutManager: () => FlyoutManagerApi | null;
 
 }
-declare module '@elastic/eui/src/components/flyout/flyout.styles' {
-	import { EuiFlyoutSize } from '@elastic/eui/src/components/flyout/flyout';
-	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const FLYOUT_BREAKPOINT: "m";
-	export const euiFlyoutSlideInRight: import("@emotion/serialize").Keyframes;
-	export const euiFlyoutSlideInLeft: import("@emotion/serialize").Keyframes;
-	export const euiFlyoutStyles: (euiThemeContext: UseEuiTheme) => {
-	    euiFlyout: import("@emotion/react").SerializedStyles;
-	    s: import("@emotion/react").SerializedStyles;
-	    m: import("@emotion/react").SerializedStyles;
-	    l: import("@emotion/react").SerializedStyles;
-	    noMaxWidth: import("@emotion/react").SerializedStyles;
-	    right: import("@emotion/react").SerializedStyles;
-	    left: import("@emotion/react").SerializedStyles;
-	    overlay: {
-	        overlay: import("@emotion/react").SerializedStyles;
-	        left: import("@emotion/react").SerializedStyles;
-	        right: import("@emotion/react").SerializedStyles;
-	    };
-	    push: {
-	        push: import("@emotion/react").SerializedStyles;
-	        right: import("@emotion/react").SerializedStyles;
-	        left: import("@emotion/react").SerializedStyles;
-	        noAnimation: import("@emotion/react").SerializedStyles;
-	    };
-	    paddingSizes: {
-	        none: import("@emotion/react").SerializedStyles;
-	        s: import("@emotion/react").SerializedStyles;
-	        m: import("@emotion/react").SerializedStyles;
-	        l: import("@emotion/react").SerializedStyles;
-	    };
+declare module '@elastic/eui/src/components/link/external_link_icon' {
+	import { FunctionComponent, AnchorHTMLAttributes } from 'react';
+	import { EuiIconProps } from '@elastic/eui/src/components/icon';
+	/**
+	 * DRY util for indicating external links both via icon and to
+	 * screen readers. Used internally by at EuiLink and EuiListGroupItem
+	 */
+	export type EuiExternalLinkIconProps = {
+	    target?: AnchorHTMLAttributes<HTMLAnchorElement>['target'];
+	    /**
+	     * Set to true to show an icon indicating that it is an external link;
+	     * Defaults to true if `target="_blank"`
+	     */
+	    external?: boolean;
 	};
-	export const maxedFlyoutWidth: (euiThemeContext: UseEuiTheme) => string;
-	export const composeFlyoutSizing: (euiThemeContext: UseEuiTheme, size: EuiFlyoutSize) => string;
+	export const EuiExternalLinkIcon: FunctionComponent<EuiExternalLinkIconProps & Partial<EuiIconProps>>;
 
 }
-declare module '@elastic/eui/src/components/flyout/_flyout_close_button.styles' {
+declare module '@elastic/eui/src/components/list_group/list_group_item_extra_action.styles' {
 	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiFlyoutCloseButtonStyles: (euiThemeContext: UseEuiTheme) => {
-	    euiFlyout__closeButton: import("@emotion/react").SerializedStyles;
-	    inside: import("@emotion/react").SerializedStyles;
-	    outside: import("@emotion/react").SerializedStyles;
-	    outsideSide: {
-	        right: import("@emotion/react").SerializedStyles;
-	        left: import("@emotion/react").SerializedStyles;
-	    };
+	export const euiListGroupItemExtraActionStyles: ({ euiTheme, }: UseEuiTheme) => {
+	    euiListGroupItemExtraAction: import("@emotion/react").SerializedStyles;
+	    hoverStyles: import("@emotion/react").SerializedStyles;
+	    alwaysShow: import("@emotion/react").SerializedStyles;
 	};
 
 }
-declare module '@elastic/eui/src/components/flyout/_flyout_close_button' {
+declare module '@elastic/eui/src/components/list_group/list_group_item_extra_action' {
 	import { FunctionComponent } from 'react';
-	import type { EuiFlyoutProps } from '@elastic/eui/src/components/flyout/flyout';
-	type EuiFlyoutCloseButtonProps = EuiFlyoutProps['closeButtonProps'] & Required<Pick<EuiFlyoutProps, 'closeButtonPosition' | 'onClose' | 'side'>>;
-	export const EuiFlyoutCloseButton: FunctionComponent<EuiFlyoutCloseButtonProps>;
+	import { EuiButtonIconPropsForButton } from '@elastic/eui/src/components/button';
+	export type EuiListGroupItemExtraActionProps = {
+	    alwaysShow?: boolean;
+	} & EuiButtonIconPropsForButton;
+	type _FromEuiListGroupItem = {
+	    parentIsDisabled?: boolean;
+	};
+	export const EuiListGroupItemExtraAction: FunctionComponent<EuiListGroupItemExtraActionProps & _FromEuiListGroupItem>;
 	export {};
 
 }
-declare module '@elastic/eui/src/components/flyout/flyout_child.styles' {
+declare module '@elastic/eui/src/components/list_group/list_group_item.styles' {
 	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiFlyoutChildStyles: (euiThemeContext: UseEuiTheme) => {
-	    euiFlyoutChild: import("@emotion/react").SerializedStyles;
-	    backgroundDefault: import("@emotion/react").SerializedStyles;
-	    backgroundShaded: import("@emotion/react").SerializedStyles;
-	    sidePosition: import("@emotion/react").SerializedStyles;
-	    stackedPosition: import("@emotion/react").SerializedStyles;
+	export const euiListGroupItemStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiListGroupItem: import("@emotion/react").SerializedStyles;
+	    xs: import("@emotion/react").SerializedStyles;
 	    s: import("@emotion/react").SerializedStyles;
 	    m: import("@emotion/react").SerializedStyles;
-	    overflow: {
-	        overflow: import("@emotion/react").SerializedStyles;
-	        wrapper: import("@emotion/react").SerializedStyles;
+	    l: import("@emotion/react").SerializedStyles;
+	    colors: {
+	        isActive: {
+	            primary: import("@emotion/react").SerializedStyles;
+	            text: import("@emotion/react").SerializedStyles;
+	            subdued: import("@emotion/react").SerializedStyles;
+	        };
+	        isClickable: {
+	            primary: import("@emotion/react").SerializedStyles;
+	            text: import("@emotion/react").SerializedStyles;
+	            subdued: import("@emotion/react").SerializedStyles;
+	        };
 	    };
-	    banner: import("@emotion/react").SerializedStyles;
 	};
-
-}
-declare module '@elastic/eui/src/components/flyout/flyout_context' {
-	import { RefObject } from 'react';
-	import { EuiFlyoutSize } from '@elastic/eui/src/components/flyout/flyout';
-	/**
-	 * Context shared between the main and child flyouts
-	 * @internal
-	 */
-	export interface EuiFlyoutContextValue {
-	    parentSize?: EuiFlyoutSize | string | number;
-	    parentFlyoutRef?: RefObject<HTMLDivElement>;
-	    isChildFlyoutOpen?: boolean;
-	    setIsChildFlyoutOpen?: (isOpen: boolean) => void;
-	    childLayoutMode?: 'side-by-side' | 'stacked';
-	}
-	export const EuiFlyoutContext: import("react").Context<EuiFlyoutContextValue | null>;
-
-}
-declare module '@elastic/eui/src/components/flyout/flyout_body.styles' {
-	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiFlyoutBodyStyles: (euiThemeContext: UseEuiTheme) => {
-	    euiFlyoutBody: import("@emotion/react").SerializedStyles;
-	    overflow: {
-	        euiFlyoutBody__overflow: import("@emotion/react").SerializedStyles;
-	        noBanner: import("@emotion/react").SerializedStyles;
-	        hasBanner: import("@emotion/react").SerializedStyles;
-	    };
-	    euiFlyoutBody__banner: import("@emotion/react").SerializedStyles;
+	export const euiListGroupItemInnerStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiListGroupItem__inner: import("@emotion/react").SerializedStyles;
+	    xs: import("@emotion/react").SerializedStyles;
+	    s: import("@emotion/react").SerializedStyles;
+	    m: import("@emotion/react").SerializedStyles;
+	    l: import("@emotion/react").SerializedStyles;
+	    primary: import("@emotion/react").SerializedStyles;
+	    text: import("@emotion/react").SerializedStyles;
+	    subdued: import("@emotion/react").SerializedStyles;
+	    ghost: import("@emotion/react").SerializedStyles;
+	    isDisabled: import("@emotion/react").SerializedStyles;
+	    isActive: import("@emotion/react").SerializedStyles;
+	    isClickable: import("@emotion/react").SerializedStyles;
+	    externalIcon: import("@emotion/react").SerializedStyles;
+	};
+	export const euiListGroupItemLabelStyles: {
+	    euiListGroupItem__label: import("@emotion/react").SerializedStyles;
+	    truncate: import("@emotion/react").SerializedStyles;
+	    wrapText: import("@emotion/react").SerializedStyles;
+	};
+	export const euiListGroupItemIconStyles: ({ euiTheme }: UseEuiTheme) => {
+	    euiListGroupItem__icon: import("@emotion/react").SerializedStyles;
+	};
+	export const euiListGroupItemTooltipStyles: {
+	    euiListGroupItem__tooltip: import("@emotion/react").SerializedStyles;
 	};
 
 }
-declare module '@elastic/eui/src/components/flyout/flyout_body' {
-	import { FunctionComponent, HTMLAttributes, ReactNode } from 'react';
-	import { CommonProps } from '@elastic/eui/src/components/common';
-	export type EuiFlyoutBodyProps = FunctionComponent<HTMLAttributes<HTMLDivElement> & CommonProps & {
+declare module '@elastic/eui/src/components/list_group/list_group_item' {
+	import React, { HTMLAttributes, AnchorHTMLAttributes, ButtonHTMLAttributes, ReactNode, ReactElement, MouseEventHandler, FunctionComponent } from 'react';
+	import { ExclusiveUnion, CommonProps } from '@elastic/eui/src/components/common';
+	import { IconType, EuiIconProps } from '@elastic/eui/src/components/icon';
+	import { EuiToolTipProps } from '@elastic/eui/src/components/tool_tip';
+	import { EuiListGroupItemExtraActionProps } from '@elastic/eui/src/components/list_group/list_group_item_extra_action';
+	export const SIZES: readonly ["xs", "s", "m", "l"];
+	export type EuiListGroupItemSize = (typeof SIZES)[number];
+	export const COLORS: readonly ["primary", "text", "subdued"];
+	export type EuiListGroupItemColor = (typeof COLORS)[number];
+	export type EuiListGroupItemProps = CommonProps & Omit<ExclusiveUnion<ExclusiveUnion<ButtonHTMLAttributes<HTMLButtonElement>, Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>>, HTMLAttributes<HTMLSpanElement>>, 'onClick' | 'color' | 'target' | 'rel'> & {
 	    /**
-	     * Use to display a banner at the top of the body. It is suggested to use `EuiCallOut` for it.
+	     * Size of the label text
 	     */
-	    banner?: ReactNode;
+	    size?: EuiListGroupItemSize;
 	    /**
-	     * [Scrollable regions (or their children) should be focusable](https://dequeuniversity.com/rules/axe/4.0/scrollable-region-focusable)
-	     * to allow keyboard users to scroll the region via arrow keys.
-	     *
-	     * By default, EuiFlyoutBody's scroll overflow wrapper sets a `tabIndex` of `0`.
-	     * If you know your flyout body content already contains focusable children
-	     * that satisfy keyboard accessibility requirements, you can use this prop
-	     * to override this default.
+	     * By default the item will get the color `text`.
+	     * You can customize the color of the item by passing a color name.
 	     */
-	    scrollableTabIndex?: number;
-	}>;
-	export const EuiFlyoutBody: EuiFlyoutBodyProps;
-
-}
-declare module '@elastic/eui/src/components/flyout/flyout_child' {
-	import { FunctionComponent, HTMLAttributes, ReactNode } from 'react';
-	import { CommonProps } from '@elastic/eui/src/components/common';
-	/**
-	 * Props used to render and configure the child flyout panel
-	 */
-	export interface EuiFlyoutChildProps extends HTMLAttributes<HTMLDivElement>, CommonProps {
+	    color?: EuiListGroupItemColor;
 	    /**
-	     * Called when the child panel's close button is clicked
+	     * Content to be displayed in the list item
 	     */
-	    onClose: (event: MouseEvent | TouchEvent | KeyboardEvent) => void;
+	    label: ReactNode;
 	    /**
-	     * Use to display a banner at the top of the child. It is suggested to use `EuiCallOut` for it.
+	     * Apply styles indicating an item is active
 	     */
-	    banner?: ReactNode;
+	    isActive?: boolean;
 	    /**
-	     * Hides the default close button. You must provide another close button somewhere within the child flyout.
-	     * @default false
+	     * Apply styles indicating an item is disabled
 	     */
-	    hideCloseButton?: boolean;
+	    isDisabled?: boolean;
 	    /**
-	     * [Scrollable regions (or their children) should be focusable](https://dequeuniversity.com/rules/axe/4.0/scrollable-region-focusable)
-	     * to allow keyboard users to scroll the region via arrow keys.
-	     *
-	     * By default, EuiFlyoutChild's scroll overflow wrapper sets a `tabIndex` of `0`.
-	     * If you know your flyout child content already contains focusable children
-	     * that satisfy keyboard accessibility requirements, you can use this prop
-	     * to override this default.
+	     * Make the list item label a link.
+	     * While permitted, `href` and `onClick` should not be used together in most cases and may create problems.
 	     */
-	    scrollableTabIndex?: number;
+	    href?: string;
+	    rel?: string;
+	    target?: string;
 	    /**
-	     * Size of the child flyout panel.
-	     * When the parent flyout is 'm', child is limited to 's'.
-	     * @default 's'
+	     * Set to true to show an icon indicating that it is an external link;
+	     * Defaults to true if `target="_blank"`
 	     */
-	    size?: 's' | 'm';
-	    backgroundStyle?: 'shaded' | 'default';
+	    external?: boolean;
 	    /**
-	     * Children are implicitly part of FunctionComponent, but good to have if props type is standalone.
+	     * Adds `EuiIcon` of `EuiIcon.type`
 	     */
-	    children?: ReactNode;
-	}
-	/**
-	 * The child flyout is a panel that appears to the left of the parent flyout.
-	 * It is only visible when the parent flyout is open.
-	 */
-	export const EuiFlyoutChild: FunctionComponent<EuiFlyoutChildProps>;
-
-}
-declare module '@elastic/eui/src/components/flyout/flyout_child_manager' {
-	import React, { ComponentProps, FunctionComponent, ReactNode } from 'react';
-	import { EuiFlyoutChild } from '@elastic/eui/src/components/flyout/flyout_child';
-	interface EuiFlyoutChildProviderProps {
-	    parentSize: 's' | 'm';
-	    parentFlyoutRef: React.RefObject<HTMLDivElement>;
-	    childElement: React.ReactElement<ComponentProps<typeof EuiFlyoutChild>>;
-	    childrenToRender: ReactNode;
-	    reportIsChildOpen: (isOpen: boolean) => void;
-	    reportChildLayoutMode: (mode: 'side-by-side' | 'stacked') => void;
-	}
-	/**
-	 * An intermediate component between EuiFlyout and EuiFlyoutChild.
-	 * It is responsible for managing the state of the child flyout, and passing it to EuiFlyoutContext.
-	 * It removes the responsibility of managing child flyout state from EuiFlyout, which is especially important there might not be a child flyout.
-	 */
-	export const EuiFlyoutChildProvider: FunctionComponent<EuiFlyoutChildProviderProps>;
-	export {};
-
-}
-declare module '@elastic/eui/src/components/flyout/flyout' {
-	import { ComponentPropsWithRef, CSSProperties, ElementType, JSX } from 'react';
-	import { EuiBreakpointSize } from '@elastic/eui/src/services';
-	import { CommonProps, PropsOfElement } from '@elastic/eui/src/components/common';
-	import { EuiFocusTrapProps } from '@elastic/eui/src/components/focus_trap';
-	import { EuiOverlayMaskProps } from '@elastic/eui/src/components/overlay_mask';
-	import type { EuiButtonIconPropsForButton } from '@elastic/eui/src/components/button';
-	export const TYPES: readonly ["push", "overlay"];
-	type _EuiFlyoutType = (typeof TYPES)[number];
-	export const SIDES: readonly ["left", "right"];
-	export type _EuiFlyoutSide = (typeof SIDES)[number];
-	export const SIZES: readonly ["s", "m", "l"];
-	export type EuiFlyoutSize = (typeof SIZES)[number];
-	export const PADDING_SIZES: readonly ["none", "s", "m", "l"];
-	export type _EuiFlyoutPaddingSize = (typeof PADDING_SIZES)[number];
-	interface _EuiFlyoutProps {
-	    onClose: (event: MouseEvent | TouchEvent | KeyboardEvent) => void;
+	    iconType?: IconType;
 	    /**
-	     * Defines the width of the panel.
-	     * Pass a predefined size of `s | m | l`, or pass any number/string compatible with the CSS `width` attribute
-	     * @default m
+	     * Further extend the props applied to EuiIcon
 	     */
-	    size?: EuiFlyoutSize | CSSProperties['width'];
+	    iconProps?: Omit<EuiIconProps, 'type'>;
 	    /**
-	     * Sets the max-width of the panel,
-	     * set to `true` to use the default size,
-	     * set to `false` to not restrict the width,
-	     * set to a number for a custom width in px,
-	     * set to a string for a custom width in custom measurement.
-	     * @default false
+	     * Custom node to pass as the icon. Cannot be used in conjunction
+	     * with `iconType` and `iconProps`.
 	     */
-	    maxWidth?: boolean | number | string;
+	    icon?: ReactElement;
 	    /**
-	     * Customize the padding around the content of the flyout header, body and footer
-	     * @default l
+	     * Display tooltip on list item
 	     */
-	    paddingSize?: _EuiFlyoutPaddingSize;
+	    showToolTip?: boolean;
 	    /**
-	     * Adds an EuiOverlayMask and wraps in an EuiPortal
-	     * @default true
+	     * An object of {@link EuiListGroupItemExtraAction} props.
+	     * Adds an `EuiButtonIcon` to the right side of the item; `iconType` is required;
+	     * pass `alwaysShow` if you don't want the default behavior of only showing on hover
 	     */
-	    ownFocus?: boolean;
+	    extraAction?: EuiListGroupItemExtraActionProps;
 	    /**
-	     * Hides the default close button. You must provide another close button somewhere within the flyout.
-	     * @default false
+	     * Make the list item label a button.
+	     * While permitted, `href` and `onClick` should not be used together in most cases and may create problems.
 	     */
-	    hideCloseButton?: boolean;
+	    onClick?: MouseEventHandler<HTMLButtonElement>;
 	    /**
-	     * Extends EuiButtonIconProps onto the close button
+	     * Allow link text to wrap
 	     */
-	    closeButtonProps?: Partial<EuiButtonIconPropsForButton>;
+	    wrapText?: boolean;
 	    /**
-	     * Position of close button.
-	     * `inside`: Floating to just inside the flyout, always top right;
-	     * `outside`: Floating just outside the flyout near the top (side dependent on `side`). Helpful when the close button may cover other interactable content.
-	     * @default inside
+	     * Pass-through ref reference specifically for targeting
+	     * instances where the item content is rendered as a `button`
 	     */
-	    closeButtonPosition?: 'inside' | 'outside';
+	    buttonRef?: React.Ref<HTMLButtonElement>;
 	    /**
-	     * Adjustments to the EuiOverlayMask that is added when `ownFocus = true`
+	     * Text to be displayed in the tooltip when `showToolTip` is true.
+	     * By default the text will be same as the label text.
 	     */
-	    maskProps?: EuiOverlayMaskProps;
+	    toolTipText?: string;
 	    /**
-	     * How to display the the flyout in relation to the body content;
-	     * `push` keeps it visible, pushing the `<body>` content via padding
-	     * @default overlay
+	     * Allows customizing the tooltip shown when `showToolTip` is true.
+	     * Accepts any props that [EuiToolTip](/#/display/tooltip) accepts.
 	     */
-	    type?: _EuiFlyoutType;
+	    toolTipProps?: Partial<EuiToolTipProps>;
+	};
+	export const EuiListGroupItem: FunctionComponent<EuiListGroupItemProps>;
+
+}
+declare module '@elastic/eui/src/components/list_group/list_group.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiListGroupStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiListGroup: import("@emotion/react").SerializedStyles;
+	    flush: import("@emotion/react").SerializedStyles;
+	    bordered: import("@emotion/react").SerializedStyles;
+	    maxWidthDefault: import("@emotion/react").SerializedStyles;
+	    none: import("@emotion/react").SerializedStyles;
+	    s: import("@emotion/react").SerializedStyles;
+	    m: import("@emotion/react").SerializedStyles;
+	};
+
+}
+declare module '@elastic/eui/src/components/list_group/list_group' {
+	import { FunctionComponent, HTMLAttributes, CSSProperties } from 'react';
+	import { CommonProps } from '@elastic/eui/src/components/common';
+	import { EuiListGroupItemProps } from '@elastic/eui/src/components/list_group/list_group_item';
+	export const GUTTER_SIZES: readonly ["none", "s", "m"];
+	export type EuiListGroupGutterSize = (typeof GUTTER_SIZES)[number];
+	export type EuiListGroupProps = CommonProps & Omit<HTMLAttributes<HTMLUListElement>, 'color'> & {
 	    /**
-	     * Forces this interaction on the mask overlay or body content.
-	     * Defaults depend on `ownFocus` and `type` values
+	     * Add a border to the list container
 	     */
-	    outsideClickCloses?: boolean;
+	    bordered?: boolean;
 	    /**
-	     * Which side of the window to attach to.
-	     * The `left` option should only be used for navigation.
-	     * @default right
+	     * Remove container padding, stretching list items to the edges
 	     */
-	    side?: _EuiFlyoutSide;
+	    flush?: boolean;
 	    /**
-	     * Named breakpoint (`xs` through `xl`) for customizing the minimum window width to enable the `push` type
-	     * @default l
+	     * Spacing between list items
 	     */
-	    pushMinBreakpoint?: EuiBreakpointSize;
+	    gutterSize?: EuiListGroupGutterSize;
 	    /**
-	     * Enables a slide in animation on push flyouts
-	     * @default false
+	     * Items to display in this group. See {@link EuiListGroupItem}
 	     */
-	    pushAnimation?: boolean;
-	    style?: CSSProperties;
+	    listItems?: EuiListGroupItemProps[];
 	    /**
-	     * Object of props passed to EuiFocusTrap.
-	     * `shards` specifies an array of elements that will be considered part of the flyout, preventing the flyout from being closed when clicked.
-	     * `closeOnMouseup` will delay the close callback, allowing time for external toggle buttons to handle close behavior.
-	     * `returnFocus` defines the return focus behavior and provides the possibility to check the available target element or opt out of the behavior in favor of manually returning focus
+	     * Change the colors of all `listItems` at once
+	     * @default text
 	     */
-	    focusTrapProps?: Pick<EuiFocusTrapProps, 'closeOnMouseup' | 'shards' | 'returnFocus'>;
+	    color?: EuiListGroupItemProps['color'];
 	    /**
-	     * By default, EuiFlyout will consider any fixed `EuiHeader`s that sit alongside or above the EuiFlyout
-	     * as part of the flyout's focus trap. This prevents focus fighting with interactive elements
-	     * within fixed headers.
-	     *
-	     * Set this to `false` if you need to disable this behavior for a specific reason.
+	     * Change the size of all `listItems` at once
+	     * @default m
 	     */
-	    includeFixedHeadersInFocusTrap?: boolean;
+	    size?: EuiListGroupItemProps['size'];
 	    /**
-	     * Specify additional css selectors to include in the focus trap.
+	     * Sets the max-width of the page.
+	     * Set to `true` to use the default size,
+	     * set to `false` to not restrict the width,
+	     * or set to a number/string for a custom CSS width/measurement.
 	     */
-	    includeSelectorInFocusTrap?: string[] | string;
-	} const defaultElement = "div";
-	type Props<T extends ElementType> = CommonProps & {
+	    maxWidth?: boolean | CSSProperties['maxWidth'];
 	    /**
-	     * Sets the HTML element for `EuiFlyout`
+	     * Display tooltips on all list items
 	     */
-	    as?: T;
-	} & _EuiFlyoutProps & Omit<PropsOfElement<T>, keyof _EuiFlyoutProps>;
-	export type EuiFlyoutProps<T extends ElementType = typeof defaultElement> = Props<T> & Omit<ComponentPropsWithRef<T>, keyof Props<T>>;
-	export const EuiFlyout: <T extends ElementType = typeof defaultElement>(props: EuiFlyoutProps<T>) => JSX.Element;
-	export {};
+	    showToolTips?: boolean;
+	    /**
+	     * Allow link text to wrap vs truncated
+	     */
+	    wrapText?: boolean;
+	    ariaLabelledby?: string;
+	};
+	export const EuiListGroup: FunctionComponent<EuiListGroupProps>;
 
 }
-declare module '@elastic/eui/src/components/flyout/flyout_footer.styles' {
+declare module '@elastic/eui/src/components/list_group/pinnable_list_group/pinnable_list_group.styles' {
 	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiFlyoutFooterStyles: (euiThemeContext: UseEuiTheme) => {
-	    euiFlyoutFooter: import("@emotion/react").SerializedStyles;
+	export const euiPinnableListGroupItemExtraActionStyles: ({ euiTheme, }: UseEuiTheme) => {
+	    euiPinnableListGroup__itemExtraAction: import("@emotion/react").SerializedStyles;
+	    pinned: import("@emotion/react").SerializedStyles;
 	};
 
 }
-declare module '@elastic/eui/src/components/flyout/flyout_footer' {
-	import { FunctionComponent, HTMLAttributes } from 'react';
+declare module '@elastic/eui/src/components/list_group/pinnable_list_group/pinnable_list_group' {
+	import { FunctionComponent } from 'react';
 	import { CommonProps } from '@elastic/eui/src/components/common';
-	export type EuiFlyoutFooterProps = FunctionComponent<HTMLAttributes<HTMLDivElement> & CommonProps>;
-	export const EuiFlyoutFooter: EuiFlyoutFooterProps;
+	import { EuiListGroupProps } from '@elastic/eui/src/components/list_group/list_group';
+	import { EuiListGroupItemProps } from '@elastic/eui/src/components/list_group/list_group_item';
+	export type EuiPinnableListGroupItemProps = EuiListGroupItemProps & {
+	    /**
+	     * Saves the pinned status and changes the visibility of the pin icon
+	     */
+	    pinned?: boolean;
+	    /**
+	     * Passing `onPinClick` to the full EuiPinnableListGroup, will make every item pinnable.
+	     * Set this property to `false` to turn off individual item pinnability
+	     */
+	    pinnable?: boolean;
+	};
+	export interface EuiPinnableListGroupProps extends CommonProps, EuiListGroupProps {
+	    /**
+	     * Extends `EuiListGroupItemProps`, at the very least, expecting a `label`.
+	     * See {@link EuiPinnableListGroupItemProps}
+	     */
+	    listItems: EuiPinnableListGroupItemProps[];
+	    /**
+	     * Shows the pin icon and calls this function on click.
+	     * Returns `item: EuiPinnableListGroupItemProps`
+	     */
+	    onPinClick: (item: EuiPinnableListGroupItemProps) => void;
+	    /**
+	     * The pin icon needs a title/aria-label for accessibility.
+	     * It is a function that passes the item back and must return a string `(item) => string`.
+	     * Default is `"Pin item"`
+	     */
+	    pinTitle?: (item: EuiPinnableListGroupItemProps) => string;
+	    /**
+	     * The unpin icon needs a title/aria-label for accessibility.
+	     * It is a function that passes the item back and must return a string `(item) => string`.
+	     * Default is `"Unpin item"`
+	     */
+	    unpinTitle?: (item: EuiPinnableListGroupItemProps) => string;
+	}
+	export const EuiPinnableListGroup: FunctionComponent<EuiPinnableListGroupProps>;
 
 }
-declare module '@elastic/eui/src/components/flyout/flyout_header.styles' {
-	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiFlyoutHeaderStyles: (euiThemeContext: UseEuiTheme) => {
-	    euiFlyoutHeader: import("@emotion/react").SerializedStyles;
-	    hasBorder: import("@emotion/react").SerializedStyles;
-	};
+declare module '@elastic/eui/src/components/list_group/pinnable_list_group' {
+	export type { EuiPinnableListGroupProps, EuiPinnableListGroupItemProps, } from '@elastic/eui/src/components/list_group/pinnable_list_group/pinnable_list_group';
+	export { EuiPinnableListGroup } from '@elastic/eui/src/components/list_group/pinnable_list_group/pinnable_list_group';
 
 }
-declare module '@elastic/eui/src/components/flyout/flyout_header' {
-	import { FunctionComponent, HTMLAttributes } from 'react';
-	import { CommonProps } from '@elastic/eui/src/components/common';
-	export type EuiFlyoutHeaderProps = FunctionComponent<HTMLAttributes<HTMLDivElement> & CommonProps & {
-	    hasBorder?: boolean;
-	}>;
-	export const EuiFlyoutHeader: EuiFlyoutHeaderProps;
+declare module '@elastic/eui/src/components/list_group' {
+	export type { EuiListGroupProps } from '@elastic/eui/src/components/list_group/list_group';
+	export { EuiListGroup } from '@elastic/eui/src/components/list_group/list_group';
+	export type { EuiListGroupItemProps } from '@elastic/eui/src/components/list_group/list_group_item';
+	export type { EuiListGroupItemExtraActionProps } from '@elastic/eui/src/components/list_group/list_group_item_extra_action';
+	export { EuiListGroupItem } from '@elastic/eui/src/components/list_group/list_group_item';
+	export type { EuiPinnableListGroupProps, EuiPinnableListGroupItemProps, } from '@elastic/eui/src/components/list_group/pinnable_list_group';
+	export { EuiPinnableListGroup } from '@elastic/eui/src/components/list_group/pinnable_list_group';
 
 }
-declare module '@elastic/eui/src/components/resizable_container/types' {
-	import { KeyboardEvent, MouseEvent, TouchEvent } from 'react';
+declare module '@elastic/eui/src/components/title' {
+	export type { EuiTitleProps, EuiTitleSize } from '@elastic/eui/src/components/title/title';
+	export { EuiTitle } from '@elastic/eui/src/components/title/title';
+
+}
+declare module '@elastic/eui/src/components/flyout/const' {
+	import { EuiBreakpointSize } from '@elastic/eui/src/services';
+	/** Allowed flyout render types. */
+	export const FLYOUT_TYPES: readonly ["push", "overlay"];
+	/** Type representing a supported flyout render type. */
+	export type _EuiFlyoutType = (typeof FLYOUT_TYPES)[number];
+	/** Allowed flyout attachment sides. */
+	export const FLYOUT_SIDES: readonly ["left", "right"];
+	/** Type representing a supported flyout side. */
+	export type _EuiFlyoutSide = (typeof FLYOUT_SIDES)[number];
+	/** Allowed named flyout sizes used by the manager. */
+	export const FLYOUT_SIZES: readonly ["s", "m", "l", "fill"];
+	/** Type representing a supported named flyout size. */
+	export type EuiFlyoutSize = (typeof FLYOUT_SIZES)[number];
+	/** Allowed padding sizes for flyout content. */
+	export const FLYOUT_PADDING_SIZES: readonly ["none", "s", "m", "l"];
+	/** Type representing a supported flyout padding size. */
+	export type _EuiFlyoutPaddingSize = (typeof FLYOUT_PADDING_SIZES)[number];
+	/** Default minimum breakpoint at which push-type flyouts begin to push content. */
+	export const DEFAULT_PUSH_MIN_BREAKPOINT: EuiBreakpointSize;
+	/** Default flyout type when none is provided. */
+	export const DEFAULT_TYPE: _EuiFlyoutType;
+	/** Default side where flyouts anchor when none is provided. */
+	export const DEFAULT_SIDE: _EuiFlyoutSide;
+	/** Default named flyout size. */
+	export const DEFAULT_SIZE: EuiFlyoutSize;
+	/** Default padding size inside flyouts. */
+	export const DEFAULT_PADDING_SIZE: _EuiFlyoutPaddingSize;
+	/**
+	 * Custom type checker for named flyout sizes since the prop
+	 * `size` can also be CSSProperties['width'] (string | number)
+	 */
+	export function isEuiFlyoutSizeNamed(value: unknown): value is EuiFlyoutSize;
+
+}
+declare module '@elastic/eui/src/components/flyout/flyout.styles' {
+	import { EuiFlyoutSize } from '@elastic/eui/src/components/flyout/const';
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const FLYOUT_BREAKPOINT: "m";
+	export const euiFlyoutSlideInRight: import("@emotion/serialize").Keyframes;
+	export const euiFlyoutSlideOutRight: import("@emotion/serialize").Keyframes;
+	export const euiFlyoutSlideInLeft: import("@emotion/serialize").Keyframes;
+	export const euiFlyoutSlideOutLeft: import("@emotion/serialize").Keyframes;
+	export const euiFlyoutStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFlyout: import("@emotion/react").SerializedStyles;
+	    s: import("@emotion/react").SerializedStyles;
+	    m: import("@emotion/react").SerializedStyles;
+	    l: import("@emotion/react").SerializedStyles;
+	    fill: import("@emotion/react").SerializedStyles;
+	    noMaxWidth: import("@emotion/react").SerializedStyles;
+	    right: import("@emotion/react").SerializedStyles;
+	    left: import("@emotion/react").SerializedStyles;
+	    overlay: {
+	        overlay: import("@emotion/react").SerializedStyles;
+	        left: import("@emotion/react").SerializedStyles;
+	        right: import("@emotion/react").SerializedStyles;
+	    };
+	    push: {
+	        push: import("@emotion/react").SerializedStyles;
+	        right: import("@emotion/react").SerializedStyles;
+	        left: import("@emotion/react").SerializedStyles;
+	        noAnimation: import("@emotion/react").SerializedStyles;
+	    };
+	    paddingSizes: {
+	        none: import("@emotion/react").SerializedStyles;
+	        s: import("@emotion/react").SerializedStyles;
+	        m: import("@emotion/react").SerializedStyles;
+	        l: import("@emotion/react").SerializedStyles;
+	    };
+	};
+	export const maxedFlyoutWidth: (euiThemeContext: UseEuiTheme) => string;
+	export const composeFlyoutSizing: (euiThemeContext: UseEuiTheme, size: EuiFlyoutSize) => string;
+	/**
+	 * Composes all inline styles for a flyout based on its configuration
+	 */
+	export const composeFlyoutInlineStyles: (size: EuiFlyoutSize | string | number, layoutMode: "side-by-side" | "stacked", siblingFlyoutId: string | null, siblingFlyoutWidth: number | null, maxWidth: boolean | number | string | undefined, zIndex?: number) => React.CSSProperties;
+
+}
+declare module '@elastic/eui/src/components/flyout/_flyout_close_button.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFlyoutCloseButtonStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFlyout__closeButton: import("@emotion/react").SerializedStyles;
+	    inside: import("@emotion/react").SerializedStyles;
+	    outside: import("@emotion/react").SerializedStyles;
+	    outsideSide: {
+	        right: import("@emotion/react").SerializedStyles;
+	        left: import("@emotion/react").SerializedStyles;
+	    };
+	};
+
+}
+declare module '@elastic/eui/src/components/flyout/_flyout_close_button' {
+	import { FunctionComponent } from 'react';
+	import type { EuiFlyoutProps } from '@elastic/eui/src/components/flyout/flyout';
+	type EuiFlyoutCloseButtonProps = EuiFlyoutProps['closeButtonProps'] & Required<Pick<EuiFlyoutProps, 'closeButtonPosition' | 'onClose' | 'side'>>;
+	export const EuiFlyoutCloseButton: FunctionComponent<EuiFlyoutCloseButtonProps>;
+	export {};
+
+}
+declare module '@elastic/eui/src/components/flyout/flyout_menu.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFlyoutMenuStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFlyoutMenu__container: import("@emotion/react").SerializedStyles;
+	    euiFlyoutMenu__spacer: import("@emotion/react").SerializedStyles;
+	    euiFlyoutMenu__actions: import("@emotion/react").SerializedStyles;
+	    euiFlyoutMenu__hiddenTitle: import("@emotion/react").SerializedStyles;
+	};
+
+}
+declare module '@elastic/eui/src/components/flyout/flyout_menu_context' {
+	import { EuiFlyoutProps } from '@elastic/eui/src/components/flyout/flyout';
+	interface EuiFlyoutMenuContextProps {
+	    onClose?: EuiFlyoutProps['onClose'];
+	}
+	export const EuiFlyoutMenuContext: import("react").Context<EuiFlyoutMenuContextProps>;
+	export {};
+
+}
+declare module '@elastic/eui/src/components/flyout/types' {
+	export type EuiFlyoutCloseEvent = MouseEvent | TouchEvent | KeyboardEvent;
+
+}
+declare module '@elastic/eui/src/components/flyout/flyout_menu' {
+	import React, { FunctionComponent, HTMLAttributes } from 'react';
+	import { EuiButtonProps } from '@elastic/eui/src/components/button';
+	import { CommonProps, PropsForAnchor } from '@elastic/eui/src/components/common';
+	type EuiFlyoutMenuBackButtonProps = Pick<PropsForAnchor<EuiButtonProps>, 'aria-label' | 'data-test-subj' | 'onClick'>;
+	/**
+	 * History item for the flyout menu history popover
+	 */
+	export interface EuiFlyoutHistoryItem {
+	    /**
+	     * Title for the history item
+	     */
+	    title: string;
+	    /**
+	     * onClick handler for the history item
+	     */
+	    onClick: () => void;
+	}
+	/**
+	 * Custom action item for the flyout menu component
+	 */
+	export interface EuiFlyoutMenuCustomAction {
+	    /**
+	     * Icon type for the action button
+	     */
+	    iconType: string;
+	    /**
+	     * onClick handler for the action button
+	     */
+	    onClick: () => void;
+	    /**
+	     * Aria label for the action button
+	     */
+	    'aria-label': string;
+	}
+	/**
+	 * Props for EuiFlyoutMenu
+	 */
+	export type EuiFlyoutMenuProps = CommonProps & HTMLAttributes<HTMLDivElement> & {
+	    /**
+	     * An id to use for the title element. Useful for setting aria-labelledby on the flyout.
+	     * Example:
+	     * ```jsx
+	     * <EuiFlyout
+	     *   aria-labelledby="myMenuTitleId"
+	     *   flyoutMenuProps={{ title: 'Menu title', titleId: 'myMenuTitleId' }
+	     * >
+	     *  ...
+	     * </EuiFlyout>
+	     * ```
+	     */
+	    titleId?: string;
+	    /**
+	     * Title for the menu component. In a managed flyout context, the title is used to indicate the flyout session for history navigation.
+	     */
+	    title?: React.ReactNode;
+	    /**
+	     * Hides the title in the `EuiFlyoutMenu`. This is useful when the title is already shown in an `EuiFlyoutHeader`.
+	     * @default true for main flyout in a managed flyout session; false otherwise
+	     */
+	    hideTitle?: boolean;
+	    /**
+	     * Hides the close button in the menu component
+	     * @default false
+	     */
+	    hideCloseButton?: boolean;
+	    /**
+	     * Shows a back button in the menu component
+	     * @default false
+	     */
+	    showBackButton?: boolean;
+	    /**
+	     * Props to pass to the back button, such as `onClick` handler
+	     */
+	    backButtonProps?: EuiFlyoutMenuBackButtonProps;
+	    /**
+	     * List of history items for the history popover
+	     */
+	    historyItems?: EuiFlyoutHistoryItem[];
+	    /**
+	     * List of custom action items for the menu component
+	     */
+	    customActions?: EuiFlyoutMenuCustomAction[];
+	};
+	/**
+	 * The component for the top menu bar inside a flyout. Since this is a private
+	 * component, rendering is controlled using the `flyoutMenuProps` prop on
+	 * `EuiFlyout`. In managed session flyouts, the Flyout Manager controls a back
+	 * button and history popover for navigating to different flyout sessions
+	 * within the managed context.
+	 *
+	 * @private
+	 */
+	export const EuiFlyoutMenu: FunctionComponent<EuiFlyoutMenuProps>;
+	export {};
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/activity_stage' {
+	import type { EuiFlyoutActivityStage, EuiFlyoutLevel } from '@elastic/eui/src/components/flyout/manager/types';
+	export interface UseFlyoutActivityStageParams {
+	    flyoutId: string;
+	    level: EuiFlyoutLevel;
+	}
+	export interface UseFlyoutActivityStageReturn {
+	    activityStage: EuiFlyoutActivityStage;
+	    onAnimationEnd: () => void;
+	}
+	/**
+	 * Encapsulates all activity-stage transitions and animation-driven updates
+	 * for managed flyouts.
+	 */
+	export const useFlyoutActivityStage: ({ flyoutId, level, }: UseFlyoutActivityStageParams) => {
+	    activityStage: EuiFlyoutActivityStage;
+	    onAnimationEnd: () => void;
+	};
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/flyout_managed.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	import { _EuiFlyoutSide } from '@elastic/eui/src/components/flyout/const';
+	import type { EuiFlyoutActivityStage, EuiFlyoutLevel } from '@elastic/eui/src/components/flyout/manager/types';
+	/**
+	 * Emotion styles for managed flyouts.
+	 * Provides base 3D context and animations tied to managed flyout stages
+	 * via data attributes.
+	 */
+	export const euiManagedFlyoutStyles: (euiThemeContext: UseEuiTheme) => {
+	    stage: (activeStage: EuiFlyoutActivityStage, side: _EuiFlyoutSide | undefined, level: EuiFlyoutLevel) => (false | import("@emotion/react").SerializedStyles)[];
+	    managedFlyout: import("@emotion/react").SerializedStyles;
+	};
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/validation' {
+	import { EuiFlyoutSize } from '@elastic/eui/src/components/flyout/const';
+	import { EuiFlyoutComponentProps } from '@elastic/eui/src/components/flyout/flyout.component';
+	import { EuiFlyoutLevel } from '@elastic/eui/src/components/flyout/manager/types';
+	type FlyoutValidationErrorType = 'INVALID_SIZE_TYPE' | 'INVALID_SIZE_COMBINATION' | 'INVALID_FLYOUT_MENU_TITLE';
+	export interface FlyoutValidationError {
+	    type: FlyoutValidationErrorType;
+	    message: string;
+	    flyoutId?: string;
+	    parentFlyoutId?: string;
+	    level?: EuiFlyoutLevel;
+	    size?: string | number;
+	    parentSize?: string | number;
+	}
+	/**
+	 * Checks if a size is a named size (s, m, l)
+	 */
+	export function isNamedSize(size: unknown): size is EuiFlyoutSize;
+	/**
+	 * Validates that a managed flyout only uses named sizes
+	 */
+	export function validateManagedFlyoutSize(size: EuiFlyoutComponentProps['size'], flyoutId: string, level: EuiFlyoutLevel): FlyoutValidationError | null;
+	/**
+	 * Validates size combinations for parent-child flyouts
+	 */
+	export function validateSizeCombination(parentSize: EuiFlyoutSize, childSize: EuiFlyoutSize): FlyoutValidationError | null;
+	/**
+	 * Creates a user-friendly error message for validation errors
+	 */
+	export function createValidationErrorMessage(error: FlyoutValidationError): string;
+	export {};
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/flyout_managed' {
+	import React from 'react';
+	import { EuiFlyoutComponentProps } from '@elastic/eui/src/components/flyout/flyout.component';
+	import { EuiFlyoutMenuProps } from '@elastic/eui/src/components/flyout/flyout_menu';
+	import type { EuiFlyoutLevel } from '@elastic/eui/src/components/flyout/manager/types';
+	/**
+	 * Props for `EuiManagedFlyout`, the internal persistent flyout used by
+	 * the manager. Extends base flyout props and requires a `level` to
+	 * distinguish `main` vs `child` behavior.
+	 */
+	export interface EuiManagedFlyoutProps extends EuiFlyoutComponentProps {
+	    level: EuiFlyoutLevel;
+	    flyoutMenuProps?: Omit<EuiFlyoutMenuProps, 'historyItems' | 'showBackButton'>;
+	    onActive?: () => void;
+	}
+	/**
+	 * Persistent managed flyout rendered inside the provider. Handles:
+	 * - registration/unregistration with the manager
+	 * - size validation and parent/child size compatibility
+	 * - width tracking for responsive layouts
+	 * - lifecycle stage transitions and data attributes for styling
+	 */
+	export const EuiManagedFlyout: ({ id, onClose: onCloseProp, onActive: onActiveProp, level, size: sizeProp, css: customCss, flyoutMenuProps: _flyoutMenuProps, ...props }: EuiManagedFlyoutProps) => React.JSX.Element;
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/flyout_child' {
+	import React from 'react';
+	import { type EuiManagedFlyoutProps } from '@elastic/eui/src/components/flyout/manager/flyout_managed';
+	/**
+	 * Props for `EuiFlyoutChild`, a managed child flyout that pairs with a main flyout.
+	 *
+	 * Notes:
+	 * - `type`, `side`, and `level` are fixed by the component and thus omitted.
+	 */
+	export type EuiFlyoutChildProps = Omit<EuiManagedFlyoutProps, 'closeButtonPosition' | 'hideCloseButton' | 'type' | 'level' | 'hasChildBackground'>;
+	/**
+	 * Managed child flyout that renders alongside or stacked over the main flyout,
+	 * depending on the current layout mode. Handles required managed flyout props.
+	 */
+	export function EuiFlyoutChild({ css: customCss, side, ...props }: EuiFlyoutChildProps): React.JSX.Element | null;
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/flyout_main.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	/**
+	 * Emotion styles for the main (parent) managed flyout.
+	 * Adds subtle borders when a child flyout is present, depending on side.
+	 *
+	 * Returns an object with:
+	 * - `hasChildFlyout.left` and `.right`: border styles to separate from child.
+	 */
+	export const euiMainFlyoutStyles: (euiThemeContext: UseEuiTheme) => {
+	    hasChildFlyout: {
+	        left: import("@emotion/react").SerializedStyles;
+	        right: import("@emotion/react").SerializedStyles;
+	    };
+	};
+
+}
+declare module '@elastic/eui/src/components/flyout/hooks' {
+	import { EuiFlyoutProps } from '@elastic/eui/src/components/flyout/flyout';
+	/**
+	 * Determines if a flyout should be rendered in a "pushed" state based on its
+	 * configuration and the current window size.
+	 */
+	export const useIsPushed: (props: Pick<EuiFlyoutProps, "type" | "pushMinBreakpoint">) => boolean;
+
+}
+declare module '@elastic/eui/src/components/flyout/manager/flyout_main' {
+	import React from 'react';
+	import { type EuiManagedFlyoutProps } from '@elastic/eui/src/components/flyout/manager/flyout_managed';
+	/**
+	 * Props for `EuiFlyoutMain`, the primary managed flyout component.
+	 * The `level` prop is fixed internally to `main` and is therefore omitted.
+	 */
+	export type EuiFlyoutMainProps = Omit<EuiManagedFlyoutProps, 'level'>;
+	/**
+	 * Managed main flyout. Handles ID management, child-flyout styling,
+	 * and push/overlay behavior based on provided props.
+	 */
+	export function EuiFlyoutMain({ id, pushMinBreakpoint, type, side, ...props }: EuiFlyoutMainProps): React.JSX.Element;
+
+}
+declare module '@elastic/eui/src/components/flyout/manager' {
+	/**
+	 * Convenience re-exports of bound action creators for external usage.
+	 */
+	export { addFlyout as addFlyoutAction, closeFlyout as closeFlyoutAction, setActiveFlyout as setActiveFlyoutAction, setFlyoutWidth as setFlyoutWidthAction, setPushPadding as setPushPaddingAction, setActivityStage as setActivityStageAction, } from '@elastic/eui/src/components/flyout/manager/actions';
+	/** Reducer and default state for the flyout manager. */
+	export { flyoutManagerReducer, initialState } from '@elastic/eui/src/components/flyout/manager/reducer';
+	/** Provider component exposing the Flyout Manager API via context. */
+	export { EuiFlyoutManager } from '@elastic/eui/src/components/flyout/manager/provider';
+	/**
+	 * Hooks for reading manager state and derived information.
+	 */
+	/**
+	 * Selectors and derived state hooks for managed flyouts.
+	 */
+	export { useCurrentChildFlyout, useCurrentMainFlyout, useCurrentSession, useFlyoutId, useFlyoutLayoutMode, useFlyoutManager, useFlyoutWidth, useHasChildFlyout, useIsFlyoutActive, useIsInManagedFlyout, useHasActiveSession, useParentFlyoutSize, usePushPaddingOffsets, useHasPushPadding, } from '@elastic/eui/src/components/flyout/manager/hooks';
+	export { EuiFlyoutChild, type EuiFlyoutChildProps } from '@elastic/eui/src/components/flyout/manager/flyout_child';
+	export { EuiFlyoutMain, type EuiFlyoutMainProps } from '@elastic/eui/src/components/flyout/manager/flyout_main';
+	/** Utility functions for flyout sizing and layout. */
+	export { getWidthFromSize } from '@elastic/eui/src/components/flyout/manager/layout_mode';
+
+}
+declare module '@elastic/eui/src/components/overlay_mask/overlay_mask.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiOverlayMaskStyles: ({ euiTheme, highContrastMode, }: UseEuiTheme) => {
+	    euiOverlayMask: string;
+	    aboveHeader: string;
+	    belowHeader: string;
+	    noAnimation: string;
+	};
+
+}
+declare module '@elastic/eui/src/components/overlay_mask/overlay_mask_body.styles' {
+	export const euiOverlayMaskBodyStyles: import("@emotion/react").SerializedStyles;
+
+}
+declare module '@elastic/eui/src/components/overlay_mask/overlay_mask' {
+	import { FunctionComponent, HTMLAttributes, MutableRefObject, ReactNode, Ref } from 'react';
+	import { CommonProps } from '@elastic/eui/src/components/common';
+	export interface EuiOverlayMaskInterface {
+	    /**
+	     * ReactNode to render as this component's content
+	     */
+	    children?: ReactNode;
+	    /**
+	     * Should the mask visually sit above or below the EuiHeader (controlled by z-index)
+	     */
+	    headerZindexLocation?: 'above' | 'below';
+	    /**
+	     * React ref to be passed to the wrapping container
+	     */
+	    maskRef?: Ref<HTMLDivElement> | MutableRefObject<HTMLDivElement>;
+	}
+	export type EuiOverlayMaskProps = Omit<CommonProps, 'css'> & Omit<Partial<Record<keyof HTMLAttributes<HTMLDivElement>, string>>, keyof EuiOverlayMaskInterface> & EuiOverlayMaskInterface;
+	export const EuiOverlayMask: FunctionComponent<EuiOverlayMaskProps>;
+
+}
+declare module '@elastic/eui/src/components/overlay_mask' {
+	export type { EuiOverlayMaskProps } from '@elastic/eui/src/components/overlay_mask/overlay_mask';
+	export { EuiOverlayMask } from '@elastic/eui/src/components/overlay_mask/overlay_mask';
+
+}
+declare module '@elastic/eui/src/components/flyout/_flyout_overlay' {
+	import React, { PropsWithChildren } from 'react';
+	import type { EuiFlyoutComponentProps } from '@elastic/eui/src/components/flyout/flyout.component';
+	export interface EuiFlyoutOverlayProps extends PropsWithChildren {
+	    hasOverlayMask: boolean;
+	    maskProps: EuiFlyoutComponentProps['maskProps'];
+	    isPushed: boolean;
+	    maskZIndex: number;
+	}
+	/**
+	 * Light wrapper for conditionally rendering portals or overlay masks:
+	 *  - If ownFocus is set, wrap with an overlay and allow the user to click it to close it.
+	 *  - Otherwise still wrap within an EuiPortal so it appends to the bottom of the window.
+	 * Push flyouts have no overlay OR portal behavior.
+	 *
+	 * @internal
+	 */
+	export const EuiFlyoutOverlay: ({ children, isPushed, maskProps, hasOverlayMask, maskZIndex, }: EuiFlyoutOverlayProps) => React.JSX.Element;
+
+}
+declare module '@elastic/eui/src/components/resizable_container/types' {
+	import { KeyboardEvent, MouseEvent, TouchEvent } from 'react';
 	export type PanelModeType = 'collapsible' | 'main' | 'custom';
 	export type PanelPosition = 'first' | 'middle' | 'last';
 	export type PanelDirection = 'left' | 'right';
@@ -6874,10 +7621,10 @@ declare module '@elastic/eui/src/components/resizable_container' {
 	export { EuiResizableButton } from '@elastic/eui/src/components/resizable_container/resizable_button';
 
 }
-declare module '@elastic/eui/src/components/flyout/flyout_resizable.styles' {
+declare module '@elastic/eui/src/components/flyout/_flyout_resize_button.styles' {
 	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiFlyoutResizableButtonStyles: ({ euiTheme }: UseEuiTheme) => {
-	    euiFlyoutResizableButton: import("@emotion/react").SerializedStyles;
+	export const euiFlyoutResizeButtonStyles: ({ euiTheme }: UseEuiTheme) => {
+	    root: import("@emotion/react").SerializedStyles;
 	    overlay: {
 	        left: import("@emotion/react").SerializedStyles;
 	        right: import("@emotion/react").SerializedStyles;
@@ -6887,200 +7634,334 @@ declare module '@elastic/eui/src/components/flyout/flyout_resizable.styles' {
 	        right: import("@emotion/react").SerializedStyles;
 	    };
 	    noOverlay: {
-	        noOverlay: import("@emotion/react").SerializedStyles;
+	        root: import("@emotion/react").SerializedStyles;
 	        left: import("@emotion/react").SerializedStyles;
 	        right: import("@emotion/react").SerializedStyles;
 	    };
 	};
 
+}
+declare module '@elastic/eui/src/components/flyout/_flyout_resize_button' {
+	import React from 'react';
+	import { EuiResizableButtonProps } from '@elastic/eui/src/components/resizable_container';
+	import type { _EuiFlyoutType, _EuiFlyoutSide } from '@elastic/eui/src/components/flyout/const';
+	import type { EuiFlyoutComponentProps } from '@elastic/eui/src/components/flyout/flyout.component';
+	type EuiFlyoutResizeButtonProps = Pick<EuiResizableButtonProps, 'onMouseDown' | 'onKeyDown' | 'onTouchStart'> & {
+	    type: _EuiFlyoutType;
+	    side: _EuiFlyoutSide;
+	    ownFocus: EuiFlyoutComponentProps['ownFocus'];
+	    isPushed: boolean;
+	};
+	export const EuiFlyoutResizeButton: ({ type, side, ownFocus, isPushed, ...resizableButtonProps }: EuiFlyoutResizeButtonProps) => React.JSX.Element;
+	export {};
+
 }
 declare module '@elastic/eui/src/components/flyout/flyout_resizable' {
 	import React from 'react';
 	import { EuiFlyoutProps } from '@elastic/eui/src/components/flyout/flyout';
 	export type EuiFlyoutResizableProps = {
 	    maxWidth?: number;
-	    minWidth?: number;
-	    /**
-	     * Optional callback that fires on user resize with the new flyout width
-	     */
-	    onResize?: (width: number) => void;
-	} & Omit<EuiFlyoutProps, 'maxWidth' | 'onResize'>;
-	export const EuiFlyoutResizable: React.ForwardRefExoticComponent<Omit<EuiFlyoutResizableProps, "ref"> & React.RefAttributes<unknown>>;
+	} & Omit<EuiFlyoutProps, 'maxWidth' | 'resizable'>;
+	export const EuiFlyoutResizable: React.ForwardRefExoticComponent<Omit<EuiFlyoutResizableProps, "ref"> & React.RefAttributes<HTMLElement | HTMLDivElement>>;
 
 }
-declare module '@elastic/eui/src/components/flyout/sessions/types' {
-	import { EuiFlyoutProps, EuiFlyoutSize } from '@elastic/eui/src/components/flyout/flyout';
-	import { EuiFlyoutChildProps } from '@elastic/eui/src/components/flyout/flyout_child';
+declare module '@elastic/eui/src/components/flyout/use_flyout_resizable' {
+	import React from 'react';
+	import type { EuiFlyoutResizableProps } from '@elastic/eui/src/components/flyout/flyout_resizable';
+	type UseEuiFlyoutResizable = Pick<EuiFlyoutResizableProps, 'onResize' | 'side'> & {
+	    enabled: boolean;
+	    minWidth?: number;
+	    maxWidth: number | undefined;
+	    size: string | number;
+	};
 	/**
-	 * Configuration used for setting display options for main and child flyouts in a session.
+	 * @internal
 	 */
-	export interface EuiFlyoutSessionConfig {
-	    mainSize: EuiFlyoutSize;
-	    childSize?: 's' | 'm';
-	    mainFlyoutProps?: Partial<Omit<EuiFlyoutProps, 'children'>>;
-	    childFlyoutProps?: Partial<Omit<EuiFlyoutChildProps, 'children'>>;
-	}
+	export const useEuiFlyoutResizable: ({ enabled, minWidth, maxWidth, onResize, side, size: _size, }: UseEuiFlyoutResizable) => {
+	    onKeyDown: (e: React.KeyboardEvent) => void;
+	    onMouseDown: (e: React.MouseEvent | React.TouchEvent) => void;
+	    setFlyoutRef: React.Dispatch<React.SetStateAction<HTMLElement | null>>;
+	    size: string | number;
+	};
+	export {};
+
+}
+declare module '@elastic/eui/src/components/flyout/use_flyout_z_index' {
+	import type { EuiOverlayMaskProps } from '@elastic/eui/src/components/overlay_mask';
 	/**
-	 * Options that control a main flyout in a session
+	 * @internal
 	 */
-	export interface EuiFlyoutSessionOpenMainOptions<Meta = unknown> {
-	    size: EuiFlyoutSize;
-	    flyoutProps?: EuiFlyoutSessionConfig['mainFlyoutProps'];
-	    /**
-	     * Caller-defined data
-	     */
-	    meta?: Meta;
+	export interface UseEuiFlyoutZIndex {
+	    maskProps?: EuiOverlayMaskProps;
+	    isPushed: boolean;
+	    managedFlyoutIndex: number;
+	    isChildFlyout: boolean;
 	}
 	/**
-	 * Options that control a child flyout in a session
+	 * @internal
 	 */
-	export interface EuiFlyoutSessionOpenChildOptions<Meta = unknown> {
-	    size: 's' | 'm';
-	    flyoutProps?: EuiFlyoutSessionConfig['childFlyoutProps'];
-	    /**
-	     * Caller-defined data
-	     */
-	    meta?: Meta;
-	}
+	export const useEuiFlyoutZIndex: ({ maskProps, isPushed, managedFlyoutIndex, isChildFlyout, }: UseEuiFlyoutZIndex) => {
+	    flyoutZIndex: number;
+	    maskZIndex: number;
+	};
+
+}
+declare module '@elastic/eui/src/components/flyout/flyout_parent_context' {
+	import React from 'react';
 	/**
-	 * Options for opening both a main flyout and child flyout simultaneously
+	 * Provider that wraps a flyout's children to indicate they're inside a parent flyout.
+	 * Nested flyouts can use this to automatically default to session inheritance.
 	 */
-	export interface EuiFlyoutSessionOpenGroupOptions<Meta = unknown> {
-	    main: EuiFlyoutSessionOpenMainOptions;
-	    child: EuiFlyoutSessionOpenChildOptions;
-	    /**
-	     * Caller-defined data
-	     */
-	    meta?: Meta;
-	}
+	export const EuiFlyoutParentProvider: ({ children, }: {
+	    children: React.ReactNode;
+	}) => React.JSX.Element;
 	/**
-	 * A configuration user state for past and current main and child flyouts in a session
-	 * @internal
+	 * Hook that returns `true` when called within a parent flyout's children.
+	 * Used to automatically determine if a nested flyout should inherit the session.
 	 */
-	export interface EuiFlyoutSessionGroup<FlyoutMeta> {
-	    isMainOpen: boolean;
-	    isChildOpen: boolean;
-	    config: EuiFlyoutSessionConfig;
+	export const useIsInsideParentFlyout: () => boolean;
+
+}
+declare module '@elastic/eui/src/components/flyout/flyout.component' {
+	import { ComponentPropsWithRef, CSSProperties, ElementType, JSX } from 'react';
+	import { EuiBreakpointSize } from '@elastic/eui/src/services';
+	import { CommonProps, PropsOfElement } from '@elastic/eui/src/components/common';
+	import { EuiFocusTrapProps } from '@elastic/eui/src/components/focus_trap';
+	import type { EuiOverlayMaskProps } from '@elastic/eui/src/components/overlay_mask';
+	import type { EuiButtonIconPropsForButton } from '@elastic/eui/src/components/button';
+	import { _EuiFlyoutPaddingSize, _EuiFlyoutSide, _EuiFlyoutType, EuiFlyoutSize } from '@elastic/eui/src/components/flyout/const';
+	import { EuiFlyoutMenuProps } from '@elastic/eui/src/components/flyout/flyout_menu';
+	import type { EuiFlyoutCloseEvent } from '@elastic/eui/src/components/flyout/types';
+	interface _EuiFlyoutComponentProps {
 	    /**
-	     * Caller-defined data
+	     * A required callback function fired when the flyout is closed.
 	     */
-	    meta?: FlyoutMeta;
-	}
-	/**
-	 * State used for tracking various EuiFlyoutSessionGroups
-	 * @internal
-	 */
-	export interface EuiFlyoutSessionHistoryState<FlyoutMeta = unknown> {
-	    activeFlyoutGroup: EuiFlyoutSessionGroup<FlyoutMeta> | null;
-	    history: Array<EuiFlyoutSessionGroup<FlyoutMeta>>;
+	    onClose: (event: EuiFlyoutCloseEvent) => void;
+	    /**
+	     * Defines the width of the panel.
+	     * Pass a predefined size of `s | m | l`, or pass any number/string compatible with the CSS `width` attribute
+	     * @default m
+	     */
+	    size?: EuiFlyoutSize | CSSProperties['width'];
+	    /**
+	     * Sets the minimum width of the panel.
+	     * Especially useful when set with `resizable = true`.
+	     */
+	    minWidth?: number;
+	    /**
+	     * Sets the max-width of the panel,
+	     * set to `true` to use the default size,
+	     * set to `false` to not restrict the width,
+	     * set to a number for a custom width in px,
+	     * set to a string for a custom width in custom measurement.
+	     * @default false
+	     */
+	    maxWidth?: boolean | number | string;
+	    /**
+	     * Customize the padding around the content of the flyout header, body and footer
+	     * @default l
+	     */
+	    paddingSize?: _EuiFlyoutPaddingSize;
+	    /**
+	     * Adds an EuiOverlayMask and wraps in an EuiPortal
+	     * @default true
+	     */
+	    ownFocus?: boolean;
+	    /**
+	     * Hides the default close button. You must provide another close button somewhere within the flyout.
+	     * @default false
+	     */
+	    hideCloseButton?: boolean;
+	    /**
+	     * Extends EuiButtonIconProps onto the close button
+	     */
+	    closeButtonProps?: Partial<EuiButtonIconPropsForButton>;
+	    /**
+	     * Position of close button.
+	     * `inside`: Floating to just inside the flyout, always top right;
+	     * `outside`: Floating just outside the flyout near the top (side dependent on `side`). Helpful when the close button may cover other interactable content.
+	     * @default inside
+	     */
+	    closeButtonPosition?: 'inside' | 'outside';
+	    /**
+	     * Adjustments to the EuiOverlayMask that is added when `ownFocus = true`
+	     */
+	    maskProps?: EuiOverlayMaskProps;
+	    /**
+	     * How to display the the flyout in relation to the body content;
+	     * `push` keeps it visible, pushing the `<body>` content via padding
+	     * @default overlay
+	     */
+	    type?: _EuiFlyoutType;
+	    /**
+	     * Forces this interaction on the mask overlay or body content.
+	     * Defaults depend on `ownFocus` and `type` values
+	     */
+	    outsideClickCloses?: boolean;
+	    /**
+	     * Which side of the window to attach to.
+	     * The `left` option should only be used for navigation.
+	     * @default right
+	     */
+	    side?: _EuiFlyoutSide;
+	    /**
+	     * Named breakpoint (`xs` through `xl`) for customizing the minimum window width to enable the `push` type
+	     * @default l
+	     */
+	    pushMinBreakpoint?: EuiBreakpointSize;
+	    /**
+	     * Enables a slide in animation on push flyouts
+	     * @default false
+	     */
+	    pushAnimation?: boolean;
+	    style?: CSSProperties;
+	    /**
+	     * When the flyout is used as a child in a managed flyout session, setting `true` gives the shaded background style.
+	     * @default false
+	     */
+	    hasChildBackground?: boolean;
+	    /**
+	     * Object of props passed to EuiFocusTrap.
+	     * `shards` specifies an array of elements that will be considered part of the flyout, preventing the flyout from being closed when clicked.
+	     * `closeOnMouseup` will delay the close callback, allowing time for external toggle buttons to handle close behavior.
+	     * `returnFocus` defines the return focus behavior and provides the possibility to check the available target element or opt out of the behavior in favor of manually returning focus
+	     */
+	    focusTrapProps?: Pick<EuiFocusTrapProps, 'closeOnMouseup' | 'shards' | 'returnFocus'>;
+	    /**
+	     * By default, EuiFlyout will consider any fixed `EuiHeader`s that sit alongside or above the EuiFlyout
+	     * as part of the flyout's focus trap. This prevents focus fighting with interactive elements
+	     * within fixed headers.
+	     *
+	     * Set this to `false` if you need to disable this behavior for a specific reason.
+	     */
+	    includeFixedHeadersInFocusTrap?: boolean;
+	    /**
+	     * Specify additional css selectors to include in the focus trap.
+	     */
+	    includeSelectorInFocusTrap?: string[] | string;
+	    /**
+	     * Props for the flyout menu to have one rendered in the flyout.
+	     * If used, the close button will be automatically hidden, as the flyout menu has its own close button.
+	     */
+	    flyoutMenuProps?: EuiFlyoutMenuProps;
+	    /**
+	     * Whether the flyout should be resizable.
+	     * @default false
+	     */
+	    resizable?: boolean;
+	    /**
+	     * Optional callback that fires when the flyout is resized.
+	     */
+	    onResize?: (width: number) => void;
 	}
-	export type EuiFlyoutSessionAction<FlyoutMeta = unknown> = {
-	    type: 'UPDATE_ACTIVE_FLYOUT_CONFIG';
-	    payload: {
-	        configChanges: Partial<EuiFlyoutSessionConfig>;
+	type Props<T extends ElementType> = CommonProps & {
+	    /**
+	     * Sets the HTML element for `EuiFlyout`
+	     */
+	    as?: T;
+	} & _EuiFlyoutComponentProps & Omit<PropsOfElement<T>, keyof _EuiFlyoutComponentProps>;
+	export type EuiFlyoutComponentProps<T extends ElementType = 'div' | 'nav'> = Props<T> & Omit<ComponentPropsWithRef<T>, keyof Props<T>>;
+	export const EuiFlyoutComponent: <T extends ElementType = "div" | "nav">(props: EuiFlyoutComponentProps<T>) => JSX.Element;
+	export {};
+
+}
+declare module '@elastic/eui/src/components/flyout/flyout' {
+	import React, { ElementType } from 'react';
+	import { type EuiFlyoutComponentProps } from '@elastic/eui/src/components/flyout/flyout.component';
+	import { SESSION_INHERIT, SESSION_NEVER, SESSION_START } from '@elastic/eui/src/components/flyout/manager/const';
+	export type { EuiFlyoutSize, _EuiFlyoutPaddingSize, _EuiFlyoutSide, } from '@elastic/eui/src/components/flyout/const';
+	export { FLYOUT_SIDES, FLYOUT_PADDING_SIZES, FLYOUT_SIZES, FLYOUT_TYPES, } from '@elastic/eui/src/components/flyout/const';
+	export type EuiFlyoutProps<T extends ElementType = 'div' | 'nav'> = Omit<EuiFlyoutComponentProps<T>, 'as'> & {
+	    /**
+	     * Controls the way the session is managed for this flyout.
+	     * - `start`: Creates a new flyout session. Use this for the main flyout.
+	     * - `inherit`: Inherits an existing session if one is active, otherwise functions as a standard flyout.
+	     * - `never`: Disregards session management and always functions as a standard flyout.
+	     *
+	     * When the `session` prop is undefined (not set), the flyout will automatically inherit from
+	     * a parent flyout if it's nested inside one. Otherwise, it defaults to `never`.
+	     *
+	     * Check out [EuiFlyout session management](https://eui.elastic.co/docs/components/containers/flyout/session-management)
+	     * documentation to learn more.
+	     * @default undefined (auto-inherit when nested, otherwise 'never')
+	     */
+	    session?: typeof SESSION_START | typeof SESSION_INHERIT | typeof SESSION_NEVER;
+	    /**
+	     * Callback fired when the flyout becomes active/visible, which may happen programmatically from history navigation.
+	     */
+	    onActive?: () => void;
+	    /**
+	     * The HTML element to render as the flyout container.
+	     */
+	    as?: T;
+	};
+	export const EuiFlyout: React.ForwardRefExoticComponent<Omit<EuiFlyoutProps<"div" | "nav">, "ref"> & React.RefAttributes<HTMLElement | HTMLDivElement>>;
+
+}
+declare module '@elastic/eui/src/components/flyout/flyout_body.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFlyoutBodyStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFlyoutBody: import("@emotion/react").SerializedStyles;
+	    overflow: {
+	        euiFlyoutBody__overflow: import("@emotion/react").SerializedStyles;
+	        noBanner: import("@emotion/react").SerializedStyles;
+	        hasBanner: import("@emotion/react").SerializedStyles;
 	    };
-	} | {
-	    type: 'OPEN_MAIN_FLYOUT';
-	    payload: EuiFlyoutSessionOpenMainOptions<FlyoutMeta>;
-	} | {
-	    type: 'OPEN_CHILD_FLYOUT';
-	    payload: EuiFlyoutSessionOpenChildOptions<FlyoutMeta>;
-	} | {
-	    type: 'OPEN_FLYOUT_GROUP';
-	    payload: EuiFlyoutSessionOpenGroupOptions<FlyoutMeta>;
-	} | {
-	    type: 'GO_BACK';
-	} | {
-	    type: 'CLOSE_CHILD_FLYOUT';
-	} | {
-	    type: 'CLOSE_SESSION';
+	    euiFlyoutBody__banner: import("@emotion/react").SerializedStyles;
 	};
-	/**
-	 * Flyout session context managed by `EuiFlyoutSessionProvider`, and passed to the `renderMainFlyoutContent` and `renderChildFlyoutContent` functions.
-	 */
-	export interface EuiFlyoutSessionRenderContext<FlyoutMeta = unknown> {
-	    activeFlyoutGroup: EuiFlyoutSessionGroup<FlyoutMeta> | null;
+
+}
+declare module '@elastic/eui/src/components/flyout/flyout_body' {
+	import { FunctionComponent, HTMLAttributes, ReactNode } from 'react';
+	import { CommonProps } from '@elastic/eui/src/components/common';
+	export type EuiFlyoutBodyProps = FunctionComponent<HTMLAttributes<HTMLDivElement> & CommonProps & {
 	    /**
-	     * Caller-defined data
+	     * Use to display a banner at the top of the body. It is suggested to use `EuiCallOut` for it.
 	     */
-	    meta?: FlyoutMeta;
-	}
-	/**
-	 * Props that can be passed to `EuiFlyoutSessionProvider` to render the main and child flyouts in a session.
-	 */
-	export interface EuiFlyoutSessionProviderComponentProps<FlyoutMeta = any> {
-	    children: React.ReactNode;
-	    onUnmount?: () => void;
-	    renderMainFlyoutContent: (context: EuiFlyoutSessionRenderContext<FlyoutMeta>) => React.ReactNode;
-	    renderChildFlyoutContent?: (context: EuiFlyoutSessionRenderContext<FlyoutMeta>) => React.ReactNode;
-	}
-	export interface EuiFlyoutSessionApi {
-	    openFlyout: (options: EuiFlyoutSessionOpenMainOptions) => void;
-	    openChildFlyout: (options: EuiFlyoutSessionOpenChildOptions) => void;
-	    openFlyoutGroup: (options: EuiFlyoutSessionOpenGroupOptions) => void;
-	    closeChildFlyout: () => void;
-	    goBack: () => void;
-	    closeSession: () => void;
-	    isFlyoutOpen: boolean;
-	    isChildFlyoutOpen: boolean;
-	    canGoBack: boolean;
-	}
+	    banner?: ReactNode;
+	    /**
+	     * [Scrollable regions (or their children) should be focusable](https://dequeuniversity.com/rules/axe/4.0/scrollable-region-focusable)
+	     * to allow keyboard users to scroll the region via arrow keys.
+	     *
+	     * By default, EuiFlyoutBody's scroll overflow wrapper sets a `tabIndex` of `0`.
+	     * If you know your flyout body content already contains focusable children
+	     * that satisfy keyboard accessibility requirements, you can use this prop
+	     * to override this default.
+	     */
+	    scrollableTabIndex?: number;
+	}>;
+	export const EuiFlyoutBody: EuiFlyoutBodyProps;
 
 }
-declare module '@elastic/eui/src/components/flyout/sessions/flyout_reducer' {
-	import { EuiFlyoutSessionAction, EuiFlyoutSessionHistoryState } from '@elastic/eui/src/components/flyout/sessions/types';
-	/**
-	 * Initial state for the flyout session
-	 * @internal
-	 */
-	export const initialFlyoutState: EuiFlyoutSessionHistoryState<unknown>;
-	/**
-	 * Flyout reducer
-	 * Controls state changes for flyout groups
-	 */
-	export function flyoutReducer<FlyoutMeta>(state: EuiFlyoutSessionHistoryState<FlyoutMeta>, action: EuiFlyoutSessionAction<FlyoutMeta>): EuiFlyoutSessionHistoryState<FlyoutMeta>;
+declare module '@elastic/eui/src/components/flyout/flyout_footer.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFlyoutFooterStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFlyoutFooter: import("@emotion/react").SerializedStyles;
+	};
 
 }
-declare module '@elastic/eui/src/components/flyout/sessions/flyout_provider' {
-	import React from 'react';
-	import { EuiFlyoutSessionAction, EuiFlyoutSessionHistoryState, EuiFlyoutSessionProviderComponentProps } from '@elastic/eui/src/components/flyout/sessions/types';
-	interface FlyoutSessionContextProps {
-	    state: EuiFlyoutSessionHistoryState;
-	    dispatch: React.Dispatch<EuiFlyoutSessionAction>;
-	    onUnmount?: EuiFlyoutSessionProviderComponentProps['onUnmount'];
-	}
-	/**
-	 * Accesses the state data and dispatch function from the context of EuiFlyoutSessionProvider
-	 * Use this if you need to debug the state or need direct access to the dispatch function, otherwise use useEuiFlyoutSession hook.
-	 */
-	export const useEuiFlyoutSessionContext: () => FlyoutSessionContextProps;
-	/**
-	 * FlyoutProvider is a component that provides a context for Flyout components.
-	 * It is used to manage the state of the Flyout and its child.
-	 * It also renders the Flyout and FlyoutChild components.
-	 *
-	 * @param children - The children of the FlyoutProvider component.
-	 * @param renderMainFlyoutContent - A function that renders the content of the main Flyout.
-	 * @param renderChildFlyoutContent - A function that renders the content of the child Flyout.
-	 * @returns The FlyoutProvider component.
-	 */
-	export const EuiFlyoutSessionProvider: React.FC<EuiFlyoutSessionProviderComponentProps>;
-	export {};
+declare module '@elastic/eui/src/components/flyout/flyout_footer' {
+	import { FunctionComponent, HTMLAttributes } from 'react';
+	import { CommonProps } from '@elastic/eui/src/components/common';
+	export type EuiFlyoutFooterProps = FunctionComponent<HTMLAttributes<HTMLDivElement> & CommonProps>;
+	export const EuiFlyoutFooter: EuiFlyoutFooterProps;
 
 }
-declare module '@elastic/eui/src/components/flyout/sessions/use_eui_flyout' {
-	import type { EuiFlyoutSessionApi } from '@elastic/eui/src/components/flyout/sessions/types';
-	/**
-	 * Hook for accessing the flyout API
-	 * @public
-	 */
-	export function useEuiFlyoutSession(): EuiFlyoutSessionApi;
+declare module '@elastic/eui/src/components/flyout/flyout_header.styles' {
+	import { UseEuiTheme } from '@elastic/eui/src/services';
+	export const euiFlyoutHeaderStyles: (euiThemeContext: UseEuiTheme) => {
+	    euiFlyoutHeader: import("@emotion/react").SerializedStyles;
+	    hasBorder: import("@emotion/react").SerializedStyles;
+	};
 
 }
-declare module '@elastic/eui/src/components/flyout/sessions' {
-	export { EuiFlyoutSessionProvider, useEuiFlyoutSessionContext, } from '@elastic/eui/src/components/flyout/sessions/flyout_provider';
-	export type { EuiFlyoutSessionApi, EuiFlyoutSessionConfig, EuiFlyoutSessionOpenChildOptions, EuiFlyoutSessionOpenGroupOptions, EuiFlyoutSessionOpenMainOptions, EuiFlyoutSessionProviderComponentProps, EuiFlyoutSessionRenderContext, } from '@elastic/eui/src/components/flyout/sessions/types';
-	export { useEuiFlyoutSession } from '@elastic/eui/src/components/flyout/sessions/use_eui_flyout';
+declare module '@elastic/eui/src/components/flyout/flyout_header' {
+	import { FunctionComponent, HTMLAttributes } from 'react';
+	import { CommonProps } from '@elastic/eui/src/components/common';
+	export type EuiFlyoutHeaderProps = FunctionComponent<HTMLAttributes<HTMLDivElement> & CommonProps & {
+	    hasBorder?: boolean;
+	}>;
+	export const EuiFlyoutHeader: EuiFlyoutHeaderProps;
 
 }
 declare module '@elastic/eui/src/components/flyout' {
@@ -7095,10 +7976,10 @@ declare module '@elastic/eui/src/components/flyout' {
 	export { euiFlyoutSlideInRight, euiFlyoutSlideInLeft } from '@elastic/eui/src/components/flyout/flyout.styles';
 	export type { EuiFlyoutResizableProps } from '@elastic/eui/src/components/flyout/flyout_resizable';
 	export { EuiFlyoutResizable } from '@elastic/eui/src/components/flyout/flyout_resizable';
-	export { EuiFlyoutChild } from '@elastic/eui/src/components/flyout/flyout_child';
-	export type { EuiFlyoutChildProps } from '@elastic/eui/src/components/flyout/flyout_child';
-	export type { EuiFlyoutSessionApi, EuiFlyoutSessionConfig, EuiFlyoutSessionOpenChildOptions, EuiFlyoutSessionOpenMainOptions, EuiFlyoutSessionOpenGroupOptions, EuiFlyoutSessionProviderComponentProps, EuiFlyoutSessionRenderContext, } from '@elastic/eui/src/components/flyout/sessions';
-	export { EuiFlyoutSessionProvider, useEuiFlyoutSession } from '@elastic/eui/src/components/flyout/sessions';
+	export type { EuiFlyoutMenuProps, EuiFlyoutHistoryItem, EuiFlyoutMenuCustomAction, } from '@elastic/eui/src/components/flyout/flyout_menu';
+	export { EuiFlyoutMenu } from '@elastic/eui/src/components/flyout/flyout_menu';
+	export { useIsInManagedFlyout, useHasActiveSession } from '@elastic/eui/src/components/flyout/manager';
+	export { useIsInsideParentFlyout } from '@elastic/eui/src/components/flyout/flyout_parent_context';
 
 }
 declare module '@elastic/eui/src/components/provider/component_defaults/component_defaults' {
@@ -10081,24 +10962,6 @@ declare module '@elastic/eui/src/components/bottom_bar' {
 	export type { EuiBottomBarProps } from '@elastic/eui/src/components/bottom_bar/bottom_bar';
 	export { EuiBottomBar } from '@elastic/eui/src/components/bottom_bar/bottom_bar';
 
-}
-declare module '@elastic/eui/src/components/link/external_link_icon' {
-	import { FunctionComponent, AnchorHTMLAttributes } from 'react';
-	import { EuiIconProps } from '@elastic/eui/src/components/icon';
-	/**
-	 * DRY util for indicating external links both via icon and to
-	 * screen readers. Used internally by at EuiLink and EuiListGroupItem
-	 */
-	export type EuiExternalLinkIconProps = {
-	    target?: AnchorHTMLAttributes<HTMLAnchorElement>['target'];
-	    /**
-	     * Set to true to show an icon indicating that it is an external link;
-	     * Defaults to true if `target="_blank"`
-	     */
-	    external?: boolean;
-	};
-	export const EuiExternalLinkIcon: FunctionComponent<EuiExternalLinkIconProps & Partial<EuiIconProps>>;
-
 }
 declare module '@elastic/eui/src/components/link/link' {
 	import React, { AnchorHTMLAttributes, ButtonHTMLAttributes, MouseEventHandler } from 'react';
@@ -10322,11 +11185,6 @@ declare module '@elastic/eui/src/components/breadcrumbs' {
 	export type { EuiBreadcrumbProps as EuiBreadcrumb, EuiBreadcrumbsProps, EuiBreadcrumbResponsiveMaxCount, } from '@elastic/eui/src/components/breadcrumbs/types';
 	export { EuiBreadcrumbs } from '@elastic/eui/src/components/breadcrumbs/breadcrumbs';
 
-}
-declare module '@elastic/eui/src/components/title' {
-	export type { EuiTitleProps, EuiTitleSize } from '@elastic/eui/src/components/title/title';
-	export { EuiTitle } from '@elastic/eui/src/components/title/title';
-
 }
 declare module '@elastic/eui/src/components/call_out/call_out.styles' {
 	import { UseEuiTheme } from '@elastic/eui/src/services';
@@ -13171,7 +14029,7 @@ declare module '@elastic/eui/src/components/header/header.styles' {
 }
 declare module '@elastic/eui/src/components/collapsible_nav_beta/context' {
 	import { MouseEventHandler } from 'react';
-	import { _EuiFlyoutSide } from '@elastic/eui/src/components/flyout/flyout';
+	import { _EuiFlyoutSide } from '@elastic/eui/src/components/flyout/const';
 	type _EuiCollapsibleNavContext = {
 	    isCollapsed: boolean;
 	    isPush: boolean;
@@ -13443,397 +14301,99 @@ declare module '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav
 	     * Consider using a heading element for better accessibility.
 	     * Defaults to an unsemantic `span` or `div`, depending on context.
 	     */
-	    titleElement?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'div';
-	    /**
-	     * Optional icon to render to the left of title content
-	     */
-	    icon?: IconType;
-	    /**
-	     * Optional props to pass to the title icon
-	     */
-	    iconProps?: Partial<EuiIconProps>;
-	}, {}> & ExclusiveUnion<{
-	    /**
-	     * The nav item link.
-	     *
-	     * If not included, and no `onClick` is specified, the nav item
-	     * will render as an non-interactive `<span>`.
-	     *
-	     * Should not be used together with `items`, as the title will
-	     * trigger the accordion collapse/expand action instead of a link.
-	     */
-	    href?: string;
-	    /**
-	     * If a `href` is specified, use this prop to pass any prop that `EuiLink` accepts
-	     */
-	    linkProps?: Partial<EuiLinkProps>;
-	}, {
-	    /**
-	     * Will render either an accordion or group of nested child item links.
-	     *
-	     * Accepts any {@link EuiCollapsibleNavItemProps}. Or, to render completely custom
-	     * subitem content, pass an object with a `renderItem` callback.
-	     */
-	    items: EuiCollapsibleNavSubItemProps[];
-	    /**
-	     * If set to false, will (visually) render an always-open accordion that cannot
-	     * be toggled closed. Ignored if `items` is not passed.
-	     *
-	     * @default true
-	     */
-	    isCollapsible?: boolean;
-	    /**
-	     * If `items` is specified, and `isCollapsible` is not set to false, you may
-	     * use this prop to pass any prop that `EuiAccordion` accepts, including props
-	     * that control the toggled state of the accordion (e.g. `initialIsOpen`, `forceState`)
-	     */
-	    accordionProps?: Partial<EuiAccordionProps>;
-	}>;
-	export type EuiCollapsibleNavCustomSubItem = {
-	    renderItem: (options: {
-	        /**
-	         * When the side nav is collapsed on larger screens, the menu appears in an EuiPopover.
-	         * When the sidenav is collapsed on smaller screens, the menu appears in an EuiFlyout.
-	         *
-	         * Use this handler to close either the portalled flyout or popover, depending on which is present.
-	         * If the handler is not defined, it means there is no portal onscreen to close.
-	         */
-	        closePortals?: MouseEventHandler;
-	    }) => ReactNode;
-	};
-	export type EuiCollapsibleNavSubItemProps = ExclusiveUnion<EuiCollapsibleNavItemProps, EuiCollapsibleNavCustomSubItem>;
-	export type _EuiCollapsibleNavItemDisplayProps = {
-	    /**
-	     * Determines whether the item should render as a top-level nav item
-	     * or a nested nav subitem. Set internally by EUI
-	     */
-	    isSubItem?: boolean;
-	};
-	/**
-	 * Internal subcomponent for title display
-	 */
-	export const EuiCollapsibleNavItemTitle: FunctionComponent<Pick<EuiCollapsibleNavItemProps, 'title' | 'titleElement' | 'icon' | 'iconProps'>>;
-	/**
-	 * Sub-items can either be a totally custom rendered item,
-	 * or they can simply be more links or accordions
-	 */
-	export const EuiCollapsibleNavSubItem: FunctionComponent<EuiCollapsibleNavSubItemProps>;
-	/**
-	 * Reuseable component for rendering a group of sub items
-	 * Used by both `EuiCollapsibleNavGroup` and `EuiCollapsibleNavAccordion`
-	 */
-	type EuiCollapsibleNavSubItemsProps = HTMLAttributes<HTMLDivElement> & _EuiCollapsibleNavItemDisplayProps & {
-	    items: EuiCollapsibleNavSubItemProps[];
-	};
-	export const EuiCollapsibleNavSubItems: FunctionComponent<EuiCollapsibleNavSubItemsProps>;
-	/**
-	 * The actual exported component
-	 */
-	export const EuiCollapsibleNavItem: FunctionComponent<EuiCollapsibleNavItemProps>;
-	export {};
-
-}
-declare module '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav_item' {
-	export type { EuiCollapsibleNavItemProps, EuiCollapsibleNavSubItemProps, } from '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item';
-	export { EuiCollapsibleNavItem, EuiCollapsibleNavSubItem, } from '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item';
-
-}
-declare module '@elastic/eui/src/components/list_group/list_group_item_extra_action.styles' {
-	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiListGroupItemExtraActionStyles: ({ euiTheme, }: UseEuiTheme) => {
-	    euiListGroupItemExtraAction: import("@emotion/react").SerializedStyles;
-	    hoverStyles: import("@emotion/react").SerializedStyles;
-	    alwaysShow: import("@emotion/react").SerializedStyles;
-	};
-
-}
-declare module '@elastic/eui/src/components/list_group/list_group_item_extra_action' {
-	import { FunctionComponent } from 'react';
-	import { EuiButtonIconPropsForButton } from '@elastic/eui/src/components/button';
-	export type EuiListGroupItemExtraActionProps = {
-	    alwaysShow?: boolean;
-	} & EuiButtonIconPropsForButton;
-	type _FromEuiListGroupItem = {
-	    parentIsDisabled?: boolean;
-	};
-	export const EuiListGroupItemExtraAction: FunctionComponent<EuiListGroupItemExtraActionProps & _FromEuiListGroupItem>;
-	export {};
-
-}
-declare module '@elastic/eui/src/components/list_group/list_group_item.styles' {
-	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiListGroupItemStyles: (euiThemeContext: UseEuiTheme) => {
-	    euiListGroupItem: import("@emotion/react").SerializedStyles;
-	    xs: import("@emotion/react").SerializedStyles;
-	    s: import("@emotion/react").SerializedStyles;
-	    m: import("@emotion/react").SerializedStyles;
-	    l: import("@emotion/react").SerializedStyles;
-	    colors: {
-	        isActive: {
-	            primary: import("@emotion/react").SerializedStyles;
-	            text: import("@emotion/react").SerializedStyles;
-	            subdued: import("@emotion/react").SerializedStyles;
-	        };
-	        isClickable: {
-	            primary: import("@emotion/react").SerializedStyles;
-	            text: import("@emotion/react").SerializedStyles;
-	            subdued: import("@emotion/react").SerializedStyles;
-	        };
-	    };
-	};
-	export const euiListGroupItemInnerStyles: (euiThemeContext: UseEuiTheme) => {
-	    euiListGroupItem__inner: import("@emotion/react").SerializedStyles;
-	    xs: import("@emotion/react").SerializedStyles;
-	    s: import("@emotion/react").SerializedStyles;
-	    m: import("@emotion/react").SerializedStyles;
-	    l: import("@emotion/react").SerializedStyles;
-	    primary: import("@emotion/react").SerializedStyles;
-	    text: import("@emotion/react").SerializedStyles;
-	    subdued: import("@emotion/react").SerializedStyles;
-	    ghost: import("@emotion/react").SerializedStyles;
-	    isDisabled: import("@emotion/react").SerializedStyles;
-	    isActive: import("@emotion/react").SerializedStyles;
-	    isClickable: import("@emotion/react").SerializedStyles;
-	    externalIcon: import("@emotion/react").SerializedStyles;
-	};
-	export const euiListGroupItemLabelStyles: {
-	    euiListGroupItem__label: import("@emotion/react").SerializedStyles;
-	    truncate: import("@emotion/react").SerializedStyles;
-	    wrapText: import("@emotion/react").SerializedStyles;
-	};
-	export const euiListGroupItemIconStyles: ({ euiTheme }: UseEuiTheme) => {
-	    euiListGroupItem__icon: import("@emotion/react").SerializedStyles;
-	};
-	export const euiListGroupItemTooltipStyles: {
-	    euiListGroupItem__tooltip: import("@emotion/react").SerializedStyles;
-	};
-
-}
-declare module '@elastic/eui/src/components/list_group/list_group_item' {
-	import React, { HTMLAttributes, AnchorHTMLAttributes, ButtonHTMLAttributes, ReactNode, ReactElement, MouseEventHandler, FunctionComponent } from 'react';
-	import { ExclusiveUnion, CommonProps } from '@elastic/eui/src/components/common';
-	import { IconType, EuiIconProps } from '@elastic/eui/src/components/icon';
-	import { EuiToolTipProps } from '@elastic/eui/src/components/tool_tip';
-	import { EuiListGroupItemExtraActionProps } from '@elastic/eui/src/components/list_group/list_group_item_extra_action';
-	export const SIZES: readonly ["xs", "s", "m", "l"];
-	export type EuiListGroupItemSize = (typeof SIZES)[number];
-	export const COLORS: readonly ["primary", "text", "subdued"];
-	export type EuiListGroupItemColor = (typeof COLORS)[number];
-	export type EuiListGroupItemProps = CommonProps & Omit<ExclusiveUnion<ExclusiveUnion<ButtonHTMLAttributes<HTMLButtonElement>, Omit<AnchorHTMLAttributes<HTMLAnchorElement>, 'href'>>, HTMLAttributes<HTMLSpanElement>>, 'onClick' | 'color' | 'target' | 'rel'> & {
-	    /**
-	     * Size of the label text
-	     */
-	    size?: EuiListGroupItemSize;
-	    /**
-	     * By default the item will get the color `text`.
-	     * You can customize the color of the item by passing a color name.
-	     */
-	    color?: EuiListGroupItemColor;
-	    /**
-	     * Content to be displayed in the list item
-	     */
-	    label: ReactNode;
-	    /**
-	     * Apply styles indicating an item is active
-	     */
-	    isActive?: boolean;
-	    /**
-	     * Apply styles indicating an item is disabled
-	     */
-	    isDisabled?: boolean;
-	    /**
-	     * Make the list item label a link.
-	     * While permitted, `href` and `onClick` should not be used together in most cases and may create problems.
-	     */
-	    href?: string;
-	    rel?: string;
-	    target?: string;
-	    /**
-	     * Set to true to show an icon indicating that it is an external link;
-	     * Defaults to true if `target="_blank"`
-	     */
-	    external?: boolean;
-	    /**
-	     * Adds `EuiIcon` of `EuiIcon.type`
-	     */
-	    iconType?: IconType;
-	    /**
-	     * Further extend the props applied to EuiIcon
-	     */
-	    iconProps?: Omit<EuiIconProps, 'type'>;
-	    /**
-	     * Custom node to pass as the icon. Cannot be used in conjunction
-	     * with `iconType` and `iconProps`.
-	     */
-	    icon?: ReactElement;
-	    /**
-	     * Display tooltip on list item
-	     */
-	    showToolTip?: boolean;
-	    /**
-	     * An object of {@link EuiListGroupItemExtraAction} props.
-	     * Adds an `EuiButtonIcon` to the right side of the item; `iconType` is required;
-	     * pass `alwaysShow` if you don't want the default behavior of only showing on hover
-	     */
-	    extraAction?: EuiListGroupItemExtraActionProps;
-	    /**
-	     * Make the list item label a button.
-	     * While permitted, `href` and `onClick` should not be used together in most cases and may create problems.
-	     */
-	    onClick?: MouseEventHandler<HTMLButtonElement>;
-	    /**
-	     * Allow link text to wrap
-	     */
-	    wrapText?: boolean;
-	    /**
-	     * Pass-through ref reference specifically for targeting
-	     * instances where the item content is rendered as a `button`
-	     */
-	    buttonRef?: React.Ref<HTMLButtonElement>;
-	    /**
-	     * Text to be displayed in the tooltip when `showToolTip` is true.
-	     * By default the text will be same as the label text.
-	     */
-	    toolTipText?: string;
-	    /**
-	     * Allows customizing the tooltip shown when `showToolTip` is true.
-	     * Accepts any props that [EuiToolTip](/#/display/tooltip) accepts.
-	     */
-	    toolTipProps?: Partial<EuiToolTipProps>;
-	};
-	export const EuiListGroupItem: FunctionComponent<EuiListGroupItemProps>;
-
-}
-declare module '@elastic/eui/src/components/list_group/list_group.styles' {
-	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiListGroupStyles: (euiThemeContext: UseEuiTheme) => {
-	    euiListGroup: import("@emotion/react").SerializedStyles;
-	    flush: import("@emotion/react").SerializedStyles;
-	    bordered: import("@emotion/react").SerializedStyles;
-	    maxWidthDefault: import("@emotion/react").SerializedStyles;
-	    none: import("@emotion/react").SerializedStyles;
-	    s: import("@emotion/react").SerializedStyles;
-	    m: import("@emotion/react").SerializedStyles;
-	};
-
-}
-declare module '@elastic/eui/src/components/list_group/list_group' {
-	import { FunctionComponent, HTMLAttributes, CSSProperties } from 'react';
-	import { CommonProps } from '@elastic/eui/src/components/common';
-	import { EuiListGroupItemProps } from '@elastic/eui/src/components/list_group/list_group_item';
-	export const GUTTER_SIZES: readonly ["none", "s", "m"];
-	export type EuiListGroupGutterSize = (typeof GUTTER_SIZES)[number];
-	export type EuiListGroupProps = CommonProps & Omit<HTMLAttributes<HTMLUListElement>, 'color'> & {
-	    /**
-	     * Add a border to the list container
-	     */
-	    bordered?: boolean;
-	    /**
-	     * Remove container padding, stretching list items to the edges
-	     */
-	    flush?: boolean;
-	    /**
-	     * Spacing between list items
-	     */
-	    gutterSize?: EuiListGroupGutterSize;
-	    /**
-	     * Items to display in this group. See {@link EuiListGroupItem}
-	     */
-	    listItems?: EuiListGroupItemProps[];
-	    /**
-	     * Change the colors of all `listItems` at once
-	     * @default text
-	     */
-	    color?: EuiListGroupItemProps['color'];
-	    /**
-	     * Change the size of all `listItems` at once
-	     * @default m
-	     */
-	    size?: EuiListGroupItemProps['size'];
-	    /**
-	     * Sets the max-width of the page.
-	     * Set to `true` to use the default size,
-	     * set to `false` to not restrict the width,
-	     * or set to a number/string for a custom CSS width/measurement.
-	     */
-	    maxWidth?: boolean | CSSProperties['maxWidth'];
+	    titleElement?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span' | 'div';
 	    /**
-	     * Display tooltips on all list items
+	     * Optional icon to render to the left of title content
 	     */
-	    showToolTips?: boolean;
+	    icon?: IconType;
 	    /**
-	     * Allow link text to wrap vs truncated
+	     * Optional props to pass to the title icon
 	     */
-	    wrapText?: boolean;
-	    ariaLabelledby?: string;
-	};
-	export const EuiListGroup: FunctionComponent<EuiListGroupProps>;
-
-}
-declare module '@elastic/eui/src/components/list_group/pinnable_list_group/pinnable_list_group.styles' {
-	import { UseEuiTheme } from '@elastic/eui/src/services';
-	export const euiPinnableListGroupItemExtraActionStyles: ({ euiTheme, }: UseEuiTheme) => {
-	    euiPinnableListGroup__itemExtraAction: import("@emotion/react").SerializedStyles;
-	    pinned: import("@emotion/react").SerializedStyles;
-	};
-
-}
-declare module '@elastic/eui/src/components/list_group/pinnable_list_group/pinnable_list_group' {
-	import { FunctionComponent } from 'react';
-	import { CommonProps } from '@elastic/eui/src/components/common';
-	import { EuiListGroupProps } from '@elastic/eui/src/components/list_group/list_group';
-	import { EuiListGroupItemProps } from '@elastic/eui/src/components/list_group/list_group_item';
-	export type EuiPinnableListGroupItemProps = EuiListGroupItemProps & {
+	    iconProps?: Partial<EuiIconProps>;
+	}, {}> & ExclusiveUnion<{
 	    /**
-	     * Saves the pinned status and changes the visibility of the pin icon
+	     * The nav item link.
+	     *
+	     * If not included, and no `onClick` is specified, the nav item
+	     * will render as an non-interactive `<span>`.
+	     *
+	     * Should not be used together with `items`, as the title will
+	     * trigger the accordion collapse/expand action instead of a link.
 	     */
-	    pinned?: boolean;
+	    href?: string;
 	    /**
-	     * Passing `onPinClick` to the full EuiPinnableListGroup, will make every item pinnable.
-	     * Set this property to `false` to turn off individual item pinnability
+	     * If a `href` is specified, use this prop to pass any prop that `EuiLink` accepts
 	     */
-	    pinnable?: boolean;
-	};
-	export interface EuiPinnableListGroupProps extends CommonProps, EuiListGroupProps {
+	    linkProps?: Partial<EuiLinkProps>;
+	}, {
 	    /**
-	     * Extends `EuiListGroupItemProps`, at the very least, expecting a `label`.
-	     * See {@link EuiPinnableListGroupItemProps}
+	     * Will render either an accordion or group of nested child item links.
+	     *
+	     * Accepts any {@link EuiCollapsibleNavItemProps}. Or, to render completely custom
+	     * subitem content, pass an object with a `renderItem` callback.
 	     */
-	    listItems: EuiPinnableListGroupItemProps[];
+	    items: EuiCollapsibleNavSubItemProps[];
 	    /**
-	     * Shows the pin icon and calls this function on click.
-	     * Returns `item: EuiPinnableListGroupItemProps`
+	     * If set to false, will (visually) render an always-open accordion that cannot
+	     * be toggled closed. Ignored if `items` is not passed.
+	     *
+	     * @default true
 	     */
-	    onPinClick: (item: EuiPinnableListGroupItemProps) => void;
+	    isCollapsible?: boolean;
 	    /**
-	     * The pin icon needs a title/aria-label for accessibility.
-	     * It is a function that passes the item back and must return a string `(item) => string`.
-	     * Default is `"Pin item"`
+	     * If `items` is specified, and `isCollapsible` is not set to false, you may
+	     * use this prop to pass any prop that `EuiAccordion` accepts, including props
+	     * that control the toggled state of the accordion (e.g. `initialIsOpen`, `forceState`)
 	     */
-	    pinTitle?: (item: EuiPinnableListGroupItemProps) => string;
+	    accordionProps?: Partial<EuiAccordionProps>;
+	}>;
+	export type EuiCollapsibleNavCustomSubItem = {
+	    renderItem: (options: {
+	        /**
+	         * When the side nav is collapsed on larger screens, the menu appears in an EuiPopover.
+	         * When the sidenav is collapsed on smaller screens, the menu appears in an EuiFlyout.
+	         *
+	         * Use this handler to close either the portalled flyout or popover, depending on which is present.
+	         * If the handler is not defined, it means there is no portal onscreen to close.
+	         */
+	        closePortals?: MouseEventHandler;
+	    }) => ReactNode;
+	};
+	export type EuiCollapsibleNavSubItemProps = ExclusiveUnion<EuiCollapsibleNavItemProps, EuiCollapsibleNavCustomSubItem>;
+	export type _EuiCollapsibleNavItemDisplayProps = {
 	    /**
-	     * The unpin icon needs a title/aria-label for accessibility.
-	     * It is a function that passes the item back and must return a string `(item) => string`.
-	     * Default is `"Unpin item"`
+	     * Determines whether the item should render as a top-level nav item
+	     * or a nested nav subitem. Set internally by EUI
 	     */
-	    unpinTitle?: (item: EuiPinnableListGroupItemProps) => string;
-	}
-	export const EuiPinnableListGroup: FunctionComponent<EuiPinnableListGroupProps>;
-
-}
-declare module '@elastic/eui/src/components/list_group/pinnable_list_group' {
-	export type { EuiPinnableListGroupProps, EuiPinnableListGroupItemProps, } from '@elastic/eui/src/components/list_group/pinnable_list_group/pinnable_list_group';
-	export { EuiPinnableListGroup } from '@elastic/eui/src/components/list_group/pinnable_list_group/pinnable_list_group';
+	    isSubItem?: boolean;
+	};
+	/**
+	 * Internal subcomponent for title display
+	 */
+	export const EuiCollapsibleNavItemTitle: FunctionComponent<Pick<EuiCollapsibleNavItemProps, 'title' | 'titleElement' | 'icon' | 'iconProps'>>;
+	/**
+	 * Sub-items can either be a totally custom rendered item,
+	 * or they can simply be more links or accordions
+	 */
+	export const EuiCollapsibleNavSubItem: FunctionComponent<EuiCollapsibleNavSubItemProps>;
+	/**
+	 * Reuseable component for rendering a group of sub items
+	 * Used by both `EuiCollapsibleNavGroup` and `EuiCollapsibleNavAccordion`
+	 */
+	type EuiCollapsibleNavSubItemsProps = HTMLAttributes<HTMLDivElement> & _EuiCollapsibleNavItemDisplayProps & {
+	    items: EuiCollapsibleNavSubItemProps[];
+	};
+	export const EuiCollapsibleNavSubItems: FunctionComponent<EuiCollapsibleNavSubItemsProps>;
+	/**
+	 * The actual exported component
+	 */
+	export const EuiCollapsibleNavItem: FunctionComponent<EuiCollapsibleNavItemProps>;
+	export {};
 
 }
-declare module '@elastic/eui/src/components/list_group' {
-	export type { EuiListGroupProps } from '@elastic/eui/src/components/list_group/list_group';
-	export { EuiListGroup } from '@elastic/eui/src/components/list_group/list_group';
-	export type { EuiListGroupItemProps } from '@elastic/eui/src/components/list_group/list_group_item';
-	export type { EuiListGroupItemExtraActionProps } from '@elastic/eui/src/components/list_group/list_group_item_extra_action';
-	export { EuiListGroupItem } from '@elastic/eui/src/components/list_group/list_group_item';
-	export type { EuiPinnableListGroupProps, EuiPinnableListGroupItemProps, } from '@elastic/eui/src/components/list_group/pinnable_list_group';
-	export { EuiPinnableListGroup } from '@elastic/eui/src/components/list_group/pinnable_list_group';
+declare module '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav_item' {
+	export type { EuiCollapsibleNavItemProps, EuiCollapsibleNavSubItemProps, } from '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item';
+	export { EuiCollapsibleNavItem, EuiCollapsibleNavSubItem, } from '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav_item/collapsible_nav_item';
 
 }
 declare module '@elastic/eui/src/components/collapsible_nav_beta/_kibana_solution/collapsible_nav_kibana_solution.styles' {
@@ -13887,7 +14447,7 @@ declare module '@elastic/eui/src/components/collapsible_nav_beta/collapsible_nav
 	import React, { HTMLAttributes, ReactNode } from 'react';
 	import { CommonProps } from '@elastic/eui/src/components/common';
 	import { EuiFlyoutProps } from '@elastic/eui/src/components/flyout';
-	export type EuiCollapsibleNavBetaProps = CommonProps & HTMLAttributes<HTMLElement> & Pick<EuiFlyoutProps, // Extend only specific flyout props - EuiCollapsibleNav is much less customizable than EuiFlyout
+	export type EuiCollapsibleNavBetaProps = CommonProps & Omit<HTMLAttributes<HTMLElement>, 'onResize'> & Pick<EuiFlyoutProps, // Extend only specific flyout props - EuiCollapsibleNav is much less customizable than EuiFlyout
 	// Extend only specific flyout props - EuiCollapsibleNav is much less customizable than EuiFlyout
 	'side' | 'focusTrapProps' | 'includeFixedHeadersInFocusTrap'> & {
 	    /**
@@ -32405,20 +32965,21 @@ declare module '@loki/create-async-callback' {
 
 declare module '@elastic/eui' {
   export type EuiTokensObject = {
-    "euiTreeView.listNavigationInstructions": any;
-"euiTourStepIndicator.isActive": any;
+    "euiTourStepIndicator.isActive": any;
 "euiTourStepIndicator.isComplete": any;
 "euiTourStepIndicator.isIncomplete": any;
 "euiTourStepIndicator.ariaLabel": any;
 "euiTourFooter.endTour": any;
 "euiTourFooter.skipTour": any;
 "euiTourFooter.closeTour": any;
+"euiIconTip.defaultAriaLabel": any;
+"euiTreeView.listNavigationInstructions": any;
 "euiToast.newNotification": any;
 "euiToast.notification": any;
 "euiToast.dismissToast": any;
 "euiGlobalToastList.clearAllToastsButtonAriaLabel": any;
 "euiGlobalToastList.clearAllToastsButtonDisplayText": any;
-"euiIconTip.defaultAriaLabel": any;
+"euiStat.loadingText": any;
 "euiTableHeaderCell.titleTextWithDesc": any;
 "euiStepStrings.step": any;
 "euiStepStrings.simpleStep": any;
@@ -32436,22 +32997,21 @@ declare module '@elastic/eui' {
 "euiStepStrings.simpleLoading": any;
 "euiStepStrings.current": any;
 "euiStepStrings.simpleCurrent": any;
-"euiStat.loadingText": any;
 "euiSkeletonLoading.loadedAriaText": any;
 "euiSkeletonLoading.loadingAriaText": any;
-"euiSearchBox.placeholder": any;
-"euiSearchBox.incrementalAriaLabel": any;
-"euiSearchBox.ariaLabel": any;
 "euiSideNav.mobileToggleAriaLabel": any;
-"euiResizablePanel.toggleButtonAriaLabel": any;
-"euiResizableButton.horizontalResizerAriaLabel": any;
-"euiResizableButton.verticalResizerAriaLabel": any;
 "euiSelectable.loadingOptions": any;
 "euiSelectable.noMatchingOptions": any;
 "euiSelectable.noAvailableOptions": any;
 "euiSelectable.screenReaderInstructions": any;
 "euiSelectable.placeholderName": any;
 "euiSelectable.searchResults": any;
+"euiSearchBox.placeholder": any;
+"euiSearchBox.incrementalAriaLabel": any;
+"euiSearchBox.ariaLabel": any;
+"euiResizablePanel.toggleButtonAriaLabel": any;
+"euiResizableButton.horizontalResizerAriaLabel": any;
+"euiResizableButton.verticalResizerAriaLabel": any;
 "euiProgress.valueText": any;
 "euiPopover.screenReaderAnnouncement": any;
 "euiPaginationButtonArrow.firstPage": any;
@@ -32468,6 +33028,8 @@ declare module '@elastic/eui' {
 "euiPagination.of": any;
 "euiPagination.collection": any;
 "euiPagination.fromEndLabel": any;
+"euiMark.highlightStart": any;
+"euiMark.highlightEnd": any;
 "euiModal.screenReaderModalDialog": any;
 "euiModal.closeModal": any;
 "euiMarkdownEditorToolbar.editor": any;
@@ -32485,11 +33047,9 @@ declare module '@elastic/eui' {
 "euiMarkdownEditorFooter.supportedFileTypes": any;
 "euiMarkdownEditorFooter.showSyntaxErrors": any;
 "euiMarkdownEditorFooter.errorsTitle": any;
-"euiMark.highlightStart": any;
-"euiMark.highlightEnd": any;
-"euiLoadingStrings.ariaLabel": any;
 "euiExternalLinkIcon.newTarget.screenReaderOnlyText": any;
 "euiExternalLinkIcon.externalTarget.screenReaderOnlyText": any;
+"euiLoadingStrings.ariaLabel": any;
 "euiInlineEditForm.saveButtonAriaLabel": any;
 "euiInlineEditForm.cancelButtonAriaLabel": any;
 "euiInlineEditForm.inputKeyboardInstructions": any;
@@ -32497,6 +33057,8 @@ declare module '@elastic/eui' {
 "euiImageButton.openFullScreen": any;
 "euiImageButton.closeFullScreen": any;
 "euiForm.addressFormErrors": any;
+"euiFlyoutMenu.back": any;
+"euiFlyoutMenu.history": any;
 "euiFlyout.screenReaderModalDialog": any;
 "euiFlyout.screenReaderNonModalDialog": any;
 "euiFlyout.screenReaderFocusTrapShards": any;
@@ -32524,22 +33086,19 @@ declare module '@elastic/eui' {
 "euiColorPicker.openLabel": any;
 "euiColorPicker.closeLabel": any;
 "euiCollapsibleNavBeta.ariaLabel": any;
+"euiCallOut.dismissAriaLabel": any;
 "euiCodeBlockFullScreen.fullscreenCollapse": any;
 "euiCodeBlockFullScreen.fullscreenExpand": any;
 "euiCodeBlockFullScreen.ariaLabel": any;
 "euiCodeBlockCopy.copy": any;
 "euiCodeBlockAnnotations.ariaLabel": any;
 "euiCodeBlock.label": any;
-"euiCallOut.dismissAriaLabel": any;
-"euiBreadcrumbs.nav.ariaLabel": any;
-"euiBreadcrumb.collapsedBadge.ariaLabel": any;
-"euiBreadcrumb.popoverAriaLabel": any;
 "euiBottomBar.screenReaderHeading": any;
 "euiBottomBar.customScreenReaderAnnouncement": any;
 "euiBottomBar.screenReaderAnnouncement": any;
-"euiCollapsedItemActions.allActionsTooltip": any;
-"euiCollapsedItemActions.allActions": any;
-"euiCollapsedItemActions.allActionsDisabled": any;
+"euiBreadcrumbs.nav.ariaLabel": any;
+"euiBreadcrumb.collapsedBadge.ariaLabel": any;
+"euiBreadcrumb.popoverAriaLabel": any;
 "euiBasicTable.noItemsMessage": any;
 "euiBasicTable.tableCaptionWithPagination": any;
 "euiBasicTable.tableAutoCaptionWithPagination": any;
@@ -32549,12 +33108,14 @@ declare module '@elastic/eui' {
 "euiBasicTable.deselectRows": any;
 "euiBasicTable.selectThisRow": any;
 "euiBasicTable.tablePagination": any;
+"euiCollapsedItemActions.allActionsTooltip": any;
+"euiCollapsedItemActions.allActions": any;
+"euiCollapsedItemActions.allActionsDisabled": any;
 "euiTablePagination.allRows": any;
 "euiTablePagination.rowsPerPage": any;
 "euiTablePagination.rowsPerPageOptionShowAllRows": any;
 "euiTablePagination.rowsPerPageOption": any;
 "euiTableSortMobile.sorting": any;
-"euiFieldValueSelectionFilter.buttonLabelHint": any;
 "euiSelectableTemplateSitewide.searchPlaceholder": any;
 "euiSelectableTemplateSitewide.loadingResults": any;
 "euiSelectableTemplateSitewide.noResults": any;
@@ -32568,6 +33129,7 @@ declare module '@elastic/eui' {
 "euiSelectableListItem.mixedOptionInstructions": any;
 "euiSelectableListItem.mixedOptionUncheckInstructions": any;
 "euiSelectableListItem.mixedOptionExcludeInstructions": any;
+"euiFieldValueSelectionFilter.buttonLabelHint": any;
 "euiPinnableListGroup.pinExtraActionLabel": any;
 "euiPinnableListGroup.pinnedExtraActionLabel": any;
 "euiHeaderLinks.appNavigation": any;
@@ -32576,20 +33138,32 @@ declare module '@elastic/eui' {
 "euiSuperSelect.ariaLabel": any;
 "euiRange.sliderScreenReaderInstructions": any;
 "euiDualRange.sliderScreenReaderInstructions": any;
+"euiFormControlLayoutDelimited.delimiterLabel": any;
+"euiFormControlLayoutClearButton.label": any;
 "euiFilePicker.promptText": any;
 "euiFilePicker.filesSelected": any;
 "euiFilePicker.removeSelectedAriaLabel": any;
 "euiFilePicker.removeSelected": any;
-"euiFormControlLayoutDelimited.delimiterLabel": any;
-"euiFormControlLayoutClearButton.label": any;
 "euiFieldSearch.clearSearchButtonLabel": any;
 "euiFieldPassword.showPassword": any;
 "euiFieldPassword.maskPassword": any;
-"euiSuperUpdateButton.updatingButtonLabel": any;
-"euiSuperUpdateButton.updateButtonLabel": any;
-"euiSuperUpdateButton.refreshButtonLabel": any;
-"euiSuperUpdateButton.cannotUpdateTooltip": any;
-"euiSuperUpdateButton.clickToApplyTooltip": any;
+"euiFlyoutManaged.defaultTitle": any;
+"euiRefreshInterval.fullDescriptionOff": any;
+"euiRefreshInterval.fullDescriptionOn": any;
+"euiRefreshInterval.toggleLabel": any;
+"euiRefreshInterval.toggleAriaLabel": any;
+"euiRefreshInterval.valueAriaLabel": any;
+"euiRefreshInterval.unitsAriaLabel": any;
+"euiAutoRefresh.autoRefreshLabel": any;
+"euiAutoRefresh.buttonLabelOff": any;
+"euiAutoRefresh.buttonLabelOn": any;
+"euiTimeWindowButtons.invalidShiftLabel": any;
+"euiTimeWindowButtons.invalidZoomOutLabel": any;
+"euiTimeWindowButtons.previousLabel": any;
+"euiTimeWindowButtons.previousDescription": any;
+"euiTimeWindowButtons.zoomOutLabel": any;
+"euiTimeWindowButtons.nextLabel": any;
+"euiTimeWindowButtons.nextDescription": any;
 "euiTimeOptions.last": any;
 "euiTimeOptions.next": any;
 "euiTimeOptions.seconds": any;
@@ -32628,13 +33202,11 @@ declare module '@elastic/eui' {
 "euiTimeOptions.weekToDate": any;
 "euiTimeOptions.monthToDate": any;
 "euiTimeOptions.yearToDate": any;
-"euiTimeWindowButtons.invalidShiftLabel": any;
-"euiTimeWindowButtons.invalidZoomOutLabel": any;
-"euiTimeWindowButtons.previousLabel": any;
-"euiTimeWindowButtons.previousDescription": any;
-"euiTimeWindowButtons.zoomOutLabel": any;
-"euiTimeWindowButtons.nextLabel": any;
-"euiTimeWindowButtons.nextDescription": any;
+"euiSuperUpdateButton.updatingButtonLabel": any;
+"euiSuperUpdateButton.updateButtonLabel": any;
+"euiSuperUpdateButton.refreshButtonLabel": any;
+"euiSuperUpdateButton.cannotUpdateTooltip": any;
+"euiSuperUpdateButton.clickToApplyTooltip": any;
 "euiPrettyInterval.seconds": any;
 "euiPrettyInterval.minutes": any;
 "euiPrettyInterval.hours": any;
@@ -32668,15 +33240,8 @@ declare module '@elastic/eui' {
 "euiPrettyDuration.now": any;
 "euiPrettyDuration.invalid": any;
 "euiPrettyDuration.fallbackDuration": any;
-"euiRefreshInterval.fullDescriptionOff": any;
-"euiRefreshInterval.fullDescriptionOn": any;
-"euiRefreshInterval.toggleLabel": any;
-"euiRefreshInterval.toggleAriaLabel": any;
-"euiRefreshInterval.valueAriaLabel": any;
-"euiRefreshInterval.unitsAriaLabel": any;
-"euiAutoRefresh.autoRefreshLabel": any;
-"euiAutoRefresh.buttonLabelOff": any;
-"euiAutoRefresh.buttonLabelOn": any;
+"euiDataGridPagination.detailedPaginationLabel": any;
+"euiDataGridPagination.paginationLabel": any;
 "euiDataGridSchema.booleanSortTextAsc": any;
 "euiDataGridSchema.booleanSortTextDesc": any;
 "euiDataGridSchema.currencySortTextAsc": any;
@@ -32687,8 +33252,6 @@ declare module '@elastic/eui' {
 "euiDataGridSchema.numberSortTextDesc": any;
 "euiDataGridSchema.jsonSortTextAsc": any;
 "euiDataGridSchema.jsonSortTextDesc": any;
-"euiDataGridPagination.detailedPaginationLabel": any;
-"euiDataGridPagination.paginationLabel": any;
 "euiKeyboardShortcuts.title": any;
 "euiKeyboardShortcuts.upArrowTitle": any;
 "euiKeyboardShortcuts.upArrowDescription": any;
@@ -32715,7 +33278,6 @@ declare module '@elastic/eui' {
 "euiKeyboardShortcuts.escapeDescription": any;
 "euiFullscreenSelector.fullscreenButton": any;
 "euiFullscreenSelector.fullscreenButtonActive": any;
-"euiDataGridToolbarControl.badgeAriaLabel": any;
 "euiDisplaySelector.densityLabel": any;
 "euiDisplaySelector.labelCompact": any;
 "euiDisplaySelector.labelNormal": any;
@@ -32726,17 +33288,18 @@ declare module '@elastic/eui' {
 "euiDisplaySelector.labelMax": any;
 "euiDisplaySelector.buttonText": any;
 "euiDisplaySelector.resetButtonText": any;
-"euiColumnSorting.button": any;
-"euiColumnSorting.sortFieldAriaLabel": any;
-"euiColumnSorting.emptySorting": any;
-"euiColumnSorting.pickFields": any;
-"euiColumnSorting.clearAll": any;
+"euiDataGridToolbarControl.badgeAriaLabel": any;
 "euiColumnSortingDraggable.defaultSortAsc": any;
 "euiColumnSortingDraggable.defaultSortDesc": any;
 "euiColumnSortingDraggable.dragHandleAriaLabel": any;
 "euiColumnSortingDraggable.activeSortLabel": any;
 "euiColumnSortingDraggable.removeSortLabel": any;
 "euiColumnSortingDraggable.toggleLegend": any;
+"euiColumnSorting.button": any;
+"euiColumnSorting.sortFieldAriaLabel": any;
+"euiColumnSorting.emptySorting": any;
+"euiColumnSorting.pickFields": any;
+"euiColumnSorting.clearAll": any;
 "euiColumnSelector.dragHandleAriaLabel": any;
 "euiColumnSelector.button": any;
 "euiColumnSelector.search": any;
@@ -32762,17 +33325,6 @@ declare module '@elastic/eui' {
 "euiCardSelect.unavailable": any;
 "euiCardSelect.select": any;
 "euiAccordionChildrenLoading.message": any;
-"euiRecentlyUsed.legend": any;
-"euiQuickSelectPopover.buttonLabel": any;
-"euiQuickSelect.quickSelectTitle": any;
-"euiQuickSelect.previousLabel": any;
-"euiQuickSelect.nextLabel": any;
-"euiQuickSelect.tenseLabel": any;
-"euiQuickSelect.valueLabel": any;
-"euiQuickSelect.unitLabel": any;
-"euiQuickSelect.applyButton": any;
-"euiQuickSelect.fullDescription": any;
-"euiCommonlyUsedTimeRanges.legend": any;
 "euiRelativeTab.numberInputLabel": any;
 "euiRelativeTab.numberInputError": any;
 "euiRelativeTab.dateInputError": any;
@@ -32804,6 +33356,17 @@ declare module '@elastic/eui' {
 "euiColumnActions.moveRight": any;
 "euiColumnActions.unsort": any;
 "euiColumnActions.sort": any;
+"euiRecentlyUsed.legend": any;
+"euiQuickSelectPopover.buttonLabel": any;
+"euiQuickSelect.quickSelectTitle": any;
+"euiQuickSelect.previousLabel": any;
+"euiQuickSelect.nextLabel": any;
+"euiQuickSelect.tenseLabel": any;
+"euiQuickSelect.valueLabel": any;
+"euiQuickSelect.unitLabel": any;
+"euiQuickSelect.applyButton": any;
+"euiQuickSelect.fullDescription": any;
+"euiCommonlyUsedTimeRanges.legend": any;
 "euiDataGridCell.focusTrapExitPrompt": any;
 "euiDataGridCell.focusTrapEnterPrompt": any;
 "euiDataGridCell.focusTrapEnteredExitPrompt": any;