@ariakit/react-core 0.3.0 → 0.3.2

package/cjs/utils/store.cjs

@@ -2,7 +2,7 @@
 
 
 
-var _42FA4OOBcjs = require('../__chunks/42FA4OOB.cjs');
+var _I63PYP2Ucjs = require('../__chunks/I63PYP2U.cjs');
 require('../__chunks/5WLTMVVQ.cjs');
 require('../__chunks/7WUTS26Y.cjs');
 require('../__chunks/72I2GWXF.cjs');
@@ -10,4 +10,4 @@ require('../__chunks/72I2GWXF.cjs');
 
 
 
-exports.useStore = _42FA4OOBcjs.useStore; exports.useStoreProps = _42FA4OOBcjs.useStoreProps; exports.useStoreState = _42FA4OOBcjs.useStoreState;
+exports.useStore = _I63PYP2Ucjs.useStore; exports.useStoreProps = _I63PYP2Ucjs.useStoreProps; exports.useStoreState = _I63PYP2Ucjs.useStoreState;

package/cjs/utils/store.d.ts

@@ -41,7 +41,7 @@ export declare function useStoreState<T extends CoreStore, V>(store: T | null |
  * @param key The key of the value prop.
  * @param setKey The key of the setValue prop.
  */
-export declare function useStoreProps<S extends State, T extends CoreStore<S>, P extends S, K extends keyof S & keyof P, SK extends keyof PickByValue<P, SetState<P[K]>>>(store: T, props: P, key: K, setKey?: SK): void;
+export declare function useStoreProps<S extends State, P extends Partial<S>, K extends keyof S, SK extends keyof PickByValue<P, SetState<P[K]>>>(store: CoreStore<S>, props: P, key: K, setKey?: SK): void;
 /**
  * Creates a React store from a core store object and returns a tuple with the
  * store and a function to update the store.

package/esm/__chunks/{VJZYCNOA.js → 34JEM52B.js}

@@ -5,7 +5,7 @@ import {
 } from "./X7FKJQME.js";
 import {
   usePopover
-} from "./XWFU333Y.js";
+} from "./GP4UGJIZ.js";
 import {
   HovercardScopedContextProvider,
   useHovercardProviderContext

package/esm/__chunks/{B7CSN7VQ.js → 35WVCYXU.js}

@@ -1,10 +1,10 @@
 import {
   useCompositeStoreProps
-} from "./FGP6QO3O.js";
+} from "./WGAKICTY.js";
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   __spreadProps,
   __spreadValues

package/esm/__chunks/{XIRNSMZD.js → 3HFOFZP4.js}

@@ -7,7 +7,7 @@ import {
 } from "./CFEUKV6C.js";
 import {
   useStoreState
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useBooleanEvent,
   useEvent,

package/esm/__chunks/{D4PXCBCI.js → 4RP654JS.js}

@@ -1,6 +1,6 @@
 import {
   DialogBackdrop
-} from "./HJPDTCDL.js";
+} from "./W575AF63.js";
 import {
   useNestedDialogs
 } from "./PLOINBVB.js";
@@ -376,7 +376,7 @@ var useDialog = createHook(
       },
       [store, finalFocus, autoFocusOnHideProp]
     );
-    useEffect(() => {
+    useSafeLayoutEffect(() => {
       if (open)
         return;
       if (!hasOpened)

package/esm/__chunks/{42I26D5Z.js → 4SB2BYFE.js}

@@ -3,14 +3,14 @@ import {
 } from "./QP4RN5UY.js";
 import {
   useCompositeStoreProps
-} from "./FGP6QO3O.js";
+} from "./WGAKICTY.js";
 import {
   usePopoverStoreProps
-} from "./DORFNB2S.js";
+} from "./H2BG4QDT.js";
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useUpdateEffect
 } from "./J7Q2EO23.js";

package/esm/__chunks/{XXOVOOT3.js → 4WK6LN27.js}

@@ -1,10 +1,10 @@
 import {
   useCompositeStoreProps
-} from "./FGP6QO3O.js";
+} from "./WGAKICTY.js";
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 
 // src/radio/radio-store.ts
 import * as Core from "@ariakit/core/radio/radio-store";

package/esm/__chunks/{6TWF32ML.js → 72OJKUSZ.js}

@@ -21,7 +21,7 @@ import {
 } from "./CFEUKV6C.js";
 import {
   useStoreState
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useBooleanEvent,
   useEvent,

package/esm/__chunks/{UHPQRTV4.js → A2ONBKVT.js}

@@ -1,16 +1,17 @@
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useUpdateEffect
 } from "./J7Q2EO23.js";
 
 // src/disclosure/disclosure-store.ts
 import * as Core from "@ariakit/core/disclosure/disclosure-store";
-function useDisclosureStoreProps(store, update, props, deps = []) {
-  useUpdateEffect(update, [props.store, props.disclosure, ...deps]);
+function useDisclosureStoreProps(store, update, props) {
+  useUpdateEffect(update, [props.store, props.disclosure]);
   useStoreProps(store, props, "open", "setOpen");
+  useStoreProps(store, props, "mounted", "setMounted");
   useStoreProps(store, props, "animated");
   return store;
 }

package/esm/__chunks/{43SODXOT.js → C5JX5C3O.js}

@@ -1,7 +1,7 @@
 import {
   getCollectionRendererItemId,
   useCollectionRenderer
-} from "./XIRNSMZD.js";
+} from "./3HFOFZP4.js";
 import {
   useCompositeContext
 } from "./5C7J4IAS.js";
@@ -11,7 +11,7 @@ import {
 } from "./CFEUKV6C.js";
 import {
   useStoreState
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useId
 } from "./J7Q2EO23.js";

package/esm/__chunks/{QOBIUWMN.js → EKIHOHWR.js}

@@ -10,7 +10,7 @@ import {
 } from "./XCH4OEEE.js";
 import {
   useCompositeItem
-} from "./6TWF32ML.js";
+} from "./72OJKUSZ.js";
 import {
   createElement,
   createHook,
@@ -18,7 +18,7 @@ import {
 } from "./CFEUKV6C.js";
 import {
   useStoreState
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useBooleanEvent,
   useEvent

package/esm/__chunks/{HVG5WXKX.js → FBTQUSIH.js}

@@ -1,10 +1,10 @@
 import {
   useCollectionStoreProps
-} from "./JEQRR7AL.js";
+} from "./NWDF5QDV.js";
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useEvent
 } from "./J7Q2EO23.js";

package/esm/__chunks/{XWFU333Y.js → GP4UGJIZ.js}

@@ -1,6 +1,6 @@
 import {
   useDialog
-} from "./D4PXCBCI.js";
+} from "./4RP654JS.js";
 import {
   PopoverScopedContextProvider,
   usePopoverProviderContext

package/esm/__chunks/{DORFNB2S.js → H2BG4QDT.js}

@@ -1,10 +1,10 @@
 import {
   useDialogStoreProps
-} from "./6X2TPJLY.js";
+} from "./UY3UQ4QI.js";
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useUpdateEffect
 } from "./J7Q2EO23.js";

package/esm/__chunks/{665VBEVH.js → HGW6FZYU.js}

@@ -14,7 +14,7 @@ import {
 } from "./CFEUKV6C.js";
 import {
   useStoreState
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useEvent,
   useMergeRefs,

package/esm/__chunks/{KFYG52K5.js → HZPJPDJY.js}

@@ -1,10 +1,10 @@
 import {
   useHovercardStoreProps
-} from "./SNU4EYPS.js";
+} from "./UQFOL5I6.js";
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 
 // src/tooltip/tooltip-store.ts
 import * as Core from "@ariakit/core/tooltip/tooltip-store";

package/esm/__chunks/{JJMBJNG5.js → IFNQMENS.js}

@@ -7,14 +7,14 @@ import {
 } from "./QP4RN5UY.js";
 import {
   useCompositeStoreProps
-} from "./FGP6QO3O.js";
+} from "./WGAKICTY.js";
 import {
   useHovercardStoreProps
-} from "./SNU4EYPS.js";
+} from "./UQFOL5I6.js";
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useUpdateEffect
 } from "./J7Q2EO23.js";

package/esm/__chunks/{U47NFJA3.js → IZ6ZARCP.js}

@@ -11,7 +11,7 @@ import {
 } from "./CFEUKV6C.js";
 import {
   useStoreState
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useEvent,
   useMergeRefs

package/esm/__chunks/{3CKB7HAW.js → K6BB6DTS.js}

@@ -1,9 +1,9 @@
 import {
   useCompositeStoreProps
-} from "./FGP6QO3O.js";
+} from "./WGAKICTY.js";
 import {
   useStore
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 
 // src/menu/menu-bar-store.ts
 import * as Core from "@ariakit/core/menu/menu-bar-store";

package/esm/__chunks/{TUPK6PWU.js → KZMKUBQH.js}

@@ -1,7 +1,7 @@
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useUpdateEffect
 } from "./J7Q2EO23.js";

package/esm/__chunks/{JEQRR7AL.js → NWDF5QDV.js}

@@ -1,7 +1,7 @@
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useUpdateEffect
 } from "./J7Q2EO23.js";

package/esm/__chunks/{NVEAMD2G.js → R4FKKQYI.js}

@@ -3,7 +3,7 @@ import {
 } from "./NRFPH2ON.js";
 import {
   useCompositeItem
-} from "./6TWF32ML.js";
+} from "./72OJKUSZ.js";
 import {
   createElement,
   createHook,
@@ -11,7 +11,7 @@ import {
 } from "./CFEUKV6C.js";
 import {
   useStoreState
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useEvent,
   useId,

package/esm/__chunks/{552DU7SQ.js → RJEKIG5Y.js}

@@ -1,6 +1,6 @@
 import {
   useCompositeItem
-} from "./6TWF32ML.js";
+} from "./72OJKUSZ.js";
 import {
   useToolbarContext
 } from "./IPFII6JW.js";

package/esm/__chunks/{SNU4EYPS.js → UQFOL5I6.js}

@@ -1,10 +1,10 @@
 import {
   usePopoverStoreProps
-} from "./DORFNB2S.js";
+} from "./H2BG4QDT.js";
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 
 // src/hovercard/hovercard-store.ts
 import * as Core from "@ariakit/core/hovercard/hovercard-store";

package/esm/__chunks/{6X2TPJLY.js → UY3UQ4QI.js}

@@ -1,9 +1,9 @@
 import {
   useDisclosureStoreProps
-} from "./UHPQRTV4.js";
+} from "./A2ONBKVT.js";
 import {
   useStore
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 
 // src/dialog/dialog-store.ts
 import * as Core from "@ariakit/core/dialog/dialog-store";

package/esm/__chunks/{2JWPGQQP.js → V5EW3YHP.js}

@@ -1,13 +1,13 @@
 import {
   useCompositeStoreProps
-} from "./FGP6QO3O.js";
+} from "./WGAKICTY.js";
 import {
   usePopoverStoreProps
-} from "./DORFNB2S.js";
+} from "./H2BG4QDT.js";
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 
 // src/combobox/combobox-store.ts
 import * as Core from "@ariakit/core/combobox/combobox-store";

package/esm/__chunks/{O5UELQLV.js → VDTDCNMP.js}

@@ -18,7 +18,7 @@ import {
 } from "./CFEUKV6C.js";
 import {
   useStoreState
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 import {
   useEvent,
   useId,

package/esm/__chunks/{AAS6MDEM.js → VPTWELSR.js}

@@ -1,9 +1,9 @@
 import {
   useCompositeStoreProps
-} from "./FGP6QO3O.js";
+} from "./WGAKICTY.js";
 import {
   useStore
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 
 // src/toolbar/toolbar-store.ts
 import * as Core from "@ariakit/core/toolbar/toolbar-store";

package/esm/__chunks/{HJPDTCDL.js → W575AF63.js}

@@ -9,7 +9,7 @@ import {
 } from "./3D7ZB3CS.js";
 import {
   useDisclosureStore
-} from "./UHPQRTV4.js";
+} from "./A2ONBKVT.js";
 import {
   useMergeRefs,
   useSafeLayoutEffect

package/esm/__chunks/{FGP6QO3O.js → WGAKICTY.js}

@@ -1,10 +1,10 @@
 import {
   useCollectionStoreProps
-} from "./JEQRR7AL.js";
+} from "./NWDF5QDV.js";
 import {
   useStore,
   useStoreProps
-} from "./L3AX6U5E.js";
+} from "./XXO3VVQU.js";
 
 // src/composite/composite-store.ts
 import * as Core from "@ariakit/core/composite/composite-store";

package/esm/__chunks/{L3AX6U5E.js → XXO3VVQU.js}

@@ -66,10 +66,8 @@ function useStoreState(store, keyOrSelector = identity) {
 }
 function useStoreProps(store, props, key, setKey) {
   const value = hasOwnProperty(props, key) ? props[key] : void 0;
-  const propsRef = useLiveRef({
-    value,
-    setValue: setKey ? props[setKey] : void 0
-  });
+  const setValue = setKey ? props[setKey] : void 0;
+  const propsRef = useLiveRef({ value, setValue });
   const canSyncValue = React.useRef(true);
   useSafeLayoutEffect(() => {
     let canFlushSync = false;
@@ -77,15 +75,20 @@ function useStoreProps(store, props, key, setKey) {
       canFlushSync = true;
     });
     return sync(store, [key], (state, prev) => {
-      const { value: value2, setValue } = propsRef.current;
-      if (!setValue)
+      const { value: value2, setValue: setValue2 } = propsRef.current;
+      if (!setValue2)
         return;
       if (state[key] === prev[key])
         return;
       if (state[key] === value2)
         return;
-      canSyncValue.current = false;
-      safeFlushSync(() => setValue(state[key]), canFlushSync);
+      if (!canFlushSync) {
+        canSyncValue.current = false;
+        queueMicrotask(() => {
+          canSyncValue.current = true;
+        });
+      }
+      safeFlushSync(() => setValue2(state[key]), canFlushSync);
     });
   }, [store, key]);
   useSafeLayoutEffect(() => {
@@ -97,7 +100,7 @@ function useStoreProps(store, props, key, setKey) {
         return;
       store.setState(key, value);
     });
-  });
+  }, [store, key, value]);
 }
 function useStore(createStore, props) {
   const [store, setStore] = React.useState(() => createStore(props));

package/esm/checkbox/checkbox-provider.js

@@ -1,11 +1,11 @@
 import {
   useCheckboxStore
-} from "../__chunks/TUPK6PWU.js";
+} from "../__chunks/KZMKUBQH.js";
 import {
   CheckboxContextProvider
 } from "../__chunks/ICL2YIES.js";
 import "../__chunks/CFEUKV6C.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/checkbox/checkbox-store.js

@@ -1,8 +1,8 @@
 import {
   useCheckboxStore,
   useCheckboxStoreProps
-} from "../__chunks/TUPK6PWU.js";
-import "../__chunks/L3AX6U5E.js";
+} from "../__chunks/KZMKUBQH.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/checkbox/checkbox.d.ts

@@ -27,12 +27,15 @@ export declare const useCheckbox: import("../utils/types.js").Hook<CheckboxOptio
 export declare const Checkbox: import("../utils/types.js").Component<CheckboxOptions<"input">>;
 export interface CheckboxOptions<T extends As = "input"> extends CommandOptions<T> {
     /**
-     * Object returned by the `useCheckboxStore` hook. If not provided, the
-     * internal store will be used.
+     * Object returned by the
+     * [`useCheckboxStore`](https://ariakit.org/reference/use-checkbox-store)
+     * hook. If not provided, the closest
+     * [`CheckboxProvider`](https://ariakit.org/reference/checkbox-provider)
+     * component's context will be used. Otherwise, the component will fall back
+     * to an internal store.
      *
      * Live examples:
      * - [Checkbox as button](https://ariakit.org/examples/checkbox-as-button)
-     * - [Custom Checkbox](https://ariakit.org/examples/checkbox-custom)
      */
     store?: CheckboxStore;
     /**
@@ -42,14 +45,14 @@ export interface CheckboxOptions<T extends As = "input"> extends CommandOptions<
      *
      * Live examples:
      * - [Checkbox group](https://ariakit.org/examples/checkbox-group)
+     * - [MenuItemCheckbox](https://ariakit.org/examples/menu-item-checkbox)
      * @example
      * ```jsx
-     * const checkbox = useCheckboxStore({
-     *   defaultValue: ["Apple", "Orange"],
-     * });
-     * <Checkbox store={checkbox} value="Apple" />
-     * <Checkbox store={checkbox} value="Orange" />
-     * <Checkbox store={checkbox} value="Watermelon" />
+     * <CheckboxProvider defaultValue={["Apple", "Orange"]}>
+     *   <Checkbox value="Apple" />
+     *   <Checkbox value="Orange" />
+     *   <Checkbox value="Watermelon" />
+     * </CheckboxProvider>
      * ```
      */
     value?: InputHTMLAttributes<HTMLInputElement>["value"];

package/esm/checkbox/checkbox.js

@@ -1,14 +1,14 @@
 import {
   Checkbox,
   useCheckbox
-} from "../__chunks/665VBEVH.js";
+} from "../__chunks/HGW6FZYU.js";
 import "../__chunks/ICL2YIES.js";
 import "../__chunks/M5KYRTQG.js";
 import "../__chunks/LND6SMHN.js";
 import "../__chunks/M4OAD5XF.js";
 import "../__chunks/BMLNRUFQ.js";
 import "../__chunks/CFEUKV6C.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/collection/collection-provider.js

