@ariakit/react-core 0.2.15 → 0.2.16

package/esm/__chunks/{ISVIGIQD.js → 6F6CCCKT.js}

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

package/esm/__chunks/{VVJJXZ6R.js → 7SIWUER2.js}

@@ -3,7 +3,7 @@ import {
 } from "./P4RGQGTG.js";
 import {
   useCollectionItem
-} from "./HGFTMLQ7.js";
+} from "./VFNGSUSF.js";
 import {
   focusSilently,
   getEnabledItem,
@@ -21,7 +21,7 @@ import {
 } from "./NQJBHION.js";
 import {
   useStoreState
-} from "./MXMUDZTV.js";
+} from "./QPTZ2G2N.js";
 import {
   useBooleanEvent,
   useEvent,

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

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

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

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

package/esm/__chunks/{4LTL37RB.js → CYNFBMYS.js}

@@ -1,7 +1,7 @@
 import {
   useStore,
   useStoreProps
-} from "./MXMUDZTV.js";
+} from "./QPTZ2G2N.js";
 
 // src/checkbox/checkbox-store.ts
 import * as Core from "@ariakit/core/checkbox/checkbox-store";

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

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

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

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

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

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

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

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

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

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

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

@@ -5,7 +5,7 @@ import {
 } from "./X7FKJQME.js";
 import {
   usePopover
-} from "./JHKKFNCJ.js";
+} from "./CU3AKJBN.js";
 import {
   createComponent,
   createElement,
@@ -39,6 +39,7 @@ import { contains } from "@ariakit/core/utils/dom";
 import { addGlobalEventListener } from "@ariakit/core/utils/events";
 import { hasFocusWithin } from "@ariakit/core/utils/focus";
 import { chain, isFalsyBooleanCallback } from "@ariakit/core/utils/misc";
+import { sync } from "@ariakit/core/utils/store";
 import { jsx } from "react/jsx-runtime";
 function isMovingOnHovercard(target, card, anchor, nested) {
   if (hasFocusWithin(card))
@@ -95,12 +96,9 @@ function useAutoFocusOnHide(_a) {
   });
   const finalFocusRef = useRef(null);
   useEffect(() => {
-    return store.sync(
-      (state) => {
-        finalFocusRef.current = state.anchorElement;
-      },
-      ["anchorElement"]
-    );
+    return sync(store, ["anchorElement"], (state) => {
+      finalFocusRef.current = state.anchorElement;
+    });
   }, []);
   props = __spreadProps(__spreadValues({
     autoFocusOnHide,

package/esm/__chunks/{OEA63YXU.js → PLOINBVB.js}

@@ -11,6 +11,7 @@ import {
   useState
 } from "react";
 import { chain } from "@ariakit/core/utils/misc";
+import { sync } from "@ariakit/core/utils/store";
 import { jsx } from "react/jsx-runtime";
 var NestedDialogsContext = createContext({});
 function useNestedDialogs(store) {
@@ -27,28 +28,21 @@ function useNestedDialogs(store) {
     [context]
   );
   useSafeLayoutEffect(() => {
-    return store.sync(
-      (state) => {
-        var _a;
-        if (!state.open)
-          return;
-        if (!state.contentElement)
-          return;
-        return (_a = context.add) == null ? void 0 : _a.call(context, store);
-      },
-      ["open", "contentElement"]
-    );
+    return sync(store, ["open", "contentElement"], (state) => {
+      var _a;
+      if (!state.open)
+        return;
+      if (!state.contentElement)
+        return;
+      return (_a = context.add) == null ? void 0 : _a.call(context, store);
+    });
   }, [store, context]);
   useSafeLayoutEffect(() => {
-    var _a;
-    return (_a = context.store) == null ? void 0 : _a.sync(
-      (state) => {
-        if (state.open)
-          return;
-        store.hide();
-      },
-      ["open"]
-    );
+    return sync(context.store, ["open"], (state) => {
+      if (state.open)
+        return;
+      store.hide();
+    });
   }, [context, store]);
   const providerValue = useMemo(() => ({ store, add }), [store, add]);
   const wrapElement = useCallback(

package/esm/__chunks/{XEEFNNEM.js → Q52PUUUL.js}

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

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

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

package/esm/__chunks/{MXMUDZTV.js → QPTZ2G2N.js}

@@ -9,8 +9,9 @@ import {
 } from "./PNRLI7OV.js";
 
 // src/utils/store.tsx
-import { useCallback, useMemo } from "react";
+import * as React from "react";
 import { hasOwnProperty, identity } from "@ariakit/core/utils/misc";
+import { batch, init, subscribe, sync } from "@ariakit/core/utils/store";
 import { flushSync } from "react-dom";
 import { useSyncExternalStore } from "use-sync-external-store/shim/index.js";
 var noopSubscribe = () => () => {
@@ -38,6 +39,14 @@ function safeFlushSync(fn, canFlushSync = true) {
   }
 }
 function useStoreState(store, keyOrSelector = identity) {
+  const storeSubscribe = React.useCallback(
+    (callback) => {
+      if (!store)
+        return noopSubscribe();
+      return subscribe(store, null, callback);
+    },
+    [store]
+  );
   const getSnapshot = () => {
     if (!store)
       return;
@@ -52,11 +61,7 @@ function useStoreState(store, keyOrSelector = identity) {
       return;
     return state[key];
   };
-  return useSyncExternalStore(
-    (store == null ? void 0 : store.subscribe) || noopSubscribe,
-    getSnapshot,
-    getSnapshot
-  );
+  return useSyncExternalStore(storeSubscribe, getSnapshot, getSnapshot);
 }
 function useStoreProps(store, props, key, setKey) {
   const value = hasOwnProperty(props, key) ? props[key] : void 0;
@@ -69,36 +74,36 @@ function useStoreProps(store, props, key, setKey) {
     queueMicrotask(() => {
       canFlushSync = true;
     });
-    return store.sync(
-      (state, prev) => {
-        const { value: value2, setValue } = propsRef.current;
-        if (!setValue)
-          return;
-        if (state[key] === prev[key])
-          return;
-        if (state[key] === value2)
-          return;
-        safeFlushSync(() => setValue(state[key]), canFlushSync);
-      },
-      [key]
-    );
+    return sync(store, [key], (state, prev) => {
+      const { value: value2, setValue } = propsRef.current;
+      if (!setValue)
+        return;
+      if (state[key] === prev[key])
+        return;
+      if (state[key] === value2)
+        return;
+      safeFlushSync(() => setValue(state[key]), canFlushSync);
+    });
   }, [store, key]);
   useSafeLayoutEffect(() => {
-    return store.sync(() => {
+    return batch(store, [key], () => {
       if (value === void 0)
         return;
       store.setState(key, value);
-    }, [key]);
+    });
   }, [store, key, value]);
 }
 function useStore(createStore) {
   const store = useLazyValue(createStore);
-  useSafeLayoutEffect(() => store.init(), [store]);
-  const useState = useCallback(
+  useSafeLayoutEffect(() => init(store), [store]);
+  const useState = React.useCallback(
     (keyOrSelector) => useStoreState(store, keyOrSelector),
     [store]
   );
-  return useMemo(() => __spreadProps(__spreadValues({}, store), { useState }), [store, useState]);
+  return React.useMemo(
+    () => __spreadProps(__spreadValues({}, store), { useState }),
+    [store, useState]
+  );
 }
 
 export {

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

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

package/esm/__chunks/{BIPBU2AE.js → TG7IDXTX.js}

@@ -1,6 +1,6 @@
 import {
   DialogBackdrop
-} from "./H3BU75TA.js";
+} from "./432NLB7J.js";
 import {
   disableTreeOutside
 } from "./NHPU54IO.js";
@@ -12,7 +12,7 @@ import {
 } from "./3LAWLNOX.js";
 import {
   useNestedDialogs
-} from "./OEA63YXU.js";
+} from "./PLOINBVB.js";
 import {
   useHideOnInteractOutside
 } from "./E5XSMSHD.js";
@@ -166,7 +166,7 @@ var useDialog = createHook(
       if (dialog && contains(dialog, activeElement))
         return;
       store.setDisclosureElement(activeElement);
-    }, [open]);
+    }, [open, store]);
     if (isSafariBrowser) {
       useEffect(() => {
         if (!mounted)
@@ -194,7 +194,7 @@ var useDialog = createHook(
         return () => {
           disclosureElement.removeEventListener("mousedown", onMouseDown);
         };
-      }, [mounted]);
+      }, [mounted, store]);
     }
     const shouldDisableAccessibilityTree = modal || // Usually, we only want to disable the accessibility tree outside if the
     // dialog is a modal. But the Portal component can't preserve the tab
@@ -405,7 +405,7 @@ var useDialog = createHook(
         store.hide();
       };
       return addGlobalEventListener("keydown", onKeyDown);
-    }, [mounted, domReady, hideOnEscapeProp]);
+    }, [mounted, domReady, store, hideOnEscapeProp]);
     props = useWrapElement(
       props,
       (element) => /* @__PURE__ */ jsx(HeadingLevel, { level: modal ? 1 : void 0, children: element }),

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

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

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

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

package/esm/__chunks/{HGFTMLQ7.js → VFNGSUSF.js}

@@ -17,7 +17,7 @@ import {
 } from "./PNRLI7OV.js";
 
 // src/collection/collection-item.ts
-import { useCallback, useContext, useRef } from "react";
+import { useContext, useEffect, useRef } from "react";
 import { identity } from "@ariakit/core/utils/misc";
 var useCollectionItem = createHook(
   (_a) => {
@@ -36,18 +36,18 @@ var useCollectionItem = createHook(
     const context = useContext(CollectionContext);
     store = store || context;
     const id = useId(props.id);
-    const unrenderItem = useRef();
-    const ref = useCallback(
-      (element2) => {
-        var _a2;
-        if (!element2 || !id || !shouldRegisterItem) {
-          return (_a2 = unrenderItem.current) == null ? void 0 : _a2.call(unrenderItem);
-        }
-        const item = getItem({ id, element: element2 });
-        unrenderItem.current = store == null ? void 0 : store.renderItem(item);
-      },
-      [id, shouldRegisterItem, getItem, store]
-    );
+    const ref = useRef(element);
+    useEffect(() => {
+      const element2 = ref.current;
+      if (!id)
+        return;
+      if (!element2)
+        return;
+      if (!shouldRegisterItem)
+        return;
+      const item = getItem({ id, element: element2 });
+      return store == null ? void 0 : store.renderItem(item);
+    }, [id, shouldRegisterItem, getItem, store]);
     props = __spreadProps(__spreadValues({}, props), {
       ref: useMergeRefs(ref, props.ref)
     });

package/esm/__chunks/{36V3RYFS.js → X5CHG5LF.js}

@@ -1,11 +1,11 @@
 import {
   useCollectionStoreOptions,
   useCollectionStoreProps
-} from "./WNGYZL6A.js";
+} from "./FSTINJD5.js";
 import {
   useStore,
   useStoreProps
-} from "./MXMUDZTV.js";
+} from "./QPTZ2G2N.js";
 import {
   __spreadValues
 } from "./PNRLI7OV.js";

package/esm/__chunks/{I3PXTXPI.js → Y5XLHDDM.js}

@@ -24,6 +24,7 @@ import { addGlobalEventListener } from "@ariakit/core/utils/events";
 var useHovercardAnchor = createHook(
   (_a) => {
     var _b = _a, { store, showOnHover = true } = _b, props = __objRest(_b, ["store", "showOnHover"]);
+    const mounted = store.useState("mounted");
     const disabled = props.disabled || props["aria-disabled"] === true || props["aria-disabled"] === "true";
     const showTimeoutRef = useRef(0);
     useEffect(() => () => window.clearTimeout(showTimeoutRef.current), []);
@@ -66,7 +67,14 @@ var useHovercardAnchor = createHook(
       }
     );
     props = __spreadProps(__spreadValues({}, props), {
-      ref: useMergeRefs(store.setAnchorElement, props.ref),
+      ref: useMergeRefs(
+        store.setAnchorElement,
+        // We need to set the anchor element as the hovercard disclosure
+        // disclosure element only when the hovercard is shown so it doesn't get
+        // assigned an arbitrary element by the dialog component.
+        mounted ? store.setDisclosureElement : void 0,
+        props.ref
+      ),
       onMouseMove
     });
     props = useFocusable(props);

package/esm/checkbox/checkbox-store.js

@@ -2,8 +2,8 @@ import {
   useCheckboxStore,
   useCheckboxStoreOptions,
   useCheckboxStoreProps
-} from "../__chunks/4LTL37RB.js";
-import "../__chunks/MXMUDZTV.js";
+} from "../__chunks/CYNFBMYS.js";
+import "../__chunks/QPTZ2G2N.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/JWSYWSCR.js";
+} from "../__chunks/R4VIEIUH.js";
 import "../__chunks/M5KYRTQG.js";
 import "../__chunks/P4RGQGTG.js";
 import "../__chunks/MYID4V27.js";
 import "../__chunks/BMLNRUFQ.js";
 import "../__chunks/NQJBHION.js";
-import "../__chunks/MXMUDZTV.js";
+import "../__chunks/QPTZ2G2N.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/collection/collection-item.js

@@ -1,7 +1,7 @@
 import {
   CollectionItem,
   useCollectionItem
-} from "../__chunks/HGFTMLQ7.js";
+} from "../__chunks/VFNGSUSF.js";
 import "../__chunks/T3DJZG63.js";
 import "../__chunks/NQJBHION.js";
 import "../__chunks/J7Q2EO23.js";

