@ariakit/react-core 0.2.7 → 0.2.9

package/esm/__chunks/{6BBYWAIS.js → QTPMBYCP.js}

@@ -1,17 +1,17 @@
 import {
   useFocusable
-} from "./IMP6LK4U.js";
+} from "./YNUPNUID.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
   useBooleanEvent,
   useEvent,
-  useForkRef,
-  useIsMouseMoving
-} from "./JSNCZ2E2.js";
+  useIsMouseMoving,
+  useMergeRefs
+} from "./SN2N5P2D.js";
 import {
   __objRest,
   __spreadProps,
@@ -66,7 +66,7 @@ var useHovercardAnchor = createHook(
       }
     );
     props = __spreadProps(__spreadValues({}, props), {
-      ref: useForkRef(store.setAnchorElement, props.ref),
+      ref: useMergeRefs(store.setAnchorElement, props.ref),
       onMouseMove
     });
     props = useFocusable(props);

package/esm/__chunks/{EMR324FL.js → RU5SBKR3.js}

@@ -1,12 +1,13 @@
 import {
   assignStyle,
   setCSSProperty
-} from "./T6V23Y6E.js";
+} from "./FW6QFGFT.js";
 import {
-  useSafeLayoutEffect
-} from "./JSNCZ2E2.js";
+  useRootDialog
+} from "./PYB45PRS.js";
 
 // src/dialog/utils/use-prevent-body-scroll.ts
+import { useEffect } from "react";
 import { getDocument, getWindow } from "@ariakit/core/utils/dom";
 import { chain } from "@ariakit/core/utils/misc";
 import { isApple, isMac } from "@ariakit/core/utils/platform";
@@ -15,11 +16,18 @@ function getPaddingProperty(documentElement) {
   const scrollbarX = Math.round(documentLeft) + documentElement.scrollLeft;
   return scrollbarX ? "paddingLeft" : "paddingRight";
 }
-function usePreventBodyScroll(store, enabled) {
-  useSafeLayoutEffect(() => {
-    if (!enabled)
+function usePreventBodyScroll(contentElement, contentId, enabled) {
+  const isRootDialog = useRootDialog({
+    attribute: "data-dialog-prevent-body-scroll",
+    contentElement,
+    contentId,
+    enabled
+  });
+  useEffect(() => {
+    if (!isRootDialog())
+      return;
+    if (!contentElement)
       return;
-    const { contentElement } = store.getState();
     const doc = getDocument(contentElement);
     const win = getWindow(contentElement);
     const { documentElement, body } = doc;
@@ -60,7 +68,7 @@ function usePreventBodyScroll(store, enabled) {
       setScrollbarWidthProperty(),
       isIOS ? setIOSStyle() : setStyle()
     );
-  }, [enabled]);
+  }, [isRootDialog, contentElement]);
 }
 
 export {

package/esm/__chunks/{CTBUXM7K.js → SHUCKX4V.js}

@@ -5,11 +5,11 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
-  useForkRef,
+  useMergeRefs,
   useTagName
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __spreadProps,
   __spreadValues
@@ -31,7 +31,7 @@ var useHeading = createHook((props) => {
     role: !isNativeHeading ? "heading" : void 0,
     "aria-level": !isNativeHeading ? level : void 0
   }, props), {
-    ref: useForkRef(ref, props.ref)
+    ref: useMergeRefs(ref, props.ref)
   });
   return props;
 });

package/esm/__chunks/{JSNCZ2E2.js → SN2N5P2D.js}

@@ -1,6 +1,6 @@
 import {
   setRef
-} from "./SXC6BPOF.js";
+} from "./UWUL6FFR.js";
 import {
   __spreadProps,
   __spreadValues
@@ -66,14 +66,12 @@ function useEvent(callback) {
     return (_a = ref.current) == null ? void 0 : _a.call(ref, ...args);
   }, []);
 }
