@ariakit/react-core 0.1.6 → 0.1.7

package/esm/__chunks/{HS4EASQI.js → PYEPYVON.js}

@@ -5,11 +5,15 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 import {
   useForkRef,
   useTagName
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/heading/heading.ts
 import { useContext, useMemo, useRef } from "react";
@@ -22,13 +26,13 @@ var useHeading = createHook((props) => {
     () => !!tagName && /^h\d$/.test(tagName),
     [tagName]
   );
-  props = {
+  props = __spreadProps(__spreadValues({
     as,
     role: !isNativeHeading ? "heading" : void 0,
-    "aria-level": !isNativeHeading ? level : void 0,
-    ...props,
+    "aria-level": !isNativeHeading ? level : void 0
+  }, props), {
     ref: useForkRef(ref, props.ref)
-  };
+  });
   return props;
 });
 var Heading = createComponent((props) => {

package/esm/__chunks/{DH2UH4YR.js → PZK3B6LX.js}

@@ -1,38 +1,49 @@
 import {
   useCompositeTypeahead
-} from "./6OCAIYRY.js";
+} from "./KSVEVAMH.js";
 import {
   SelectContext
 } from "./EEVSGAZW.js";
 import {
   useComposite
-} from "./NOLA2XUH.js";
+} from "./OY5YT7OV.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 import {
   useBooleanEvent,
   useEvent,
   useForkRef,
   useId,
   useWrapElement
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/select/select-list.tsx
 import { useEffect, useRef, useState } from "react";
 import { isSelfTarget } from "@ariakit/core/utils/events";
 import { jsx } from "react/jsx-runtime";
 var useSelectList = createHook(
-  ({
-    store,
-    resetOnEscape = true,
-    hideOnEnter = true,
-    focusOnMove = true,
-    composite = true,
-    ...props
-  }) => {
+  (_a) => {
+    var _b = _a, {
+      store,
+      resetOnEscape = true,
+      hideOnEnter = true,
+      focusOnMove = true,
+      composite = true
+    } = _b, props = __objRest(_b, [
+      "store",
+      "resetOnEscape",
+      "hideOnEnter",
+      "focusOnMove",
+      "composite"
+    ]);
     const ref = useRef(null);
     const id = useId(props.id);
     const value = store.useState("value");
@@ -49,7 +60,7 @@ var useSelectList = createHook(
     const resetOnEscapeProp = useBooleanEvent(resetOnEscape);
     const hideOnEnterProp = useBooleanEvent(hideOnEnter);
     const onKeyDown = useEvent((event) => {
-      onKeyDownProp?.(event);
+      onKeyDownProp == null ? void 0 : onKeyDownProp(event);
       if (event.defaultPrevented)
         return;
       if (event.key === "Escape" && resetOnEscapeProp(event)) {
@@ -67,34 +78,36 @@ var useSelectList = createHook(
       (element) => /* @__PURE__ */ jsx(SelectContext.Provider, { value: store, children: element }),
       [store]
     );
-    const labelId = store.useState((state) => state.labelElement?.id);
-    const style = mounted ? props.style : { ...props.style, display: "none" };
+    const labelId = store.useState((state) => {
+      var _a2;
+      return (_a2 = state.labelElement) == null ? void 0 : _a2.id;
+    });
+    const style = mounted ? props.style : __spreadProps(__spreadValues({}, props.style), { display: "none" });
     if (composite) {
-      props = {
+      props = __spreadValues({
         role: "listbox",
-        "aria-multiselectable": multiSelectable ? true : void 0,
-        ...props
-      };
+        "aria-multiselectable": multiSelectable ? true : void 0
+      }, props);
     }
-    props = {
+    props = __spreadProps(__spreadValues({
       id,
       hidden: !mounted,
-      "aria-labelledby": labelId,
-      ...props,
+      "aria-labelledby": labelId
+    }, props), {
       ref: useForkRef(id ? store.setContentElement : null, ref, props.ref),
       style,
       onKeyDown
-    };
+    });
     const canFocusOnMove = store.useState(
       (state) => state.open && !state.animating && focusOnMove
     );
-    props = useComposite({
-      store,
-      ...props,
+    props = useComposite(__spreadProps(__spreadValues({
+      store
+    }, props), {
       composite,
       focusOnMove: canFocusOnMove
-    });
-    props = useCompositeTypeahead({ store, ...props });
+    }));
+    props = useCompositeTypeahead(__spreadValues({ store }, props));
     return props;
   }
 );

package/esm/__chunks/{DVR5Q5UR.js → R3XRDDO7.js}

@@ -1,11 +1,11 @@
 import {
   usePopoverHeading
-} from "./SE2URGHN.js";
+} from "./MR7KGB6U.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 
 // src/hovercard/hovercard-heading.ts
 var useHovercardHeading = createHook(

package/esm/__chunks/{GWYHKM6Q.js → RBUEJWRA.js}

@@ -1,59 +1,32 @@
 import {
-  useChampionDialog
-} from "./FD7UP2TJ.js";
+  assignStyle,
+  setCSSProperty
+} from "./DJESYNLE.js";
 import {
   useSafeLayoutEffect
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
 
 // src/dialog/utils/use-prevent-body-scroll.ts
 import { getDocument, getWindow } from "@ariakit/core/utils/dom";
 import { chain } from "@ariakit/core/utils/misc";
 import { isApple, isMac } from "@ariakit/core/utils/platform";
-function assignStyle(element, style) {
-  if (!element)
-    return () => {
-    };
-  const previousStyle = element.style.cssText;
-  Object.assign(element.style, style);
-  return () => {
-    element.style.cssText = previousStyle;
-  };
-}
-function setCSSProperty(element, property, value) {
-  if (!element)
-    return () => {
-    };
-  const previousValue = element.style.getPropertyValue(property);
-  element.style.setProperty(property, value);
-  return () => {
-    if (previousValue) {
-      element.style.setProperty(property, previousValue);
-    } else {
-      element.style.removeProperty(property);
-    }
-  };
-}
 function getPaddingProperty(documentElement) {
   const documentLeft = documentElement.getBoundingClientRect().left;
   const scrollbarX = Math.round(documentLeft) + documentElement.scrollLeft;
   return scrollbarX ? "paddingLeft" : "paddingRight";
 }
 function usePreventBodyScroll(store, enabled) {
-  const isChampionDialog = useChampionDialog(
-    "data-dialog-body-scroll",
-    store,
-    enabled
-  );
   useSafeLayoutEffect(() => {
-    const dialog = store.getState().contentElement;
-    if (!dialog)
+    if (!enabled)
       return;
-    if (!isChampionDialog())
+    const { contentElement } = store.getState();
+    if (!contentElement)
       return;
-    const doc = getDocument(dialog);
-    const win = getWindow(dialog);
+    const doc = getDocument(contentElement);
+    const win = getWindow(contentElement);
     const { documentElement, body } = doc;
-    const scrollbarWidth = win.innerWidth - documentElement.clientWidth;
+    const cssScrollbarWidth = documentElement.style.getPropertyValue("--scrollbar-width");
+    const scrollbarWidth = cssScrollbarWidth ? parseInt(cssScrollbarWidth) : win.innerWidth - documentElement.clientWidth;
     const setScrollbarWidthProperty = () => setCSSProperty(
       documentElement,
       "--scrollbar-width",
@@ -65,9 +38,10 @@ function usePreventBodyScroll(store, enabled) {
       [paddingProperty]: `${scrollbarWidth}px`
     });
     const setIOSStyle = () => {
+      var _a, _b;
       const { scrollX, scrollY, visualViewport } = win;
-      const offsetLeft = visualViewport?.offsetLeft ?? 0;
-      const offsetTop = visualViewport?.offsetTop ?? 0;
+      const offsetLeft = (_a = visualViewport == null ? void 0 : visualViewport.offsetLeft) != null ? _a : 0;
+      const offsetTop = (_b = visualViewport == null ? void 0 : visualViewport.offsetTop) != null ? _b : 0;
       const restoreStyle = assignStyle(body, {
         position: "fixed",
         overflow: "hidden",
@@ -88,7 +62,7 @@ function usePreventBodyScroll(store, enabled) {
       setScrollbarWidthProperty(),
       isIOS ? setIOSStyle() : setStyle()
     );
-  }, [isChampionDialog]);
+  }, [enabled]);
 }
 
 export {

package/esm/__chunks/{TQC4ZBYZ.js → RPJS3S4B.js}

@@ -4,25 +4,30 @@ import {
 } from "./HVBRRKV4.js";
 import {
   hasExpandedMenuButton
-} from "./SJEKLK5Q.js";
+} from "./W7JXAQKF.js";
 import {
   useCompositeHover
-} from "./DRSUYUM5.js";
+} from "./UGXJ5IN7.js";
 import {
   useCompositeItem
-} from "./HAHDW4I2.js";
+} from "./M32DI6TL.js";
 import {
   createElement,
   createHook,
   createMemoComponent
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 import {
   useStoreState
-} from "./EUGPS2W3.js";
+} from "./AV5WE37O.js";
 import {
   useBooleanEvent,
   useEvent
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/menu/menu-item.ts
 import { useContext } from "react";
@@ -30,13 +35,18 @@ import { getPopupItemRole } from "@ariakit/core/utils/dom";
 import { isDownloading, isOpeningInNewTab } from "@ariakit/core/utils/events";
 import { invariant } from "@ariakit/core/utils/misc";
 var useMenuItem = createHook(
-  ({
-    store,
-    hideOnClick = true,
-    preventScrollOnKeyDown = true,
-    focusOnHover,
-    ...props
-  }) => {
+  (_a) => {
+    var _b = _a, {
+      store,
+      hideOnClick = true,
+      preventScrollOnKeyDown = true,
+      focusOnHover
+    } = _b, props = __objRest(_b, [
+      "store",
+      "hideOnClick",
+      "preventScrollOnKeyDown",
+      "focusOnHover"
+    ]);
     const menuContext = useContext(MenuContext);
     const menuBarContext = useContext(MenuBarContext);
     store = store || menuContext || menuBarContext;
@@ -49,7 +59,7 @@ var useMenuItem = createHook(
     const hideMenu = "hideAll" in store ? store.hideAll : void 0;
     const isWithinMenu = !!hideMenu;
     const onClick = useEvent((event) => {
-      onClickProp?.(event);
+      onClickProp == null ? void 0 : onClickProp(event);
       if (event.defaultPrevented)
         return;
       if (isDownloading(event))
@@ -70,15 +80,15 @@ var useMenuItem = createHook(
       (state) => "contentElement" in state ? state.contentElement : null
     );
     const role = getPopupItemRole(contentElement, "menuitem");
-    props = {
-      role,
-      ...props,
+    props = __spreadProps(__spreadValues({
+      role
+    }, props), {
       onClick
-    };
-    props = useCompositeItem({ store, preventScrollOnKeyDown, ...props });
-    props = useCompositeHover({
-      store,
-      ...props,
+    });
+    props = useCompositeItem(__spreadValues({ store, preventScrollOnKeyDown }, props));
+    props = useCompositeHover(__spreadProps(__spreadValues({
+      store
+    }, props), {
       focusOnHover: (event) => {
         if (typeof focusOnHover === "function")
           return focusOnHover(event);
@@ -86,19 +96,19 @@ var useMenuItem = createHook(
           return focusOnHover;
         if (event.type === "mouseleave")
           return isWithinMenu;
-        const state = store?.getState();
+        const state = store == null ? void 0 : store.getState();
         if (isWithinMenu) {
           if (event.currentTarget.hasAttribute("aria-expanded")) {
             event.currentTarget.focus();
           }
           return true;
-        } else if (hasExpandedMenuButton(state?.items, event.currentTarget)) {
+        } else if (hasExpandedMenuButton(state == null ? void 0 : state.items, event.currentTarget)) {
           event.currentTarget.focus();
           return true;
         }
         return false;
       }
-    });
+    }));
     return props;
   }
 );

package/esm/__chunks/{LUPFVLDA.js → RVIGSXKO.js}

@@ -1,6 +1,6 @@
 import {
   useDialog
-} from "./E3LZDF77.js";
+} from "./TCX5FQUL.js";
 import {
   PopoverContext
 } from "./6GS36SYX.js";
@@ -8,26 +8,38 @@ import {
   createComponent,
   createElement,
   createHook
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 import {
   usePortalRef,
   useSafeLayoutEffect,
   useWrapElement
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/popover/popover.tsx
 import { useState } from "react";
 import { jsx } from "react/jsx-runtime";
 var usePopover = createHook(
-  ({
-    store,
-    modal = false,
-    portal = !!modal,
-    preserveTabOrder = true,
-    autoFocusOnShow = true,
-    wrapperProps,
-    ...props
-  }) => {
+  (_a) => {
+    var _b = _a, {
+      store,
+      modal = false,
+      portal = !!modal,
+      preserveTabOrder = true,
+      autoFocusOnShow = true,
+      wrapperProps
+    } = _b, props = __objRest(_b, [
+      "store",
+      "modal",
+      "portal",
+      "preserveTabOrder",
+      "autoFocusOnShow",
+      "wrapperProps"
+    ]);
     const popoverElement = store.useState("popoverElement");
     const contentElement = store.useState("contentElement");
     useSafeLayoutEffect(() => {
@@ -47,7 +59,7 @@ var usePopover = createHook(
         return;
       if (!mounted)
         return;
-      if (!contentElement?.isConnected)
+      if (!(contentElement == null ? void 0 : contentElement.isConnected))
         return;
       const raf = requestAnimationFrame(() => {
         setCanAutoFocusOnShow(true);
@@ -63,18 +75,17 @@ var usePopover = createHook(
       props,
       (element) => /* @__PURE__ */ jsx(
         "div",
-        {
-          role: "presentation",
-          ...wrapperProps,
-          style: {
+        __spreadProps(__spreadValues({
+          role: "presentation"
+        }, wrapperProps), {
+          style: __spreadValues({
             position,
             top: 0,
-            left: 0,
-            ...wrapperProps?.style
-          },
+            left: 0
+          }, wrapperProps == null ? void 0 : wrapperProps.style),
           ref: store.setPopoverElement,
           children: element
-        }
+        })
       ),
       [store, position, wrapperProps]
     );
@@ -83,22 +94,20 @@ var usePopover = createHook(
       (element) => /* @__PURE__ */ jsx(PopoverContext.Provider, { value: store, children: element }),
       [store]
     );
-    props = {
-      ...props,
-      style: {
-        position: "relative",
-        ...props.style
-      }
-    };
-    props = useDialog({
+    props = __spreadProps(__spreadValues({}, props), {
+      style: __spreadValues({
+        position: "relative"
+      }, props.style)
+    });
+    props = useDialog(__spreadProps(__spreadValues({
       store,
       modal,
       preserveTabOrder,
       portal,
-      autoFocusOnShow: canAutoFocusOnShow && autoFocusOnShow,
-      ...props,
+      autoFocusOnShow: canAutoFocusOnShow && autoFocusOnShow
+    }, props), {
       portalRef
-    });
+    }));
     return props;
   }
 );

package/esm/__chunks/{HMJVMCGK.js → RXTFLI35.js}

@@ -1,11 +1,11 @@
 import {
   useDialogDescription
-} from "./DGTYZREX.js";
+} from "./4JRG3QNR.js";
 import {
   createComponent,
   createElement,
   createHook
-} from "./JE5NWDDX.js";
+} from "./5ETIGB6O.js";
 
 // src/popover/popover-description.ts
 var usePopoverDescription = createHook(

package/esm/__chunks/{YTUXLB4R.js → SHGWT5HV.js}

@@ -1,25 +1,28 @@
 import {
   useDialogStoreOptions,
   useDialogStoreProps
-} from "./LWUHIEZR.js";
+} from "./OBNQHP6V.js";
 import {
   useStore,
   useStoreProps
-} from "./EUGPS2W3.js";
+} from "./AV5WE37O.js";
 import {
   useEvent
-} from "./B7MIN7YT.js";
+} from "./ASYR66PQ.js";
+import {
+  __spreadProps,
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/popover/popover-store.ts
 import * as Core from "@ariakit/core/popover/popover-store";
 function usePopoverStoreOptions(props) {
   const getAnchorRect = useEvent(props.getAnchorRect);
   const renderCallback = useEvent(props.renderCallback);
-  return {
-    ...useDialogStoreOptions(props),
+  return __spreadProps(__spreadValues({}, useDialogStoreOptions(props)), {
     getAnchorRect: props.getAnchorRect ? getAnchorRect : void 0,
     renderCallback: props.renderCallback ? renderCallback : void 0
-  };
+  });
 }
 function usePopoverStoreProps(store, props) {
   store = useDialogStoreProps(store, props);
@@ -39,7 +42,7 @@ function usePopoverStoreProps(store, props) {
 function usePopoverStore(props = {}) {
   const options = usePopoverStoreOptions(props);
   const store = useStore(
-    () => Core.createPopoverStore({ ...props, ...options })
+    () => Core.createPopoverStore(__spreadValues(__spreadValues({}, props), options))
   );
   return usePopoverStoreProps(store, props);
 }

package/esm/__chunks/{ZNVJPG2U.js → SSM4B45D.js}

@@ -1,11 +1,14 @@
 import {
   useCollectionStoreOptions,
   useCollectionStoreProps
-} from "./WKCZETSE.js";
+} from "./MEYEPL2D.js";
 import {
   useStore,
   useStoreProps
-} from "./EUGPS2W3.js";
+} from "./AV5WE37O.js";
+import {
+  __spreadValues
+} from "./4BKCJXBM.js";
 
 // src/composite/composite-store.ts
 import * as Core from "@ariakit/core/composite/composite-store";
@@ -27,7 +30,7 @@ function useCompositeStoreProps(store, props) {
 function useCompositeStore(props = {}) {
   const options = useCompositeStoreOptions(props);
   const store = useStore(
-    () => Core.createCompositeStore({ ...props, ...options })
+    () => Core.createCompositeStore(__spreadValues(__spreadValues({}, props), options))
   );
   return useCompositeStoreProps(store, props);
 }

package/esm/__chunks/T3WBUAHU.js

@@ -0,0 +1,61 @@
+import {
+  useSafeLayoutEffect
+} from "./ASYR66PQ.js";
+
+// src/dialog/utils/use-nested-dialogs.tsx
+import {
+  createContext,
+  useCallback,
+  useContext,
+  useMemo,
+  useState
+} from "react";
+import { chain } from "@ariakit/core/utils/misc";
+import { jsx } from "react/jsx-runtime";
+var NestedDialogsContext = createContext({});
+function useNestedDialogs(store) {
+  const context = useContext(NestedDialogsContext);
+  const [dialogs, setDialogs] = useState([]);
+  const add = useCallback(
+    (dialog) => {
+      var _a;
+      setDialogs((dialogs2) => [...dialogs2, dialog]);
+      return chain((_a = context.add) == null ? void 0 : _a.call(context, dialog), () => {
+        setDialogs((dialogs2) => dialogs2.filter((d) => d !== dialog));
+      });
+    },
+    [context]
+  );
+  useSafeLayoutEffect(() => {
+    return store.sync(
+      (state) => {
+        var _a;
+        if (!state.contentElement)
+          return;
+        return (_a = context.add) == null ? void 0 : _a.call(context, state.contentElement);
+      },
+      ["contentElement"]
+    );
+  }, [store, context]);
+  useSafeLayoutEffect(() => {
+    var _a;
+    return (_a = context.store) == null ? void 0 : _a.sync(
+      (state) => {
+        if (state.open)
+          return;
+        store.hide();
+      },
+      ["open"]
+    );
+  }, [context, store]);
+  const providerValue = useMemo(() => ({ store, add }), [store, add]);
+  const wrapElement = useCallback(
+    (element) => /* @__PURE__ */ jsx(NestedDialogsContext.Provider, { value: providerValue, children: element }),
+    [providerValue]
+  );
+  return { wrapElement, nestedDialogs: dialogs };
+}
+
+export {
+  useNestedDialogs
+};