@base-ui/react 1.4.1 → 1.5.0

package/popover/arrow/PopoverArrow.js

@@ -19,8 +19,8 @@ var _useRenderElement = require("../../internals/useRenderElement");
  */
 const PopoverArrow = exports.PopoverArrow = /*#__PURE__*/React.forwardRef(function PopoverArrow(componentProps, forwardedRef) {
   const {
-    className,
     render,
+    className,
     style,
     ...elementProps
   } = componentProps;

package/popover/backdrop/PopoverBackdrop.js

@@ -25,8 +25,8 @@ const stateAttributesMapping = {
  */
 const PopoverBackdrop = exports.PopoverBackdrop = /*#__PURE__*/React.forwardRef(function PopoverBackdrop(props, forwardedRef) {
   const {
-    className,
     render,
+    className,
     style,
     ...elementProps
   } = props;

package/popover/close/PopoverClose.js

@@ -23,9 +23,9 @@ const PopoverClose = exports.PopoverClose = /*#__PURE__*/React.forwardRef(functi
   const {
     render,
     className,
+    style,
     disabled = false,
     nativeButton = true,
-    style,
     ...elementProps
   } = componentProps;
   const {
@@ -44,7 +44,7 @@ const PopoverClose = exports.PopoverClose = /*#__PURE__*/React.forwardRef(functi
     ref: [forwardedRef, buttonRef],
     props: [{
       onClick(event) {
-        store.setOpen(false, (0, _createBaseUIEventDetails.createChangeEventDetails)(_reasons.REASONS.closePress, event.nativeEvent, event.currentTarget));
+        store.setOpen(false, (0, _createBaseUIEventDetails.createChangeEventDetails)(_reasons.REASONS.closePress, event.nativeEvent));
       }
     }, elementProps, getButtonProps]
   });

package/popover/description/PopoverDescription.js

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.PopoverDescription = void 0;
 var React = _interopRequireWildcard(require("react"));
-var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
 var _PopoverRootContext = require("../root/PopoverRootContext");
 var _useBaseUiId = require("../../internals/useBaseUiId");
 var _useRenderElement = require("../../internals/useRenderElement");
@@ -28,12 +27,7 @@ const PopoverDescription = exports.PopoverDescription = /*#__PURE__*/React.forwa
     store
   } = (0, _PopoverRootContext.usePopoverRootContext)();
   const id = (0, _useBaseUiId.useBaseUiId)(elementProps.id);
-  (0, _useIsoLayoutEffect.useIsoLayoutEffect)(() => {
-    store.set('descriptionElementId', id);
-    return () => {
-      store.set('descriptionElementId', undefined);
-    };
-  }, [store, id]);
+  store.useSyncedValueWithCleanup('descriptionElementId', id);
   const element = (0, _useRenderElement.useRenderElement)('p', componentProps, {
     ref: forwardedRef,
     props: [{

package/popover/popup/PopoverPopup.d.ts

@@ -30,7 +30,7 @@ export interface PopoverPopupState {
   /**
    * Whether transitions should be skipped.
    */
-  instant: 'dismiss' | 'click' | undefined;
+  instant: 'dismiss' | 'click' | 'focus' | 'trigger-change' | undefined;
 }
 export interface PopoverPopupProps extends BaseUIComponentProps<'div', PopoverPopupState> {
   /**

package/popover/popup/PopoverPopup.js

@@ -20,6 +20,7 @@ var _composite = require("../../internals/composite/composite");
 var _ToolbarRootContext = require("../../toolbar/root/ToolbarRootContext");
 var _getDisabledMountTransitionStyles = require("../../utils/getDisabledMountTransitionStyles");
 var _closePart = require("../../utils/closePart");
+var _popups = require("../../utils/popups");
 var _jsxRuntime = require("react/jsx-runtime");
 const stateAttributesMapping = {
   ..._popupStateMapping.popupStateMapping,
@@ -34,11 +35,11 @@ const stateAttributesMapping = {
  */
 const PopoverPopup = exports.PopoverPopup = /*#__PURE__*/React.forwardRef(function PopoverPopup(componentProps, forwardedRef) {
   const {
-    className,
     render,
+    className,
+    style,
     initialFocus,
     finalFocus,
-    style,
     ...elementProps
   } = componentProps;
   const {
@@ -62,6 +63,11 @@ const PopoverPopup = exports.PopoverPopup = /*#__PURE__*/React.forwardRef(functi
   const openReason = store.useState('openChangeReason');
   const activeTriggerElement = store.useState('activeTriggerElement');
   const floatingContext = store.useState('floatingRootContext');
+  const floatingId = floatingContext.useState('floatingId');
+  const disabled = store.useState('disabled');
+  const openOnHover = store.useState('openOnHover');
+  const closeDelay = store.useState('closeDelay');
+  const popupId = elementProps.id ?? floatingId;
   (0, _useOpenChangeComplete.useOpenChangeComplete)({
     open,
     ref: store.context.popupRef,
@@ -71,9 +77,6 @@ const PopoverPopup = exports.PopoverPopup = /*#__PURE__*/React.forwardRef(functi
       }
     }
   });
-  const disabled = store.useState('disabled');
-  const openOnHover = store.useState('openOnHover');
-  const closeDelay = store.useState('closeDelay');
   (0, _floatingUiReact.useHoverFloatingInteraction)(floatingContext, {
     enabled: openOnHover && !disabled,
     closeDelay
@@ -89,6 +92,11 @@ const PopoverPopup = exports.PopoverPopup = /*#__PURE__*/React.forwardRef(functi
     return true;
   }
   const resolvedInitialFocus = initialFocus === undefined ? defaultInitialFocus : initialFocus;
+  const focusManagerModal = modal !== false && hasClosePart;
+  store.useSyncedValue('focusManagerModal', focusManagerModal);
+  const setPopupElement = React.useCallback(element => {
+    store.set('popupElement', element);
+  }, [store]);
   const state = {
     open,
     side: positioner.side,
@@ -96,15 +104,13 @@ const PopoverPopup = exports.PopoverPopup = /*#__PURE__*/React.forwardRef(functi
     instant: instantType,
     transitionStatus
   };
-  const focusManagerModal = modal !== false && hasClosePart;
-  store.useSyncedValue('focusManagerModal', focusManagerModal);
-  const setPopupElement = React.useCallback(element => {
-    store.set('popupElement', element);
-  }, [store]);
   const element = (0, _useRenderElement.useRenderElement)('div', componentProps, {
     state,
     ref: [forwardedRef, store.context.popupRef, setPopupElement],
     props: [popupProps, {
+      id: popupId,
+      role: 'dialog',
+      ..._popups.FOCUSABLE_POPUP_PROPS,
       'aria-labelledby': titleId,
       'aria-describedby': descriptionId,
       onKeyDown(event) {

package/popover/popup/PopoverPopupDataAttributes.d.ts

@@ -27,7 +27,7 @@ export declare enum PopoverPopupDataAttributes {
   align = "data-align",
   /**
    * Present if animations should be instant.
-   * @type {'click' | 'dismiss'}
+   * @type {'click' | 'dismiss' | 'focus' | 'trigger-change'}
    */
   instant = "data-instant",
 }

package/popover/popup/PopoverPopupDataAttributes.js

@@ -34,7 +34,7 @@ let PopoverPopupDataAttributes = exports.PopoverPopupDataAttributes = function (
   PopoverPopupDataAttributes["align"] = "data-align";
   /**
    * Present if animations should be instant.
-   * @type {'click' | 'dismiss'}
+   * @type {'click' | 'dismiss' | 'focus' | 'trigger-change'}
    */
   PopoverPopupDataAttributes["instant"] = "data-instant";
   return PopoverPopupDataAttributes;

package/popover/positioner/PopoverPositioner.js

@@ -32,6 +32,7 @@ const PopoverPositioner = exports.PopoverPositioner = /*#__PURE__*/React.forward
   const {
     render,
     className,
+    style,
     anchor,
     positionMethod = 'absolute',
     side = 'bottom',
@@ -44,7 +45,6 @@ const PopoverPositioner = exports.PopoverPositioner = /*#__PURE__*/React.forward
     sticky = false,
     disableAnchorTracking = false,
     collisionAvoidance = _constants.POPUP_COLLISION_AVOIDANCE,
-    style,
     ...elementProps
   } = componentProps;
   const {
@@ -106,6 +106,10 @@ const PopoverPositioner = exports.PopoverPositioner = /*#__PURE__*/React.forward
     }
     return undefined;
   }, [domReference, runOnceAnimationsFinish, store]);
+  (0, _useAnchoredPopupScrollLock.useAnchoredPopupScrollLock)(open && modal === true && openReason !== _reasons.REASONS.triggerHover, openMethod === 'touch', positionerElement, triggerElement);
+  const setPositionerElement = React.useCallback(element => {
+    store.set('positionerElement', element);
+  }, [store]);
   const state = {
     open,
     side: positioning.side,
@@ -113,10 +117,6 @@ const PopoverPositioner = exports.PopoverPositioner = /*#__PURE__*/React.forward
     anchorHidden: positioning.anchorHidden,
     instant: instantType
   };
-  (0, _useAnchoredPopupScrollLock.useAnchoredPopupScrollLock)(open && modal === true && openReason !== _reasons.REASONS.triggerHover, openMethod === 'touch', positionerElement, triggerElement);
-  const setPositionerElement = React.useCallback(element => {
-    store.set('positionerElement', element);
-  }, [store]);
   const element = (0, _usePositioner.usePositioner)(componentProps, state, {
     styles: positioning.positionerStyles,
     transitionStatus,

package/popover/root/PopoverRoot.d.ts

@@ -36,7 +36,7 @@ export interface PopoverRootProps<Payload = unknown> {
    * - `unmount`: When specified, the popover will not be unmounted when closed.
    * Instead, the `unmount` function must be called to unmount the popover manually.
    * Useful when the popover's animation is controlled by an external library.
-   * - `close`: Closes the dialog imperatively when called.
+   * - `close`: Closes the popover imperatively when called.
    */
   actionsRef?: React.RefObject<PopoverRoot.Actions | null> | undefined;
   /**

package/popover/root/PopoverRoot.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.PopoverRoot = PopoverRoot;
 var React = _interopRequireWildcard(require("react"));
+var _empty = require("@base-ui/utils/empty");
 var _useOnFirstRender = require("@base-ui/utils/useOnFirstRender");
 var _floatingUiReact = require("../../floating-ui-react");
 var _PopoverRootContext = require("./PopoverRootContext");
@@ -14,7 +15,7 @@ var _PopoverStore = require("../store/PopoverStore");
 var _createBaseUIEventDetails = require("../../internals/createBaseUIEventDetails");
 var _reasons = require("../../internals/reasons");
 var _popups = require("../../utils/popups");
-var _useOpenInteractionType = require("../../utils/useOpenInteractionType");
+var _mergeProps = require("../../merge-props");
 var _jsxRuntime = require("react/jsx-runtime");
 function PopoverRootComponent({
   props
@@ -50,13 +51,12 @@ function PopoverRootComponent({
   store.useControlledProp('openProp', openProp);
   store.useControlledProp('triggerIdProp', triggerIdProp);
   const open = store.useState('open');
+  const mounted = store.useState('mounted');
   const payload = store.useState('payload');
+  const nested = (0, _floatingUiReact.useFloatingParentNodeId)() != null;
   store.useContextCallback('onOpenChange', onOpenChange);
   store.useContextCallback('onOpenChangeComplete', onOpenChangeComplete);
-  const {
-    openMethod,
-    triggerProps: interactionTypeTriggerProps
-  } = (0, _useOpenInteractionType.useOpenInteractionType)(open);
+  (0, _popups.usePopupRootSync)(store, open);
   (0, _popups.useImplicitActiveTrigger)(store);
   const {
     forceUnmount
@@ -66,6 +66,10 @@ function PopoverRootComponent({
       openChangeReason: null
     });
   });
+  store.useSyncedValues({
+    modal,
+    nested
+  });
   React.useEffect(() => {
     if (!open) {
       store.context.stickIfOpenTimeout.clear();
@@ -78,50 +82,18 @@ function PopoverRootComponent({
     unmount: forceUnmount,
     close: handleImperativeClose
   }), [forceUnmount, handleImperativeClose]);
-  const floatingRootContext = (0, _floatingUiReact.useSyncedFloatingRootContext)({
-    popupStore: store,
-    onOpenChange: store.setOpen
-  });
-  const dismiss = (0, _floatingUiReact.useDismiss)(floatingRootContext, {
-    outsidePressEvent: {
-      // Ensure `aria-hidden` on outside elements is removed immediately
-      // on outside press when trapping focus.
-      mouse: modal === 'trap-focus' ? 'sloppy' : 'intentional',
-      touch: 'sloppy'
-    }
-  });
-  const role = (0, _floatingUiReact.useRole)(floatingRootContext);
-  const {
-    getReferenceProps,
-    getFloatingProps,
-    getTriggerProps
-  } = (0, _floatingUiReact.useInteractions)([dismiss, role]);
-  const activeTriggerProps = React.useMemo(() => {
-    return getReferenceProps(interactionTypeTriggerProps);
-  }, [getReferenceProps, interactionTypeTriggerProps]);
-  const inactiveTriggerProps = React.useMemo(() => {
-    return getTriggerProps(interactionTypeTriggerProps);
-  }, [getTriggerProps, interactionTypeTriggerProps]);
-  const popupProps = React.useMemo(() => {
-    return getFloatingProps();
-  }, [getFloatingProps]);
-  store.useSyncedValues({
-    modal,
-    openMethod,
-    activeTriggerProps,
-    inactiveTriggerProps,
-    popupProps,
-    floatingRootContext,
-    nested: (0, _floatingUiReact.useFloatingParentNodeId)() != null
-  });
+  const shouldRenderInteractions = open || mounted;
   const popoverContext = React.useMemo(() => ({
     store
   }), [store]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_PopoverRootContext.PopoverRootContext.Provider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_PopoverRootContext.PopoverRootContext.Provider, {
     value: popoverContext,
-    children: typeof children === 'function' ? children({
+    children: [shouldRenderInteractions && /*#__PURE__*/(0, _jsxRuntime.jsx)(PopoverInteractions, {
+      store: store,
+      modal: modal
+    }), typeof children === 'function' ? children({
       payload
-    }) : children
+    }) : children]
   });
 }
 
@@ -142,4 +114,27 @@ function PopoverRoot(props) {
       props: props
     })
   });
+}
+function PopoverInteractions({
+  store,
+  modal
+}) {
+  const floatingRootContext = store.useState('floatingRootContext');
+  const dismiss = (0, _floatingUiReact.useDismiss)(floatingRootContext, {
+    outsidePressEvent: {
+      // Ensure `aria-hidden` on outside elements is removed immediately
+      // on outside press when trapping focus.
+      mouse: modal === 'trap-focus' ? 'sloppy' : 'intentional',
+      touch: 'sloppy'
+    }
+  });
+  const activeTriggerProps = dismiss.reference ?? _empty.EMPTY_OBJECT;
+  const inactiveTriggerProps = dismiss.trigger ?? _empty.EMPTY_OBJECT;
+  const popupProps = React.useMemo(() => (0, _mergeProps.mergeProps)(_popups.FOCUSABLE_POPUP_PROPS, dismiss.floating), [dismiss.floating]);
+  (0, _popups.usePopupInteractionProps)(store, {
+    activeTriggerProps,
+    inactiveTriggerProps,
+    popupProps
+  });
+  return null;
 }

package/popover/store/PopoverHandle.js

@@ -45,7 +45,7 @@ class PopoverHandle {
    * Indicates whether the popover is currently open.
    */
   get isOpen() {
-    return this.store.state.open;
+    return this.store.select('open');
   }
 }
 

package/popover/store/PopoverStore.d.ts

@@ -2,11 +2,11 @@ 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 { PopoverRoot } from "../root/PopoverRoot.js";
+import { type PopoverRoot } from "../root/PopoverRoot.js";
 import { PopupStoreContext, PopupStoreState } from "../../utils/popups/index.js";
 export type State<Payload> = PopupStoreState<Payload> & {
   disabled: boolean;
-  instantType: 'dismiss' | 'click' | undefined;
+  instantType: 'dismiss' | 'click' | 'focus' | 'trigger-change' | undefined;
   modal: boolean | 'trap-focus';
   focusManagerModal: boolean;
   openMethod: InteractionType | null;
@@ -29,7 +29,7 @@ type Context = PopupStoreContext<PopoverRoot.ChangeEventDetails> & {
 };
 declare const selectors: {
   disabled: (state: State<unknown>) => boolean;
-  instantType: (state: State<unknown>) => "click" | "dismiss" | undefined;
+  instantType: (state: State<unknown>) => "click" | "focus" | "dismiss" | "trigger-change" | undefined;
   openMethod: (state: State<unknown>) => InteractionType | null;
   openChangeReason: (state: State<unknown>) => import("../index.js").PopoverRootChangeEventReason | null;
   modal: (state: State<unknown>) => boolean | "trap-focus";
@@ -46,6 +46,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -63,6 +65,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -80,6 +84,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -97,6 +103,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -108,12 +116,33 @@ declare const selectors: {
     inactiveTriggerProps: import("../../index.js").HTMLProps;
     popupProps: import("../../index.js").HTMLProps;
   }) => import("../../floating-ui-react/components/FloatingRootStore.js").FloatingRootStore;
+  triggerCount: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").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.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => number;
   preventUnmountingOnClose: (state: {
     open: boolean;
     readonly openProp: boolean | undefined;
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -131,6 +160,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -148,6 +179,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -165,6 +198,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -176,12 +211,33 @@ declare const selectors: {
     inactiveTriggerProps: import("../../index.js").HTMLProps;
     popupProps: import("../../index.js").HTMLProps;
   }) => Element | null;
+  popupId: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").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.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }) => string | undefined;
   isTriggerActive: (state: {
     open: boolean;
     readonly openProp: boolean | undefined;
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -199,6 +255,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -216,6 +274,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -233,6 +293,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -244,12 +306,33 @@ declare const selectors: {
     inactiveTriggerProps: import("../../index.js").HTMLProps;
     popupProps: import("../../index.js").HTMLProps;
   }, isActive: boolean) => import("../../index.js").HTMLProps;
+  triggerPopupId: (state: {
+    open: boolean;
+    readonly openProp: boolean | undefined;
+    mounted: boolean;
+    transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
+    floatingRootContext: import("../../floating-ui-react/index.js").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.js").HTMLProps;
+    inactiveTriggerProps: import("../../index.js").HTMLProps;
+    popupProps: import("../../index.js").HTMLProps;
+  }, triggerId: string | undefined) => string | undefined;
   popupProps: (state: {
     open: boolean;
     readonly openProp: boolean | undefined;
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -267,6 +350,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -284,6 +369,8 @@ declare const selectors: {
     mounted: boolean;
     transitionStatus: import("../../internals/useTransitionStatus.js").TransitionStatus;
     floatingRootContext: import("../../floating-ui-react/index.js").FloatingRootContext;
+    floatingId: string | undefined;
+    triggerCount: number;
     preventUnmountingOnClose: boolean;
     payload: unknown;
     activeTriggerId: string | null;
@@ -297,7 +384,7 @@ declare const selectors: {
   }) => HTMLElement | null;
 };
 export declare class PopoverStore<Payload> extends ReactStore<Readonly<State<Payload>>, Context, Selectors> {
-  constructor(initialState?: Partial<State<Payload>>);
+  constructor(initialState?: Partial<State<Payload>>, floatingId?: string | undefined, nested?: boolean);
   setOpen: (nextOpen: boolean, eventDetails: Omit<PopoverRoot.ChangeEventDetails, "preventUnmountOnClose">) => void;
   static useStore<Payload>(externalStore: PopoverStore<Payload> | undefined, initialState: Partial<State<Payload>>): PopoverStore<Payload>;
   private disposeEffect;