-function useForkRef(...refs) {
+function useMergeRefs(...refs) {
   return useMemo(() => {
     if (!refs.some(Boolean))
       return;
     return (value) => {
-      refs.forEach((ref) => {
-        setRef(ref, value);
-      });
+      refs.forEach((ref) => setRef(ref, value));
     };
   }, refs);
 }
@@ -221,7 +219,7 @@ function useWrapElement(props, callback, deps = []) {
 }
 function usePortalRef(portalProp = false, portalRefProp) {
   const [portalNode, setPortalNode] = useState(null);
-  const portalRef = useForkRef(setPortalNode, portalRefProp);
+  const portalRef = useMergeRefs(setPortalNode, portalRefProp);
   const domReady = !portalProp || portalNode;
   return { portalRef, portalNode, domReady };
 }
@@ -262,7 +260,7 @@ export {
   useLiveRef,
   usePreviousValue,
   useEvent,
-  useForkRef,
+  useMergeRefs,
   useRefId,
   useId,
   useDeferredValue,

package/esm/__chunks/{XIW77V4E.js → TAQP627X.js}

@@ -1,11 +1,11 @@
 import {
   usePopoverHeading
-} from "./A5P4XOHC.js";
+} from "./3O3K4H2I.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 
 // src/hovercard/hovercard-heading.ts
 var useHovercardHeading = createHook(

package/esm/__chunks/{QDEVTSDD.js → TQ2K6WFI.js}

@@ -1,6 +1,6 @@
 import {
   useButton
-} from "./WPWRDZX3.js";
+} from "./EUD77B6Z.js";
 import {
   DialogContext
 } from "./LNHZLQEK.js";
@@ -8,10 +8,10 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
   useEvent
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{5KT3GDTM.js → TWSODZ43.js}

@@ -1,10 +1,10 @@
 import {
   useDisclosureStoreOptions,
   useDisclosureStoreProps
-} from "./JX7L6AQW.js";
+} from "./2XOPWNSQ.js";
 import {
   useStore
-} from "./FY2SXATP.js";
+} from "./USB5JBON.js";
 import {
   __spreadValues
 } from "./4BKCJXBM.js";

package/esm/__chunks/{R35SLIEE.js → TZIIKRHF.js}

@@ -2,7 +2,7 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 
 // src/role/role.ts
 var useRole = createHook((props) => {

package/esm/__chunks/{NMKK3GWP.js → UGE3SLMW.js}

@@ -6,11 +6,11 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
   useId,
   useWrapElement
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __objRest,
   __spreadValues

package/esm/__chunks/{FY2SXATP.js → USB5JBON.js}

@@ -2,7 +2,7 @@ import {
   useLazyValue,
   useLiveRef,
   useSafeLayoutEffect
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __spreadProps,
   __spreadValues

package/esm/__chunks/UWUL6FFR.js

@@ -0,0 +1,65 @@
+import {
+  __spreadValues
+} from "./4BKCJXBM.js";
+
+// src/utils/misc.ts
+import { isValidElement } from "react";
+import { hasOwnProperty } from "@ariakit/core/utils/misc";
+function setRef(ref, value) {
+  if (typeof ref === "function") {
+    ref(value);
+  } else if (ref) {
+    ref.current = value;
+  }
+}
+function isValidElementWithRef(element) {
+  if (!element)
+    return false;
+  if (!isValidElement(element))
+    return false;
+  if (!("ref" in element))
+    return false;
+  return true;
+}
+function getRefProperty(element) {
+  if (!isValidElementWithRef(element))
+    return null;
+  return element.ref;
+}
+function mergeProps(base, overrides) {
+  const props = __spreadValues({}, base);
+  for (const key in overrides) {
+    if (!hasOwnProperty(overrides, key))
+      continue;
+    if (key === "className") {
+      const prop = "className";
+      props[prop] = base[prop] ? `${base[prop]} ${overrides[prop]}` : overrides[prop];
+      continue;
+    }
+    if (key === "style") {
+      const prop = "style";
+      props[prop] = base[prop] ? __spreadValues(__spreadValues({}, base[prop]), overrides[prop]) : overrides[prop];
+      continue;
+    }
+    const overrideValue = overrides[key];
+    if (typeof overrideValue === "function" && key.startsWith("on")) {
+      const baseValue = base[key];
+      if (typeof baseValue === "function") {
+        props[key] = (...args) => {
+          overrideValue(...args);
+          baseValue(...args);
+        };
+        continue;
+      }
+    }
+    props[key] = overrideValue;
+  }
+  return props;
+}
+
+export {
+  setRef,
+  isValidElementWithRef,
+  getRefProperty,
+  mergeProps
+};

package/esm/__chunks/{FETTDVY4.js → UYTR2SZP.js}

@@ -1,28 +1,28 @@
 import {
   useCompositeTypeahead
-} from "./XXMIY262.js";
+} from "./ZSRI7KJ2.js";
 import {
   SelectContext
 } from "./EEVSGAZW.js";
 import {
   useComposite
-} from "./YBDXDAKQ.js";
+} from "./7MJF27QJ.js";
 import {
   isHidden
-} from "./YJZ2FEUT.js";
+} from "./WFPVIVLA.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
   useAttribute,
   useBooleanEvent,
   useEvent,
-  useForkRef,
   useId,
+  useMergeRefs,
   useWrapElement
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __objRest,
   __spreadProps,
