@ariakit/react-core 0.4.23 → 0.4.25

package/cjs/combobox/combobox-store.d.ts

@@ -14,8 +14,8 @@ export declare function useComboboxStoreProps<T extends Core.ComboboxStore>(stor
 };
 /**
  * Creates a combobox store to control the state of
- * [Combobox](https://ariakit.org/components/combobox) components.
- * @see https://ariakit.org/components/combobox
+ * [Combobox](https://ariakit.com/components/combobox) components.
+ * @see https://ariakit.com/components/combobox
  * @example
  * ```jsx
  * const combobox = useComboboxStore();
@@ -42,33 +42,33 @@ export interface ComboboxStoreFunctions<T extends ComboboxStoreSelectedValue = C
 export interface ComboboxStoreOptions<T extends ComboboxStoreSelectedValue = ComboboxStoreSelectedValue> extends Omit<Core.ComboboxStoreOptions<T>, "tag" | "disclosure">, CompositeStoreOptions<ComboboxStoreItem>, PopoverStoreOptions {
     /**
      * A callback that gets called when the
-     * [`value`](https://ariakit.org/reference/combobox-provider#value) state
+     * [`value`](https://ariakit.com/reference/combobox-provider#value) state
      * changes.
      *
      * Live examples:
      * - [Combobox with integrated
-     *   filter](https://ariakit.org/examples/combobox-filtering-integrated)
-     * - [ComboboxGroup](https://ariakit.org/examples/combobox-group)
-     * - [Combobox with links](https://ariakit.org/examples/combobox-links)
+     *   filter](https://ariakit.com/examples/combobox-filtering-integrated)
+     * - [ComboboxGroup](https://ariakit.com/examples/combobox-group)
+     * - [Combobox with links](https://ariakit.com/examples/combobox-links)
      * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
-     * - [Menu with Combobox](https://ariakit.org/examples/menu-combobox)
-     * - [Select with Combobox](https://ariakit.org/examples/select-combobox)
+     *   Combobox](https://ariakit.com/examples/combobox-multiple)
+     * - [Menu with Combobox](https://ariakit.com/examples/menu-combobox)
+     * - [Select with Combobox](https://ariakit.com/examples/select-combobox)
      */
     setValue?: (value: ComboboxStoreState<T>["value"]) => void;
     /**
      * A callback that's invoked when the
-     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * [`selectedValue`](https://ariakit.com/reference/combobox-provider#selectedvalue)
      * state changes, typically when the user selects an item. This can be used to
      * implement behavior like `onSelect` or `onItemSelect`.
      *
      * Live examples:
      * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     *   Combobox](https://ariakit.com/examples/combobox-multiple)
      */
     setSelectedValue?: (value: ComboboxStoreState<T>["selectedValue"]) => void;
     /**
-     * A reference to a [tag store](https://ariakit.org/apis/use-tag-store). It's
+     * A reference to a [tag store](https://ariakit.com/apis/use-tag-store). It's
      * automatically set when rendering a combobox within a tag list.
      */
     tag?: TagStore | null;

package/cjs/combobox/combobox-value.cjs

