@jobber/components 9.4.0 → 9.5.0

package/dist/useScrollLock-cjs.js

@@ -1,11 +1,9 @@
 'use strict';
 
 var React = require('react');
-var floatingUi_utils_dom = require('./floating-ui.utils.dom-cjs.js');
-var useButton = require('./useButton-cjs.js');
+var floatingUi_utils = require('./floating-ui.utils-cjs.js');
 var useRenderElement = require('./useRenderElement-cjs.js');
 var jsxRuntime = require('react/jsx-runtime');
-var floatingUi_utils = require('./floating-ui.utils-cjs.js');
 var ReactDOM = require('react-dom');
 
 function _interopNamespaceDefault(e) {
@@ -28,6 +26,84 @@ function _interopNamespaceDefault(e) {
 var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
 var ReactDOM__namespace = /*#__PURE__*/_interopNamespaceDefault(ReactDOM);
 
+let set;
+if (process.env.NODE_ENV !== 'production') {
+  set = new Set();
+}
+function error(...messages) {
+  if (process.env.NODE_ENV !== 'production') {
+    const messageKey = messages.join(' ');
+    if (!set.has(messageKey)) {
+      set.add(messageKey);
+      console.error(`Base UI: ${messageKey}`);
+    }
+  }
+}
+
+function useControlled({
+  controlled,
+  default: defaultProp,
+  name,
+  state = 'value'
+}) {
+  // isControlled is ignored in the hook dependency lists as it should never change.
+  const {
+    current: isControlled
+  } = React__namespace.useRef(controlled !== undefined);
+  const [valueState, setValue] = React__namespace.useState(defaultProp);
+  const value = isControlled ? controlled : valueState;
+  if (process.env.NODE_ENV !== 'production') {
+    React__namespace.useEffect(() => {
+      if (isControlled !== (controlled !== undefined)) {
+        error([`A component is changing the ${isControlled ? '' : 'un'}controlled ${state} state of ${name} to be ${isControlled ? 'un' : ''}controlled.`, 'Elements should not switch from uncontrolled to controlled (or vice versa).', `Decide between using a controlled or uncontrolled ${name} ` + 'element for the lifetime of the component.', "The nature of the state is determined during the first render. It's considered controlled if the value is not `undefined`.", 'More info: https://fb.me/react-controlled-components'].join('\n'));
+      }
+    }, [state, name, controlled]);
+    const {
+      current: defaultValue
+    } = React__namespace.useRef(defaultProp);
+    React__namespace.useEffect(() => {
+      if (!isControlled && serializeToDevModeString(defaultValue) !== serializeToDevModeString(defaultProp)) {
+        error([`A component is changing the default ${state} state of an uncontrolled ${name} after being initialized. ` + `To suppress this warning opt to use a controlled ${name}.`].join('\n'));
+      }
+    }, [defaultProp]);
+  }
+  const setValueIfUncontrolled = React__namespace.useCallback(newValue => {
+    if (!isControlled) {
+      setValue(newValue);
+    }
+  }, []);
+  return [value, setValueIfUncontrolled];
+}
+function serializeToDevModeString(input) {
+  let nextId = 0;
+  const seen = new WeakMap();
+  try {
+    const result = JSON.stringify(input, function replacer(key, value) {
+      if (key === '_owner' && this != null && typeof this === 'object' && '$$typeof' in this) {
+        return undefined;
+      }
+      if (typeof value === 'bigint') {
+        return `__bigint__:${value}`;
+      }
+      if (value !== null && typeof value === 'object') {
+        const id = seen.get(value);
+        if (id !== undefined) {
+          return `__object__:${id}`;
+        }
+        seen.set(value, nextId);
+        nextId += 1;
+      }
+      return value;
+    });
+    return result ?? `__top__:${typeof input}`;
+  } catch {
+    return '__unserializable__';
+  }
+}
+
+const noop = () => {};
+const useIsoLayoutEffect = typeof document !== 'undefined' ? React__namespace.useLayoutEffect : noop;
+
 function useOnFirstRender(fn) {
   const ref = React__namespace.useRef(true);
   if (ref.current) {
@@ -36,6 +112,104 @@ function useOnFirstRender(fn) {
   }
 }
 
+/**
+ * A clone of the React namespace for reading APIs that may be missing in older
+ * supported React versions. Bundlers can rewrite direct `React.someNewApi`
+ * reads into named imports, which breaks React 17. Reading from this cloned
+ * object keeps those lookups optional.
+ *
+ * @see https://github.com/mui/material-ui/issues/41190#issuecomment-2040873379
+ */
+const SafeReact = {
+  ...React__namespace
+};
+
+const useInsertionEffect = SafeReact.useInsertionEffect;
+const useSafeInsertionEffect =
+// React 17 doesn't have useInsertionEffect.
+useInsertionEffect &&
+// Preact replaces useInsertionEffect with useLayoutEffect and fires too late.
+useInsertionEffect !== SafeReact.useLayoutEffect ? useInsertionEffect : fn => fn();
+/**
+ * Stabilizes the function passed so it's always the same between renders.
+ *
+ * The function becomes non-reactive to any values it captures.
+ * It can safely be passed as a dependency of `React.useMemo` and `React.useEffect` without re-triggering them if its captured values change.
+ *
+ * The function must only be called inside effects and event handlers, never during render (which throws an error).
+ *
+ * This hook is a more permissive version of React 19.2's `React.useEffectEvent` in that it can be passed through contexts and called in event handler props, not just effects.
+ */
+function useStableCallback(callback) {
+  const stable = useRenderElement.useRefWithInit(createStableCallback).current;
+  stable.next = callback;
+  useSafeInsertionEffect(stable.effect);
+  return stable.trampoline;
+}
+function createStableCallback() {
+  const stable = {
+    next: undefined,
+    callback: assertNotCalled,
+    trampoline: (...args) => stable.callback?.(...args),
+    effect: () => {
+      stable.callback = stable.next;
+    }
+  };
+  return stable;
+}
+function assertNotCalled() {
+  if (process.env.NODE_ENV !== 'production') {
+    // TODO: fix mui/no-guarded-throw
+    // eslint-disable-next-line mui/no-guarded-throw
+    throw /* minify-error-disabled */new Error('Base UI: Cannot call an event handler while rendering.');
+  }
+}
+
+/**
+ * Untracks the provided value by turning it into a ref to remove its reactivity.
+ *
+ * Used to access the passed value inside `React.useEffect` without causing the effect to re-run when the value changes.
+ */
+function useValueAsRef(value) {
+  const latest = useRenderElement.useRefWithInit(createLatestRef, value).current;
+  latest.next = value;
+
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  useIsoLayoutEffect(latest.effect);
+  return latest;
+}
+function createLatestRef(value) {
+  const latest = {
+    current: value,
+    next: value,
+    effect: () => {
+      latest.current = latest.next;
+    }
+  };
+  return latest;
+}
+
+const visuallyHiddenBase = {
+  clipPath: 'inset(50%)',
+  overflow: 'hidden',
+  whiteSpace: 'nowrap',
+  border: 0,
+  padding: 0,
+  width: 1,
+  height: 1,
+  margin: -1
+};
+const visuallyHidden = {
+  ...visuallyHiddenBase,
+  position: 'fixed',
+  top: 0,
+  left: 0
+};
+const visuallyHiddenInput = {
+  ...visuallyHiddenBase,
+  position: 'absolute'
+};
+
 /**
  * The NoOptionalParams type is a utility type that checks if a function has optional or default parameters.
  * If the function has optional or default parameters, it returns a string literal type with an error message.
@@ -799,7 +973,7 @@ class ReactStore extends Store {
     React__namespace.useDebugValue(key);
     // eslint-disable-next-line consistent-this
     const store = this;
-    useButton.useIsoLayoutEffect(() => {
+    useIsoLayoutEffect(() => {
       if (store.state[key] !== value) {
         store.set(key, value);
       }
@@ -816,7 +990,7 @@ class ReactStore extends Store {
   useSyncedValueWithCleanup(key, value) {
     // eslint-disable-next-line consistent-this
     const store = this;
-    useButton.useIsoLayoutEffect(() => {
+    useIsoLayoutEffect(() => {
       if (store.state[key] !== value) {
         store.set(key, value);
       }
@@ -845,7 +1019,7 @@ class ReactStore extends Store {
       }
     }
     const dependencies = Object.values(statePart);
-    useButton.useIsoLayoutEffect(() => {
+    useIsoLayoutEffect(() => {
       store.update(statePart);
       // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [store, ...dependencies]);
@@ -860,7 +1034,7 @@ class ReactStore extends Store {
     // eslint-disable-next-line consistent-this
     const store = this;
     const isControlled = controlled !== undefined;
-    useButton.useIsoLayoutEffect(() => {
+    useIsoLayoutEffect(() => {
       if (isControlled && !Object.is(store.state[key], controlled)) {
         // Set the internal state to match the controlled value.
         store.setState({
@@ -914,7 +1088,7 @@ class ReactStore extends Store {
    */
   useContextCallback(key, fn) {
     React__namespace.useDebugValue(key);
-    const stableFunction = useButton.useStableCallback(fn ?? useRenderElement.NOOP);
+    const stableFunction = useStableCallback(fn ?? useRenderElement.NOOP);
     this.context[key] = stableFunction;
   }
 
@@ -975,6 +1149,240 @@ function mergeCleanups(...cleanups) {
   };
 }
 
+function ownerDocument(node) {
+  return node?.ownerDocument || document;
+}
+
+/**
+ * Adds an event listener and returns a cleanup function to remove it.
+ */
+
+function addEventListener(target, type, listener, options) {
+  target.addEventListener(type, listener, options);
+  return () => {
+    target.removeEventListener(type, listener, options);
+  };
+}
+
+const EMPTY$2 = [];
+
+/**
+ * A React.useEffect equivalent that runs once, when the component is mounted.
+ */
+function useOnMount(fn) {
+  // TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler -- no need to put `fn` in the dependency array
+  /* eslint-disable react-hooks/exhaustive-deps */
+  React__namespace.useEffect(fn, EMPTY$2);
+  /* eslint-enable react-hooks/exhaustive-deps */
+}
+
+/** Unlike `setTimeout`, rAF doesn't guarantee a positive integer return value, so we can't have
+ * a monomorphic `uint` type with `0` meaning empty.
+ * See warning note at:
+ * https://developer.mozilla.org/en-US/docs/Web/API/Window/requestAnimationFrame#return_value */
+const EMPTY$1 = null;
+let LAST_RAF = globalThis.requestAnimationFrame;
+class Scheduler {
+  /* This implementation uses an array as a backing data-structure for frame callbacks.
+   * It allows `O(1)` callback cancelling by inserting a `null` in the array, though it
+   * never calls the native `cancelAnimationFrame` if there are no frames left. This can
+   * be much more efficient if there is a call pattern that alterns as
+   * "request-cancel-request-cancel-…".
+   * But in the case of "request-request-…-cancel-cancel-…", it leaves the final animation
+   * frame to run anyway. We turn that frame into a `O(1)` no-op via `callbacksCount`. */
+
+  callbacks = [];
+  callbacksCount = 0;
+  nextId = 1;
+  startId = 1;
+  isScheduled = false;
+  tick = timestamp => {
+    this.isScheduled = false;
+    const currentCallbacks = this.callbacks;
+    const currentCallbacksCount = this.callbacksCount;
+
+    // Update these before iterating, callbacks could call `requestAnimationFrame` again.
+    this.callbacks = [];
+    this.callbacksCount = 0;
+    this.startId = this.nextId;
+    if (currentCallbacksCount > 0) {
+      for (let i = 0; i < currentCallbacks.length; i += 1) {
+        currentCallbacks[i]?.(timestamp);
+      }
+    }
+  };
+  request(fn) {
+    const id = this.nextId;
+    this.nextId += 1;
+    this.callbacks.push(fn);
+    this.callbacksCount += 1;
+
+    /* In a test environment with fake timers, a fake `requestAnimationFrame` can be called
+     * but there's no guarantee that the animation frame will actually run before the fake
+     * timers are teared, which leaves `isScheduled` set, but won't run our `tick()`. */
+    const didRAFChange = process.env.NODE_ENV !== 'production' && LAST_RAF !== requestAnimationFrame && (LAST_RAF = requestAnimationFrame, true);
+    if (!this.isScheduled || didRAFChange) {
+      requestAnimationFrame(this.tick);
+      this.isScheduled = true;
+    }
+    return id;
+  }
+  cancel(id) {
+    const index = id - this.startId;
+    if (index < 0 || index >= this.callbacks.length) {
+      return;
+    }
+    this.callbacks[index] = null;
+    this.callbacksCount -= 1;
+  }
+}
+const scheduler = new Scheduler();
+class AnimationFrame {
+  static create() {
+    return new AnimationFrame();
+  }
+  static request(fn) {
+    return scheduler.request(fn);
+  }
+  static cancel(id) {
+    return scheduler.cancel(id);
+  }
+  currentId = EMPTY$1;
+
+  /**
+   * Executes `fn` after `delay`, clearing any previously scheduled call.
+   */
+  request(fn) {
+    this.cancel();
+    this.currentId = scheduler.request(() => {
+      this.currentId = EMPTY$1;
+      fn();
+    });
+  }
+  cancel = () => {
+    if (this.currentId !== EMPTY$1) {
+      scheduler.cancel(this.currentId);
+      this.currentId = EMPTY$1;
+    }
+  };
+  disposeEffect = () => {
+    return this.cancel;
+  };
+}
+
+/**
+ * A `requestAnimationFrame` with automatic cleanup and guard.
+ */
+function useAnimationFrame() {
+  const timeout = useRenderElement.useRefWithInit(AnimationFrame.create).current;
+  useOnMount(timeout.disposeEffect);
+  return timeout;
+}
+
+const EMPTY = 0;
+class Timeout {
+  static create() {
+    return new Timeout();
+  }
+  currentId = EMPTY;
+
+  /**
+   * Executes `fn` after `delay`, clearing any previously scheduled call.
+   */
+  start(delay, fn) {
+    this.clear();
+    this.currentId = setTimeout(() => {
+      this.currentId = EMPTY;
+      fn();
+    }, delay); /* Node.js types are enabled in development */
+  }
+  isStarted() {
+    return this.currentId !== EMPTY;
+  }
+  clear = () => {
+    if (this.currentId !== EMPTY) {
+      clearTimeout(this.currentId);
+      this.currentId = EMPTY;
+    }
+  };
+  disposeEffect = () => {
+    return this.clear;
+  };
+}
+
+/**
+ * A `setTimeout` with automatic cleanup and guard.
+ */
+function useTimeout() {
+  const timeout = useRenderElement.useRefWithInit(Timeout.create).current;
+  useOnMount(timeout.disposeEffect);
+  return timeout;
+}
+
+/**
+ * Reads `navigator.userAgent` / `navigator.platform` (legacy but universally
+ * supported) into a normalized shape. In development, prefers the modern
+ * `navigator.userAgentData` API on Chromium to avoid DevTools warnings about
+ * the deprecated reads; that branch is dead-code-eliminated in production
+ * builds to keep the bundle small.
+ *
+ * Returns empty/zero values when `navigator` is undefined (SSR), so every
+ * derived flag safely evaluates to `false`.
+ */
+function readRawData() {
+  if (typeof navigator === 'undefined') {
+    return {
+      userAgent: '',
+      platform: '',
+      maxTouchPoints: 0
+    };
+  }
+  if (process.env.NODE_ENV !== 'production') {
+    const uaData = navigator.userAgentData;
+    if (uaData && Array.isArray(uaData.brands)) {
+      return {
+        userAgent: uaData.brands.map(({
+          brand,
+          version
+        }) => `${brand}/${version}`).join(' '),
+        platform: uaData.platform ?? navigator.platform ?? '',
+        maxTouchPoints: navigator.maxTouchPoints ?? 0
+      };
+    }
+  }
+  return {
+    userAgent: navigator.userAgent,
+    platform: navigator.platform ?? '',
+    maxTouchPoints: navigator.maxTouchPoints ?? 0
+  };
+}
+const {
+  userAgent,
+  platform,
+  maxTouchPoints
+} = readRawData();
+const lowerUserAgent = userAgent.toLowerCase();
+const lowerPlatform = platform.toLowerCase();
+
+// iPadOS 13+ reports `MacIntel` for `navigator.platform`; disambiguated via
+// `maxTouchPoints` so iPad is classified as iOS, not macOS.
+// https://github.com/mui/base-ui/issues/1309
+/** iPhone, iPad (including iPadOS 13+ reporting as macOS), iPod. */
+const ios = /^i(os$|p)/.test(lowerPlatform) || lowerPlatform === 'macintel' && maxTouchPoints > 1;
+
+/** Android phones, tablets, and embedded Android browsers. */
+const ANDROID_STRING = 'android';
+const android = lowerPlatform === ANDROID_STRING || lowerUserAgent.includes(ANDROID_STRING);
+
+/** macOS desktop. Excludes iPadOS, which reports as `MacIntel`. */
+const mac = !ios && lowerPlatform.startsWith('mac');
+
+/** Windows desktop. */
+lowerPlatform.startsWith('win');
+
+/** Any Apple OS (`mac || ios`). */
+const apple = mac || ios;
+
 // WebKit (Safari, all iOS browsers, GNOME Web). Distinguished from Blink by
 // the legacy `-webkit-backdrop-filter` name — Blink forked from WebKit in 2013
 // and only ships the unprefixed `backdrop-filter`.
@@ -986,14 +1394,14 @@ const webkit = typeof CSS !== 'undefined' && !!CSS.supports?.('-webkit-backdrop-
 // `!webkit` prefix also defends against future iOS-browser UA changes that
 // might inject `Firefox` into a WebKit-based UA.
 /** Gecko: Firefox. */
-const gecko = !webkit && useButton.lowerUserAgent.includes('firefox');
+const gecko = !webkit && lowerUserAgent.includes('firefox');
 
 // All Chromium-based browsers ship `Chrome/` or `Chromium/` in their UA — both
 // share the `chrom` prefix, so a single substring check covers Chrome, Edge,
 // Opera, Brave, etc. Chrome-on-iOS uses `CriOS/` and stays WebKit. The positive
 // UA check also makes this SSR-safe — an empty UA matches nothing.
 /** Blink: Chrome, Edge, Opera, Brave, and other Chromium-based browsers. */
-!webkit && useButton.lowerUserAgent.includes('chrom');
+!webkit && lowerUserAgent.includes('chrom');
 
 // Whether a screen reader is *actually* running cannot be detected. These flags
 // identify platforms where a specific screen reader could be active. VoiceOver
@@ -1004,7 +1412,50 @@ const gecko = !webkit && useButton.lowerUserAgent.includes('firefox');
  * The user *may* be using VoiceOver — actual activation is not detectable.
  * True on any Apple platform (macOS, iOS, iPadOS).
  */
-const voiceOver = useButton.apple;
+const voiceOver = apple;
+
+/** Running in jsdom or HappyDOM (used by unit tests). */
+const jsdom = /jsdom|happydom/.test(lowerUserAgent);
+
+function stopEvent(event) {
+  event.preventDefault();
+  event.stopPropagation();
+}
+function isReactEvent(event) {
+  return 'nativeEvent' in event;
+}
+
+// License: https://github.com/adobe/react-spectrum/blob/main/packages/@react-aria/utils/src/isVirtualEvent.ts
+function isVirtualClick(event) {
+  if (event.pointerType === '' && event.isTrusted) {
+    return true;
+  }
+  if (android && event.pointerType) {
+    return event.type === 'click' && event.buttons === 1;
+  }
+  return event.detail === 0 && !event.pointerType;
+}
+function isVirtualPointerEvent(event) {
+  if (jsdom) {
+    return false;
+  }
+  return !android && event.width === 0 && event.height === 0 || android && event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === 'mouse' ||
+  // iOS VoiceOver returns 0.333• for width/height.
+  event.width < 1 && event.height < 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === 'touch';
+}
+function isMouseLikePointerType(pointerType, strict) {
+  // On some Linux machines with Chromium, mouse inputs return a `pointerType`
+  // of "pen": https://github.com/floating-ui/floating-ui/issues/2015
+  const values = ['mouse', 'pen'];
+  if (!strict) {
+    values.push('', undefined);
+  }
+  return values.includes(pointerType);
+}
+function isClickLikeEvent(event) {
+  const type = event.type;
+  return type === 'click' || type === 'mousedown' || type === 'keydown' || type === 'keyup';
+}
 
 const FOCUSABLE_ATTRIBUTE = 'data-base-ui-focusable';
 const TYPEABLE_SELECTOR = "input:not([type='hidden']):not([disabled])," + "[contenteditable]:not([contenteditable='false']),textarea:not([disabled])";
@@ -1013,8 +1464,48 @@ const ARROW_RIGHT = 'ArrowRight';
 const ARROW_UP = 'ArrowUp';
 const ARROW_DOWN = 'ArrowDown';
 
+function activeElement(doc) {
+  let element = doc.activeElement;
+  while (element?.shadowRoot?.activeElement != null) {
+    element = element.shadowRoot.activeElement;
+  }
+  return element;
+}
+function contains(parent, child) {
+  if (!parent || !child) {
+    return false;
+  }
+  const rootNode = child.getRootNode?.();
+
+  // First, attempt with the faster native method.
+  if (parent.contains(child)) {
+    return true;
+  }
+
+  // Then fall back to traversing out of shadow roots when needed.
+  if (rootNode && floatingUi_utils.isShadowRoot(rootNode)) {
+    let next = child;
+    while (next) {
+      if (parent === next) {
+        return true;
+      }
+      next = next.parentNode || next.host;
+    }
+  }
+  return false;
+}
+function getTarget(event) {
+  if ('composedPath' in event) {
+    return event.composedPath()[0];
+  }
+
+  // TS assumes `composedPath()` always exists, but older browsers without
+  // shadow DOM support still fall back to `target`.
+  return event.target;
+}
+
 function isTargetInsideEnabledTrigger(target, triggerElements) {
-  if (!floatingUi_utils_dom.isElement(target)) {
+  if (!floatingUi_utils.isElement(target)) {
     return false;
   }
   const targetElement = target;
@@ -1022,7 +1513,7 @@ function isTargetInsideEnabledTrigger(target, triggerElements) {
     return !targetElement.hasAttribute('data-trigger-disabled');
   }
   for (const [, trigger] of triggerElements.entries()) {
-    if (useButton.contains(trigger, targetElement)) {
+    if (contains(trigger, targetElement)) {
       return !trigger.hasAttribute('data-trigger-disabled');
     }
   }
@@ -1044,7 +1535,7 @@ function isRootElement(element) {
   return element.matches('html,body');
 }
 function isTypeableElement(element) {
-  return floatingUi_utils_dom.isHTMLElement(element) && element.matches(TYPEABLE_SELECTOR);
+  return floatingUi_utils.isHTMLElement(element) && element.matches(TYPEABLE_SELECTOR);
 }
 function isInteractiveElement(element) {
   return element?.closest(`button,a[href],[role="button"],select,[tabindex]:not([tabindex="-1"]),${TYPEABLE_SELECTOR}`) != null;
@@ -1058,7 +1549,7 @@ function isTypeableCombobox(element) {
 function matchesFocusVisible(element) {
   // We don't want to block focus from working with `visibleOnly`
   // (JSDOM doesn't match `:focus-visible` when the element has `:focus`)
-  if (!element || useButton.jsdom) {
+  if (!element || jsdom) {
     return true;
   }
   try {
@@ -1078,9 +1569,89 @@ function getFloatingFocusElement(floatingElement) {
   return floatingElement.hasAttribute(FOCUSABLE_ATTRIBUTE) ? floatingElement : floatingElement.querySelector(`[${FOCUSABLE_ATTRIBUTE}]`) || floatingElement;
 }
 
+const none = 'none';
+const triggerPress = 'trigger-press';
+const triggerHover = 'trigger-hover';
+const triggerFocus = 'trigger-focus';
+const outsidePress = 'outside-press';
+const itemPress = 'item-press';
+const closePress = 'close-press';
+const clearPress = 'clear-press';
+const chipRemovePress = 'chip-remove-press';
+const incrementPress = 'increment-press';
+const decrementPress = 'decrement-press';
+const inputChange = 'input-change';
+const inputClear = 'input-clear';
+const inputBlur = 'input-blur';
+const inputPaste = 'input-paste';
+const inputPress = 'input-press';
+const focusOut = 'focus-out';
+const escapeKey = 'escape-key';
+const closeWatcher = 'close-watcher';
+const listNavigation = 'list-navigation';
+const keyboard = 'keyboard';
+const pointer = 'pointer';
+const wheel = 'wheel';
+const scrub = 'scrub';
+const cancelOpen = 'cancel-open';
+const siblingOpen = 'sibling-open';
+const imperativeAction = 'imperative-action';
+const swipe = 'swipe';
+const windowResize = 'window-resize';
+
+/**
+ * Maps a change `reason` string to the corresponding native event type.
+ */
+
+/**
+ * Details of custom change events emitted by Base UI components.
+ */
+
+/**
+ * Details of custom generic events emitted by Base UI components.
+ */
+
+/**
+ * Creates a Base UI event details object with the given reason and utilities
+ * for preventing Base UI's internal event handling.
+ */
+function createChangeEventDetails(reason, event, trigger, customProperties) {
+  let canceled = false;
+  let allowPropagation = false;
+  const custom = customProperties ?? useRenderElement.EMPTY_OBJECT;
+  const details = {
+    reason,
+    event: event ?? new Event('base-ui'),
+    cancel() {
+      canceled = true;
+    },
+    allowPropagation() {
+      allowPropagation = true;
+    },
+    get isCanceled() {
+      return canceled;
+    },
+    get isPropagationAllowed() {
+      return allowPropagation;
+    },
+    trigger,
+    ...custom
+  };
+  return details;
+}
+function createGenericEventDetails(reason, event, customProperties) {
+  const custom = customProperties ?? useRenderElement.EMPTY_OBJECT;
+  const details = {
+    reason,
+    event: event ?? new Event('base-ui'),
+    ...custom
+  };
+  return details;
+}
+
 const FocusGuard = /*#__PURE__*/React__namespace.forwardRef(function FocusGuard(props, ref) {
   const [role, setRole] = React__namespace.useState();
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     // Unlike NVDA and JAWS, VoiceOver's virtual cursor triggers `onFocus` as
     // it moves — but only on focusable/role-button elements through WebKit's
     // NSAccessibility path. Setting `role="button"` lets the focus trap catch
@@ -1097,7 +1668,7 @@ const FocusGuard = /*#__PURE__*/React__namespace.forwardRef(function FocusGuard(
   return /*#__PURE__*/jsxRuntime.jsx("span", {
     ...props,
     ref: ref,
-    style: useButton.visuallyHidden,
+    style: visuallyHidden,
     "aria-hidden": role ? undefined : true,
     ...restProps,
     "data-base-ui-focus-guard": ""
@@ -1258,7 +1829,7 @@ function getGridNavigatedIndex(list, {
       return undefined;
     };
     if (stop) {
-      useButton.stopEvent(event);
+      stopEvent(event);
     }
     const verticalCandidate = navigateVertically(verticalDirection) ?? navigateVerticallyWithInferredRows(verticalDirection);
     if (verticalCandidate !== undefined) {
@@ -1308,7 +1879,7 @@ function getGridNavigatedIndex(list, {
     const prevRow = floatingUi_utils.floor(prevIndex / cols);
     if (event.key === (rtl ? ARROW_LEFT : ARROW_RIGHT)) {
       if (stop) {
-        useButton.stopEvent(event);
+        stopEvent(event);
       }
       if (prevIndex % cols !== cols - 1) {
         nextIndex = findNonDisabledListIndex(list, {
@@ -1339,7 +1910,7 @@ function getGridNavigatedIndex(list, {
     }
     if (event.key === (rtl ? ARROW_RIGHT : ARROW_LEFT)) {
       if (stop) {
-        useButton.stopEvent(event);
+        stopEvent(event);
       }
       if (prevIndex % cols !== 0) {
         nextIndex = findNonDisabledListIndex(list, {
@@ -1405,7 +1976,7 @@ function isListIndexDisabled(list, index, disabledIndices) {
 function isHiddenByStyles(styles) {
   return styles.visibility === 'hidden' || styles.visibility === 'collapse';
 }
-function isElementVisible(element, styles = element ? floatingUi_utils_dom.getComputedStyle(element) : null) {
+function isElementVisible(element, styles = element ? floatingUi_utils.getComputedStyle(element) : null) {
   if (!element || !element.isConnected || !styles || isHiddenByStyles(styles)) {
     return false;
   }
@@ -1425,11 +1996,11 @@ function getParentElement(element) {
     return element.parentElement;
   }
   const rootNode = element.getRootNode();
-  return floatingUi_utils_dom.isShadowRoot(rootNode) ? rootNode.host : null;
+  return floatingUi_utils.isShadowRoot(rootNode) ? rootNode.host : null;
 }
 function getDetailsSummary(details) {
   for (const child of Array.from(details.children)) {
-    if (floatingUi_utils_dom.getNodeName(child) === 'summary') {
+    if (floatingUi_utils.getNodeName(child) === 'summary') {
       return child;
     }
   }
@@ -1437,11 +2008,11 @@ function getDetailsSummary(details) {
 }
 function isWithinOpenDetailsSummary(element, details) {
   const summary = getDetailsSummary(details);
-  return !!summary && (element === summary || useButton.contains(summary, element));
+  return !!summary && (element === summary || contains(summary, element));
 }
 function isFocusableCandidate(element) {
-  const nodeName = element ? floatingUi_utils_dom.getNodeName(element) : '';
-  return element != null && element.matches(CANDIDATE_SELECTOR) && (nodeName !== 'summary' || element.parentElement != null && floatingUi_utils_dom.getNodeName(element.parentElement) === 'details' && getDetailsSummary(element.parentElement) === element) && (nodeName !== 'details' || getDetailsSummary(element) == null) && (nodeName !== 'input' || element.type !== 'hidden');
+  const nodeName = element ? floatingUi_utils.getNodeName(element) : '';
+  return element != null && element.matches(CANDIDATE_SELECTOR) && (nodeName !== 'summary' || element.parentElement != null && floatingUi_utils.getNodeName(element.parentElement) === 'details' && getDetailsSummary(element.parentElement) === element) && (nodeName !== 'details' || getDetailsSummary(element) == null) && (nodeName !== 'input' || element.type !== 'hidden');
 }
 function isFocusableElement(element) {
   if (!isFocusableCandidate(element) || !element.isConnected || element.matches(':disabled')) {
@@ -1449,18 +2020,18 @@ function isFocusableElement(element) {
   }
   for (let current = element; current; current = getParentElement(current)) {
     const isAncestor = current !== element;
-    const isSlot = floatingUi_utils_dom.getNodeName(current) === 'slot';
+    const isSlot = floatingUi_utils.getNodeName(current) === 'slot';
     if (current.hasAttribute('inert')) {
       return false;
     }
-    if (isAncestor && floatingUi_utils_dom.getNodeName(current) === 'details' && !current.open && !isWithinOpenDetailsSummary(element, current) || current.hasAttribute('hidden') || !isSlot && !isVisibleInTabbableTree(current, isAncestor)) {
+    if (isAncestor && floatingUi_utils.getNodeName(current) === 'details' && !current.open && !isWithinOpenDetailsSummary(element, current) || current.hasAttribute('hidden') || !isSlot && !isVisibleInTabbableTree(current, isAncestor)) {
       return false;
     }
   }
   return true;
 }
 function isVisibleInTabbableTree(element, isAncestor) {
-  const styles = floatingUi_utils_dom.getComputedStyle(element);
+  const styles = floatingUi_utils.getComputedStyle(element);
   if (!isAncestor) {
     return isElementVisible(element, styles);
   }
@@ -1469,15 +2040,15 @@ function isVisibleInTabbableTree(element, isAncestor) {
 function getTabIndex(element) {
   const tabIndex = element.tabIndex;
   if (tabIndex < 0) {
-    const nodeName = floatingUi_utils_dom.getNodeName(element);
-    if (nodeName === 'details' || nodeName === 'audio' || nodeName === 'video' || floatingUi_utils_dom.isHTMLElement(element) && element.isContentEditable) {
+    const nodeName = floatingUi_utils.getNodeName(element);
+    if (nodeName === 'details' || nodeName === 'audio' || nodeName === 'video' || floatingUi_utils.isHTMLElement(element) && element.isContentEditable) {
       return 0;
     }
   }
   return tabIndex;
 }
 function getNamedRadioInput(element) {
-  if (floatingUi_utils_dom.getNodeName(element) !== 'input') {
+  if (floatingUi_utils.getNodeName(element) !== 'input') {
     return null;
   }
   const input = element;
@@ -1501,7 +2072,7 @@ function isTabbableRadio(element, candidates) {
   }) === input;
 }
 function getComposedChildren(container) {
-  if (floatingUi_utils_dom.isHTMLElement(container) && floatingUi_utils_dom.getNodeName(container) === 'slot') {
+  if (floatingUi_utils.isHTMLElement(container) && floatingUi_utils.getNodeName(container) === 'slot') {
     const assignedElements = container.assignedElements({
       flatten: true
     });
@@ -1509,7 +2080,7 @@ function getComposedChildren(container) {
       return assignedElements;
     }
   }
-  if (floatingUi_utils_dom.isHTMLElement(container) && container.shadowRoot) {
+  if (floatingUi_utils.isHTMLElement(container) && container.shadowRoot) {
     return Array.from(container.shadowRoot.children);
   }
   return Array.from(container.children);
@@ -1524,7 +2095,7 @@ function appendCandidates(container, list) {
 }
 function appendMatchingElements(container, selector, list) {
   getComposedChildren(container).forEach(child => {
-    if (floatingUi_utils_dom.isHTMLElement(child) && child.matches(selector)) {
+    if (floatingUi_utils.isHTMLElement(child) && child.matches(selector)) {
       list.push(child);
     }
     appendMatchingElements(child, selector, list);
@@ -1548,23 +2119,23 @@ function getTabbableIn(container, dir) {
   if (len === 0) {
     return undefined;
   }
-  const active = useButton.activeElement(useButton.ownerDocument(container));
+  const active = activeElement(ownerDocument(container));
   const index = list.indexOf(active);
   // eslint-disable-next-line no-nested-ternary
   const nextIndex = index === -1 ? dir === 1 ? 0 : len - 1 : index + dir;
   return list[nextIndex];
 }
 function getNextTabbable(referenceElement) {
-  return getTabbableIn(useButton.ownerDocument(referenceElement).body, 1) || referenceElement;
+  return getTabbableIn(ownerDocument(referenceElement).body, 1) || referenceElement;
 }
 function getPreviousTabbable(referenceElement) {
-  return getTabbableIn(useButton.ownerDocument(referenceElement).body, -1) || referenceElement;
+  return getTabbableIn(ownerDocument(referenceElement).body, -1) || referenceElement;
 }
 function getTabbableNearElement(referenceElement, dir) {
   if (!referenceElement) {
     return null;
   }
-  const list = tabbable(useButton.ownerDocument(referenceElement).body);
+  const list = tabbable(ownerDocument(referenceElement).body);
   const elementCount = list.length;
   if (elementCount === 0) {
     return null;
@@ -1585,7 +2156,7 @@ function getTabbableBeforeElement(referenceElement) {
 function isOutsideEvent(event, container) {
   const containerElement = container || event.currentTarget;
   const relatedTarget = event.relatedTarget;
-  return !relatedTarget || !useButton.contains(containerElement, relatedTarget);
+  return !relatedTarget || !contains(containerElement, relatedTarget);
 }
 function disableFocusInside(container) {
   const tabbableElements = tabbable(container);
@@ -1681,7 +2252,7 @@ function unwrapHost(node) {
   if (!node) {
     return null;
   }
-  return floatingUi_utils_dom.isShadowRoot(node) ? node.host : unwrapHost(node.parentNode);
+  return floatingUi_utils.isShadowRoot(node) ? node.host : unwrapHost(node.parentNode);
 }
 const correctElements = (parent, targets) => targets.map(target => {
   if (parent.contains(target)) {
@@ -1711,7 +2282,7 @@ const collectOutsideElements = (root, keepElements, stopElements) => {
       return;
     }
     Array.from(parent.children).forEach(node => {
-      if (floatingUi_utils_dom.getNodeName(node) === 'script') {
+      if (floatingUi_utils.getNodeName(node) === 'script') {
         return;
       }
       if (keepElements.has(node)) {
@@ -1811,12 +2382,50 @@ function markOthers(avoidElements, options = {}) {
     inert = false,
     mark = true
   } = options;
-  const body = useButton.ownerDocument(avoidElements[0]).body;
+  const body = ownerDocument(avoidElements[0]).body;
   return applyAttributeToOthers(avoidElements, body, ariaHidden, inert, {
     mark
   });
 }
 
+let globalId = 0;
+
+// TODO React 17: Remove `useGlobalId` once React 17 support is removed
+function useGlobalId(idOverride, prefix = 'mui') {
+  const [defaultId, setDefaultId] = React__namespace.useState(idOverride);
+  const id = idOverride || defaultId;
+  React__namespace.useEffect(() => {
+    if (defaultId == null) {
+      // Fallback to this default id when possible.
+      // Use the incrementing value for client-side rendering only.
+      // We can't use it server-side.
+      // If you want to use random values please consider the Birthday Problem: https://en.wikipedia.org/wiki/Birthday_problem
+      globalId += 1;
+      setDefaultId(`${prefix}-${globalId}`);
+    }
+  }, [defaultId, prefix]);
+  return id;
+}
+const maybeReactUseId = SafeReact.useId;
+
+/**
+ *
+ * @example <div id={useId()} />
+ * @param idOverride
+ * @returns {string}
+ */
+function useId(idOverride, prefix) {
+  // React.useId() is only available from React 17.0.0.
+  if (maybeReactUseId !== undefined) {
+    const reactId = maybeReactUseId();
+    return idOverride ?? (prefix ? `${prefix}-${reactId}` : reactId);
+  }
+
+  // TODO: uncomment once we enable eslint-plugin-react-compiler // eslint-disable-next-line react-compiler/react-compiler
+  // eslint-disable-next-line react-hooks/rules-of-hooks -- `React.useId` is invariant at runtime.
+  return useGlobalId(idOverride, prefix);
+}
+
 const TYPEAHEAD_RESET_MS = 500;
 const PATIENT_CLICK_THRESHOLD = 500;
 const DISABLED_TRANSITIONS_STYLE = {
@@ -1868,12 +2477,12 @@ function useFloatingPortalNode(props = {}) {
     componentProps = useRenderElement.EMPTY_OBJECT,
     elementProps
   } = props;
-  const uniqueId = useButton.useId();
+  const uniqueId = useId();
   const portalContext = usePortalContext();
   const parentPortalNode = portalContext?.portalNode;
   const [containerElement, setContainerElement] = React__namespace.useState(null);
   const [portalNode, setPortalNode] = React__namespace.useState(null);
-  const setPortalNodeRef = useButton.useStableCallback(node => {
+  const setPortalNodeRef = useStableCallback(node => {
     if (node !== null) {
       // the useIsoLayoutEffect below watching containerProp / parentPortalNode
       // sets setPortalNode(null) when the container becomes null or changes.
@@ -1882,7 +2491,7 @@ function useFloatingPortalNode(props = {}) {
     }
   });
   const containerRef = React__namespace.useRef(null);
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     // Wait for the container to be resolved if explicitly `null`.
     if (containerProp === null) {
       if (containerRef.current) {
@@ -1897,7 +2506,7 @@ function useFloatingPortalNode(props = {}) {
     if (uniqueId == null) {
       return;
     }
-    const resolvedContainer = (containerProp && (floatingUi_utils_dom.isNode(containerProp) ? containerProp : containerProp.current)) ?? parentPortalNode ?? document.body;
+    const resolvedContainer = (containerProp && (floatingUi_utils.isNode(containerProp) ? containerProp : containerProp.current)) ?? parentPortalNode ?? document.body;
     if (resolvedContainer == null) {
       if (containerRef.current) {
         containerRef.current = null;
@@ -1992,9 +2601,9 @@ const FloatingPortal = /*#__PURE__*/React__namespace.forwardRef(function Floatin
 
     // Listen to the event on the capture phase so they run before the focus
     // trap elements onFocus prop is called.
-    return mergeCleanups(useButton.addEventListener(portalNode, 'focusin', onFocus, true), useButton.addEventListener(portalNode, 'focusout', onFocus, true));
+    return mergeCleanups(addEventListener(portalNode, 'focusin', onFocus, true), addEventListener(portalNode, 'focusout', onFocus, true));
   }, [portalNode, modal]);
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     if (!portalNode || open !== true || !focusInsideDisabledRef.current) {
       return;
     }
@@ -2040,7 +2649,7 @@ const FloatingPortal = /*#__PURE__*/React__namespace.forwardRef(function Floatin
             const nextTabbable = getNextTabbable(domReference);
             nextTabbable?.focus();
             if (focusManagerState?.closeOnFocusOut) {
-              focusManagerState?.onOpenChange(false, useButton.createChangeEventDetails(useButton.focusOut, event.nativeEvent));
+              focusManagerState?.onOpenChange(false, createChangeEventDetails(focusOut, event.nativeEvent));
             }
           }
         }
@@ -2112,10 +2721,10 @@ const useFloatingTree = externalTree => {
  * @see https://floating-ui.com/docs/FloatingTree
  */
 function useFloatingNodeId(externalTree) {
-  const id = useButton.useId();
+  const id = useId();
   const tree = useFloatingTree(externalTree);
   const parentId = useFloatingParentNodeId();
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     if (!id) {
       return undefined;
     }
@@ -2172,8 +2781,19 @@ function FloatingTree(props) {
   });
 }
 
+/**
+ * If the provided argument is a ref object, returns its `current` value.
+ * Otherwise, returns the argument itself.
+ */
+function resolveRef(maybeRef) {
+  if (maybeRef == null) {
+    return maybeRef;
+  }
+  return 'current' in maybeRef ? maybeRef.current : maybeRef;
+}
+
 function getEventType(event, lastInteractionType) {
-  const win = floatingUi_utils_dom.getWindow(useButton.getTarget(event));
+  const win = floatingUi_utils.getWindow(getTarget(event));
   if (event instanceof win.KeyboardEvent) {
     return 'keyboard';
   }
@@ -2203,7 +2823,7 @@ function clearDisconnectedPreviouslyFocusedElements() {
 }
 function addPreviouslyFocusedElement(element) {
   clearDisconnectedPreviouslyFocusedElements();
-  if (element && floatingUi_utils_dom.getNodeName(element) !== 'body') {
+  if (element && floatingUi_utils.getNodeName(element) !== 'body') {
     previouslyFocusedElements.push(new WeakRef(element));
     if (previouslyFocusedElements.length > LIST_LIMIT) {
       previouslyFocusedElements = previouslyFocusedElements.slice(-LIST_LIMIT);
@@ -2278,7 +2898,7 @@ function FloatingFocusManager(props) {
     events,
     dataRef
   } = store.context;
-  const getNodeId = useButton.useStableCallback(() => dataRef.current.floatingContext?.nodeId);
+  const getNodeId = useStableCallback(() => dataRef.current.floatingContext?.nodeId);
   const ignoreInitialFocus = initialFocus === false;
   // If the reference is a combobox and is typeable (e.g. input/textarea),
   // there are different focus semantics. The guards should not be rendered, but
@@ -2286,10 +2906,10 @@ function FloatingFocusManager(props) {
   // hidden dismiss button should only appear at the end of the list, not the
   // start.
   const isUntrappedTypeableCombobox = isTypeableCombobox(domReference) && ignoreInitialFocus;
-  const initialFocusRef = useButton.useValueAsRef(initialFocus);
-  const returnFocusRef = useButton.useValueAsRef(returnFocus);
-  const openInteractionTypeRef = useButton.useValueAsRef(openInteractionType);
-  const openRef = useButton.useValueAsRef(open);
+  const initialFocusRef = useValueAsRef(initialFocus);
+  const returnFocusRef = useValueAsRef(returnFocus);
+  const openInteractionTypeRef = useValueAsRef(openInteractionType);
+  const openRef = useValueAsRef(open);
   const tree = useFloatingTree(externalTree);
   const portalContext = usePortalContext();
   const preventReturnFocusRef = React__namespace.useRef(false);
@@ -2302,15 +2922,15 @@ function FloatingFocusManager(props) {
   const afterGuardRef = React__namespace.useRef(null);
   const mergedBeforeGuardRef = useRenderElement.useMergedRefs(beforeGuardRef, beforeContentFocusGuardRef, portalContext?.beforeInsideRef);
   const mergedAfterGuardRef = useRenderElement.useMergedRefs(afterGuardRef, portalContext?.afterInsideRef);
-  const blurTimeout = useButton.useTimeout();
-  const pointerDownTimeout = useButton.useTimeout();
-  const restoreFocusFrame = useButton.useAnimationFrame();
+  const blurTimeout = useTimeout();
+  const pointerDownTimeout = useTimeout();
+  const restoreFocusFrame = useAnimationFrame();
   const isInsidePortal = portalContext != null;
   const floatingFocusElement = getFloatingFocusElement(floating);
-  const getTabbableContent = useButton.useStableCallback((container = floatingFocusElement) => {
+  const getTabbableContent = useStableCallback((container = floatingFocusElement) => {
     return container ? tabbable(container) : [];
   });
-  const getResolvedInsideElements = useButton.useStableCallback(() => getInsideElements?.().filter(element => element != null) ?? []);
+  const getResolvedInsideElements = useStableCallback(() => getInsideElements?.().filter(element => element != null) ?? []);
 
   // Prevent Tab from escaping the modal when there are no tabbable elements.
   React__namespace.useEffect(() => {
@@ -2320,13 +2940,13 @@ function FloatingFocusManager(props) {
     function onKeyDown(event) {
       if (event.key === 'Tab') {
         // The focus guards have nothing to focus, so we need to stop the event.
-        if (useButton.contains(floatingFocusElement, useButton.activeElement(useButton.ownerDocument(floatingFocusElement))) && getTabbableContent().length === 0 && !isUntrappedTypeableCombobox) {
-          useButton.stopEvent(event);
+        if (contains(floatingFocusElement, activeElement(ownerDocument(floatingFocusElement))) && getTabbableContent().length === 0 && !isUntrappedTypeableCombobox) {
+          stopEvent(event);
         }
       }
     }
-    const doc = useButton.ownerDocument(floatingFocusElement);
-    return useButton.addEventListener(doc, 'keydown', onKeyDown);
+    const doc = ownerDocument(floatingFocusElement);
+    return addEventListener(doc, 'keydown', onKeyDown);
   }, [disabled, floatingFocusElement, modal, isUntrappedTypeableCombobox, getTabbableContent]);
 
   // Track pointer/keyboard interactions to disambiguate focus and outside presses.
@@ -2334,14 +2954,14 @@ function FloatingFocusManager(props) {
     if (disabled || !open) {
       return undefined;
     }
-    const doc = useButton.ownerDocument(floatingFocusElement);
+    const doc = ownerDocument(floatingFocusElement);
     function clearPointerDownOutside() {
       pointerDownOutsideRef.current = false;
     }
     function onPointerDown(event) {
-      const target = useButton.getTarget(event);
+      const target = getTarget(event);
       const insideElements = getResolvedInsideElements();
-      const pointerTargetInside = useButton.contains(floating, target) || useButton.contains(domReference, target) || useButton.contains(portalContext?.portalNode, target) || insideElements.some(element => element === target || useButton.contains(element, target));
+      const pointerTargetInside = contains(floating, target) || contains(domReference, target) || contains(portalContext?.portalNode, target) || insideElements.some(element => element === target || contains(element, target));
       pointerDownOutsideRef.current = !pointerTargetInside;
       lastInteractionTypeRef.current = event.pointerType || 'keyboard';
       if (target?.closest(`[${CLICK_TRIGGER_IDENTIFIER}]`)) {
@@ -2356,7 +2976,7 @@ function FloatingFocusManager(props) {
     function onKeyDown() {
       lastInteractionTypeRef.current = 'keyboard';
     }
-    return mergeCleanups(useButton.addEventListener(doc, 'pointerdown', onPointerDown, true), useButton.addEventListener(doc, 'pointerup', clearPointerDownOutside, true), useButton.addEventListener(doc, 'pointercancel', clearPointerDownOutside, true), useButton.addEventListener(doc, 'keydown', onKeyDown, true),
+    return mergeCleanups(addEventListener(doc, 'pointerdown', onPointerDown, true), addEventListener(doc, 'pointerup', clearPointerDownOutside, true), addEventListener(doc, 'pointercancel', clearPointerDownOutside, true), addEventListener(doc, 'keydown', onKeyDown, true),
     // Avoid a stale `true` leaking into the next open (e.g. keep-mounted popups)
     // if the popup dismissed between pointerdown and pointerup.
     clearPointerDownOutside);
@@ -2367,7 +2987,7 @@ function FloatingFocusManager(props) {
     if (disabled || !closeOnFocusOut) {
       return undefined;
     }
-    const doc = useButton.ownerDocument(floatingFocusElement);
+    const doc = ownerDocument(floatingFocusElement);
 
     // In Safari, buttons lose focus when pressing them.
     function handlePointerDown() {
@@ -2377,7 +2997,7 @@ function FloatingFocusManager(props) {
       });
     }
     function handleFocusIn(event) {
-      const target = useButton.getTarget(event);
+      const target = getTarget(event);
       if (isTabbable(target)) {
         lastFocusedTabbableRef.current = target;
       }
@@ -2385,30 +3005,30 @@ function FloatingFocusManager(props) {
     function handleFocusOutside(event) {
       const relatedTarget = event.relatedTarget;
       const currentTarget = event.currentTarget;
-      const target = useButton.getTarget(event);
+      const target = getTarget(event);
 
       // When focus is lost to the body (e.g. on a backdrop press), record the element that
       // had focus so a confirmation dialog opened while the body is focused can return focus
       // to it. Scoped to `modal` to avoid non-modal popups polluting the shared stack.
-      if (modal && relatedTarget == null && target != null && useButton.contains(floating, target)) {
+      if (modal && relatedTarget == null && target != null && contains(floating, target)) {
         addPreviouslyFocusedElement(target);
       }
       queueMicrotask(() => {
         const nodeId = getNodeId();
         const triggers = store.context.triggerElements;
         const insideElements = getResolvedInsideElements();
-        const isRelatedFocusGuard = relatedTarget?.hasAttribute(createAttribute('focus-guard')) && [beforeGuardRef.current, afterGuardRef.current, portalContext?.beforeInsideRef.current, portalContext?.afterInsideRef.current, portalContext?.beforeOutsideRef.current, portalContext?.afterOutsideRef.current, useButton.resolveRef(previousFocusableElement), useButton.resolveRef(nextFocusableElement)].includes(relatedTarget);
-        const movedToUnrelatedNode = !(useButton.contains(domReference, relatedTarget) || useButton.contains(floating, relatedTarget) || useButton.contains(relatedTarget, floating) || useButton.contains(portalContext?.portalNode, relatedTarget) || insideElements.some(element => element === relatedTarget || useButton.contains(element, relatedTarget)) || relatedTarget != null && triggers.hasElement(relatedTarget) || triggers.hasMatchingElement(trigger => useButton.contains(trigger, relatedTarget)) || isRelatedFocusGuard || tree && (getNodeChildren(tree.nodesRef.current, nodeId).find(node => useButton.contains(node.context?.elements.floating, relatedTarget) || useButton.contains(node.context?.elements.domReference, relatedTarget)) || getNodeAncestors(tree.nodesRef.current, nodeId).find(node => [node.context?.elements.floating, getFloatingFocusElement(node.context?.elements.floating)].includes(relatedTarget) || node.context?.elements.domReference === relatedTarget)));
+        const isRelatedFocusGuard = relatedTarget?.hasAttribute(createAttribute('focus-guard')) && [beforeGuardRef.current, afterGuardRef.current, portalContext?.beforeInsideRef.current, portalContext?.afterInsideRef.current, portalContext?.beforeOutsideRef.current, portalContext?.afterOutsideRef.current, resolveRef(previousFocusableElement), resolveRef(nextFocusableElement)].includes(relatedTarget);
+        const movedToUnrelatedNode = !(contains(domReference, relatedTarget) || contains(floating, relatedTarget) || contains(relatedTarget, floating) || contains(portalContext?.portalNode, relatedTarget) || insideElements.some(element => element === relatedTarget || contains(element, relatedTarget)) || relatedTarget != null && triggers.hasElement(relatedTarget) || triggers.hasMatchingElement(trigger => contains(trigger, relatedTarget)) || isRelatedFocusGuard || tree && (getNodeChildren(tree.nodesRef.current, nodeId).find(node => contains(node.context?.elements.floating, relatedTarget) || contains(node.context?.elements.domReference, relatedTarget)) || getNodeAncestors(tree.nodesRef.current, nodeId).find(node => [node.context?.elements.floating, getFloatingFocusElement(node.context?.elements.floating)].includes(relatedTarget) || node.context?.elements.domReference === relatedTarget)));
         if (currentTarget === domReference && floatingFocusElement) {
           handleTabIndex(floatingFocusElement);
         }
 
         // Restore focus to the previous tabbable element index to prevent
         // focus from being lost outside the floating tree.
-        if (restoreFocus && currentTarget !== domReference && !isElementVisible(target) && useButton.activeElement(doc) === doc.body) {
+        if (restoreFocus && currentTarget !== domReference && !isElementVisible(target) && activeElement(doc) === doc.body) {
           // Let `FloatingPortal` effect knows that focus is still inside the
           // floating tree.
-          if (floatingUi_utils_dom.isHTMLElement(floatingFocusElement)) {
+          if (floatingUi_utils.isHTMLElement(floatingFocusElement)) {
             floatingFocusElement.focus();
             // If explicitly requested to restore focus to the popup container, do not search
             // for the next/previous tabbable element.
@@ -2426,7 +3046,7 @@ function FloatingFocusManager(props) {
           const tabbableContent = getTabbableContent();
           const prevTabbable = lastFocusedTabbableRef.current;
           const nodeToFocus = (prevTabbable && tabbableContent.includes(prevTabbable) ? prevTabbable : null) || tabbableContent[tabbableContent.length - 1] || floatingFocusElement;
-          if (floatingUi_utils_dom.isHTMLElement(nodeToFocus)) {
+          if (floatingUi_utils.isHTMLElement(nodeToFocus)) {
             nodeToFocus.focus();
           }
         }
@@ -2449,7 +3069,7 @@ function FloatingFocusManager(props) {
         // Allow closing when `isUntrappedTypeableCombobox` regardless of the previously focused element.
         isUntrappedTypeableCombobox || relatedTarget !== getPreviouslyFocusedElement())) {
           preventReturnFocusRef.current = true;
-          store.setOpen(false, useButton.createChangeEventDetails(useButton.focusOut, event));
+          store.setOpen(false, createChangeEventDetails(focusOut, event));
         }
       });
     }
@@ -2462,11 +3082,11 @@ function FloatingFocusManager(props) {
         dataRef.current.insideReactTree = false;
       });
     }
-    const domReferenceElement = floatingUi_utils_dom.isHTMLElement(domReference) ? domReference : null;
+    const domReferenceElement = floatingUi_utils.isHTMLElement(domReference) ? domReference : null;
     if (!floating && !domReferenceElement) {
       return undefined;
     }
-    return mergeCleanups(domReferenceElement && useButton.addEventListener(domReferenceElement, 'focusout', handleFocusOutside), domReferenceElement && useButton.addEventListener(domReferenceElement, 'pointerdown', handlePointerDown), floating && useButton.addEventListener(floating, 'focusin', handleFocusIn), floating && useButton.addEventListener(floating, 'focusout', handleFocusOutside), floating && portalContext && useButton.addEventListener(floating, 'focusout', markInsideReactTree, true));
+    return mergeCleanups(domReferenceElement && addEventListener(domReferenceElement, 'focusout', handleFocusOutside), domReferenceElement && addEventListener(domReferenceElement, 'pointerdown', handlePointerDown), floating && addEventListener(floating, 'focusin', handleFocusIn), floating && addEventListener(floating, 'focusout', handleFocusOutside), floating && portalContext && addEventListener(floating, 'focusout', markInsideReactTree, true));
   }, [disabled, domReference, floating, floatingFocusElement, modal, tree, portalContext, store, closeOnFocusOut, restoreFocus, getTabbableContent, isUntrappedTypeableCombobox, getNodeId, dataRef, blurTimeout, pointerDownTimeout, restoreFocusFrame, nextFocusableElement, previousFocusableElement, getResolvedInsideElements]);
 
   // Hide everything outside the floating tree from assistive tech while open.
@@ -2480,7 +3100,7 @@ function FloatingFocusManager(props) {
     const ancestors = tree ? getNodeAncestors(tree.nodesRef.current, getNodeId()) : [];
     const rootAncestorComboboxDomReference = ancestors.find(node => isTypeableCombobox(node.context?.elements.domReference || null))?.context?.elements.domReference;
     const controlInsideElements = [floating, ...portalNodes, beforeGuardRef.current, afterGuardRef.current, portalContext?.beforeOutsideRef.current, portalContext?.afterOutsideRef.current, ...getResolvedInsideElements()];
-    const insideElements = [...controlInsideElements, rootAncestorComboboxDomReference, useButton.resolveRef(previousFocusableElement), useButton.resolveRef(nextFocusableElement), isUntrappedTypeableCombobox ? domReference : null].filter(x => x != null);
+    const insideElements = [...controlInsideElements, rootAncestorComboboxDomReference, resolveRef(previousFocusableElement), resolveRef(nextFocusableElement), isUntrappedTypeableCombobox ? domReference : null].filter(x => x != null);
     const ariaHiddenCleanup = markOthers(insideElements, {
       ariaHidden: modal || isUntrappedTypeableCombobox,
       mark: false
@@ -2494,12 +3114,12 @@ function FloatingFocusManager(props) {
   }, [open, disabled, domReference, floating, modal, portalContext, isUntrappedTypeableCombobox, tree, getNodeId, nextFocusableElement, previousFocusableElement, getResolvedInsideElements]);
 
   // Focus the initial element when the floating element opens.
-  useButton.useIsoLayoutEffect(() => {
-    if (!open || disabled || !floatingUi_utils_dom.isHTMLElement(floatingFocusElement)) {
+  useIsoLayoutEffect(() => {
+    if (!open || disabled || !floatingUi_utils.isHTMLElement(floatingFocusElement)) {
       return;
     }
-    const doc = useButton.ownerDocument(floatingFocusElement);
-    const previouslyFocusedElement = useButton.activeElement(doc);
+    const doc = ownerDocument(floatingFocusElement);
+    const previouslyFocusedElement = activeElement(doc);
 
     // Wait for any layout effect state setters to execute to set `tabIndex`.
     queueMicrotask(() => {
@@ -2510,7 +3130,7 @@ function FloatingFocusManager(props) {
       if (resolvedInitialFocus === undefined || resolvedInitialFocus === false) {
         return;
       }
-      const focusAlreadyInsideFloatingEl = useButton.contains(floatingFocusElement, previouslyFocusedElement);
+      const focusAlreadyInsideFloatingEl = contains(floatingFocusElement, previouslyFocusedElement);
       if (focusAlreadyInsideFloatingEl) {
         return;
       }
@@ -2525,10 +3145,10 @@ function FloatingFocusManager(props) {
       if (resolvedInitialFocus === true || resolvedInitialFocus === null) {
         elToFocus = getDefaultFocusElement();
       } else {
-        elToFocus = useButton.resolveRef(resolvedInitialFocus);
+        elToFocus = resolveRef(resolvedInitialFocus);
       }
       elToFocus = elToFocus || getDefaultFocusElement();
-      const hadFocusInside = useButton.contains(floatingFocusElement, useButton.activeElement(doc));
+      const hadFocusInside = contains(floatingFocusElement, activeElement(doc));
       enqueueFocus(elToFocus, {
         preventScroll: elToFocus === floatingFocusElement,
         shouldFocus() {
@@ -2541,8 +3161,8 @@ function FloatingFocusManager(props) {
           if (hadFocusInside) {
             return true;
           }
-          const currentActiveElement = useButton.activeElement(doc);
-          const focusMovedInside = currentActiveElement !== elToFocus && useButton.contains(floatingFocusElement, currentActiveElement);
+          const currentActiveElement = activeElement(doc);
+          const focusMovedInside = currentActiveElement !== elToFocus && contains(floatingFocusElement, currentActiveElement);
           return !focusMovedInside;
         }
       });
@@ -2550,12 +3170,12 @@ function FloatingFocusManager(props) {
   }, [disabled, open, floatingFocusElement, getTabbableContent, initialFocusRef, openInteractionTypeRef, openRef]);
 
   // Track return focus targets and restore focus on unmount/close.
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     if (disabled || !floatingFocusElement) {
       return undefined;
     }
-    const doc = useButton.ownerDocument(floatingFocusElement);
-    const elementFocusedBeforeOpen = useButton.activeElement(doc);
+    const doc = ownerDocument(floatingFocusElement);
+    const elementFocusedBeforeOpen = activeElement(doc);
     // Only nullish interaction types represent programmatic opens. The empty
     // string default is intentionally not treated as programmatic.
     const preferPreviousFocus = openInteractionTypeRef.current == null;
@@ -2567,19 +3187,19 @@ function FloatingFocusManager(props) {
       if (!details.open) {
         closeTypeRef.current = getEventType(details.nativeEvent, lastInteractionTypeRef.current);
       }
-      if (details.reason === useButton.triggerHover && details.nativeEvent.type === 'mouseleave') {
+      if (details.reason === triggerHover && details.nativeEvent.type === 'mouseleave') {
         preventReturnFocusRef.current = true;
       }
-      if (details.reason !== useButton.outsidePress) {
+      if (details.reason !== outsidePress) {
         return;
       }
       if (details.nested) {
         preventReturnFocusRef.current = false;
-      } else if (useButton.isVirtualClick(details.nativeEvent) || useButton.isVirtualPointerEvent(details.nativeEvent)) {
+      } else if (isVirtualClick(details.nativeEvent) || isVirtualPointerEvent(details.nativeEvent)) {
         preventReturnFocusRef.current = false;
       } else {
         let isPreventScrollSupported = false;
-        useButton.ownerDocument(floatingFocusElement).createElement('div').focus({
+        ownerDocument(floatingFocusElement).createElement('div').focus({
           get preventScroll() {
             isPreventScrollSupported = true;
             return false;
@@ -2605,7 +3225,7 @@ function FloatingFocusManager(props) {
         resolvedReturnFocusValue = true;
       }
       const referenceReturnElement = domReference?.isConnected ? domReference : null;
-      const previousReturnElement = elementFocusedBeforeOpen?.isConnected && floatingUi_utils_dom.getNodeName(elementFocusedBeforeOpen) !== 'body' ? elementFocusedBeforeOpen : null;
+      const previousReturnElement = elementFocusedBeforeOpen?.isConnected && floatingUi_utils.getNodeName(elementFocusedBeforeOpen) !== 'body' ? elementFocusedBeforeOpen : null;
       let defaultReturnElement = preferPreviousFocus ? previousReturnElement || referenceReturnElement : referenceReturnElement || previousReturnElement;
       if (!defaultReturnElement) {
         defaultReturnElement = getPreviouslyFocusedElement() || null;
@@ -2613,13 +3233,13 @@ function FloatingFocusManager(props) {
       if (typeof resolvedReturnFocusValue === 'boolean') {
         return defaultReturnElement;
       }
-      return useButton.resolveRef(resolvedReturnFocusValue) || defaultReturnElement || null;
+      return resolveRef(resolvedReturnFocusValue) || defaultReturnElement || null;
     }
     return () => {
       events.off('openchange', onOpenChangeLocal);
-      const activeEl = useButton.activeElement(doc);
+      const activeEl = activeElement(doc);
       const insideElements = getResolvedInsideElements();
-      const isFocusInsideFloatingTree = useButton.contains(floating, activeEl) || insideElements.some(element => element === activeEl || useButton.contains(element, activeEl)) || tree && getNodeChildren(tree.nodesRef.current, getNodeId(), false).some(node => useButton.contains(node.context?.elements.floating, activeEl));
+      const isFocusInsideFloatingTree = contains(floating, activeEl) || insideElements.some(element => element === activeEl || contains(element, activeEl)) || tree && getNodeChildren(tree.nodesRef.current, getNodeId(), false).some(node => contains(node.context?.elements.floating, activeEl));
 
       // eslint-disable-next-line react-hooks/exhaustive-deps
       const returnFocusValueOrFn = returnFocusRef.current;
@@ -2628,7 +3248,7 @@ function FloatingFocusManager(props) {
         // This is `returnElement`, if it's tabbable, or its first tabbable child.
         const tabbableReturnElement = getFirstTabbableElement(returnElement);
         const hasExplicitReturnFocus = typeof returnFocusValueOrFn !== 'boolean';
-        if (returnFocusValueOrFn && !preventReturnFocusRef.current && floatingUi_utils_dom.isHTMLElement(tabbableReturnElement) && (
+        if (returnFocusValueOrFn && !preventReturnFocusRef.current && floatingUi_utils.isHTMLElement(tabbableReturnElement) && (
         // If the focus moved somewhere else after mount, avoid returning focus
         // since it likely entered a different element which should be
         // respected: https://github.com/floating-ui/floating-ui/issues/2607
@@ -2645,22 +3265,22 @@ function FloatingFocusManager(props) {
   // Safari may randomly scroll to the bottom of the page if an input inside a popup has focus
   // when the popup unmounts from the DOM.
   // By blurring it before the popup unmounts, we can prevent this behavior.
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     if (!webkit || open || !floating) {
       return;
     }
-    const activeEl = useButton.activeElement(useButton.ownerDocument(floating));
-    if (!floatingUi_utils_dom.isHTMLElement(activeEl) || !isTypeableElement(activeEl)) {
+    const activeEl = activeElement(ownerDocument(floating));
+    if (!floatingUi_utils.isHTMLElement(activeEl) || !isTypeableElement(activeEl)) {
       return;
     }
-    if (useButton.contains(floating, activeEl)) {
+    if (contains(floating, activeEl)) {
       activeEl.blur();
     }
   }, [open, floating]);
 
   // Synchronize the `context` & `modal` value to the FloatingPortal context.
   // It will decide whether or not it needs to render its own guards.
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     if (disabled || !portalContext) {
       return undefined;
     }
@@ -2677,7 +3297,7 @@ function FloatingFocusManager(props) {
   }, [disabled, portalContext, modal, open, store, closeOnFocusOut, domReference]);
 
   // Keep the floating element tabIndex in sync and clear stale focus records.
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     if (disabled || !floatingFocusElement) {
       return undefined;
     }
@@ -2701,7 +3321,7 @@ function FloatingFocusManager(props) {
             const nextTabbable = getNextTabbable(domReference);
             nextTabbable?.focus();
           } else {
-            useButton.resolveRef(previousFocusableElement ?? portalContext.beforeOutsideRef)?.focus();
+            resolveRef(previousFocusableElement ?? portalContext.beforeOutsideRef)?.focus();
           }
         }
       }
@@ -2719,7 +3339,7 @@ function FloatingFocusManager(props) {
             const prevTabbable = getPreviousTabbable(domReference);
             prevTabbable?.focus();
           } else {
-            useButton.resolveRef(nextFocusableElement ?? portalContext.afterOutsideRef)?.focus();
+            resolveRef(nextFocusableElement ?? portalContext.afterOutsideRef)?.focus();
           }
         }
       }
@@ -2739,16 +3359,16 @@ function useClick(context, props = {}) {
     ignoreMouse = false,
     stickIfOpen = true,
     touchOpenDelay = 0,
-    reason = useButton.triggerPress
+    reason = triggerPress
   } = props;
   const store = 'rootStore' in context ? context.rootStore : context;
   const dataRef = store.context.dataRef;
   const pointerTypeRef = React__namespace.useRef(undefined);
-  const frame = useButton.useAnimationFrame();
-  const touchOpenTimeout = useButton.useTimeout();
+  const frame = useAnimationFrame();
+  const touchOpenTimeout = useTimeout();
   const reference = React__namespace.useMemo(() => {
     function setOpenWithTouchDelay(nextOpen, nativeEvent, target, pointerType) {
-      const details = useButton.createChangeEventDetails(reason, nativeEvent, target);
+      const details = createChangeEventDetails(reason, nativeEvent, target);
       if (nextOpen && pointerType === 'touch' && touchOpenDelay > 0) {
         touchOpenTimeout.start(touchOpenDelay, () => {
           store.setOpen(true, details);
@@ -2791,14 +3411,14 @@ function useClick(context, props = {}) {
 
         // Ignore all buttons except for the "main" button.
         // https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button
-        if (event.button !== 0 || eventOption === 'click' || useButton.isMouseLikePointerType(pointerType, true) && ignoreMouse) {
+        if (event.button !== 0 || eventOption === 'click' || isMouseLikePointerType(pointerType, true) && ignoreMouse) {
           return;
         }
         const nextOpen = getNextOpen(open, event.currentTarget, openEventType => openEventType === 'click' || openEventType === 'mousedown');
 
         // Animations sometimes won't run on a typeable element if using a rAF.
         // Focus is always set on these elements. For touch, we may delay opening.
-        const target = useButton.getTarget(nativeEvent);
+        const target = getTarget(nativeEvent);
         if (isTypeableElement(target)) {
           setOpenWithTouchDelay(nextOpen, nativeEvent, target, pointerType);
           return;
@@ -2823,7 +3443,7 @@ function useClick(context, props = {}) {
           pointerTypeRef.current = undefined;
           return;
         }
-        if (useButton.isMouseLikePointerType(pointerType, true) && ignoreMouse) {
+        if (isMouseLikePointerType(pointerType, true) && ignoreMouse) {
           return;
         }
         const open = store.select('open');
@@ -2857,7 +3477,7 @@ function normalizeProp(normalizable) {
 function useDismiss(context, props = {}) {
   const {
     enabled = true,
-    escapeKey = true,
+    escapeKey: escapeKey$1 = true,
     outsidePress: outsidePressProp = true,
     outsidePressEvent = 'sloppy',
     referencePress = alwaysFalse,
@@ -2871,10 +3491,10 @@ function useDismiss(context, props = {}) {
     dataRef
   } = store.context;
   const tree = useFloatingTree(externalTree);
-  const outsidePressFn = useButton.useStableCallback(typeof outsidePressProp === 'function' ? outsidePressProp : () => false);
-  const outsidePress = typeof outsidePressProp === 'function' ? outsidePressFn : outsidePressProp;
-  const outsidePressEnabled = outsidePress !== false;
-  const getOutsidePressEventProp = useButton.useStableCallback(() => outsidePressEvent);
+  const outsidePressFn = useStableCallback(typeof outsidePressProp === 'function' ? outsidePressProp : () => false);
+  const outsidePress$1 = typeof outsidePressProp === 'function' ? outsidePressFn : outsidePressProp;
+  const outsidePressEnabled = outsidePress$1 !== false;
+  const getOutsidePressEventProp = useStableCallback(() => outsidePressEvent);
   const {
     escapeKey: escapeKeyBubbles,
     outsidePress: outsidePressBubbles
@@ -2886,28 +3506,28 @@ function useDismiss(context, props = {}) {
   const isComposingRef = React__namespace.useRef(false);
   const currentPointerTypeRef = React__namespace.useRef('');
   const touchStateRef = React__namespace.useRef(null);
-  const cancelDismissOnEndTimeout = useButton.useTimeout();
-  const clearInsideReactTreeTimeout = useButton.useTimeout();
-  const clearInsideReactTree = useButton.useStableCallback(() => {
+  const cancelDismissOnEndTimeout = useTimeout();
+  const clearInsideReactTreeTimeout = useTimeout();
+  const clearInsideReactTree = useStableCallback(() => {
     clearInsideReactTreeTimeout.clear();
     dataRef.current.insideReactTree = false;
   });
-  const hasBlockingChild = useButton.useStableCallback(bubbleKey => {
+  const hasBlockingChild = useStableCallback(bubbleKey => {
     const nodeId = dataRef.current.floatingContext?.nodeId;
     const children = tree ? getNodeChildren(tree.nodesRef.current, nodeId) : [];
     return children.some(child => child.context?.open && !child.context.dataRef.current[bubbleKey]);
   });
-  const isEventWithinOwnElements = useButton.useStableCallback(event => {
+  const isEventWithinOwnElements = useStableCallback(event => {
     return isEventTargetWithin(event, store.select('floatingElement')) || isEventTargetWithin(event, store.select('domReferenceElement'));
   });
-  const closeOnReferencePress = useButton.useStableCallback(event => {
+  const closeOnReferencePress = useStableCallback(event => {
     if (!referencePress()) {
       return;
     }
-    store.setOpen(false, useButton.createChangeEventDetails(useButton.triggerPress, event.nativeEvent));
+    store.setOpen(false, createChangeEventDetails(triggerPress, event.nativeEvent));
   });
-  const closeOnEscapeKeyDown = useButton.useStableCallback(event => {
-    if (!open || !enabled || !escapeKey || event.key !== 'Escape') {
+  const closeOnEscapeKeyDown = useStableCallback(event => {
+    if (!open || !enabled || !escapeKey$1 || event.key !== 'Escape') {
       return;
     }
 
@@ -2919,8 +3539,8 @@ function useDismiss(context, props = {}) {
     if (!escapeKeyBubbles && hasBlockingChild('__escapeKeyBubbles')) {
       return;
     }
-    const native = useButton.isReactEvent(event) ? event.nativeEvent : event;
-    const eventDetails = useButton.createChangeEventDetails(useButton.escapeKey, native);
+    const native = isReactEvent(event) ? event.nativeEvent : event;
+    const eventDetails = createChangeEventDetails(escapeKey, native);
     store.setOpen(false, eventDetails);
     if (!eventDetails.isCanceled) {
       event.preventDefault();
@@ -2929,19 +3549,19 @@ function useDismiss(context, props = {}) {
       event.stopPropagation();
     }
   });
-  const markInsideReactTree = useButton.useStableCallback(() => {
+  const markInsideReactTree = useStableCallback(() => {
     dataRef.current.insideReactTree = true;
     clearInsideReactTreeTimeout.start(0, clearInsideReactTree);
   });
-  const markPressStartedInsideReactTree = useButton.useStableCallback(event => {
+  const markPressStartedInsideReactTree = useStableCallback(event => {
     if (!open || !enabled || event.button !== 0) {
       return;
     }
-    const target = useButton.getTarget(event.nativeEvent);
+    const target = getTarget(event.nativeEvent);
 
     // Only treat presses that start within the floating DOM subtree as inside.
     // This avoids suppressing parent dismissal when interacting with nested portals.
-    if (!useButton.contains(store.select('floatingElement'), target)) {
+    if (!contains(store.select('floatingElement'), target)) {
       return;
     }
     if (!pressStartedInsideRef.current) {
@@ -2949,7 +3569,7 @@ function useDismiss(context, props = {}) {
       pressStartPreventedRef.current = false;
     }
   });
-  const markInsidePressStartPrevented = useButton.useStableCallback(event => {
+  const markInsidePressStartPrevented = useStableCallback(event => {
     if (!open || !enabled) {
       return;
     }
@@ -2966,8 +3586,8 @@ function useDismiss(context, props = {}) {
     }
     dataRef.current.__escapeKeyBubbles = escapeKeyBubbles;
     dataRef.current.__outsidePressBubbles = outsidePressBubbles;
-    const compositionTimeout = new useButton.Timeout();
-    const preventedPressSuppressionTimeout = new useButton.Timeout();
+    const compositionTimeout = new Timeout();
+    const preventedPressSuppressionTimeout = new Timeout();
     function handleCompositionStart() {
       compositionTimeout.clear();
       isComposingRef.current = true;
@@ -3029,20 +3649,20 @@ function useDismiss(context, props = {}) {
         clearInsideReactTree();
         return;
       }
-      const target = useButton.getTarget(event);
+      const target = getTarget(event);
       const inertSelector = `[${createAttribute('inert')}]`;
-      const targetRoot = floatingUi_utils_dom.isElement(target) ? target.getRootNode() : null;
-      const markers = Array.from((floatingUi_utils_dom.isShadowRoot(targetRoot) ? targetRoot : useButton.ownerDocument(store.select('floatingElement'))).querySelectorAll(inertSelector));
+      const targetRoot = floatingUi_utils.isElement(target) ? target.getRootNode() : null;
+      const markers = Array.from((floatingUi_utils.isShadowRoot(targetRoot) ? targetRoot : ownerDocument(store.select('floatingElement'))).querySelectorAll(inertSelector));
       const triggers = store.context.triggerElements;
 
       // If another trigger is clicked, don't close the floating element.
-      if (target && (triggers.hasElement(target) || triggers.hasMatchingElement(trigger => useButton.contains(trigger, target)))) {
+      if (target && (triggers.hasElement(target) || triggers.hasMatchingElement(trigger => contains(trigger, target)))) {
         return;
       }
-      let targetRootAncestor = floatingUi_utils_dom.isElement(target) ? target : null;
-      while (targetRootAncestor && !floatingUi_utils_dom.isLastTraversableNode(targetRootAncestor)) {
-        const nextParent = floatingUi_utils_dom.getParentNode(targetRootAncestor);
-        if (floatingUi_utils_dom.isLastTraversableNode(nextParent) || !floatingUi_utils_dom.isElement(nextParent)) {
+      let targetRootAncestor = floatingUi_utils.isElement(target) ? target : null;
+      while (targetRootAncestor && !floatingUi_utils.isLastTraversableNode(targetRootAncestor)) {
+        const nextParent = floatingUi_utils.getParentNode(targetRootAncestor);
+        if (floatingUi_utils.isLastTraversableNode(nextParent) || !floatingUi_utils.isElement(nextParent)) {
           break;
         }
         targetRootAncestor = nextParent;
@@ -3050,20 +3670,20 @@ function useDismiss(context, props = {}) {
 
       // Check if the click occurred on a third-party element injected after the
       // floating element rendered.
-      if (markers.length && floatingUi_utils_dom.isElement(target) && !isRootElement(target) &&
+      if (markers.length && floatingUi_utils.isElement(target) && !isRootElement(target) &&
       // Clicked on a direct ancestor (e.g. FloatingOverlay).
-      !useButton.contains(target, store.select('floatingElement')) &&
+      !contains(target, store.select('floatingElement')) &&
       // If the target root element contains none of the markers, then the
       // element was injected after the floating element rendered.
-      markers.every(marker => !useButton.contains(targetRootAncestor, marker))) {
+      markers.every(marker => !contains(targetRootAncestor, marker))) {
         return;
       }
 
       // Check if the click occurred on the scrollbar
       // Skip for touch events: scrollbars don't receive touch events on most platforms
-      if (floatingUi_utils_dom.isHTMLElement(target) && !('touches' in event)) {
-        const lastTraversableNode = floatingUi_utils_dom.isLastTraversableNode(target);
-        const style = floatingUi_utils_dom.getComputedStyle(target);
+      if (floatingUi_utils.isHTMLElement(target) && !('touches' in event)) {
+        const lastTraversableNode = floatingUi_utils.isLastTraversableNode(target);
+        const style = floatingUi_utils.getComputedStyle(target);
         const scrollRe = /auto|scroll/;
         const isScrollableX = lastTraversableNode || scrollRe.test(style.overflowX);
         const isScrollableY = lastTraversableNode || scrollRe.test(style.overflowY);
@@ -3094,13 +3714,13 @@ function useDismiss(context, props = {}) {
         suppressNextOutsideClickRef.current = false;
         return;
       }
-      if (typeof outsidePress === 'function' && !outsidePress(event)) {
+      if (typeof outsidePress$1 === 'function' && !outsidePress$1(event)) {
         return;
       }
       if (hasBlockingChild('__outsidePressBubbles')) {
         return;
       }
-      store.setOpen(false, useButton.createChangeEventDetails(useButton.outsidePress, event));
+      store.setOpen(false, createChangeEventDetails(outsidePress, event));
       clearInsideReactTree();
     }
     function handlePointerDown(event) {
@@ -3131,11 +3751,11 @@ function useDismiss(context, props = {}) {
       }
     }
     function addTargetEventListenerOnce(event, listener) {
-      const target = useButton.getTarget(event);
+      const target = getTarget(event);
       if (!target) {
         return;
       }
-      const unsubscribe = useButton.addEventListener(target, event.type, () => {
+      const unsubscribe = addEventListener(target, event.type, () => {
         listener(event);
         unsubscribe();
       });
@@ -3189,7 +3809,7 @@ function useDismiss(context, props = {}) {
       }
 
       // Avoid suppressing when outsidePress explicitly ignores this target.
-      if (typeof outsidePress === 'function' && !outsidePress(event)) {
+      if (typeof outsidePress$1 === 'function' && !outsidePress$1(event)) {
         return;
       }
       preventedPressSuppressionTimeout.clear();
@@ -3232,8 +3852,8 @@ function useDismiss(context, props = {}) {
     function handleTouchEndCapture(event) {
       addTargetEventListenerOnce(event, handleTouchEnd);
     }
-    const doc = useButton.ownerDocument(floatingElement);
-    const unsubscribe = mergeCleanups(escapeKey && mergeCleanups(useButton.addEventListener(doc, 'keydown', closeOnEscapeKeyDown), useButton.addEventListener(doc, 'compositionstart', handleCompositionStart), useButton.addEventListener(doc, 'compositionend', handleCompositionEnd)), outsidePressEnabled && mergeCleanups(useButton.addEventListener(doc, 'click', closeOnPressOutsideCapture, true), useButton.addEventListener(doc, 'pointerdown', closeOnPressOutsideCapture, true), useButton.addEventListener(doc, 'pointerup', handlePressEndCapture, true), useButton.addEventListener(doc, 'pointercancel', handlePressEndCapture, true), useButton.addEventListener(doc, 'mousedown', closeOnPressOutsideCapture, true), useButton.addEventListener(doc, 'mouseup', handlePressEndCapture, true), useButton.addEventListener(doc, 'touchstart', handleTouchStartCapture, true), useButton.addEventListener(doc, 'touchmove', handleTouchMoveCapture, true), useButton.addEventListener(doc, 'touchend', handleTouchEndCapture, true)));
+    const doc = ownerDocument(floatingElement);
+    const unsubscribe = mergeCleanups(escapeKey$1 && 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)));
     return () => {
       unsubscribe();
       compositionTimeout.clear();
@@ -3241,8 +3861,8 @@ function useDismiss(context, props = {}) {
       resetPressStartState();
       suppressNextOutsideClickRef.current = false;
     };
-  }, [dataRef, floatingElement, escapeKey, outsidePressEnabled, outsidePress, open, enabled, escapeKeyBubbles, outsidePressBubbles, closeOnEscapeKeyDown, clearInsideReactTree, getOutsidePressEventProp, hasBlockingChild, isEventWithinOwnElements, tree, store, cancelDismissOnEndTimeout]);
-  React__namespace.useEffect(clearInsideReactTree, [outsidePress, clearInsideReactTree]);
+  }, [dataRef, floatingElement, escapeKey$1, outsidePressEnabled, outsidePress$1, open, enabled, escapeKeyBubbles, outsidePressBubbles, closeOnEscapeKeyDown, clearInsideReactTree, getOutsidePressEventProp, hasBlockingChild, isEventWithinOwnElements, tree, store, cancelDismissOnEndTimeout]);
+  React__namespace.useEffect(clearInsideReactTree, [outsidePress$1, clearInsideReactTree]);
   const reference = React__namespace.useMemo(() => ({
     onKeyDown: closeOnEscapeKeyDown,
     onPointerDown: closeOnReferencePress,
@@ -3315,7 +3935,7 @@ class FloatingRootStore extends ReactStore {
     if (!newOpen || !this.state.open ||
     // Prevent a pending hover-open from overwriting a click-open event, while allowing
     // click events to upgrade a hover-open.
-    event != null && useButton.isClickLikeEvent(event)) {
+    event != null && isClickLikeEvent(event)) {
       this.context.dataRef.current.openEvent = newOpen ? event : undefined;
     }
   };
@@ -3385,14 +4005,14 @@ function useSyncedFloatingRootContext(options) {
   }
   const store = floatingRootContextProp ?? internalStoreRef.current;
   popupStore.useSyncedValue('floatingId', floatingId);
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     const valuesToSync = {
       open,
       floatingId,
       referenceElement,
       floatingElement
     };
-    if (floatingUi_utils_dom.isElement(referenceElement)) {
+    if (floatingUi_utils.isElement(referenceElement)) {
       valuesToSync.domReferenceElement = referenceElement;
     }
     if (store.state.positionReference === store.state.referenceElement) {
@@ -3407,6 +4027,204 @@ function useSyncedFloatingRootContext(options) {
   return store;
 }
 
+/**
+ * Provides a status string for CSS animations.
+ * @param open - a boolean that determines if the element is open.
+ * @param enableIdleState - a boolean that enables the `'idle'` state between `'starting'` and `'ending'`
+ */
+function useTransitionStatus(open, enableIdleState = false, deferEndingState = false) {
+  const [transitionStatus, setTransitionStatus] = React__namespace.useState(open && enableIdleState ? 'idle' : undefined);
+  const [mounted, setMounted] = React__namespace.useState(open);
+  if (open && !mounted) {
+    setMounted(true);
+    setTransitionStatus('starting');
+  }
+  if (!open && mounted && transitionStatus !== 'ending' && !deferEndingState) {
+    setTransitionStatus('ending');
+  }
+  if (!open && !mounted && transitionStatus === 'ending') {
+    setTransitionStatus(undefined);
+  }
+  useIsoLayoutEffect(() => {
+    if (!open && mounted && transitionStatus !== 'ending' && deferEndingState) {
+      const frame = AnimationFrame.request(() => {
+        setTransitionStatus('ending');
+      });
+      return () => {
+        AnimationFrame.cancel(frame);
+      };
+    }
+    return undefined;
+  }, [open, mounted, transitionStatus, deferEndingState]);
+  useIsoLayoutEffect(() => {
+    if (!open || enableIdleState) {
+      return undefined;
+    }
+    const frame = AnimationFrame.request(() => {
+      // Avoid `flushSync` here due to Firefox.
+      // See https://github.com/mui/base-ui/pull/3424
+      setTransitionStatus(undefined);
+    });
+    return () => {
+      AnimationFrame.cancel(frame);
+    };
+  }, [enableIdleState, open]);
+  useIsoLayoutEffect(() => {
+    if (!open || !enableIdleState) {
+      return undefined;
+    }
+    if (open && mounted && transitionStatus !== 'idle') {
+      setTransitionStatus('starting');
+    }
+    const frame = AnimationFrame.request(() => {
+      setTransitionStatus('idle');
+    });
+    return () => {
+      AnimationFrame.cancel(frame);
+    };
+  }, [enableIdleState, open, mounted, transitionStatus]);
+  return {
+    mounted,
+    setMounted,
+    transitionStatus
+  };
+}
+
+let TransitionStatusDataAttributes = /*#__PURE__*/function (TransitionStatusDataAttributes) {
+  /**
+   * Present when the component is animating in.
+   */
+  TransitionStatusDataAttributes["startingStyle"] = "data-starting-style";
+  /**
+   * Present when the component is animating out.
+   */
+  TransitionStatusDataAttributes["endingStyle"] = "data-ending-style";
+  return TransitionStatusDataAttributes;
+}({});
+const STARTING_HOOK = {
+  [TransitionStatusDataAttributes.startingStyle]: ''
+};
+const ENDING_HOOK = {
+  [TransitionStatusDataAttributes.endingStyle]: ''
+};
+const transitionStatusMapping = {
+  transitionStatus(value) {
+    if (value === 'starting') {
+      return STARTING_HOOK;
+    }
+    if (value === 'ending') {
+      return ENDING_HOOK;
+    }
+    return null;
+  }
+};
+
+/**
+ * Executes a function once all animations have finished on the provided element.
+ * @param elementOrRef - The element to watch for animations.
+ * @param waitForStartingStyleRemoved - Whether to wait for [data-starting-style] to be removed before checking for animations.
+ * @param treatAbortedAsFinished - Whether to treat aborted animations as finished. If `false`, and there are aborted animations,
+ *   the function will check again if any new animations have started and wait for them to finish.
+ * @returns A function that takes a callback to execute once all animations have finished, and an optional AbortSignal to abort the callback
+ */
+function useAnimationsFinished(elementOrRef, waitForStartingStyleRemoved = false, treatAbortedAsFinished = true) {
+  const frame = useAnimationFrame();
+  return useStableCallback((fnToExecute,
+  /**
+   * An optional [AbortSignal](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal) that
+   * can be used to abort `fnToExecute` before all the animations have finished.
+   * @default null
+   */
+  signal = null) => {
+    frame.cancel();
+    const element = resolveRef(elementOrRef);
+    if (element == null) {
+      return;
+    }
+    const resolvedElement = element;
+    const done = () => {
+      // Synchronously flush the unmounting of the component so that the browser doesn't
+      // paint: https://github.com/mui/base-ui/issues/979
+      ReactDOM__namespace.flushSync(fnToExecute);
+    };
+    if (typeof resolvedElement.getAnimations !== 'function' || globalThis.BASE_UI_ANIMATIONS_DISABLED) {
+      fnToExecute();
+      return;
+    }
+    function exec() {
+      Promise.all(resolvedElement.getAnimations().map(animation => animation.finished)).then(() => {
+        if (!signal?.aborted) {
+          done();
+        }
+      }).catch(() => {
+        if (treatAbortedAsFinished) {
+          if (!signal?.aborted) {
+            done();
+          }
+          return;
+        }
+        const currentAnimations = resolvedElement.getAnimations();
+        if (!signal?.aborted && currentAnimations.length > 0 && currentAnimations.some(animation => animation.pending || animation.playState !== 'finished')) {
+          // Sometimes animations can be aborted because a property they depend on changes while the animation plays.
+          // In such cases, we need to re-check if any new animations have started.
+          exec();
+        }
+      });
+    }
+    if (waitForStartingStyleRemoved) {
+      const startingStyleAttribute = TransitionStatusDataAttributes.startingStyle;
+
+      // If `[data-starting-style]` isn't present, fall back to waiting one more frame
+      // to give "open" animations a chance to be registered.
+      if (!resolvedElement.hasAttribute(startingStyleAttribute)) {
+        frame.request(exec);
+        return;
+      }
+
+      // Wait for `[data-starting-style]` to have been removed.
+      const attributeObserver = new MutationObserver(() => {
+        if (!resolvedElement.hasAttribute(startingStyleAttribute)) {
+          attributeObserver.disconnect();
+          exec();
+        }
+      });
+      attributeObserver.observe(resolvedElement, {
+        attributes: true,
+        attributeFilter: [startingStyleAttribute]
+      });
+      signal?.addEventListener('abort', () => attributeObserver.disconnect(), {
+        once: true
+      });
+      return;
+    }
+    frame.request(exec);
+  });
+}
+
+/**
+ * Calls the provided function when the CSS open/close animation or transition completes.
+ */
+function useOpenChangeComplete(parameters) {
+  const {
+    enabled = true,
+    open,
+    ref,
+    onComplete: onCompleteParam
+  } = parameters;
+  const onComplete = useStableCallback(onCompleteParam);
+  const runOnceAnimationsFinish = useAnimationsFinished(ref, open, false);
+  React__namespace.useEffect(() => {
+    if (!enabled) {
+      return undefined;
+    }
+    const abortController = new AbortController();
+    runOnceAnimationsFinish(onComplete, abortController.signal);
+    return () => {
+      abortController.abort();
+    };
+  }, [enabled, open, onComplete, runOnceAnimationsFinish]);
+}
+
 const FOCUSABLE_POPUP_PROPS = {
   tabIndex: -1,
   [FOCUSABLE_ATTRIBUTE]: ''
@@ -3421,7 +4239,7 @@ function createDefaultInitialFocus(popupRef) {
   return interactionType => interactionType === 'touch' ? popupRef.current : true;
 }
 function usePopupStore(externalStore, createStore, treatPopupAsFloatingElement = false) {
-  const floatingId = useButton.useId();
+  const floatingId = useId();
   const nested = useFloatingParentNodeId() != null;
   const internalStoreRef = React__namespace.useRef(null);
   if (externalStore === undefined && internalStoreRef.current === null) {
@@ -3529,7 +4347,7 @@ function useInitialOpenSync(store, openProp, defaultOpen, defaultTriggerId) {
 function useTriggerDataForwarding(triggerId, triggerElementRef, store, stateUpdates) {
   const isMountedByThisTrigger = store.useState('isMountedByTrigger', triggerId);
   const baseRegisterTrigger = useTriggerRegistration(triggerId, store);
-  const registerTrigger = useButton.useStableCallback(element => {
+  const registerTrigger = useStableCallback(element => {
     baseRegisterTrigger(element);
     if (!element) {
       return;
@@ -3554,7 +4372,7 @@ function useTriggerDataForwarding(triggerId, triggerElementRef, store, stateUpda
       });
     }
   });
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     if (isMountedByThisTrigger) {
       store.update({
         activeTriggerElement: triggerElementRef.current,
@@ -3591,7 +4409,7 @@ function useImplicitActiveTrigger(store, options = {}) {
   } = options;
   const open = store.useState('open');
   const reactiveTriggerCount = store.useState('triggerCount');
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     if (!open) {
       if (store.state.triggerCount !== 0) {
         store.set('triggerCount', 0);
@@ -3629,7 +4447,7 @@ function useImplicitActiveTrigger(store, options = {}) {
         // Defer so a same-tick replacement trigger with the same id can register first.
         queueMicrotask(() => {
           if (store.select('open') && store.select('activeTriggerId') === lostActiveTriggerId && !store.context.triggerElements.getById(lostActiveTriggerId)) {
-            const eventDetails = useButton.createChangeEventDetails(useButton.none);
+            const eventDetails = createChangeEventDetails(none);
             store.setOpen(false, eventDetails);
             // If closing is canceled, keep the previous active trigger ownership for the
             // still-open popup instead of claiming another trigger implicitly.
@@ -3662,7 +4480,7 @@ function useOpenStateTransitions(open, store, onUnmount) {
     mounted,
     setMounted,
     transitionStatus
-  } = useButton.useTransitionStatus(open);
+  } = useTransitionStatus(open);
   const preventUnmountingOnClose = store.useState('preventUnmountingOnClose');
   // Opening starts a new close cycle. Clear during render so the close-completion hook below
   // reads the synchronized value on the same pass.
@@ -3672,7 +4490,7 @@ function useOpenStateTransitions(open, store, onUnmount) {
     transitionStatus,
     preventUnmountingOnClose: syncedPreventUnmountingOnClose
   });
-  const forceUnmount = useButton.useStableCallback(() => {
+  const forceUnmount = useStableCallback(() => {
     setMounted(false);
     store.update({
       activeTriggerId: null,
@@ -3683,7 +4501,7 @@ function useOpenStateTransitions(open, store, onUnmount) {
     onUnmount?.();
     store.context.onOpenChangeComplete?.(false);
   });
-  useButton.useOpenChangeComplete({
+  useOpenChangeComplete({
     enabled: mounted && !open && !syncedPreventUnmountingOnClose,
     open,
     ref: store.context.popupRef,
@@ -3700,7 +4518,7 @@ function useOpenStateTransitions(open, store, onUnmount) {
 }
 function usePopupInteractionProps(store, statePart) {
   store.useSyncedValues(statePart);
-  useButton.useIsoLayoutEffect(() => () => {
+  useIsoLayoutEffect(() => () => {
     store.update({
       activeTriggerProps: useRenderElement.EMPTY_OBJECT,
       inactiveTriggerProps: useRenderElement.EMPTY_OBJECT,
@@ -3709,12 +4527,12 @@ function usePopupInteractionProps(store, statePart) {
   }, [store]);
 }
 function usePopupRootSync(store, open) {
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     if (!open && store.state.openMethod !== null) {
       store.set('openMethod', null);
     }
   }, [open, store]);
-  useButton.useIsoLayoutEffect(() => () => {
+  useIsoLayoutEffect(() => () => {
     if (store.state.openMethod !== null) {
       store.set('openMethod', null);
     }
@@ -3816,6 +4634,15 @@ class PopupTriggerMap {
   }
 }
 
+/**
+ * Wraps `useId` and prefixes generated `id`s with `base-ui-`
+ * @param {string | undefined} idOverride overrides the generated id when provided
+ * @returns {string | undefined}
+ */
+function useBaseUiId(idOverride) {
+  return useId(idOverride, 'base-ui');
+}
+
 /**
  * Provides a cross-browser way to determine the type of the pointer used to click.
  * Safari and Firefox do not provide the PointerEvent to the click handler (they use MouseEvent) yet.
@@ -3852,15 +4679,29 @@ function useEnhancedClickHandler(handler) {
   };
 }
 
+function useValueChanged(value, onChange) {
+  const valueRef = React__namespace.useRef(value);
+  const onChangeCallback = useStableCallback(onChange);
+  useIsoLayoutEffect(() => {
+    if (valueRef.current === value) {
+      return;
+    }
+    onChangeCallback(valueRef.current);
+  }, [value, onChangeCallback]);
+  useIsoLayoutEffect(() => {
+    valueRef.current = value;
+  }, [value]);
+}
+
 function useOpenMethodTriggerProps(open, setOpenMethod) {
-  const handleTriggerClick = useButton.useStableCallback((_, interactionType) => {
+  const handleTriggerClick = useStableCallback((_, interactionType) => {
     const isOpen = typeof open === 'function' ? open() : open;
     if (!isOpen) {
       setOpenMethod(interactionType || (
       // On iOS Safari, the hitslop around touch targets means tapping outside an element's
       // bounds does not fire `pointerdown` but does fire `mousedown`. The `interactionType`
       // will be "" in that case.
-      useButton.ios ? 'touch' : ''));
+      ios ? 'touch' : ''));
     }
   });
   const {
@@ -3881,7 +4722,7 @@ function useOpenMethodTriggerProps(open, setOpenMethod) {
 function useOpenInteractionType(open) {
   const [openMethod, setOpenMethod] = React__namespace.useState(null);
   const triggerProps = useOpenMethodTriggerProps(open, setOpenMethod);
-  useButton.useValueChanged(open, previousOpen => {
+  useValueChanged(open, previousOpen => {
     if (previousOpen && !open) {
       setOpenMethod(null);
     }
@@ -3902,6 +4743,228 @@ function useDirection() {
   return context?.direction ?? 'ltr';
 }
 
+const CompositeRootContext = /*#__PURE__*/React__namespace.createContext(undefined);
+if (process.env.NODE_ENV !== "production") CompositeRootContext.displayName = "CompositeRootContext";
+function useCompositeRootContext(optional = false) {
+  const context = React__namespace.useContext(CompositeRootContext);
+  if (context === undefined && !optional) {
+    throw new Error(process.env.NODE_ENV !== "production" ? 'Base UI: CompositeRootContext is missing. Composite parts must be placed within <Composite.Root>.' : useRenderElement.formatErrorMessage(16));
+  }
+  return context;
+}
+
+function useFocusableWhenDisabled(parameters) {
+  const {
+    focusableWhenDisabled,
+    disabled,
+    composite = false,
+    tabIndex: tabIndexProp = 0,
+    isNativeButton
+  } = parameters;
+  const isFocusableComposite = composite && focusableWhenDisabled !== false;
+  const isNonFocusableComposite = composite && focusableWhenDisabled === false;
+
+  // we can't explicitly assign `undefined` to any of these props because it
+  // would otherwise prevent subsequently merged props from setting them
+  const props = React__namespace.useMemo(() => {
+    const additionalProps = {
+      // allow Tabbing away from focusableWhenDisabled elements
+      onKeyDown(event) {
+        if (disabled && focusableWhenDisabled && event.key !== 'Tab') {
+          event.preventDefault();
+        }
+      }
+    };
+    if (!composite) {
+      additionalProps.tabIndex = tabIndexProp;
+      if (!isNativeButton && disabled) {
+        additionalProps.tabIndex = focusableWhenDisabled ? tabIndexProp : -1;
+      }
+    }
+    if (isNativeButton && (focusableWhenDisabled || isFocusableComposite) || !isNativeButton && disabled) {
+      additionalProps['aria-disabled'] = disabled;
+    }
+    if (isNativeButton && (!focusableWhenDisabled || isNonFocusableComposite)) {
+      additionalProps.disabled = disabled;
+    }
+    return additionalProps;
+  }, [composite, disabled, focusableWhenDisabled, isFocusableComposite, isNonFocusableComposite, isNativeButton, tabIndexProp]);
+  return {
+    props
+  };
+}
+
+function useButton(parameters = {}) {
+  const {
+    disabled = false,
+    focusableWhenDisabled,
+    tabIndex = 0,
+    native: isNativeButton = true,
+    composite: compositeProp
+  } = parameters;
+  const elementRef = React__namespace.useRef(null);
+  const compositeRootContext = useCompositeRootContext(true);
+  const isCompositeItem = compositeProp ?? compositeRootContext !== undefined;
+  const {
+    props: focusableWhenDisabledProps
+  } = useFocusableWhenDisabled({
+    focusableWhenDisabled,
+    disabled,
+    composite: isCompositeItem,
+    tabIndex,
+    isNativeButton
+  });
+  if (process.env.NODE_ENV !== 'production') {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React__namespace.useEffect(() => {
+      if (!elementRef.current) {
+        return;
+      }
+      const isButtonTag = isButtonElement(elementRef.current);
+      if (isNativeButton) {
+        if (!isButtonTag) {
+          const ownerStackMessage = SafeReact.captureOwnerStack?.() || '';
+          const message = 'A component that acts as a button expected a native <button> because the ' + '`nativeButton` prop is true. Rendering a non-<button> removes native button ' + 'semantics, which can impact forms and accessibility. Use a real <button> in the ' + '`render` prop, or set `nativeButton` to `false`.';
+          error(`${message}${ownerStackMessage}`);
+        }
+      } else if (isButtonTag) {
+        const ownerStackMessage = SafeReact.captureOwnerStack?.() || '';
+        const message = 'A component that acts as a button expected a non-<button> because the `nativeButton` ' + 'prop is false. Rendering a <button> keeps native behavior while Base UI applies ' + 'non-native attributes and handlers, which can add unintended extra attributes (such ' + 'as `role` or `aria-disabled`). Use a non-<button> in the `render` prop, or set ' + '`nativeButton` to `true`.';
+        error(`${message}${ownerStackMessage}`);
+      }
+    }, [isNativeButton]);
+  }
+
+  // handles a disabled composite button rendering another button, e.g.
+  // <Toolbar.Button disabled render={<Menu.Trigger />} />
+  // the `disabled` prop needs to pass through 2 `useButton`s then finally
+  // delete the `disabled` attribute from DOM
+  const updateDisabled = React__namespace.useCallback(() => {
+    const element = elementRef.current;
+    if (!isButtonElement(element)) {
+      return;
+    }
+    if (isCompositeItem && disabled && focusableWhenDisabledProps.disabled === undefined && element.disabled) {
+      element.disabled = false;
+    }
+  }, [disabled, focusableWhenDisabledProps.disabled, isCompositeItem]);
+  useIsoLayoutEffect(updateDisabled, [updateDisabled]);
+  const getButtonProps = React__namespace.useCallback((externalProps = {}) => {
+    const {
+      onClick: externalOnClick,
+      onMouseDown: externalOnMouseDown,
+      onKeyUp: externalOnKeyUp,
+      onKeyDown: externalOnKeyDown,
+      onPointerDown: externalOnPointerDown,
+      ...otherExternalProps
+    } = externalProps;
+    return useRenderElement.mergeProps({
+      onClick(event) {
+        if (disabled) {
+          event.preventDefault();
+          return;
+        }
+        externalOnClick?.(event);
+      },
+      onMouseDown(event) {
+        if (!disabled) {
+          externalOnMouseDown?.(event);
+        }
+      },
+      onKeyDown(event) {
+        if (disabled) {
+          return;
+        }
+        useRenderElement.makeEventPreventable(event);
+        externalOnKeyDown?.(event);
+        if (event.baseUIHandlerPrevented) {
+          return;
+        }
+        const isCurrentTarget = event.target === event.currentTarget;
+        const currentTarget = event.currentTarget;
+        const isButton = isButtonElement(currentTarget);
+        const isLink = !isNativeButton && isValidLinkElement(currentTarget);
+        const shouldClick = isCurrentTarget && (isNativeButton ? isButton : !isLink);
+        const isEnterKey = event.key === 'Enter';
+        const isSpaceKey = event.key === ' ';
+        const role = currentTarget.getAttribute('role');
+        const isTextNavigationRole = role?.startsWith('menuitem') || role === 'option' || role === 'gridcell';
+        if (isCurrentTarget && isCompositeItem && isSpaceKey) {
+          if (event.defaultPrevented && isTextNavigationRole) {
+            return;
+          }
+          event.preventDefault();
+          if (isLink || isNativeButton && isButton) {
+            currentTarget.click();
+            event.preventBaseUIHandler();
+          } else if (shouldClick) {
+            externalOnClick?.(event);
+            event.preventBaseUIHandler();
+          }
+          return;
+        }
+
+        // Keyboard accessibility for native and non-native elements.
+        if (shouldClick) {
+          if (!isNativeButton && (isSpaceKey || isEnterKey)) {
+            event.preventDefault();
+          }
+          if (!isNativeButton && isEnterKey) {
+            externalOnClick?.(event);
+          }
+        }
+      },
+      onKeyUp(event) {
+        if (disabled) {
+          return;
+        }
+
+        // calling preventDefault in keyUp on a <button> will not dispatch a click event if Space is pressed
+        // https://codesandbox.io/p/sandbox/button-keyup-preventdefault-dn7f0
+        useRenderElement.makeEventPreventable(event);
+        externalOnKeyUp?.(event);
+        if (event.target === event.currentTarget && isNativeButton && isCompositeItem && isButtonElement(event.currentTarget) && event.key === ' ') {
+          event.preventDefault();
+          return;
+        }
+        if (event.baseUIHandlerPrevented) {
+          return;
+        }
+
+        // Keyboard accessibility for non interactive elements
+        if (event.target === event.currentTarget && !isNativeButton && !isCompositeItem && event.key === ' ') {
+          externalOnClick?.(event);
+        }
+      },
+      onPointerDown(event) {
+        if (disabled) {
+          event.preventDefault();
+          return;
+        }
+        externalOnPointerDown?.(event);
+      }
+    }, isNativeButton ? {
+      type: 'button'
+    } : {
+      role: 'button'
+    }, focusableWhenDisabledProps, otherExternalProps);
+  }, [disabled, focusableWhenDisabledProps, isCompositeItem, isNativeButton]);
+  const buttonRef = useStableCallback(element => {
+    elementRef.current = element;
+    updateDisabled();
+  });
+  return {
+    getButtonProps,
+    buttonRef
+  };
+}
+function isButtonElement(elem) {
+  return floatingUi_utils.isHTMLElement(elem) && elem.tagName === 'BUTTON';
+}
+function isValidLinkElement(elem) {
+  return Boolean(elem?.tagName === 'A' && elem?.href);
+}
+
 let CommonPopupDataAttributes = function (CommonPopupDataAttributes) {
   /**
    * Present when the popup is open.
@@ -3914,11 +4977,11 @@ let CommonPopupDataAttributes = function (CommonPopupDataAttributes) {
   /**
    * Present when the popup is animating in.
    */
-  CommonPopupDataAttributes[CommonPopupDataAttributes["startingStyle"] = useButton.TransitionStatusDataAttributes.startingStyle] = "startingStyle";
+  CommonPopupDataAttributes[CommonPopupDataAttributes["startingStyle"] = TransitionStatusDataAttributes.startingStyle] = "startingStyle";
   /**
    * Present when the popup is animating out.
    */
-  CommonPopupDataAttributes[CommonPopupDataAttributes["endingStyle"] = useButton.TransitionStatusDataAttributes.endingStyle] = "endingStyle";
+  CommonPopupDataAttributes[CommonPopupDataAttributes["endingStyle"] = TransitionStatusDataAttributes.endingStyle] = "endingStyle";
   /**
    * Present when the anchor is hidden.
    */
@@ -4037,8 +5100,8 @@ function hasInsetScrollbars(referenceElement) {
   if (typeof document === 'undefined') {
     return false;
   }
-  const doc = useButton.ownerDocument(referenceElement);
-  const win = floatingUi_utils_dom.getWindow(doc);
+  const doc = ownerDocument(referenceElement);
+  const win = floatingUi_utils.getWindow(doc);
   return win.innerWidth - doc.documentElement.clientWidth > 0;
 }
 function supportsStableScrollbarGutter(referenceElement) {
@@ -4046,10 +5109,10 @@ function supportsStableScrollbarGutter(referenceElement) {
   if (!supported || typeof document === 'undefined') {
     return false;
   }
-  const doc = useButton.ownerDocument(referenceElement);
+  const doc = ownerDocument(referenceElement);
   const html = doc.documentElement;
   const body = doc.body;
-  const scrollContainer = floatingUi_utils_dom.isOverflowElement(html) ? html : body;
+  const scrollContainer = floatingUi_utils.isOverflowElement(html) ? html : body;
   const originalScrollContainerOverflowY = scrollContainer.style.overflowY;
   const originalHtmlStyleGutter = html.style.scrollbarGutter;
   html.style.scrollbarGutter = 'stable';
@@ -4062,7 +5125,7 @@ function supportsStableScrollbarGutter(referenceElement) {
   return before === after;
 }
 function preventScrollOverlayScrollbars(referenceElement) {
-  const doc = useButton.ownerDocument(referenceElement);
+  const doc = ownerDocument(referenceElement);
   const html = doc.documentElement;
   const body = doc.body;
 
@@ -4070,7 +5133,7 @@ function preventScrollOverlayScrollbars(referenceElement) {
   // won't have any effect.
   // But if <body> has an `overflow` style (like `overflow-x: hidden`), we need to lock it
   // instead, as sticky elements shift otherwise.
-  const elementToLock = floatingUi_utils_dom.isOverflowElement(html) ? html : body;
+  const elementToLock = floatingUi_utils.isOverflowElement(html) ? html : body;
   const originalElementToLockStyles = {
     overflowY: elementToLock.style.overflowY,
     overflowX: elementToLock.style.overflowX
@@ -4084,14 +5147,14 @@ function preventScrollOverlayScrollbars(referenceElement) {
   };
 }
 function preventScrollInsetScrollbars(referenceElement) {
-  const doc = useButton.ownerDocument(referenceElement);
+  const doc = ownerDocument(referenceElement);
   const html = doc.documentElement;
   const body = doc.body;
-  const win = floatingUi_utils_dom.getWindow(html);
+  const win = floatingUi_utils.getWindow(html);
   let scrollTop = 0;
   let scrollLeft = 0;
   let updateGutterOnly = false;
-  const resizeFrame = useButton.AnimationFrame.create();
+  const resizeFrame = AnimationFrame.create();
 
   // Pinch-zoom in Safari causes a shift. Just don't lock scroll if there's any pinch-zoom.
   if (webkit && (win.visualViewport?.scale ?? 1) !== 1) {
@@ -4135,7 +5198,7 @@ function preventScrollInsetScrollbars(referenceElement) {
     // with whitespace. Warn if <body> has margins?
     const marginY = parseFloat(bodyStyles.marginTop) + parseFloat(bodyStyles.marginBottom);
     const marginX = parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight);
-    const elementToLock = floatingUi_utils_dom.isOverflowElement(html) ? html : body;
+    const elementToLock = floatingUi_utils.isOverflowElement(html) ? html : body;
     updateGutterOnly = supportsStableScrollbarGutter(referenceElement);
 
     /*
@@ -4188,7 +5251,7 @@ function preventScrollInsetScrollbars(referenceElement) {
     resizeFrame.request(lockScroll);
   }
   lockScroll();
-  const unsubscribeResize = useButton.addEventListener(win, 'resize', handleResize);
+  const unsubscribeResize = addEventListener(win, 'resize', handleResize);
   return () => {
     resizeFrame.cancel();
     cleanup();
@@ -4203,8 +5266,8 @@ function preventScrollInsetScrollbars(referenceElement) {
 class ScrollLocker {
   lockCount = 0;
   restore = null;
-  timeoutLock = useButton.Timeout.create();
-  timeoutUnlock = useButton.Timeout.create();
+  timeoutLock = Timeout.create();
+  timeoutUnlock = Timeout.create();
   acquire(referenceElement) {
     this.lockCount += 1;
     if (this.lockCount === 1 && this.restore === null) {
@@ -4228,16 +5291,16 @@ class ScrollLocker {
     if (this.lockCount === 0 || this.restore !== null) {
       return;
     }
-    const doc = useButton.ownerDocument(referenceElement);
+    const doc = ownerDocument(referenceElement);
     const html = doc.documentElement;
-    const htmlOverflowY = floatingUi_utils_dom.getWindow(html).getComputedStyle(html).overflowY;
+    const htmlOverflowY = floatingUi_utils.getWindow(html).getComputedStyle(html).overflowY;
 
     // If the site author already hid overflow on <html>, respect it and bail out.
     if (htmlOverflowY === 'hidden' || htmlOverflowY === 'clip') {
       this.restore = useRenderElement.NOOP;
       return;
     }
-    const hasOverlayScrollbars = useButton.ios || !hasInsetScrollbars(referenceElement);
+    const hasOverlayScrollbars = ios || !hasInsetScrollbars(referenceElement);
 
     // On iOS, scroll locking does not work if the navbar is collapsed. Due to numerous
     // side effects and bugs that arise on iOS, it must be researched extensively before
@@ -4257,7 +5320,7 @@ const SCROLL_LOCKER = new ScrollLocker();
  * @param referenceElement - Element to use as a reference for lock calculations.
  */
 function useScrollLock(enabled = true, referenceElement = null) {
-  useButton.useIsoLayoutEffect(() => {
+  useIsoLayoutEffect(() => {
     if (!enabled) {
       return undefined;
     }
@@ -4287,16 +5350,34 @@ exports.PATIENT_CLICK_THRESHOLD = PATIENT_CLICK_THRESHOLD;
 exports.POPUP_COLLISION_AVOIDANCE = POPUP_COLLISION_AVOIDANCE;
 exports.PopupTriggerMap = PopupTriggerMap;
 exports.ReactStore = ReactStore;
+exports.SafeReact = SafeReact;
 exports.Store = Store;
 exports.TYPEAHEAD_RESET_MS = TYPEAHEAD_RESET_MS;
+exports.Timeout = Timeout;
+exports.TransitionStatusDataAttributes = TransitionStatusDataAttributes;
+exports.activeElement = activeElement;
+exports.addEventListener = addEventListener;
+exports.android = android;
 exports.attachPreventUnmountOnClose = attachPreventUnmountOnClose;
+exports.cancelOpen = cancelOpen;
+exports.chipRemovePress = chipRemovePress;
+exports.clearPress = clearPress;
+exports.closePress = closePress;
+exports.closeWatcher = closeWatcher;
+exports.contains = contains;
 exports.createAttribute = createAttribute;
+exports.createChangeEventDetails = createChangeEventDetails;
 exports.createDefaultInitialFocus = createDefaultInitialFocus;
+exports.createGenericEventDetails = createGenericEventDetails;
 exports.createSelector = createSelector;
+exports.decrementPress = decrementPress;
 exports.enqueueFocus = enqueueFocus;
+exports.error = error;
+exports.escapeKey = escapeKey;
 exports.fastComponent = fastComponent;
 exports.fastComponentRef = fastComponentRef;
 exports.findNonDisabledListIndex = findNonDisabledListIndex;
+exports.focusOut = focusOut;
 exports.gecko = gecko;
 exports.getFloatingFocusElement = getFloatingFocusElement;
 exports.getGridNavigatedIndex = getGridNavigatedIndex;
@@ -4306,30 +5387,69 @@ exports.getNextTabbable = getNextTabbable;
 exports.getNodeChildren = getNodeChildren;
 exports.getTabbableAfterElement = getTabbableAfterElement;
 exports.getTabbableBeforeElement = getTabbableBeforeElement;
+exports.getTarget = getTarget;
+exports.imperativeAction = imperativeAction;
+exports.incrementPress = incrementPress;
 exports.inertValue = inertValue;
+exports.inputBlur = inputBlur;
+exports.inputChange = inputChange;
+exports.inputClear = inputClear;
+exports.inputPaste = inputPaste;
+exports.inputPress = inputPress;
+exports.ios = ios;
 exports.isElementVisible = isElementVisible;
 exports.isIndexOutOfListBounds = isIndexOutOfListBounds;
 exports.isInteractiveElement = isInteractiveElement;
 exports.isListIndexDisabled = isListIndexDisabled;
+exports.isMouseLikePointerType = isMouseLikePointerType;
 exports.isOutsideEvent = isOutsideEvent;
 exports.isTargetInsideEnabledTrigger = isTargetInsideEnabledTrigger;
 exports.isTypeableCombobox = isTypeableCombobox;
 exports.isTypeableElement = isTypeableElement;
+exports.isVirtualClick = isVirtualClick;
+exports.isVirtualPointerEvent = isVirtualPointerEvent;
+exports.itemPress = itemPress;
+exports.jsdom = jsdom;
+exports.keyboard = keyboard;
+exports.listNavigation = listNavigation;
+exports.mac = mac;
 exports.matchesFocusVisible = matchesFocusVisible;
 exports.mergeCleanups = mergeCleanups;
+exports.none = none;
+exports.outsidePress = outsidePress;
+exports.ownerDocument = ownerDocument;
+exports.pointer = pointer;
 exports.popupStateMapping = popupStateMapping;
 exports.pressableTriggerOpenStateMapping = pressableTriggerOpenStateMapping;
+exports.scrub = scrub;
 exports.setPopupOpenState = setPopupOpenState;
+exports.siblingOpen = siblingOpen;
+exports.stopEvent = stopEvent;
+exports.swipe = swipe;
+exports.transitionStatusMapping = transitionStatusMapping;
+exports.triggerFocus = triggerFocus;
+exports.triggerHover = triggerHover;
 exports.triggerOpenStateMapping = triggerOpenStateMapping;
+exports.triggerPress = triggerPress;
+exports.useAnimationFrame = useAnimationFrame;
+exports.useAnimationsFinished = useAnimationsFinished;
+exports.useBaseUiId = useBaseUiId;
+exports.useButton = useButton;
 exports.useClick = useClick;
+exports.useCompositeRootContext = useCompositeRootContext;
+exports.useControlled = useControlled;
 exports.useDirection = useDirection;
 exports.useDismiss = useDismiss;
 exports.useFloatingNodeId = useFloatingNodeId;
 exports.useFloatingParentNodeId = useFloatingParentNodeId;
 exports.useFloatingTree = useFloatingTree;
+exports.useId = useId;
 exports.useImplicitActiveTrigger = useImplicitActiveTrigger;
 exports.useInitialOpenSync = useInitialOpenSync;
+exports.useIsoLayoutEffect = useIsoLayoutEffect;
 exports.useOnFirstRender = useOnFirstRender;
+exports.useOnMount = useOnMount;
+exports.useOpenChangeComplete = useOpenChangeComplete;
 exports.useOpenInteractionType = useOpenInteractionType;
 exports.useOpenMethodTriggerProps = useOpenMethodTriggerProps;
 exports.useOpenStateTransitions = useOpenStateTransitions;
@@ -4337,8 +5457,17 @@ exports.usePopupInteractionProps = usePopupInteractionProps;
 exports.usePopupRootSync = usePopupRootSync;
 exports.usePopupStore = usePopupStore;
 exports.useScrollLock = useScrollLock;
+exports.useStableCallback = useStableCallback;
 exports.useStore = useStore;
 exports.useSyncedFloatingRootContext = useSyncedFloatingRootContext;
+exports.useTimeout = useTimeout;
+exports.useTransitionStatus = useTransitionStatus;
 exports.useTriggerDataForwarding = useTriggerDataForwarding;
 exports.useTriggerRegistration = useTriggerRegistration;
+exports.useValueAsRef = useValueAsRef;
+exports.useValueChanged = useValueChanged;
+exports.visuallyHidden = visuallyHidden;
+exports.visuallyHiddenInput = visuallyHiddenInput;
 exports.webkit = webkit;
+exports.wheel = wheel;
+exports.windowResize = windowResize;