@base-ui/react/popover/store/PopoverStore.d.mts

Base UI is a library of headless ('unstyled') React components and low-level hooks. You gain complete control over your app's CSS and accessibility features.

import * as React from 'react';
import { ReactStore } from '@base-ui/utils/store';
import { Timeout } from '@base-ui/utils/useTimeout';
import { type InteractionType } from '@base-ui/utils/useEnhancedClickHandler';
import { type PopoverRoot } from "../root/PopoverRoot.mjs";
import { PopupStoreContext, PopupStoreState, type PopupTriggerStoreKeys } from "../../utils/popups/index.mjs";
import type { AdaptiveOriginMiddleware } from "../../utils/adaptiveOriginConstants.mjs";
export type State<Payload> = PopupStoreState<Payload> & {
  disabled: boolean;
  instantType: 'dismiss' | 'click' | 'focus' | 'trigger-change' | undefined;
  modal: boolean | 'trap-focus';
  focusManagerModal: boolean;
  openMethod: InteractionType | null;
  openChangeReason: PopoverRoot.ChangeEventReason | null;
  stickIfOpen: boolean;
  titleElementId: string | undefined;
  descriptionElementId: string | undefined;
  openOnHover: boolean;
  closeDelay: number;
  adaptiveOrigin: AdaptiveOriginMiddleware | undefined;
};
type Context = PopupStoreContext<PopoverRoot.ChangeEventDetails> & {
  readonly popupRef: React.RefObject<HTMLElement | null>;
  readonly triggerFocusTargetRef: React.RefObject<HTMLElement | null>;
  readonly beforeContentFocusGuardRef: React.RefObject<HTMLElement | null>;
  readonly stickIfOpenTimeout: Timeout;
};
declare const selectors: {
  open: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => boolean;
  mounted: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => boolean;
  transitionStatus: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => import("../../internals/useTransitionStatus.mjs").TransitionStatus;
  floatingRootContext: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => import("../../floating-ui-react/components/FloatingRootStore.mjs").FloatingRootStore;
  triggerCount: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => number;
  preventUnmountingOnClose: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => boolean;
  payload: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => unknown;
  activeTriggerId: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => string | null;
  activeTriggerElement: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => Element | null;
  popupId: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => string | undefined;
  isTriggerActive: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }, triggerId: string | undefined) => boolean;
  isOpenedByTrigger: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }, triggerId: string | undefined) => boolean;
  isMountedByTrigger: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }, triggerId: string | undefined) => boolean;
  triggerProps: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }, isActive: boolean) => import("../../index.mjs").HTMLProps;
  triggerPopupId: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }, triggerId: string | undefined) => string | undefined;
  popupProps: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => import("../../index.mjs").HTMLProps;
  popupElement: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => HTMLElement | null;
  positionerElement: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../internals/useTransitionStatus.mjs").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.mjs").FloatingRootContext;
    floatingId: string | undefined;
    triggerCount: number;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.mjs").HTMLProps;
    inactiveTriggerProps: import("../../index.mjs").HTMLProps;
    popupProps: import("../../index.mjs").HTMLProps;
  }) => HTMLElement | null;
  disabled: (state: State<unknown>) => boolean;
  instantType: (state: State<unknown>) => "click" | "dismiss" | "focus" | "trigger-change" | undefined;
  openMethod: (state: State<unknown>) => InteractionType | null;
  openChangeReason: (state: State<unknown>) => import("../index.mjs").PopoverRootChangeEventReason | null;
  modal: (state: State<unknown>) => "trap-focus" | boolean;
  focusManagerModal: (state: State<unknown>) => boolean;
  stickIfOpen: (state: State<unknown>) => boolean;
  titleElementId: (state: State<unknown>) => string | undefined;
  descriptionElementId: (state: State<unknown>) => string | undefined;
  openOnHover: (state: State<unknown>) => boolean;
  closeDelay: (state: State<unknown>) => number;
  adaptiveOrigin: (state: State<unknown>) => AdaptiveOriginMiddleware | undefined;
};
type Selectors = typeof selectors;
/**
 * The store view that detached handle-backed triggers read from. Both the real `PopoverStore` and
 * the inert fallback store satisfy it, so a trigger can read from whichever store the handle
 * currently exposes. Narrowed to the members a trigger actually uses — the trigger-data members plus
 * `setOpen` (called by the focus guards) — so the exposed surface can't bypass the open-change
 * pipeline; on the detached fallback store every one of these mutations is a no-op.
 */
export type PopoverHandleStore<Payload> = Pick<PopoverStore<Payload>, PopupTriggerStoreKeys | 'setOpen'>;
export declare class PopoverStore<Payload> extends ReactStore<Readonly<State<Payload>>, Context, Selectors> {
  constructor(initialState: Partial<State<Payload>>, floatingId: string | undefined, nested: boolean);
  setOpen: (nextOpen: boolean, eventDetails: Omit<PopoverRoot.ChangeEventDetails, 'preventUnmountOnClose'>) => void;
}
/**
 * Creates the inert fallback store used by detached handle-backed triggers while no
 * `Popover.Root` is attached. It preserves a popover-specific trigger registry in context so
 * detached triggers can register before migrating to the live root store. `setOpen` is a no-op
 * (matching the inert reads/writes of `NullStore`), so a trigger can hand the store to focus-guard
 * helpers that expect `setOpen` without it ever taking effect while detached.
 */
export declare function createNullPopoverStore<Payload>(): PopoverHandleStore<Payload>;
export {};