@base-ui/react/dialog/store/DialogStore.d.ts

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 { type InteractionType } from '@base-ui/utils/useEnhancedClickHandler';
import { type DialogRoot } from "../root/DialogRoot.js";
import { PopupStoreContext, PopupStoreState } from "../../utils/popups/index.js";
export type State<Payload> = PopupStoreState<Payload> & {
  modal: boolean | 'trap-focus';
  disablePointerDismissal: boolean;
  openMethod: InteractionType | null;
  nested: boolean;
  nestedOpenDialogCount: number;
  titleElementId: string | undefined;
  descriptionElementId: string | undefined;
  viewportElement: HTMLElement | null;
  role: 'dialog' | 'alertdialog';
};
type Context = PopupStoreContext<DialogRoot.ChangeEventDetails> & {
  readonly popupRef: React.RefObject<HTMLElement | null>;
  readonly backdropRef: React.RefObject<HTMLDivElement | null>;
  readonly internalBackdropRef: React.RefObject<HTMLDivElement | null>;
  readonly outsidePressEnabledRef: React.MutableRefObject<boolean>;
  readonly onNestedDialogOpen?: ((ownChildrenCount: number) => void) | undefined;
  readonly onNestedDialogClose?: (() => void) | undefined;
};
declare const selectors: {
  modal: (state: State<unknown>) => boolean | "trap-focus";
  nested: (state: State<unknown>) => boolean;
  nestedOpenDialogCount: (state: State<unknown>) => number;
  disablePointerDismissal: (state: State<unknown>) => boolean;
  openMethod: (state: State<unknown>) => InteractionType | null;
  descriptionElementId: (state: State<unknown>) => string | undefined;
  titleElementId: (state: State<unknown>) => string | undefined;
  viewportElement: (state: State<unknown>) => HTMLElement | null;
  role: (state: State<unknown>) => "dialog" | "alertdialog";
  open: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => boolean;
  mounted: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => boolean;
  transitionStatus: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => import("../../utils/useTransitionStatus.js").TransitionStatus;
  floatingRootContext: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => import("../../floating-ui-react/components/FloatingRootStore.js").FloatingRootStore;
  preventUnmountingOnClose: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => boolean;
  payload: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => unknown;
  activeTriggerId: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => string | null;
  activeTriggerElement: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => Element | null;
  isTriggerActive: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }, triggerId: string | undefined) => boolean;
  isOpenedByTrigger: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }, triggerId: string | undefined) => boolean;
  isMountedByTrigger: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }, triggerId: string | undefined) => boolean;
  triggerProps: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }, isActive: boolean) => import("../../index.js").HTMLProps;
  popupProps: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => import("../../index.js").HTMLProps;
  popupElement: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => HTMLElement | null;
  positionerElement: (state: {
    open: boolean;
    readonly openProp: boolean | undefined;
    mounted: boolean;
    transitionStatus: import("../../utils/useTransitionStatus.js").TransitionStatus;
    floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
    preventUnmountingOnClose: boolean;
    payload: unknown;
    activeTriggerId: string | null;
    activeTriggerElement: Element | null;
    readonly triggerIdProp: string | null | undefined;
    popupElement: HTMLElement | null;
    positionerElement: HTMLElement | null;
    activeTriggerProps: import("../../index.js").HTMLProps;
    inactiveTriggerProps: import("../../index.js").HTMLProps;
    popupProps: import("../../index.js").HTMLProps;
  }) => HTMLElement | null;
};
export declare class DialogStore<Payload> extends ReactStore<Readonly<State<Payload>>, Context, typeof selectors> {
  constructor(initialState?: Partial<State<Payload>>);
  setOpen: (nextOpen: boolean, eventDetails: Omit<DialogRoot.ChangeEventDetails, "preventUnmountOnClose">) => void;
}
export {};