@@ -1,25 +1,28 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _MLRWKUIEcjs = require('../__chunks/MLRWKUIE.cjs');
-require('../__chunks/ZO6DH46K.cjs');
-require('../__chunks/5BVSKVUN.cjs');
-require('../__chunks/HHXD2YNZ.cjs');
-require('../__chunks/WI7QXQL7.cjs');
-require('../__chunks/SS26HAQ2.cjs');
-require('../__chunks/743QABRA.cjs');
-require('../__chunks/KGFTRA3C.cjs');
+var _EV33XSIBcjs = require('../__chunks/EV33XSIB.cjs');
+require('../__chunks/6P52IAFY.cjs');
+require('../__chunks/PFM4PJSG.cjs');
+require('../__chunks/SARAALGA.cjs');
+require('../__chunks/UCZW3OGH.cjs');
+
+
+var _FH6HQ5JNcjs = require('../__chunks/FH6HQ5JN.cjs');
+require('../__chunks/XWMMMXUK.cjs');
+require('../__chunks/PTOCUU2D.cjs');
+require('../__chunks/3BSDKDKD.cjs');
 require('../__chunks/XMDZRF6Y.cjs');
 
 // src/combobox/combobox-value.tsx
 var _misc = require('@ariakit/core/utils/misc');
 function ComboboxValue({ store, children } = {}) {
-  const context = _MLRWKUIEcjs.useComboboxContext.call(void 0, );
+  const context = _EV33XSIBcjs.useComboboxContext.call(void 0, );
   store = store || context;
   _misc.invariant.call(void 0, 
     store,
     process.env.NODE_ENV !== "production" && "ComboboxValue must receive a `store` prop or be wrapped in a ComboboxProvider component."
   );
-  const value = store.useState("value");
+  const value = _FH6HQ5JNcjs.useStoreState.call(void 0, store, "value");
   if (children) {
     return children(value);
   }

package/cjs/combobox/combobox-value.d.cts

@@ -2,17 +2,17 @@ import type { ReactNode } from "react";
 import type { ComboboxStore, ComboboxStoreState } from "./combobox-store.ts";
 /**
  * Renders the current
- * [`value`](https://ariakit.org/reference/use-combobox-store#value) state in
- * the [combobox store](https://ariakit.org/reference/use-combobox-store).
+ * [`value`](https://ariakit.com/reference/use-combobox-store#value) state in
+ * the [combobox store](https://ariakit.com/reference/use-combobox-store).
  *
  * As a value component, it doesn't render any DOM elements and therefore
  * doesn't accept HTML props.
  *
  * It takes a
- * [`children`](https://ariakit.org/reference/combobox-value#children) function
+ * [`children`](https://ariakit.com/reference/combobox-value#children) function
  * that gets called with the current value as an argument. This can be used as
  * an uncontrolled API to render the combobox value in a custom way.
- * @see https://ariakit.org/components/combobox
+ * @see https://ariakit.com/components/combobox
  * @example
  * ```jsx {3-5}
  * <ComboboxProvider>
@@ -27,9 +27,9 @@ export declare function ComboboxValue({ store, children }?: ComboboxValueProps):
 export interface ComboboxValueProps {
     /**
      * Object returned by the
-     * [`useComboboxStore`](https://ariakit.org/reference/use-combobox-store)
+     * [`useComboboxStore`](https://ariakit.com/reference/use-combobox-store)
      * hook. If not provided, the closest
-     * [`ComboboxProvider`](https://ariakit.org/reference/combobox-provider)
+     * [`ComboboxProvider`](https://ariakit.com/reference/combobox-provider)
      * component's context will be used.
      */
     store?: ComboboxStore;

package/cjs/combobox/combobox-value.d.ts

@@ -2,17 +2,17 @@ import type { ReactNode } from "react";
 import type { ComboboxStore, ComboboxStoreState } from "./combobox-store.ts";
 /**
  * Renders the current
- * [`value`](https://ariakit.org/reference/use-combobox-store#value) state in
- * the [combobox store](https://ariakit.org/reference/use-combobox-store).
+ * [`value`](https://ariakit.com/reference/use-combobox-store#value) state in
+ * the [combobox store](https://ariakit.com/reference/use-combobox-store).
  *
  * As a value component, it doesn't render any DOM elements and therefore
  * doesn't accept HTML props.
  *
  * It takes a
- * [`children`](https://ariakit.org/reference/combobox-value#children) function
+ * [`children`](https://ariakit.com/reference/combobox-value#children) function
  * that gets called with the current value as an argument. This can be used as
  * an uncontrolled API to render the combobox value in a custom way.
- * @see https://ariakit.org/components/combobox
+ * @see https://ariakit.com/components/combobox
  * @example
  * ```jsx {3-5}
  * <ComboboxProvider>
@@ -27,9 +27,9 @@ export declare function ComboboxValue({ store, children }?: ComboboxValueProps):
 export interface ComboboxValueProps {
     /**
      * Object returned by the
-     * [`useComboboxStore`](https://ariakit.org/reference/use-combobox-store)
+     * [`useComboboxStore`](https://ariakit.com/reference/use-combobox-store)
      * hook. If not provided, the closest
-     * [`ComboboxProvider`](https://ariakit.org/reference/combobox-provider)
+     * [`ComboboxProvider`](https://ariakit.com/reference/combobox-provider)
      * component's context will be used.
      */
     store?: ComboboxStore;

package/cjs/combobox/combobox.cjs

@@ -1,27 +1,28 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _YTQONGS5cjs = require('../__chunks/YTQONGS5.cjs');
+var _6E4BBKC4cjs = require('../__chunks/6E4BBKC4.cjs');
 
 
-var _YQMDNMVHcjs = require('../__chunks/YQMDNMVH.cjs');
-require('../__chunks/MIBORXQW.cjs');
+var _AYPF6BURcjs = require('../__chunks/AYPF6BUR.cjs');
+require('../__chunks/2XVCJUVB.cjs');
 
 
-var _MLRWKUIEcjs = require('../__chunks/MLRWKUIE.cjs');
-require('../__chunks/ZO6DH46K.cjs');
-require('../__chunks/5BVSKVUN.cjs');
-require('../__chunks/HHXD2YNZ.cjs');
-require('../__chunks/WI7QXQL7.cjs');
-require('../__chunks/4JH5Q6AQ.cjs');
+var _EV33XSIBcjs = require('../__chunks/EV33XSIB.cjs');
+require('../__chunks/6P52IAFY.cjs');
+require('../__chunks/PFM4PJSG.cjs');
+require('../__chunks/SARAALGA.cjs');
+require('../__chunks/UCZW3OGH.cjs');
+require('../__chunks/MWXEIKZX.cjs');
 require('../__chunks/T3QB4FR3.cjs');
-require('../__chunks/SS26HAQ2.cjs');
 
 
+var _FH6HQ5JNcjs = require('../__chunks/FH6HQ5JN.cjs');
+require('../__chunks/XWMMMXUK.cjs');
 
 
-var _743QABRAcjs = require('../__chunks/743QABRA.cjs');
 
 
+var _PTOCUU2Dcjs = require('../__chunks/PTOCUU2D.cjs');
 
 
 
@@ -29,7 +30,9 @@ var _743QABRAcjs = require('../__chunks/743QABRA.cjs');
 
 
 
-var _KGFTRA3Ccjs = require('../__chunks/KGFTRA3C.cjs');
+
+
+var _3BSDKDKDcjs = require('../__chunks/3BSDKDKD.cjs');
 require('../__chunks/XMDZRF6Y.cjs');
 
 // src/combobox/combobox.tsx
@@ -78,7 +81,7 @@ function getDefaultAutoSelectId(items) {
   });
   return item == null ? void 0 : item.id;
 }