@@ -104,7 +104,7 @@ var useSelectList = createHook(
       "aria-multiselectable": ariaMultiSelectable,
       hidden
     }, props), {
-      ref: useForkRef(id ? store.setContentElement : null, ref, props.ref),
+      ref: useMergeRefs(id ? store.setContentElement : null, ref, props.ref),
       style,
       onKeyDown
     });

package/esm/__chunks/{VQPGNVAE.js → VSM5JGQO.js}

@@ -1,11 +1,11 @@
 import {
   usePopoverDismiss
-} from "./BBUDEDX6.js";
+} from "./MO5Q5FB7.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 
 // src/hovercard/hovercard-dismiss.ts
 var useHovercardDismiss = createHook(

package/esm/__chunks/{WNWUDBP3.js → VTOOL4S4.js}

@@ -5,12 +5,12 @@ import {
   createElement,
   createHook,
   createMemoComponent
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
   useBooleanEvent,
   useEvent,
   useIsMouseMoving
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{UPKA4QN5.js → VV72RDTD.js}

@@ -1,12 +1,12 @@
-import {
-  isElementMarked
-} from "./TJKNVC7W.js";
 import {
   usePreviousMouseDownRef
 } from "./7JNF6I52.js";
+import {
+  isElementMarked
+} from "./HCZMY53N.js";
 import {
   useEvent
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __spreadProps,
   __spreadValues

package/esm/__chunks/{YJZ2FEUT.js → WFPVIVLA.js}

@@ -2,12 +2,12 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
-  useForkRef,
   useId,
+  useMergeRefs,
   useSafeLayoutEffect
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __objRest,
   __spreadProps,
@@ -93,7 +93,7 @@ var useDisclosureContent = createHook(
       "data-leave": transition === "leave" ? "" : void 0,
       hidden
     }, props), {
-      ref: useForkRef(id ? store.setContentElement : null, props.ref),
+      ref: useMergeRefs(id ? store.setContentElement : null, props.ref),
       style
     });
     return props;

package/esm/__chunks/{KTJKD3FC.js → WMY7U3GW.js}

@@ -5,7 +5,7 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
   __objRest,
   __spreadProps,

package/esm/__chunks/{GKEHNDOU.js → WQIYBPAY.js}

@@ -1,16 +1,16 @@
 import {
   useFocusable
-} from "./IMP6LK4U.js";
+} from "./YNUPNUID.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
   useEvent,
-  useForkRef,
+  useMergeRefs,
   useTagName
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __objRest,
   __spreadProps,
@@ -128,7 +128,7 @@ var useCommand = createHook(
       "data-active": active ? "" : void 0,
       type: isNativeButton ? "button" : void 0
     }, props), {
-      ref: useForkRef(ref, props.ref),
+      ref: useMergeRefs(ref, props.ref),
       onKeyDown,
       onKeyUp
     });

package/esm/__chunks/{34WFGKVL.js → WYH7HZPL.js}

@@ -5,10 +5,10 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
   useWrapElement
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __spreadValues
 } from "./4BKCJXBM.js";

package/esm/__chunks/{IZU5PNP2.js → XECTFJQS.js}

@@ -1,37 +1,37 @@
 import {
   DialogBackdrop
-} from "./OJHPXVNR.js";
+} from "./LIFXUQPU.js";
 import {
   disableTreeOutside
-} from "./CKSO3V6B.js";
+} from "./QLHUIPVK.js";
 import {
   disableAccessibilityTreeOutside
-} from "./265D6T7T.js";
+} from "./CYJJUQU3.js";
 import {
   usePreventBodyScroll
-} from "./EMR324FL.js";
+} from "./RU5SBKR3.js";
 import {
   useNestedDialogs
-} from "./4D3OGBNH.js";
+} from "./J4BKICPJ.js";
 import {
   useHideOnInteractOutside
-} from "./UPKA4QN5.js";
+} from "./VV72RDTD.js";
 import {
   prependHiddenDismiss
 } from "./62DFK33R.js";
 import {
   isElementMarked,
   markTreeOutside
-} from "./TJKNVC7W.js";
+} from "./HCZMY53N.js";
 import {
   useFocusableContainer
-} from "./URYSNCDU.js";
+} from "./GKH7N3JM.js";
 import {
   HeadingLevel
 } from "./6OMX4H3W.js";
 import {
   usePortal
-} from "./56DUJ462.js";
+} from "./ENZR4N3P.js";
 import {
   DialogContext,
   DialogDescriptionContext,
@@ -40,24 +40,24 @@ import {
 import {
   isHidden,
   useDisclosureContent
-} from "./YJZ2FEUT.js";
+} from "./WFPVIVLA.js";
 import {
   useFocusable
-} from "./IMP6LK4U.js";
+} from "./YNUPNUID.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
   useBooleanEvent,
   useEvent,