package/esm/collection/collection-renderer.js

@@ -3,10 +3,10 @@ import {
   getCollectionRendererItem,
   getCollectionRendererItemId,
   useCollectionRenderer
-} from "../__chunks/QLIKSQTQ.js";
+} from "../__chunks/5PDNXTAR.js";
 import "../__chunks/T3DJZG63.js";
 import "../__chunks/NQJBHION.js";
-import "../__chunks/MXMUDZTV.js";
+import "../__chunks/QPTZ2G2N.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/WNGYZL6A.js";
-import "../__chunks/MXMUDZTV.js";
+} from "../__chunks/FSTINJD5.js";
+import "../__chunks/QPTZ2G2N.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/combobox/combobox-item.js

@@ -7,9 +7,9 @@ import {
 } from "../__chunks/W5P7IKOU.js";
 import {
   useCompositeItem
-} from "../__chunks/VVJJXZ6R.js";
+} from "../__chunks/7SIWUER2.js";
 import "../__chunks/P4RGQGTG.js";
-import "../__chunks/HGFTMLQ7.js";
+import "../__chunks/VFNGSUSF.js";
 import "../__chunks/T3DJZG63.js";
 import "../__chunks/OXPV2NBK.js";
 import "../__chunks/WJ37OVG2.js";
@@ -20,7 +20,7 @@ import {
   createHook,
   createMemoComponent
 } from "../__chunks/NQJBHION.js";
