@base-ui/react 1.7.0 → 1.8.0

package/floating-ui-react/hooks/useDismiss.d.mts

@@ -45,7 +45,7 @@ export interface UseDismissProps {
   outsidePress?: boolean | ((event: MouseEvent | TouchEvent) => boolean) | undefined;
   /**
    * The type of event to use to determine an outside "press".
-   * - `intentional` requires the user to click outside intentionally, firing on `pointerup` for mouse, and requiring minimal `touchmove`s for touch.
+   * - `intentional` dismisses on an outside `click` whose press began while the floating element was open, ignoring the trailing click of a press that started before it opened. Touch requires minimal `touchmove`s, and press-less clicks (keyboard, assistive technology) are always accepted.
    * - `sloppy` fires on `pointerdown` for mouse, while for touch it fires on `touchend` (within 1 second) or while scrolling away after `touchstart`.
    */
   outsidePressEvent?: PressType | {

package/floating-ui-react/hooks/useDismiss.d.ts

@@ -45,7 +45,7 @@ export interface UseDismissProps {
   outsidePress?: boolean | ((event: MouseEvent | TouchEvent) => boolean) | undefined;
   /**
    * The type of event to use to determine an outside "press".
-   * - `intentional` requires the user to click outside intentionally, firing on `pointerup` for mouse, and requiring minimal `touchmove`s for touch.
+   * - `intentional` dismisses on an outside `click` whose press began while the floating element was open, ignoring the trailing click of a press that started before it opened. Touch requires minimal `touchmove`s, and press-less clicks (keyboard, assistive technology) are always accepted.
    * - `sloppy` fires on `pointerdown` for mouse, while for touch it fires on `touchend` (within 1 second) or while scrolling away after `touchstart`.
    */
   outsidePressEvent?: PressType | {

package/floating-ui-react/hooks/useDismiss.js

@@ -51,7 +51,8 @@ function useDismiss(context, props = {}) {
   const open = store.useState('open');
   const floatingElement = store.useState('floatingElement');
   const {
-    dataRef
+    dataRef,
+    events
   } = store.context;
   const tree = (0, _FloatingTree.useFloatingTree)(externalTree);
   const outsidePressFn = (0, _useStableCallback.useStableCallback)(typeof outsidePressProp === 'function' ? outsidePressProp : () => false);
@@ -66,6 +67,9 @@ function useDismiss(context, props = {}) {
   const pressStartPreventedRef = React.useRef(false);
   // Ignore only the very next outside click after dragging from inside to outside.
   const suppressNextOutsideClickRef = React.useRef(false);
+  // A click whose press began before the floating element opened is the tail of that
+  // gesture (e.g. the drag-release that opened it), not a new outside press.
+  const sawPressWhileOpenRef = React.useRef(false);
   const isComposingRef = React.useRef(false);
   const currentPointerTypeRef = React.useRef('');
   const touchStateRef = React.useRef(null);
@@ -143,14 +147,36 @@ function useDismiss(context, props = {}) {
       pressStartPreventedRef.current = true;
     }
   });
+
+  // A same-batch close+reopen never renders `open === false`, so only `openchange` can
+  // observe that session boundary. The effect below covers controlled flips.
+  React.useEffect(() => {
+    function handleOpenChange(details) {
+      // Only the closing half ends the session: `setOpen(true)` on an already-open
+      // element (hovering an inactive trigger) must not drop a press mid-gesture.
+      if (!details.open) {
+        sawPressWhileOpenRef.current = false;
+      }
+    }
+    events.on('openchange', handleOpenChange);
+    return () => {
+      events.off('openchange', handleOpenChange);
+    };
+  }, [events]);
   React.useEffect(() => {
     if (!open || !enabled) {
+      // Reset in the effect body, not the cleanup, which also runs when a dependency
+      // changes mid-gesture.
+      if (!open) {
+        sawPressWhileOpenRef.current = false;
+      }
       return clearInsideReactTree;
     }
     dataRef.current.__escapeKeyBubbles = escapeKeyBubbles;
     dataRef.current.__outsidePressBubbles = outsidePressBubbles;
     const compositionTimeout = new _useTimeout.Timeout();
     const preventedPressSuppressionTimeout = new _useTimeout.Timeout();
+    const doc = (0, _owner.ownerDocument)(floatingElement);
     function handleCompositionStart() {
       compositionTimeout.clear();
       isComposingRef.current = true;
@@ -269,13 +295,22 @@ function useDismiss(context, props = {}) {
         return;
       }
 
-      // In intentional mode, a press that starts inside and ends outside gets
-      // one suppressed outside click. Run this after inside-target checks so
-      // inside clicks don't consume the one-shot suppression.
-      if (getOutsidePressEvent() === 'intentional' && suppressNextOutsideClickRef.current) {
-        preventedPressSuppressionTimeout.clear();
-        suppressNextOutsideClickRef.current = false;
-        return;
+      // Only `click` events reach this point in intentional mode.
+      if (getOutsidePressEvent() === 'intentional') {
+        // Press-less clicks (keyboard, assistive technology, `element.click()`) report no
+        // click count; `isVirtualClick` also catches the ones that do.
+        if (event.detail !== 0 && !(0, _event.isVirtualClick)(event) && !sawPressWhileOpenRef.current) {
+          return;
+        }
+
+        // A press that starts inside and ends outside gets one suppressed
+        // outside click. Run this after inside-target checks so inside clicks
+        // don't consume the one-shot suppression.
+        if (suppressNextOutsideClickRef.current) {
+          preventedPressSuppressionTimeout.clear();
+          suppressNextOutsideClickRef.current = false;
+          return;
+        }
       }
       if (typeof outsidePress === 'function' && !outsidePress(event)) {
         return;
@@ -329,7 +364,14 @@ function useDismiss(context, props = {}) {
     }
     function closeOnPressOutsideCapture(event) {
       cancelDismissOnEndTimeout.clear();
+
+      // Only `pointerdown` marks a press; `mousedown` is its compatibility event, and
+      // counting it would misattribute a gesture that started before open.
       if (event.type === 'pointerdown') {
+        // Only a primary press can produce a `click`.
+        if (event.button === 0) {
+          sawPressWhileOpenRef.current = true;
+        }
         currentPointerTypeRef.current = event.pointerType;
       }
       if (event.type === 'mousedown' && touchStateRef.current && !touchStateRef.current.dismissOnMouseDown) {
@@ -344,6 +386,11 @@ function useDismiss(context, props = {}) {
       });
     }
     function handlePressEndCapture(event) {
+      // A cancelled gesture produces no click. Not cleared on `pointerup`: the click
+      // fires after it and must still find the press.
+      if (event.type === 'pointercancel') {
+        sawPressWhileOpenRef.current = false;
+      }
       if (!pressStartedInsideRef.current) {
         return;
       }
@@ -415,8 +462,16 @@ function useDismiss(context, props = {}) {
     function handleTouchEndCapture(event) {
       addTargetEventListenerOnce(event, handleTouchEnd);
     }
-    const doc = (0, _owner.ownerDocument)(floatingElement);
-    const unsubscribe = (0, _mergeCleanups.mergeCleanups)(escapeKey && (0, _mergeCleanups.mergeCleanups)((0, _addEventListener.addEventListener)(doc, 'keydown', closeOnEscapeKeyDown), (0, _addEventListener.addEventListener)(doc, 'compositionstart', handleCompositionStart), (0, _addEventListener.addEventListener)(doc, 'compositionend', handleCompositionEnd)), outsidePressEnabled && (0, _mergeCleanups.mergeCleanups)((0, _addEventListener.addEventListener)(doc, 'click', closeOnPressOutsideCapture, true), (0, _addEventListener.addEventListener)(doc, 'pointerdown', closeOnPressOutsideCapture, true), (0, _addEventListener.addEventListener)(doc, 'pointerup', handlePressEndCapture, true), (0, _addEventListener.addEventListener)(doc, 'pointercancel', handlePressEndCapture, true), (0, _addEventListener.addEventListener)(doc, 'mousedown', closeOnPressOutsideCapture, true), (0, _addEventListener.addEventListener)(doc, 'mouseup', handlePressEndCapture, true), (0, _addEventListener.addEventListener)(doc, 'touchstart', handleTouchStartCapture, true), (0, _addEventListener.addEventListener)(doc, 'touchmove', handleTouchMoveCapture, true), (0, _addEventListener.addEventListener)(doc, 'touchend', handleTouchEndCapture, true)));
+    const unsubscribe = (0, _mergeCleanups.mergeCleanups)(escapeKey && (0, _mergeCleanups.mergeCleanups)((0, _addEventListener.addEventListener)(doc, 'keydown', closeOnEscapeKeyDown), (0, _addEventListener.addEventListener)(doc, 'compositionstart', handleCompositionStart), (0, _addEventListener.addEventListener)(doc, 'compositionend', handleCompositionEnd)), outsidePressEnabled && (0, _mergeCleanups.mergeCleanups)((0, _addEventListener.addEventListener)(doc, 'click', closeOnPressOutsideCapture, true), (0, _addEventListener.addEventListener)(doc, 'pointerdown', closeOnPressOutsideCapture, true), (0, _addEventListener.addEventListener)(doc, 'pointerup', handlePressEndCapture, true), (0, _addEventListener.addEventListener)(doc, 'pointercancel', handlePressEndCapture, true), (0, _addEventListener.addEventListener)(doc, 'mousedown', closeOnPressOutsideCapture, true), (0, _addEventListener.addEventListener)(doc, 'mouseup', handlePressEndCapture, true), (0, _addEventListener.addEventListener)(doc, 'touchstart', handleTouchStartCapture, {
+      capture: true,
+      passive: true
+    }), (0, _addEventListener.addEventListener)(doc, 'touchmove', handleTouchMoveCapture, {
+      capture: true,
+      passive: true
+    }), (0, _addEventListener.addEventListener)(doc, 'touchend', handleTouchEndCapture, {
+      capture: true,
+      passive: true
+    })));
     return () => {
       unsubscribe();
       compositionTimeout.clear();

package/floating-ui-react/hooks/useDismiss.mjs

@@ -14,7 +14,7 @@ import { createChangeEventDetails } from "../../internals/createBaseUIEventDetai
 import { REASONS } from "../../internals/reasons.mjs";
 import { createAttribute } from "../utils/createAttribute.mjs";
 import { contains, getTarget, isEventTargetWithin, isRootElement } from "../utils/element.mjs";
-import { isReactEvent } from "../utils/event.mjs";
+import { isReactEvent, isVirtualClick } from "../utils/event.mjs";
 import { getNodeChildren } from "../utils/nodes.mjs";
 function alwaysFalse() {
   return false;
@@ -44,7 +44,8 @@ export function useDismiss(context, props = {}) {
   const open = store.useState('open');
   const floatingElement = store.useState('floatingElement');
   const {
-    dataRef
+    dataRef,
+    events
   } = store.context;
   const tree = useFloatingTree(externalTree);
   const outsidePressFn = useStableCallback(typeof outsidePressProp === 'function' ? outsidePressProp : () => false);
@@ -59,6 +60,9 @@ export function useDismiss(context, props = {}) {
   const pressStartPreventedRef = React.useRef(false);
   // Ignore only the very next outside click after dragging from inside to outside.
   const suppressNextOutsideClickRef = React.useRef(false);
+  // A click whose press began before the floating element opened is the tail of that
+  // gesture (e.g. the drag-release that opened it), not a new outside press.
+  const sawPressWhileOpenRef = React.useRef(false);
   const isComposingRef = React.useRef(false);
   const currentPointerTypeRef = React.useRef('');
   const touchStateRef = React.useRef(null);
@@ -136,14 +140,36 @@ export function useDismiss(context, props = {}) {
       pressStartPreventedRef.current = true;
     }
   });
+
+  // A same-batch close+reopen never renders `open === false`, so only `openchange` can
+  // observe that session boundary. The effect below covers controlled flips.
+  React.useEffect(() => {
+    function handleOpenChange(details) {
+      // Only the closing half ends the session: `setOpen(true)` on an already-open
+      // element (hovering an inactive trigger) must not drop a press mid-gesture.
+      if (!details.open) {
+        sawPressWhileOpenRef.current = false;
+      }
+    }
+    events.on('openchange', handleOpenChange);
+    return () => {
+      events.off('openchange', handleOpenChange);
+    };
+  }, [events]);
   React.useEffect(() => {
     if (!open || !enabled) {
+      // Reset in the effect body, not the cleanup, which also runs when a dependency
+      // changes mid-gesture.
+      if (!open) {
+        sawPressWhileOpenRef.current = false;
+      }
       return clearInsideReactTree;
     }
     dataRef.current.__escapeKeyBubbles = escapeKeyBubbles;
     dataRef.current.__outsidePressBubbles = outsidePressBubbles;
     const compositionTimeout = new Timeout();
     const preventedPressSuppressionTimeout = new Timeout();
+    const doc = ownerDocument(floatingElement);
     function handleCompositionStart() {
       compositionTimeout.clear();
       isComposingRef.current = true;
@@ -262,13 +288,22 @@ export function useDismiss(context, props = {}) {
         return;
       }
 
-      // In intentional mode, a press that starts inside and ends outside gets
-      // one suppressed outside click. Run this after inside-target checks so
-      // inside clicks don't consume the one-shot suppression.
-      if (getOutsidePressEvent() === 'intentional' && suppressNextOutsideClickRef.current) {
-        preventedPressSuppressionTimeout.clear();
-        suppressNextOutsideClickRef.current = false;
-        return;
+      // Only `click` events reach this point in intentional mode.
+      if (getOutsidePressEvent() === 'intentional') {
+        // Press-less clicks (keyboard, assistive technology, `element.click()`) report no
+        // click count; `isVirtualClick` also catches the ones that do.
+        if (event.detail !== 0 && !isVirtualClick(event) && !sawPressWhileOpenRef.current) {
+          return;
+        }
+
+        // A press that starts inside and ends outside gets one suppressed
+        // outside click. Run this after inside-target checks so inside clicks
+        // don't consume the one-shot suppression.
+        if (suppressNextOutsideClickRef.current) {
+          preventedPressSuppressionTimeout.clear();
+          suppressNextOutsideClickRef.current = false;
+          return;
+        }
       }
       if (typeof outsidePress === 'function' && !outsidePress(event)) {
         return;
@@ -322,7 +357,14 @@ export function useDismiss(context, props = {}) {
     }
     function closeOnPressOutsideCapture(event) {
       cancelDismissOnEndTimeout.clear();
+
+      // Only `pointerdown` marks a press; `mousedown` is its compatibility event, and
+      // counting it would misattribute a gesture that started before open.
       if (event.type === 'pointerdown') {
+        // Only a primary press can produce a `click`.
+        if (event.button === 0) {
+          sawPressWhileOpenRef.current = true;
+        }
         currentPointerTypeRef.current = event.pointerType;
       }
       if (event.type === 'mousedown' && touchStateRef.current && !touchStateRef.current.dismissOnMouseDown) {
@@ -337,6 +379,11 @@ export function useDismiss(context, props = {}) {
       });
     }
     function handlePressEndCapture(event) {
+      // A cancelled gesture produces no click. Not cleared on `pointerup`: the click
+      // fires after it and must still find the press.
+      if (event.type === 'pointercancel') {
+        sawPressWhileOpenRef.current = false;
+      }
       if (!pressStartedInsideRef.current) {
         return;
       }
@@ -408,8 +455,16 @@ export function useDismiss(context, props = {}) {
     function handleTouchEndCapture(event) {
       addTargetEventListenerOnce(event, handleTouchEnd);
     }
-    const doc = ownerDocument(floatingElement);
-    const unsubscribe = mergeCleanups(escapeKey && mergeCleanups(addEventListener(doc, 'keydown', closeOnEscapeKeyDown), addEventListener(doc, 'compositionstart', handleCompositionStart), addEventListener(doc, 'compositionend', handleCompositionEnd)), outsidePressEnabled && mergeCleanups(addEventListener(doc, 'click', closeOnPressOutsideCapture, true), addEventListener(doc, 'pointerdown', closeOnPressOutsideCapture, true), addEventListener(doc, 'pointerup', handlePressEndCapture, true), addEventListener(doc, 'pointercancel', handlePressEndCapture, true), addEventListener(doc, 'mousedown', closeOnPressOutsideCapture, true), addEventListener(doc, 'mouseup', handlePressEndCapture, true), addEventListener(doc, 'touchstart', handleTouchStartCapture, true), addEventListener(doc, 'touchmove', handleTouchMoveCapture, true), addEventListener(doc, 'touchend', handleTouchEndCapture, true)));
+    const unsubscribe = mergeCleanups(escapeKey && mergeCleanups(addEventListener(doc, 'keydown', closeOnEscapeKeyDown), addEventListener(doc, 'compositionstart', handleCompositionStart), addEventListener(doc, 'compositionend', handleCompositionEnd)), outsidePressEnabled && mergeCleanups(addEventListener(doc, 'click', closeOnPressOutsideCapture, true), addEventListener(doc, 'pointerdown', closeOnPressOutsideCapture, true), addEventListener(doc, 'pointerup', handlePressEndCapture, true), addEventListener(doc, 'pointercancel', handlePressEndCapture, true), addEventListener(doc, 'mousedown', closeOnPressOutsideCapture, true), addEventListener(doc, 'mouseup', handlePressEndCapture, true), addEventListener(doc, 'touchstart', handleTouchStartCapture, {
+      capture: true,
+      passive: true
+    }), addEventListener(doc, 'touchmove', handleTouchMoveCapture, {
+      capture: true,
+      passive: true
+    }), addEventListener(doc, 'touchend', handleTouchEndCapture, {
+      capture: true,
+      passive: true
+    })));
     return () => {
       unsubscribe();
       compositionTimeout.clear();

package/floating-ui-react/hooks/useFloatingRootContext.js

@@ -42,8 +42,6 @@ function useFloatingRootContext(options) {
       open,
       floatingId
     };
-
-    // Only sync elements that are defined to avoid overwriting existing ones
     if (elements.reference !== undefined) {
       valuesToSync.referenceElement = elements.reference;
       valuesToSync.domReferenceElement = (0, _dom.isElement)(elements.reference) ? elements.reference : null;

package/floating-ui-react/hooks/useFloatingRootContext.mjs

@@ -37,8 +37,6 @@ export function useFloatingRootContext(options) {
       open,
       floatingId
     };
-
-    // Only sync elements that are defined to avoid overwriting existing ones
     if (elements.reference !== undefined) {
       valuesToSync.referenceElement = elements.reference;
       valuesToSync.domReferenceElement = isElement(elements.reference) ? elements.reference : null;

package/floating-ui-react/hooks/useFocus.js

@@ -52,6 +52,7 @@ function useFocus(context, props = {}) {
       const currentDomReference = store.select('domReferenceElement');
       if (!store.select('open') && (0, _dom.isHTMLElement)(currentDomReference) && currentDomReference === (0, _element.activeElement)((0, _owner.ownerDocument)(currentDomReference))) {
         blockFocusRef.current = true;
+        blockedReferenceRef.current = currentDomReference;
       }
     }
     function onKeyDown() {

package/floating-ui-react/hooks/useFocus.mjs

@@ -46,6 +46,7 @@ export function useFocus(context, props = {}) {
       const currentDomReference = store.select('domReferenceElement');
       if (!store.select('open') && isHTMLElement(currentDomReference) && currentDomReference === activeElement(ownerDocument(currentDomReference))) {
         blockFocusRef.current = true;
+        blockedReferenceRef.current = currentDomReference;
       }
     }
     function onKeyDown() {

package/floating-ui-react/hooks/useHoverReferenceInteraction.js

@@ -93,7 +93,7 @@ function useHoverReferenceInteraction(context, props = {}) {
   });
   if (isActiveTrigger) {
     // eslint-disable-next-line no-underscore-dangle
-    instance.handleCloseOptions = handleCloseRef.current?.__options;
+    instance.handleCloseOptions = handleClose?.__options;
   }
   React.useEffect(() => cleanupMouseMoveHandler, [cleanupMouseMoveHandler]);
 

package/floating-ui-react/hooks/useHoverReferenceInteraction.mjs

@@ -87,7 +87,7 @@ export function useHoverReferenceInteraction(context, props = {}) {
   });
   if (isActiveTrigger) {
     // eslint-disable-next-line no-underscore-dangle
-    instance.handleCloseOptions = handleCloseRef.current?.__options;
+    instance.handleCloseOptions = handleClose?.__options;
   }
   React.useEffect(() => cleanupMouseMoveHandler, [cleanupMouseMoveHandler]);
 

package/floating-ui-react/hooks/useListNavigation.js

@@ -482,7 +482,6 @@ function useListNavigation(context, props) {
   }, [virtual, open, hasActiveIndex, id, activeIndex]);
   const floating = React.useMemo(() => {
     return {
-      'aria-orientation': orientation === 'both' ? undefined : orientation,
       ...(!typeableComboboxReference ? ariaActiveDescendantProp : {}),
       onKeyDown(event) {
         // Close submenu on Shift+Tab
@@ -510,7 +509,7 @@ function useListNavigation(context, props) {
         isPointerModalityRef.current = true;
       }
     };
-  }, [ariaActiveDescendantProp, commonOnKeyDown, floatingFocusElementRef, orientation, typeableComboboxReference, store, open, virtual, domReferenceElement]);
+  }, [ariaActiveDescendantProp, commonOnKeyDown, floatingFocusElementRef, typeableComboboxReference, store, open, virtual, domReferenceElement]);
   const trigger = React.useMemo(() => {
     function openOnNavigationKeyDown(event) {
       store.setOpen(true, (0, _createBaseUIEventDetails.createChangeEventDetails)(_reasons.REASONS.listNavigation, event.nativeEvent, event.currentTarget));

package/floating-ui-react/hooks/useListNavigation.mjs

@@ -475,7 +475,6 @@ export function useListNavigation(context, props) {
   }, [virtual, open, hasActiveIndex, id, activeIndex]);
   const floating = React.useMemo(() => {
     return {
-      'aria-orientation': orientation === 'both' ? undefined : orientation,
       ...(!typeableComboboxReference ? ariaActiveDescendantProp : {}),
       onKeyDown(event) {
         // Close submenu on Shift+Tab
@@ -503,7 +502,7 @@ export function useListNavigation(context, props) {
         isPointerModalityRef.current = true;
       }
     };
-  }, [ariaActiveDescendantProp, commonOnKeyDown, floatingFocusElementRef, orientation, typeableComboboxReference, store, open, virtual, domReferenceElement]);
+  }, [ariaActiveDescendantProp, commonOnKeyDown, floatingFocusElementRef, typeableComboboxReference, store, open, virtual, domReferenceElement]);
   const trigger = React.useMemo(() => {
     function openOnNavigationKeyDown(event) {
       store.setOpen(true, createChangeEventDetails(REASONS.listNavigation, event.nativeEvent, event.currentTarget));

package/floating-ui-react/hooks/useSyncedFloatingRootContext.d.mts

@@ -1,9 +1,14 @@
-import { ReactStore } from '@base-ui/utils/store';
+import type { ReactStore } from '@base-ui/utils/store';
 import { BaseUIChangeEventDetails } from "../../types/index.mjs";
 import { PopupStoreContext, PopupStoreSelectors, PopupStoreState } from "../../utils/popups/index.mjs";
 import { FloatingRootStore } from "../components/FloatingRootStore.mjs";
-export interface UseSyncedFloatingRootContextOptions<State extends PopupStoreState<unknown>, ContextEventDetails extends BaseUIChangeEventDetails<string>, OpenChangeEventDetails extends BaseUIChangeEventDetails<string>> {
-  popupStore: ReactStore<State, PopupStoreContext<ContextEventDetails>, PopupStoreSelectors>;
+/**
+ * Narrowed to the store members this hook uses so consumers do not need to provide
+ * unrelated store capabilities.
+ */
+export type SyncedFloatingRootContextStore<State extends PopupStoreState<unknown>> = Pick<ReactStore<Readonly<State>, PopupStoreContext<never>, PopupStoreSelectors>, 'context' | 'state' | 'useState' | 'useSyncedValue'>;
+export interface UseSyncedFloatingRootContextOptions<State extends PopupStoreState<unknown>, OpenChangeEventDetails extends BaseUIChangeEventDetails<string>> {
+  popupStore: SyncedFloatingRootContextStore<State>;
   /**
    * Whether the Popup element is passed to Floating UI as the floating element instead of the default Positioner.
    */
@@ -17,4 +22,4 @@ export interface UseSyncedFloatingRootContextOptions<State extends PopupStoreSta
  * Keeps a FloatingRootStore in sync with the provided PopupStore.
  * Uses the provided FloatingRootStore when one exists, otherwise creates one once and updates it on every render.
  */
-export declare function useSyncedFloatingRootContext<State extends PopupStoreState<unknown>, ContextEventDetails extends BaseUIChangeEventDetails<string>, OpenChangeEventDetails extends BaseUIChangeEventDetails<string>>(options: UseSyncedFloatingRootContextOptions<State, ContextEventDetails, OpenChangeEventDetails>): FloatingRootStore;
+export declare function useSyncedFloatingRootContext<State extends PopupStoreState<unknown>, OpenChangeEventDetails extends BaseUIChangeEventDetails<string>>(options: UseSyncedFloatingRootContextOptions<State, OpenChangeEventDetails>): FloatingRootStore;

package/floating-ui-react/hooks/useSyncedFloatingRootContext.d.ts

@@ -1,9 +1,14 @@
-import { ReactStore } from '@base-ui/utils/store';
+import type { ReactStore } from '@base-ui/utils/store';
 import { BaseUIChangeEventDetails } from "../../types/index.js";
 import { PopupStoreContext, PopupStoreSelectors, PopupStoreState } from "../../utils/popups/index.js";
 import { FloatingRootStore } from "../components/FloatingRootStore.js";
-export interface UseSyncedFloatingRootContextOptions<State extends PopupStoreState<unknown>, ContextEventDetails extends BaseUIChangeEventDetails<string>, OpenChangeEventDetails extends BaseUIChangeEventDetails<string>> {
-  popupStore: ReactStore<State, PopupStoreContext<ContextEventDetails>, PopupStoreSelectors>;
+/**
+ * Narrowed to the store members this hook uses so consumers do not need to provide
+ * unrelated store capabilities.
+ */
+export type SyncedFloatingRootContextStore<State extends PopupStoreState<unknown>> = Pick<ReactStore<Readonly<State>, PopupStoreContext<never>, PopupStoreSelectors>, 'context' | 'state' | 'useState' | 'useSyncedValue'>;
+export interface UseSyncedFloatingRootContextOptions<State extends PopupStoreState<unknown>, OpenChangeEventDetails extends BaseUIChangeEventDetails<string>> {
+  popupStore: SyncedFloatingRootContextStore<State>;
   /**
    * Whether the Popup element is passed to Floating UI as the floating element instead of the default Positioner.
    */
@@ -17,4 +22,4 @@ export interface UseSyncedFloatingRootContextOptions<State extends PopupStoreSta
  * Keeps a FloatingRootStore in sync with the provided PopupStore.
  * Uses the provided FloatingRootStore when one exists, otherwise creates one once and updates it on every render.
  */
-export declare function useSyncedFloatingRootContext<State extends PopupStoreState<unknown>, ContextEventDetails extends BaseUIChangeEventDetails<string>, OpenChangeEventDetails extends BaseUIChangeEventDetails<string>>(options: UseSyncedFloatingRootContextOptions<State, ContextEventDetails, OpenChangeEventDetails>): FloatingRootStore;
+export declare function useSyncedFloatingRootContext<State extends PopupStoreState<unknown>, OpenChangeEventDetails extends BaseUIChangeEventDetails<string>>(options: UseSyncedFloatingRootContextOptions<State, OpenChangeEventDetails>): FloatingRootStore;

package/floating-ui-react/hooks/useSyncedFloatingRootContext.js

@@ -10,6 +10,11 @@ var React = _interopRequireWildcard(require("react"));
 var _useIsoLayoutEffect = require("@base-ui/utils/useIsoLayoutEffect");
 var _dom = require("@floating-ui/utils/dom");
 var _FloatingRootStore = require("../components/FloatingRootStore");
+/**
+ * Narrowed to the store members this hook uses so consumers do not need to provide
+ * unrelated store capabilities.
+ */
+
 /**
  * Keeps a FloatingRootStore in sync with the provided PopupStore.
  * Uses the provided FloatingRootStore when one exists, otherwise creates one once and updates it on every render.

package/floating-ui-react/hooks/useSyncedFloatingRootContext.mjs

@@ -4,6 +4,12 @@ import * as React from 'react';
 import { useIsoLayoutEffect } from '@base-ui/utils/useIsoLayoutEffect';
 import { isElement } from '@floating-ui/utils/dom';
 import { FloatingRootStore } from "../components/FloatingRootStore.mjs";
+
+/**
+ * Narrowed to the store members this hook uses so consumers do not need to provide
+ * unrelated store capabilities.
+ */
+
 /**
  * Keeps a FloatingRootStore in sync with the provided PopupStore.
  * Uses the provided FloatingRootStore when one exists, otherwise creates one once and updates it on every render.

package/floating-ui-react/middleware/arrow.js

@@ -95,8 +95,15 @@ const baseArrow = options => ({
  * @see https://floating-ui.com/docs/arrow
  */
 exports.baseArrow = baseArrow;
-const arrow = (options, deps) => ({
-  ...baseArrow(options),
-  options: [options, deps]
-});
+const arrow = (options, deps) => {
+  const {
+    name,
+    fn
+  } = baseArrow(options);
+  return {
+    name,
+    fn,
+    options: [options, deps]
+  };
+};
 exports.arrow = arrow;

package/floating-ui-react/middleware/arrow.mjs

@@ -88,7 +88,14 @@ export const baseArrow = options => ({
  * This wraps the core `arrow` middleware to allow React refs as the element.
  * @see https://floating-ui.com/docs/arrow
  */
-export const arrow = (options, deps) => ({
-  ...baseArrow(options),
-  options: [options, deps]
-});
+export const arrow = (options, deps) => {
+  const {
+    name,
+    fn
+  } = baseArrow(options);
+  return {
+    name,
+    fn,
+    options: [options, deps]
+  };
+};

package/floating-ui-react/utils/element.d.mts

@@ -1,5 +1,5 @@
+import { activeElement, contains, getTarget } from '@base-ui/utils/shadowDom';
 import { type PopupTriggerMap } from "../../utils/popups/index.mjs";
-import { activeElement, contains, getTarget } from "../../internals/shadowDom.mjs";
 export { activeElement, contains, getTarget };
 export declare function isTargetInsideEnabledTrigger(target: EventTarget | null, triggerElements: PopupTriggerMap): boolean;
 export declare function isEventTargetWithin(event: Event, node: Node | null | undefined): boolean;

package/floating-ui-react/utils/element.d.ts

@@ -1,5 +1,5 @@
+import { activeElement, contains, getTarget } from '@base-ui/utils/shadowDom';
 import { type PopupTriggerMap } from "../../utils/popups/index.js";
-import { activeElement, contains, getTarget } from "../../internals/shadowDom.js";
 export { activeElement, contains, getTarget };
 export declare function isTargetInsideEnabledTrigger(target: EventTarget | null, triggerElements: PopupTriggerMap): boolean;
 export declare function isEventTargetWithin(event: Event, node: Node | null | undefined): boolean;

package/floating-ui-react/utils/element.js

@@ -1,5 +1,6 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -31,19 +32,20 @@ exports.isTypeableElement = isTypeableElement;
 exports.matchesFocusVisible = matchesFocusVisible;
 var _dom = require("@floating-ui/utils/dom");
 var _platform = require("@base-ui/utils/platform");
+var _shadowDom = require("@base-ui/utils/shadowDom");
 var _constants = require("./constants");
-var _shadowDom = require("../../internals/shadowDom");
+var TooltipTriggerDataAttributes = _interopRequireWildcard(require("../../tooltip/trigger/TooltipTriggerDataAttributes"));
 function isTargetInsideEnabledTrigger(target, triggerElements) {
   if (!(0, _dom.isElement)(target)) {
     return false;
   }
   const targetElement = target;
   if (triggerElements.hasElement(targetElement)) {
-    return !targetElement.hasAttribute('data-trigger-disabled');
+    return !targetElement.hasAttribute(TooltipTriggerDataAttributes.triggerDisabled);
   }
   for (const [, trigger] of triggerElements.entries()) {
     if ((0, _shadowDom.contains)(trigger, targetElement)) {
-      return !trigger.hasAttribute('data-trigger-disabled');
+      return !trigger.hasAttribute(TooltipTriggerDataAttributes.triggerDisabled);
     }
   }
   return false;

package/floating-ui-react/utils/element.mjs

@@ -1,7 +1,8 @@
 import { isElement, isHTMLElement } from '@floating-ui/utils/dom';
 import { platform } from '@base-ui/utils/platform';
+import { activeElement, contains, getTarget } from '@base-ui/utils/shadowDom';
 import { FOCUSABLE_ATTRIBUTE, TYPEABLE_SELECTOR } from "./constants.mjs";
-import { activeElement, contains, getTarget } from "../../internals/shadowDom.mjs";
+import * as TooltipTriggerDataAttributes from "../../tooltip/trigger/TooltipTriggerDataAttributes.mjs";
 export { activeElement, contains, getTarget };
 export function isTargetInsideEnabledTrigger(target, triggerElements) {
   if (!isElement(target)) {
@@ -9,11 +10,11 @@ export function isTargetInsideEnabledTrigger(target, triggerElements) {
   }
   const targetElement = target;
   if (triggerElements.hasElement(targetElement)) {
-    return !targetElement.hasAttribute('data-trigger-disabled');
+    return !targetElement.hasAttribute(TooltipTriggerDataAttributes.triggerDisabled);
   }
   for (const [, trigger] of triggerElements.entries()) {
     if (contains(trigger, targetElement)) {
-      return !trigger.hasAttribute('data-trigger-disabled');
+      return !trigger.hasAttribute(TooltipTriggerDataAttributes.triggerDisabled);
     }
   }
   return false;

package/form/Form.js

@@ -38,7 +38,7 @@ const Form = exports.Form = /*#__PURE__*/React.forwardRef(function Form(componen
   });
   const elementRef = React.useRef(null);
   const submittedRef = React.useRef(false);
-  const submitAttemptedRef = React.useRef(false);
+  const submitCountRef = React.useRef(0);
   const focusFirstInvalid = (0, _useStableCallback.useStableCallback)(() => {
     // A field can be invalid without a focusable control (for example a checkbox group whose
     // custom validation failed while every checkbox is unmounted, disabled, or reassociated).
@@ -95,7 +95,7 @@ const Form = exports.Form = /*#__PURE__*/React.forwardRef(function Form(componen
     props: [{
       noValidate: true,
       onSubmit(event) {
-        submitAttemptedRef.current = true;
+        submitCountRef.current += 1;
 
         // Async validation isn't supported to stop the submit event.
         formRef.current.fields.forEach(field => {
@@ -121,13 +121,19 @@ const Form = exports.Form = /*#__PURE__*/React.forwardRef(function Form(componen
     }, elementProps]
   });
   const clearErrors = (0, _useStableCallback.useStableCallback)(name => {
-    if (name && errors && Object.hasOwn(errors, name)) {
+    if (!name) {
+      return;
+    }
+    setErrors(previousErrors => {
+      if (!previousErrors || !Object.hasOwn(previousErrors, name)) {
+        return previousErrors;
+      }
       const nextErrors = {
-        ...errors
+        ...previousErrors
       };
       delete nextErrors[name];
-      setErrors(nextErrors);
-    }
+      return nextErrors;
+    });
   });
   const contextValue = React.useMemo(() => ({
     elementRef,
@@ -135,7 +141,7 @@ const Form = exports.Form = /*#__PURE__*/React.forwardRef(function Form(componen
     validationMode,
     errors: errors ?? _empty.EMPTY_OBJECT,
     clearErrors,
-    submitAttemptedRef
+    submitCountRef
   }), [formRef, validationMode, errors, clearErrors]);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_FormContext.FormContext.Provider, {
     value: contextValue,