@ariakit/react-core 0.2.13 → 0.2.15

package/esm/__chunks/{FV23EKJL.js → 5M4ITSXL.js}

@@ -20,12 +20,13 @@ function walkTreeOutside(elements, callback, ancestorCallback) {
       return maybeAncestor.contains(element);
     });
     const doc = getDocument(element);
+    const originalElement = element;
     while (element.parentElement && element !== doc.body) {
-      ancestorCallback == null ? void 0 : ancestorCallback(element.parentElement);
+      ancestorCallback == null ? void 0 : ancestorCallback(element.parentElement, originalElement);
       if (!hasAncestorAlready) {
         for (const child of element.parentElement.children) {
           if (isValidElement(child, elements)) {
-            callback(child);
+            callback(child, originalElement);
           }
         }
       }

package/esm/__chunks/{DP7YKWXP.js → 74BBE733.js}

@@ -1,11 +1,11 @@
 import {
   usePopoverStoreOptions,
   usePopoverStoreProps
-} from "./FAKCYHFK.js";
+} from "./SPTQP5I5.js";
 import {
   useStore,
   useStoreProps
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   __spreadValues
 } from "./PNRLI7OV.js";

package/esm/__chunks/{5UGSKFCK.js → BIPBU2AE.js}

@@ -1,12 +1,12 @@
 import {
   DialogBackdrop
-} from "./TM5MM3ME.js";
+} from "./H3BU75TA.js";
 import {
   disableTreeOutside
-} from "./AR6DTI3S.js";
+} from "./NHPU54IO.js";
 import {
   disableAccessibilityTreeOutside
-} from "./CYJJUQU3.js";
+} from "./GDORSOK6.js";
 import {
   usePreventBodyScroll
 } from "./3LAWLNOX.js";
@@ -15,11 +15,11 @@ import {
 } from "./OEA63YXU.js";
 import {
   useHideOnInteractOutside
-} from "./4XWTU3WN.js";
+} from "./E5XSMSHD.js";
 import {
   isElementMarked,
   markTreeOutside
-} from "./HCZMY53N.js";
+} from "./LEBYH5FW.js";
 import {
   prependHiddenDismiss
 } from "./62DFK33R.js";
@@ -65,7 +65,7 @@ import {
 } from "./PNRLI7OV.js";
 
 // src/dialog/dialog.tsx