-import "../__chunks/MXMUDZTV.js";
+import "../__chunks/QPTZ2G2N.js";
 import {
   useBooleanEvent,
   useEvent,

package/esm/combobox/combobox-popover.js

@@ -4,14 +4,14 @@ import {
 import "../__chunks/5VGBBGF5.js";
 import {
   usePopover
-} from "../__chunks/JHKKFNCJ.js";
-import "../__chunks/BIPBU2AE.js";
-import "../__chunks/H3BU75TA.js";
+} from "../__chunks/CU3AKJBN.js";
+import "../__chunks/TG7IDXTX.js";
+import "../__chunks/432NLB7J.js";
 import "../__chunks/NHPU54IO.js";
 import "../__chunks/GDORSOK6.js";
 import "../__chunks/3LAWLNOX.js";
 import "../__chunks/CJI67A3R.js";
-import "../__chunks/OEA63YXU.js";
+import "../__chunks/PLOINBVB.js";
 import "../__chunks/E5XSMSHD.js";
 import "../__chunks/LEBYH5FW.js";
 import "../__chunks/IXXFVVA2.js";
@@ -38,8 +38,8 @@ import {
   createElement,
   createHook
 } from "../__chunks/NQJBHION.js";
-import "../__chunks/JJW3R5IK.js";
-import "../__chunks/MXMUDZTV.js";
+import "../__chunks/F6PEGR7W.js";
+import "../__chunks/QPTZ2G2N.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import {

package/esm/combobox/combobox-store.js

@@ -1,18 +1,18 @@
 import {
   useCompositeStoreOptions,
   useCompositeStoreProps
-} from "../__chunks/36V3RYFS.js";
-import "../__chunks/WNGYZL6A.js";
+} from "../__chunks/X5CHG5LF.js";
+import "../__chunks/FSTINJD5.js";
 import {
   usePopoverStoreOptions,
   usePopoverStoreProps
-} from "../__chunks/SPTQP5I5.js";
-import "../__chunks/RRY7OZXM.js";
-import "../__chunks/JJW3R5IK.js";
+} from "../__chunks/EICJBDBV.js";
+import "../__chunks/FW5SU7FV.js";
+import "../__chunks/F6PEGR7W.js";
 import {
   useStore,
   useStoreProps
-} from "../__chunks/MXMUDZTV.js";
+} from "../__chunks/QPTZ2G2N.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import {

package/esm/combobox/combobox.js

@@ -271,9 +271,6 @@ var useCombobox = createHook(
           setCanInline(textInserted && caretAtEnd);
         }
       }
-      if (showOnChangeProp(event)) {
-        store.show();
-      }
       if (setValueOnChangeProp(event)) {
         const isSameValue = value2 === store.getState().value;
         store.setValue(value2);
@@ -281,6 +278,9 @@ var useCombobox = createHook(
           forceValueUpdate();
         }
       }
+      if (showOnChangeProp(event)) {
+        store.show();
+      }
       if (!autoSelect || !canAutoSelectRef.current) {
         store.setActiveId(null);
       }