-var useCombobox = _743QABRAcjs.createHook.call(void 0, 
+var useCombobox = _PTOCUU2Dcjs.createHook.call(void 0, 
   function useCombobox2({
     store,
     focusable = true,
@@ -97,33 +100,34 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
     autoComplete = "list",
     ...props
   }) {
-    const context = _MLRWKUIEcjs.useComboboxProviderContext.call(void 0, );
+    const context = _EV33XSIBcjs.useComboboxProviderContext.call(void 0, );
     store = store || context;
     _misc.invariant.call(void 0, 
       store,
       process.env.NODE_ENV !== "production" && "Combobox must receive a `store` prop or be wrapped in a ComboboxProvider component."
     );
     const ref = _react.useRef.call(void 0, null);
-    const [valueUpdated, forceValueUpdate] = _KGFTRA3Ccjs.useForceUpdate.call(void 0, );
+    const [valueUpdated, forceValueUpdate] = _3BSDKDKDcjs.useForceUpdate.call(void 0, );
     const canAutoSelectRef = _react.useRef.call(void 0, false);
     const composingRef = _react.useRef.call(void 0, false);
-    const autoSelect = store.useState(
+    const autoSelect = _FH6HQ5JNcjs.useStoreState.call(void 0, 
+      store,
       (state) => state.virtualFocus && autoSelectProp
     );
     const inline = autoComplete === "inline" || autoComplete === "both";
     const [canInline, setCanInline] = _react.useState.call(void 0, inline);
-    _KGFTRA3Ccjs.useUpdateLayoutEffect.call(void 0, () => {
+    _3BSDKDKDcjs.useUpdateLayoutEffect.call(void 0, () => {
       if (!inline) return;
       setCanInline(true);
     }, [inline]);
-    const storeValue = store.useState("value");
+    const storeValue = _FH6HQ5JNcjs.useStoreState.call(void 0, store, "value");
     const prevSelectedValueRef = _react.useRef.call(void 0, void 0);
     _react.useEffect.call(void 0, () => {
       return _store.sync.call(void 0, store, ["selectedValue", "activeId"], (_, prev) => {
         prevSelectedValueRef.current = prev.selectedValue;
       });
-    }, []);
-    const inlineActiveValue = store.useState((state) => {
+    }, [store]);
+    const inlineActiveValue = _FH6HQ5JNcjs.useStoreState.call(void 0, store, (state) => {
       var _a;
       if (!inline) return;
       if (!canInline) return;
@@ -133,9 +137,9 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
       }
       return state.activeValue;
     });
-    const items = store.useState("renderedItems");
-    const open = store.useState("open");
-    const contentElement = store.useState("contentElement");
+    const items = _FH6HQ5JNcjs.useStoreState.call(void 0, store, "renderedItems");
+    const open = _FH6HQ5JNcjs.useStoreState.call(void 0, store, "open");
+    const contentElement = _FH6HQ5JNcjs.useStoreState.call(void 0, store, "contentElement");
     const value = _react.useMemo.call(void 0, () => {
       if (!inline) return storeValue;
       if (!canInline) return storeValue;
@@ -200,8 +204,10 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
       storeValue
     ]);
     const scrollingElementRef = _react.useRef.call(void 0, null);
-    const getAutoSelectIdProp = _KGFTRA3Ccjs.useEvent.call(void 0, getAutoSelectId);
+    const getAutoSelectIdProp = _3BSDKDKDcjs.useEvent.call(void 0, getAutoSelectId);
     const autoSelectIdRef = _react.useRef.call(void 0, null);
+    const userScrolledRef = _react.useRef.call(void 0, false);
+    const isAutoScrollingRef = _react.useRef.call(void 0, false);
     _react.useEffect.call(void 0, () => {
       if (!open) return;
       if (!contentElement) return;
@@ -210,8 +216,12 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
       scrollingElementRef.current = scrollingElement;
       const onUserScroll = () => {
         canAutoSelectRef.current = false;
+        userScrolledRef.current = true;
       };
       const onScroll = () => {
+        if (!isAutoScrollingRef.current) {
+          userScrolledRef.current = true;
+        }
         if (!store) return;
         if (!canAutoSelectRef.current) return;
         const { activeId } = store.getState();
@@ -229,22 +239,24 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
         scrollingElement.removeEventListener("scroll", onScroll, true);
       };
     }, [open, contentElement, store]);
-    _KGFTRA3Ccjs.useSafeLayoutEffect.call(void 0, () => {
+    _3BSDKDKDcjs.useSafeLayoutEffect.call(void 0, () => {
+      userScrolledRef.current = false;
       if (!storeValue) return;
       if (composingRef.current) return;
       canAutoSelectRef.current = true;
     }, [storeValue]);
-    _KGFTRA3Ccjs.useSafeLayoutEffect.call(void 0, () => {
+    _3BSDKDKDcjs.useSafeLayoutEffect.call(void 0, () => {
       if (autoSelect !== "always" && open) return;
       canAutoSelectRef.current = open;
     }, [autoSelect, open]);
-    const resetValueOnSelect = store.useState("resetValueOnSelect");
-    _KGFTRA3Ccjs.useUpdateEffect.call(void 0, () => {
+    const resetValueOnSelect = _FH6HQ5JNcjs.useStoreState.call(void 0, store, "resetValueOnSelect");
+    _3BSDKDKDcjs.useUpdateEffect.call(void 0, () => {
       var _a, _b;
       const canAutoSelect = canAutoSelectRef.current;
       if (!store) return;
       if (!open) return;
-      if (!canAutoSelect && !resetValueOnSelect) return;
+      if (!canAutoSelect && (!resetValueOnSelect || userScrolledRef.current))
+        return;
       const { baseElement, contentElement: contentElement2, activeId } = store.getState();
       if (baseElement && !_focus.hasFocus.call(void 0, baseElement)) return;
       if (contentElement2 == null ? void 0 : contentElement2.hasAttribute("data-placing")) {
@@ -260,7 +272,11 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
       } else {
         const element = (_b = store.item(activeId || store.first())) == null ? void 0 : _b.element;
         if (element && "scrollIntoView" in element) {
+          isAutoScrollingRef.current = true;
           element.scrollIntoView({ block: "nearest", inline: "nearest" });
+          requestAnimationFrame(() => {
+            isAutoScrollingRef.current = false;
+          });
         }
       }
       return;
@@ -300,13 +316,13 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
       return currentTarget.value.length >= showMinLength;
     };
     const onChangeProp = props.onChange;
-    const showOnChangeProp = _KGFTRA3Ccjs.useBooleanEvent.call(void 0, showOnChange != null ? showOnChange : canShow);
-    const setValueOnChangeProp = _KGFTRA3Ccjs.useBooleanEvent.call(void 0, 
+    const showOnChangeProp = _3BSDKDKDcjs.useBooleanEvent.call(void 0, showOnChange != null ? showOnChange : canShow);
+    const setValueOnChangeProp = _3BSDKDKDcjs.useBooleanEvent.call(void 0, 
       // If the combobox is combined with tags, the value will be set by the tag
       // input component.
       setValueOnChange != null ? setValueOnChange : !store.tag
     );
-    const onChange = _KGFTRA3Ccjs.useEvent.call(void 0, (event) => {
+    const onChange = _3BSDKDKDcjs.useEvent.call(void 0, (event) => {
       onChangeProp == null ? void 0 : onChangeProp(event);
       if (event.defaultPrevented) return;
       if (!store) return;
@@ -343,7 +359,7 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
       }
     });
     const onCompositionEndProp = props.onCompositionEnd;
-    const onCompositionEnd = _KGFTRA3Ccjs.useEvent.call(void 0, (event) => {
+    const onCompositionEnd = _3BSDKDKDcjs.useEvent.call(void 0, (event) => {
       canAutoSelectRef.current = true;
       composingRef.current = false;
       onCompositionEndProp == null ? void 0 : onCompositionEndProp(event);
@@ -352,12 +368,12 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
       forceValueUpdate();
     });
     const onMouseDownProp = props.onMouseDown;
-    const blurActiveItemOnClickProp = _KGFTRA3Ccjs.useBooleanEvent.call(void 0, 
+    const blurActiveItemOnClickProp = _3BSDKDKDcjs.useBooleanEvent.call(void 0, 
       blurActiveItemOnClick != null ? blurActiveItemOnClick : (() => !!(store == null ? void 0 : store.getState().includesBaseElement))
     );
-    const setValueOnClickProp = _KGFTRA3Ccjs.useBooleanEvent.call(void 0, setValueOnClick);
-    const showOnClickProp = _KGFTRA3Ccjs.useBooleanEvent.call(void 0, showOnClick != null ? showOnClick : canShow);
-    const onMouseDown = _KGFTRA3Ccjs.useEvent.call(void 0, (event) => {
+    const setValueOnClickProp = _3BSDKDKDcjs.useBooleanEvent.call(void 0, setValueOnClick);
+    const showOnClickProp = _3BSDKDKDcjs.useBooleanEvent.call(void 0, showOnClick != null ? showOnClick : canShow);
+    const onMouseDown = _3BSDKDKDcjs.useEvent.call(void 0, (event) => {
       onMouseDownProp == null ? void 0 : onMouseDownProp(event);
       if (event.defaultPrevented) return;
       if (event.button) return;
@@ -374,8 +390,8 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
       }
     });
     const onKeyDownProp = props.onKeyDown;
-    const showOnKeyPressProp = _KGFTRA3Ccjs.useBooleanEvent.call(void 0, showOnKeyPress != null ? showOnKeyPress : canShow);
-    const onKeyDown = _KGFTRA3Ccjs.useEvent.call(void 0, (event) => {
+    const showOnKeyPressProp = _3BSDKDKDcjs.useBooleanEvent.call(void 0, showOnKeyPress != null ? showOnKeyPress : canShow);
+    const onKeyDown = _3BSDKDKDcjs.useEvent.call(void 0, (event) => {
       onKeyDownProp == null ? void 0 : onKeyDownProp(event);
       if (!event.repeat) {
         canAutoSelectRef.current = false;
@@ -396,16 +412,18 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
       }
     });
     const onBlurProp = props.onBlur;
-    const onBlur = _KGFTRA3Ccjs.useEvent.call(void 0, (event) => {
+    const onBlur = _3BSDKDKDcjs.useEvent.call(void 0, (event) => {
       canAutoSelectRef.current = false;
       onBlurProp == null ? void 0 : onBlurProp(event);
       if (event.defaultPrevented) return;
     });
-    const id = _KGFTRA3Ccjs.useId.call(void 0, props.id);
+    const id = _3BSDKDKDcjs.useId.call(void 0, props.id);
     const ariaAutoComplete = isAriaAutoCompleteValue(autoComplete) ? autoComplete : void 0;
-    const isActiveItem = store.useState((state) => state.activeId === null);
+    const isActiveItem = _FH6HQ5JNcjs.useStoreState.call(void 0, 
+      store,
+      (state) => state.activeId === null
+    );
     props = {
-      id,
       role: "combobox",
       "aria-autocomplete": ariaAutoComplete,
       "aria-haspopup": _dom.getPopupRole.call(void 0, contentElement, "listbox"),
@@ -414,14 +432,15 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
       "data-active-item": isActiveItem || void 0,
       value,
       ...props,
-      ref: _KGFTRA3Ccjs.useMergeRefs.call(void 0, ref, props.ref),
+      id,
+      ref: _3BSDKDKDcjs.useMergeRefs.call(void 0, ref, props.ref),
       onChange,
       onCompositionEnd,
       onMouseDown,
       onKeyDown,
       onBlur
     };
-    props = _YTQONGS5cjs.useComposite.call(void 0, {
+    props = _6E4BBKC4cjs.useComposite.call(void 0, {
       store,
       focusable,
       ...props,
@@ -433,13 +452,13 @@ var useCombobox = _743QABRAcjs.createHook.call(void 0,
         return true;
       }
     });
-    props = _YQMDNMVHcjs.usePopoverAnchor.call(void 0, { store, ...props });
+    props = _AYPF6BURcjs.usePopoverAnchor.call(void 0, { store, ...props });
     return { autoComplete: "off", ...props };
   }
 );
-var Combobox = _743QABRAcjs.forwardRef.call(void 0, function Combobox2(props) {
+var Combobox = _PTOCUU2Dcjs.forwardRef.call(void 0, function Combobox2(props) {
   const htmlProps = useCombobox(props);
-  return _743QABRAcjs.createElement.call(void 0, TagName, htmlProps);
+  return _PTOCUU2Dcjs.createElement.call(void 0, TagName, htmlProps);
 });