-import { useEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import {
   closest,
   contains,
@@ -151,7 +151,7 @@ var useDialog = createHook(
     const contentElement = store.useState("contentElement");
     const hidden = isHidden(mounted, props.hidden, props.alwaysVisible);
     usePreventBodyScroll(contentElement, id, preventBodyScroll && !hidden);
-    useHideOnInteractOutside(store, hideOnInteractOutside);
+    useHideOnInteractOutside(store, hideOnInteractOutside, domReady);
     const { wrapElement, nestedDialogs } = useNestedDialogs(store);
     props = useWrapElement(props, wrapElement, [wrapElement]);
     useSafeLayoutEffect(() => {
@@ -309,16 +309,13 @@ var useDialog = createHook(
       setHasOpened(true);
       return () => setHasOpened(false);
     }, [open]);
-    useSafeLayoutEffect(() => {
-      if (!hasOpened)
-        return;
-      if (!mayAutoFocusOnHide)
-        return;
-      const dialog = ref.current;
-      const focusOnHide = (retry = true) => {
+    const focusOnHide = useCallback(
+      (dialog, retry = true) => {
+        const { open: open2, disclosureElement } = store.getState();
+        if (open2)
+          return;
         if (isAlreadyFocusingAnotherElement(dialog))
           return;
-        const { disclosureElement } = store.getState();
         let element = getElementFromProp(finalFocus) || disclosureElement;
         if (element == null ? void 0 : element.id) {
           const doc = getDocument(element);
@@ -341,7 +338,7 @@ var useDialog = createHook(
         }
         const isElementFocusable = element && isFocusable(element);
         if (!isElementFocusable && retry) {
-          requestAnimationFrame(() => focusOnHide(false));
+          requestAnimationFrame(() => focusOnHide(dialog, false));
           return;
         }
         if (!autoFocusOnHideProp(isElementFocusable ? element : null))
@@ -349,12 +346,27 @@ var useDialog = createHook(
         if (!isElementFocusable)
           return;
         element == null ? void 0 : element.focus();
-      };
-      if (!open) {
-        return focusOnHide();
-      }
-      return focusOnHide;
-    }, [hasOpened, open, mayAutoFocusOnHide, finalFocus, autoFocusOnHideProp]);
+      },
+      [store, finalFocus, autoFocusOnHideProp]
+    );
+    useEffect(() => {
+      if (open)
+        return;
+      if (!hasOpened)
+        return;
+      if (!mayAutoFocusOnHide)
+        return;
+      const dialog = ref.current;
+      focusOnHide(dialog);
+    }, [open, hasOpened, mayAutoFocusOnHide, focusOnHide]);
+    useEffect(() => {
+      if (!hasOpened)
+        return;
+      if (!mayAutoFocusOnHide)
+        return;
+      const dialog = ref.current;
+      return () => focusOnHide(dialog);
+    }, [hasOpened, mayAutoFocusOnHide, focusOnHide]);
     const hideOnEscapeProp = useBooleanEvent(hideOnEscape);
     useEffect(() => {
       if (!domReady)

package/esm/__chunks/{4XWTU3WN.js → E5XSMSHD.js}

@@ -1,11 +1,12 @@
 import {
   isElementMarked
-} from "./HCZMY53N.js";
+} from "./LEBYH5FW.js";
 import {
   usePreviousMouseDownRef
 } from "./7JNF6I52.js";
 import {
-  useEvent
+  useEvent,
+  useSafeLayoutEffect
 } from "./J7Q2EO23.js";
 import {
   __spreadProps,
@@ -13,7 +14,7 @@ import {
 } from "./PNRLI7OV.js";
 
 // src/dialog/utils/use-hide-on-interact-outside.ts
-import { useEffect } from "react";
+import { useEffect, useRef } from "react";
 import { contains, getDocument, isVisible } from "@ariakit/core/utils/dom";
 import { addGlobalEventListener } from "@ariakit/core/utils/events";
 function isInDocument(target) {
@@ -47,10 +48,26 @@ function useEventOutside({
   store,
   type,
   listener,
-  capture
+  capture,
+  domReady
 }) {
   const callListener = useEvent(listener);
   const open = store.useState("open");
+  const focusedRef = useRef(false);
+  useSafeLayoutEffect(() => {
+    if (!open)
+      return;
+    if (!domReady)
+      return;
+    const { contentElement } = store.getState();
+    if (!contentElement)
+      return;
+    const onFocus = () => {
+      focusedRef.current = true;
+    };
+    contentElement.addEventListener("focusin", onFocus, true);
+    return () => contentElement.removeEventListener("focusin", onFocus, true);
+  }, [store, open, domReady]);
   useEffect(() => {
     if (!open)
       return;
@@ -71,7 +88,8 @@ function useEventOutside({
         return;
       if (isMouseEventOnDialog(event, contentElement))
         return;
-      if (!isElementMarked(target, contentElement.id))
+      const focused = focusedRef.current;
+      if (focused && !isElementMarked(target, contentElement.id))
         return;
       callListener(event);
     };
@@ -84,10 +102,10 @@ function shouldHideOnInteractOutside(hideOnInteractOutside, event) {
   }
   return !!hideOnInteractOutside;
 }
-function useHideOnInteractOutside(store, hideOnInteractOutside) {
+function useHideOnInteractOutside(store, hideOnInteractOutside, domReady) {
   const open = store.useState("open");
   const previousMouseDownRef = usePreviousMouseDownRef(open);
-  const props = { store, capture: true };
+  const props = { store, domReady, capture: true };
   useEventOutside(__spreadProps(__spreadValues({}, props), {
     type: "click",
     listener: (event) => {

package/esm/__chunks/{CYJJUQU3.js → GDORSOK6.js}

@@ -6,7 +6,7 @@ import {
 } from "./FW6QFGFT.js";
 import {
   walkTreeOutside
-} from "./FV23EKJL.js";
+} from "./5M4ITSXL.js";
 
 // src/dialog/utils/disable-accessibility-tree-outside.ts
 function hideElementFromAccessibilityTree(element) {

package/esm/__chunks/{TM5MM3ME.js → H3BU75TA.js}

@@ -1,6 +1,6 @@
 import {
   markAncestor
-} from "./HCZMY53N.js";
+} from "./LEBYH5FW.js";
 import {
   Role
 } from "./M5I7AM4N.js";
@@ -9,7 +9,7 @@ import {
 } from "./WHEEIXMF.js";
 import {
   useDisclosureStore
-} from "./LZ4RMGK5.js";
+} from "./JJW3R5IK.js";
 import {
   useMergeRefs,
   useSafeLayoutEffect

package/esm/__chunks/{XSCTYXG5.js → I6WUAEGK.js}

@@ -1,7 +1,7 @@
 import {
   getCollectionRendererItemId,
   useCollectionRenderer
-} from "./VJKEASM4.js";
+} from "./QLIKSQTQ.js";
 import {
   CompositeContext
 } from "./WJ37OVG2.js";
@@ -11,7 +11,7 @@ import {
 } from "./NQJBHION.js";
 import {
   useStoreState
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   useId
 } from "./J7Q2EO23.js";

package/esm/__chunks/{LU22MAAA.js → ID2DTD7Z.js}

@@ -5,7 +5,7 @@ import {
 } from "./X7FKJQME.js";
 import {
   usePopover
-} from "./J2DK7IKI.js";
+} from "./JHKKFNCJ.js";
 import {
   createComponent,
   createElement,

package/esm/__chunks/{X44LESGC.js → ISVIGIQD.js}

@@ -18,7 +18,7 @@ import {
 } from "./NQJBHION.js";
 import {
   useStoreState
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   useEvent,
   useId,

package/esm/__chunks/{RLFO7W2T.js → JFQ4TNZX.js}

@@ -10,7 +10,7 @@ import {
 } from "./W5P7IKOU.js";
 import {
   useCompositeItem
-} from "./LNROWH6D.js";
+} from "./VVJJXZ6R.js";
 import {
   createElement,
   createHook,
@@ -18,7 +18,7 @@ import {
 } from "./NQJBHION.js";
 import {
   useStoreState
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   useBooleanEvent,
   useEvent

package/esm/__chunks/{J2DK7IKI.js → JHKKFNCJ.js}

@@ -1,6 +1,6 @@
 import {
   useDialog
-} from "./5UGSKFCK.js";
+} from "./BIPBU2AE.js";
 import {
   PopoverContext
 } from "./6GS36SYX.js";

package/esm/__chunks/{LZ4RMGK5.js → JJW3R5IK.js}

@@ -1,7 +1,7 @@
 import {
   useStore,
   useStoreProps
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   __spreadValues
 } from "./PNRLI7OV.js";

package/esm/__chunks/{OQKUGLAX.js → JWSYWSCR.js}

@@ -11,7 +11,7 @@ import {
 } from "./NQJBHION.js";
 import {
   useStoreState
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   useEvent,
   useMergeRefs,

package/esm/__chunks/{HCZMY53N.js → LEBYH5FW.js}

@@ -6,7 +6,7 @@ import {
 } from "./FW6QFGFT.js";
 import {
   walkTreeOutside
-} from "./FV23EKJL.js";
+} from "./5M4ITSXL.js";
 
 // src/dialog/utils/mark-tree-outside.ts
 import { chain } from "@ariakit/core/utils/misc";
@@ -15,12 +15,18 @@ function getPropertyName(id = "", ancestor = false) {
 }
 function markElement(element, id = "") {
   return chain(
+    // Debug
+    // setAttribute(element, getPropertyName(), "true"),
+    // setAttribute(element, getPropertyName(id), "true"),
     setProperty(element, getPropertyName(), true),
     setProperty(element, getPropertyName(id), true)
   );
 }
 function markAncestor(element, id = "") {
   return chain(
+    // Debug
+    // setAttribute(element, getPropertyName("", true), "true"),
+    // setAttribute(element, getPropertyName(id, true), "true"),
     setProperty(element, getPropertyName("", true), true),
     setProperty(element, getPropertyName(id, true), true)
   );
@@ -48,7 +54,12 @@ function markTreeOutside(dialogId, ...elements) {
         return;
       cleanups.unshift(markElement(element, dialogId));
     },
-    (ancestor) => cleanups.unshift(markAncestor(ancestor, dialogId))
+    (ancestor, element) => {
+      const isAnotherDialogAncestor = element.hasAttribute("data-dialog") && element.id !== dialogId;
+      if (isAnotherDialogAncestor)
+        return;
+      cleanups.unshift(markAncestor(ancestor, dialogId));
+    }
   );
   const restoreAccessibilityTree = () => {
     cleanups.forEach((fn) => fn());

package/esm/__chunks/{563SOJCA.js → MXMUDZTV.js}

@@ -15,6 +15,28 @@ import { flushSync } from "react-dom";
 import { useSyncExternalStore } from "use-sync-external-store/shim/index.js";
 var noopSubscribe = () => () => {
 };
+var inFlushSyncContext = false;
+function safeFlushSync(fn, canFlushSync = true) {
+  if (inFlushSyncContext || !canFlushSync) {
+    fn();
+    return;
+  }
+  inFlushSyncContext = true;
+  const originalError = console.error;
+  if (process.env.NODE_ENV !== "production") {
+    console.error = (msg) => {
+      if (msg.startsWith("Warning: flushSync"))
+        return;
+      originalError(msg);
+    };
+  }
+  try {
+    flushSync(fn);
+  } finally {
+    console.error = originalError;
+    inFlushSyncContext = false;
+  }
+}
 function useStoreState(store, keyOrSelector = identity) {
   const getSnapshot = () => {
     if (!store)
@@ -43,6 +65,10 @@ function useStoreProps(store, props, key, setKey) {
     setValue: setKey ? props[setKey] : void 0
   });
   useSafeLayoutEffect(() => {
+    let canFlushSync = false;
+    queueMicrotask(() => {
+      canFlushSync = true;
+    });
     return store.sync(
       (state, prev) => {
         const { value: value2, setValue } = propsRef.current;
@@ -52,7 +78,7 @@ function useStoreProps(store, props, key, setKey) {
           return;
         if (state[key] === value2)
           return;
-        flushSync(() => setValue(state[key]));
+        safeFlushSync(() => setValue(state[key]), canFlushSync);
       },
       [key]
     );

package/esm/__chunks/{AR6DTI3S.js → NHPU54IO.js}

@@ -1,6 +1,6 @@
 import {
   hideElementFromAccessibilityTree
-} from "./CYJJUQU3.js";
+} from "./GDORSOK6.js";
 import {
   isBackdrop
 } from "./IXXFVVA2.js";
@@ -14,7 +14,7 @@ import {
 } from "./FW6QFGFT.js";
 import {
   walkTreeOutside
-} from "./FV23EKJL.js";
+} from "./5M4ITSXL.js";
 
 // src/dialog/utils/disable-tree-outside.ts
 import { contains } from "@ariakit/core/utils/dom";

package/esm/__chunks/{CTQHL4DC.js → OJNIJGF2.js}

@@ -3,7 +3,7 @@ import {
 } from "./6I2PARRP.js";
 import {
   useCompositeItem
-} from "./LNROWH6D.js";
+} from "./VVJJXZ6R.js";
 import {
   createElement,
   createHook,
@@ -11,7 +11,7 @@ import {
 } from "./NQJBHION.js";
 import {
   useStoreState
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   useEvent,
   useId,

package/esm/__chunks/{VJKEASM4.js → QLIKSQTQ.js}

@@ -7,7 +7,7 @@ import {
 } from "./NQJBHION.js";
 import {
   useStoreState
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   useBooleanEvent,
   useEvent,

package/esm/__chunks/{LYXIRVKB.js → RRY7OZXM.js}

@@ -1,10 +1,10 @@
 import {
   useDisclosureStoreOptions,
   useDisclosureStoreProps
-} from "./LZ4RMGK5.js";
+} from "./JJW3R5IK.js";
 import {
   useStore
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   __spreadValues
 } from "./PNRLI7OV.js";

package/esm/__chunks/{FAKCYHFK.js → SPTQP5I5.js}

@@ -1,11 +1,11 @@
 import {
   useDialogStoreOptions,
   useDialogStoreProps
-} from "./LYXIRVKB.js";
+} from "./RRY7OZXM.js";
 import {
   useStore,
   useStoreProps
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   __spreadValues
 } from "./PNRLI7OV.js";

package/esm/__chunks/{LNROWH6D.js → VVJJXZ6R.js}

@@ -21,7 +21,7 @@ import {
 } from "./NQJBHION.js";
 import {
   useStoreState
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   useBooleanEvent,
   useEvent,

package/esm/__chunks/{BFJZP2NO.js → WNGYZL6A.js}

@@ -1,7 +1,7 @@
 import {
   useStore,
   useStoreProps
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   __spreadValues
 } from "./PNRLI7OV.js";

package/esm/__chunks/{ZII73YFS.js → XE25NQP3.js}

@@ -1,6 +1,6 @@
 import {
   useCompositeItem
-} from "./LNROWH6D.js";
+} from "./VVJJXZ6R.js";
 import {
   createElement,
   createHook,

package/esm/__chunks/{4L6ILOIA.js → XEEFNNEM.js}

@@ -11,7 +11,7 @@ import {
 } from "./NQJBHION.js";
 import {
   useStoreState
-} from "./563SOJCA.js";
+} from "./MXMUDZTV.js";
 import {
   useEvent,
   useMergeRefs

package/esm/checkbox/checkbox-store.js

@@ -2,8 +2,8 @@ import {
   useCheckboxStore,
   useCheckboxStoreOptions,
   useCheckboxStoreProps
-} from "../__chunks/3QWF4P62.js";
-import "../__chunks/563SOJCA.js";
+} from "../__chunks/4LTL37RB.js";
+import "../__chunks/MXMUDZTV.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/checkbox/checkbox.js

@@ -1,13 +1,13 @@
 import {
   Checkbox,
   useCheckbox
-} from "../__chunks/OQKUGLAX.js";
+} from "../__chunks/JWSYWSCR.js";
 import "../__chunks/M5KYRTQG.js";
 import "../__chunks/P4RGQGTG.js";
 import "../__chunks/MYID4V27.js";
 import "../__chunks/BMLNRUFQ.js";
 import "../__chunks/NQJBHION.js";
-import "../__chunks/563SOJCA.js";
+import "../__chunks/MXMUDZTV.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/collection/collection-renderer.js

@@ -3,10 +3,10 @@ import {
   getCollectionRendererItem,
   getCollectionRendererItemId,
   useCollectionRenderer
-} from "../__chunks/VJKEASM4.js";
+} from "../__chunks/QLIKSQTQ.js";
 import "../__chunks/T3DJZG63.js";
 import "../__chunks/NQJBHION.js";
-import "../__chunks/563SOJCA.js";
+import "../__chunks/MXMUDZTV.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/collection/collection-store.js

@@ -2,8 +2,8 @@ import {
   useCollectionStore,
   useCollectionStoreOptions,
   useCollectionStoreProps
-} from "../__chunks/BFJZP2NO.js";
-import "../__chunks/563SOJCA.js";
+} from "../__chunks/WNGYZL6A.js";
+import "../__chunks/MXMUDZTV.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/combobox/combobox-item.js

@@ -7,7 +7,7 @@ import {
 } from "../__chunks/W5P7IKOU.js";
 import {
   useCompositeItem
-} from "../__chunks/LNROWH6D.js";
+} from "../__chunks/VVJJXZ6R.js";
 import "../__chunks/P4RGQGTG.js";
 import "../__chunks/HGFTMLQ7.js";
 import "../__chunks/T3DJZG63.js";
@@ -20,7 +20,7 @@ import {
   createHook,
   createMemoComponent
 } from "../__chunks/NQJBHION.js";
-import "../__chunks/563SOJCA.js";
+import "../__chunks/MXMUDZTV.js";
 import {
   useBooleanEvent,
   useEvent,

package/esm/combobox/combobox-popover.js

@@ -4,23 +4,23 @@ import {
 import "../__chunks/5VGBBGF5.js";
 import {
   usePopover
-} from "../__chunks/J2DK7IKI.js";
-import "../__chunks/5UGSKFCK.js";
-import "../__chunks/TM5MM3ME.js";
-import "../__chunks/AR6DTI3S.js";
-import "../__chunks/CYJJUQU3.js";
+} from "../__chunks/JHKKFNCJ.js";
+import "../__chunks/BIPBU2AE.js";
+import "../__chunks/H3BU75TA.js";
+import "../__chunks/NHPU54IO.js";
+import "../__chunks/GDORSOK6.js";
 import "../__chunks/3LAWLNOX.js";
 import "../__chunks/CJI67A3R.js";
 import "../__chunks/OEA63YXU.js";
-import "../__chunks/4XWTU3WN.js";
-import "../__chunks/HCZMY53N.js";
+import "../__chunks/E5XSMSHD.js";
+import "../__chunks/LEBYH5FW.js";
 import "../__chunks/IXXFVVA2.js";
 import "../__chunks/7JNF6I52.js";
 import "../__chunks/KOVUJERF.js";
 import "../__chunks/62DFK33R.js";
 import "../__chunks/FW6QFGFT.js";
 import "../__chunks/IYNN2ZO5.js";
-import "../__chunks/FV23EKJL.js";
+import "../__chunks/5M4ITSXL.js";
 import "../__chunks/6OMX4H3W.js";
 import "../__chunks/LL3AE4N4.js";
 import "../__chunks/EJ3GIT5B.js";
@@ -38,8 +38,8 @@ import {
   createElement,
   createHook
 } from "../__chunks/NQJBHION.js";
-import "../__chunks/LZ4RMGK5.js";
-import "../__chunks/563SOJCA.js";
+import "../__chunks/JJW3R5IK.js";
+import "../__chunks/MXMUDZTV.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import {