-  useForkRef,
   useId,
+  useMergeRefs,
   usePortalRef,
   useSafeLayoutEffect,
   useWrapElement
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __objRest,
   __spreadProps,
@@ -140,10 +140,7 @@ var useDialog = createHook(
       "finalFocus"
     ]);
     const ref = useRef(null);
-    const { portalRef, portalNode, domReady } = usePortalRef(
-      portal,
-      props.portalRef
-    );
+    const { portalRef, domReady } = usePortalRef(portal, props.portalRef);
     const preserveTabOrderProp = props.preserveTabOrder;
     const preserveTabOrder = store.useState(
       (state) => preserveTabOrderProp && !modal && state.mounted
@@ -153,7 +150,7 @@ var useDialog = createHook(
     const mounted = store.useState("mounted");
     const contentElement = store.useState("contentElement");
     const hidden = isHidden(mounted, props.hidden, props.alwaysVisible);
-    usePreventBodyScroll(store, preventBodyScroll && !hidden);
+    usePreventBodyScroll(contentElement, id, preventBodyScroll && !hidden);
     useHideOnInteractOutside(store, hideOnInteractOutside);
     const { wrapElement, nestedDialogs } = useNestedDialogs(store);
     props = useWrapElement(props, wrapElement, [wrapElement]);
@@ -222,6 +219,8 @@ var useDialog = createHook(
     }, [mounted, domReady, shouldDisableAccessibilityTree]);
     const getPersistentElementsProp = useEvent(getPersistentElements);
     useSafeLayoutEffect(() => {
+      if (!domReady)
+        return;
       if (!id)
         return;
       if (!open)
@@ -230,14 +229,8 @@ var useDialog = createHook(
       const dialog = ref.current;
       const persistentElements = getPersistentElementsProp() || [];
       const allElements = [
-        // In addition to the dialog element, we also include the portal node
-        // here so nested dialogs are considered as well.
         dialog,
-        portalNode,
         ...persistentElements,
-        // We still need to include nested dialogs here because they may be
-        // outside the portal node or the parent dialog may not be using a
-        // portal.
         ...nestedDialogs.map((dialog2) => dialog2.getState().contentElement)
       ];
       if (!shouldDisableAccessibilityTree) {
@@ -254,13 +247,12 @@ var useDialog = createHook(
         disableAccessibilityTreeOutside(...allElements)
       );
     }, [
+      domReady,
       id,
       open,
       store,
-      portal,
-      portalNode,
-      nestedDialogs,
       getPersistentElementsProp,
+      nestedDialogs,
       shouldDisableAccessibilityTree,
       modal
     ]);
@@ -407,22 +399,21 @@ var useDialog = createHook(
     props = useWrapElement(
       props,
       (element) => {
-        if (backdrop) {
-          return /* @__PURE__ */ jsxs(Fragment, { children: [
-            backdrop && /* @__PURE__ */ jsx(
-              DialogBackdrop,
-              {
-                store,
-                backdrop,
-                backdropProps,
-                hidden: hiddenProp,
-                alwaysVisible
-              }
-            ),
-            element
-          ] });
-        }
-        return element;
+        if (!backdrop)
+          return element;
+        return /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            DialogBackdrop,
+            {
+              store,
+              backdrop,
+              backdropProps,
+              hidden: hiddenProp,
+              alwaysVisible
+            }
+          ),
+          element
+        ] });
       },
       [store, backdrop, backdropProps, hiddenProp, alwaysVisible]
     );
@@ -441,7 +432,7 @@ var useDialog = createHook(
       "aria-labelledby": headingId,
       "aria-describedby": descriptionId
     }, props), {
-      ref: useForkRef(ref, props.ref)
+      ref: useMergeRefs(ref, props.ref)
     });
     props = useFocusableContainer(__spreadProps(__spreadValues({}, props), {
       autoFocusOnShow: autoFocusEnabled

package/esm/__chunks/{KXTECTTC.js → XGUNEAFA.js}

@@ -8,11 +8,11 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./U2LXZPCY.js";
+} from "./7GCARSHZ.js";
 import {
-  useForkRef,
+  useMergeRefs,
   useSafeLayoutEffect
-} from "./JSNCZ2E2.js";
+} from "./SN2N5P2D.js";
 import {
   __objRest,
   __spreadProps,
@@ -73,7 +73,7 @@ var usePopoverArrow = createHook(
       children,
       "aria-hidden": true
     }, props), {
-      ref: useForkRef(store.setArrowElement, props.ref),
+      ref: useMergeRefs(store.setArrowElement, props.ref),
       style: __spreadValues({
         // server side rendering
         position: "absolute",