@@ -1,11 +1,11 @@
 import {
   useCollectionStore
-} from "../__chunks/JEQRR7AL.js";
+} from "../__chunks/NWDF5QDV.js";
 import {
   CollectionContextProvider
 } from "../__chunks/74KKBFVP.js";
 import "../__chunks/CFEUKV6C.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/XXO3VVQU.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/XIRNSMZD.js";
+} from "../__chunks/3HFOFZP4.js";
 import "../__chunks/74KKBFVP.js";
 import "../__chunks/CFEUKV6C.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/collection/collection-store.js

@@ -1,8 +1,8 @@
 import {
   useCollectionStore,
   useCollectionStoreProps
-} from "../__chunks/JEQRR7AL.js";
-import "../__chunks/L3AX6U5E.js";
+} from "../__chunks/NWDF5QDV.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/collection/collection.d.ts

@@ -35,7 +35,11 @@ export declare const useCollection: import("../utils/types.js").Hook<CollectionO
 export declare const Collection: import("../utils/types.js").Component<CollectionOptions<"div">>;
 export interface CollectionOptions<T extends As = "div"> extends Options<T> {
     /**
-     * Object returned by the `useCollectionStore` hook.
+     * Object returned by the
+     * [`useCollectionStore`](https://ariakit.org/reference/use-collection-store)
+     * hook. If not provided, the closest
+     * [`CollectionProvider`](https://ariakit.org/reference/collection-provider)
+     * component's context will be used.
      */
     store?: CollectionStore;
 }

package/esm/combobox/combobox-cancel.d.ts

@@ -19,20 +19,25 @@ export declare const useComboboxCancel: import("../utils/types.js").Hook<Combobo
  * @see https://ariakit.org/components/combobox
  * @example
  * ```jsx
- * const combobox = useComboboxStore();
- * <Combobox store={combobox} />
- * <ComboboxCancel store={combobox} />
- * <ComboboxPopover store={combobox}>
- *   <ComboboxItem value="Item 1" />
- *   <ComboboxItem value="Item 2" />
- *   <ComboboxItem value="Item 3" />
- * </ComboboxPopover>
+ * <ComboboxProvider>
+ *   <Combobox />
+ *   <ComboboxCancel />
+ *   <ComboboxPopover>
+ *     <ComboboxItem value="Apple" />
+ *     <ComboboxItem value="Banana" />
+ *     <ComboboxItem value="Orange" />
+ *   </ComboboxPopover>
+ * </ComboboxProvider>
  * ```
  */
 export declare const ComboboxCancel: import("../utils/types.js").Component<ComboboxCancelOptions<"button">>;
 export interface ComboboxCancelOptions<T extends As = "button"> extends ButtonOptions<T> {
     /**
-     * Object returned by the `useComboboxStore` hook.
+     * Object returned by the
+     * [`useComboboxStore`](https://ariakit.org/reference/use-combobox-store)
+     * hook. If not provided, the closest
+     * [`ComboboxProvider`](https://ariakit.org/reference/combobox-provider)
+     * component's context will be used.
      */
     store?: ComboboxStore;
 }