@ariakit/react-core 0.3.7 → 0.3.8

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

@@ -52,15 +52,15 @@ export interface ComboboxItemOptions<T extends As = "div"> extends CompositeItem
     store?: ComboboxStore;
     /**
      * The value of the item. This will be rendered as the children by default.
-     *   - If
-     *     [`setValueOnClick`](https://ariakit.org/reference/combobox-item#setvalueonclick)
-     *     is set to `true`, this will be the value of the combobox input when the
-     *     user clicks on this item.
-     *   - If the
-     *     [`autoComplete`](https://ariakit.org/reference/combobox#autocomplete)
-     *     prop on the [`Combobox`](https://ariakit.org/reference/combobox)
-     *     component is set to `both` or `inline`, this will be the value of the
-     *     combobox input when the combobox loses focus.
+     * - If
+     *   [`setValueOnClick`](https://ariakit.org/reference/combobox-item#setvalueonclick)
+     *   is set to `true`, this will be the value of the combobox input when the
+     *   user clicks on this item.
+     * - If the
+     *   [`autoComplete`](https://ariakit.org/reference/combobox#autocomplete)
+     *   prop on the [`Combobox`](https://ariakit.org/reference/combobox)
+     *   component is set to `both` or `inline`, this will be the value of the
+     *   combobox input when the combobox loses focus.
      *
      * Live examples:
      * - [Animated Combobox](https://ariakit.org/examples/combobox-animated)
@@ -73,18 +73,36 @@ export interface ComboboxItemOptions<T extends As = "div"> extends CompositeItem
      */
     value?: string;
     /**
-     * Whether to hide the combobox when this item is clicked.
+     * Whether to hide the combobox when this item is clicked. By default, the
+     * combobox will be hidden when the user clicks on an item with a
+     * [`value`](https://ariakit.org/reference/combobox-item#value) prop, unless
+     * the combobox is
+     * [multi-selectable](https://ariakit.org/examples/combobox-multiple).
      *
      * Live examples:
      * - [Combobox with links](https://ariakit.org/examples/combobox-links)
-     * @default true
      */
     hideOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
     /**
-     * Whether to set the combobox value with this item's value when this item is
-     * clicked.
+     * Whether to set the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * state using this item's
+     * [`value`](https://ariakit.org/reference/combobox-item#value) when the item
+     * is clicked.
      * @default true
      */
+    selectValueOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
+    /**
+     * Whether to set the combobox
+     * [`value`](https://ariakit.org/reference/combobox-provider#value) state
+     * using this item's
+     * [`value`](https://ariakit.org/reference/combobox-item#value) when the item
+     * is clicked. The default is `true`, unless the combobox is
+     * [multi-selectable](https://ariakit.org/examples/combobox-multiple).
+     *
+     * Live examples:
+     * - [Menu with Combobox](https://ariakit.org/examples/menu-combobox)
+     */
     setValueOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
     /**
      * @default false

package/cjs/combobox/combobox-label.cjs

@@ -0,0 +1,55 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
+
+
+var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
+require('../__chunks/UZNYSPKP.cjs');
+require('../__chunks/BZTDJIVT.cjs');
+require('../__chunks/UVBBMANL.cjs');
+require('../__chunks/F2A2ZQDB.cjs');
+require('../__chunks/S6UU7NA4.cjs');
+
+
+
+
+var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+require('../__chunks/EO6LS72H.cjs');
+require('../__chunks/CJDHQUBR.cjs');
+
+
+
+var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
+
+// src/combobox/combobox-label.ts
+var _misc = require('@ariakit/core/utils/misc');
+var useComboboxLabel = _RNZNGEL4cjs.createHook.call(void 0, 
+  (_a) => {
+    var _b = _a, { store } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store"]);
+    const context = _3WCBE6SUcjs.useComboboxProviderContext.call(void 0, );
+    store = store || context;
+    _misc.invariant.call(void 0, 
+      store,
+      process.env.NODE_ENV !== "production" && "ComboboxLabel must receive a `store` prop or be wrapped in a ComboboxProvider component."
+    );
+    const comboboxId = store.useState((state) => {
+      var _a2;
+      return (_a2 = state.baseElement) == null ? void 0 : _a2.id;
+    });
+    props = _AV6KTKLEcjs.__spreadValues.call(void 0, {
+      htmlFor: comboboxId
+    }, props);
+    return props;
+  }
+);
+var ComboboxLabel = _RNZNGEL4cjs.createMemoComponent.call(void 0, 
+  (props) => {
+    const htmlProps = useComboboxLabel(props);
+    return _RNZNGEL4cjs.createElement.call(void 0, "label", htmlProps);
+  }
+);
+if (process.env.NODE_ENV !== "production") {
+  ComboboxLabel.displayName = "ComboboxLabel";
+}
+
+
+
+exports.ComboboxLabel = ComboboxLabel; exports.useComboboxLabel = useComboboxLabel;

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

@@ -0,0 +1,42 @@
+import type { As, Options, Props } from "../utils/types.js";
+import type { ComboboxStore } from "./combobox-store.js";
+/**
+ * Returns props to create a `ComboboxLabel` component.
+ * @see https://ariakit.org/components/combobox
+ * @example
+ * ```jsx
+ * const store = useComboboxStore();
+ * const props = useComboboxLabel({ store });
+ * <Role {...props}>Favorite fruit</Role>
+ * <Combobox store={store} />
+ * ```
+ */
+export declare const useComboboxLabel: import("../utils/types.js").Hook<ComboboxLabelOptions<"label">>;
+/**
+ * Renders a label for the [`Combobox`](https://ariakit.org/reference/combobox)
+ * component.
+ * @see https://ariakit.org/components/combobox
+ * @example
+ * ```jsx {2}
+ * <ComboboxProvider>
+ *   <ComboboxLabel>Favorite fruit</ComboboxLabel>
+ *   <Combobox />
+ *   <ComboboxPopover>
+ *     <ComboboxItem value="Apple" />
+ *     <ComboboxItem value="Orange" />
+ *   </ComboboxPopover>
+ * </ComboboxProvider>
+ * ```
+ */
+export declare const ComboboxLabel: import("../utils/types.js").Component<ComboboxLabelOptions<"label">>;
+export interface ComboboxLabelOptions<T extends As = "label"> extends Options<T> {
+    /**
+     * 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;
+}
+export type ComboboxLabelProps<T extends As = "label"> = Props<ComboboxLabelOptions<T>>;

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

@@ -0,0 +1,42 @@
+import type { As, Options, Props } from "../utils/types.js";
+import type { ComboboxStore } from "./combobox-store.js";
+/**
+ * Returns props to create a `ComboboxLabel` component.
+ * @see https://ariakit.org/components/combobox
+ * @example
+ * ```jsx
+ * const store = useComboboxStore();
+ * const props = useComboboxLabel({ store });
+ * <Role {...props}>Favorite fruit</Role>
+ * <Combobox store={store} />
+ * ```
+ */
+export declare const useComboboxLabel: import("../utils/types.js").Hook<ComboboxLabelOptions<"label">>;
+/**
+ * Renders a label for the [`Combobox`](https://ariakit.org/reference/combobox)
+ * component.
+ * @see https://ariakit.org/components/combobox
+ * @example
+ * ```jsx {2}
+ * <ComboboxProvider>
+ *   <ComboboxLabel>Favorite fruit</ComboboxLabel>
+ *   <Combobox />
+ *   <ComboboxPopover>
+ *     <ComboboxItem value="Apple" />
+ *     <ComboboxItem value="Orange" />
+ *   </ComboboxPopover>
+ * </ComboboxProvider>
+ * ```
+ */
+export declare const ComboboxLabel: import("../utils/types.js").Component<ComboboxLabelOptions<"label">>;
+export interface ComboboxLabelOptions<T extends As = "label"> extends Options<T> {
+    /**
+     * 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;
+}
+export type ComboboxLabelProps<T extends As = "label"> = Props<ComboboxLabelOptions<T>>;

package/cjs/combobox/combobox-list.cjs

@@ -2,8 +2,8 @@
 
 
 
-var _QU2266CJcjs = require('../__chunks/QU2266CJ.cjs');
-require('../__chunks/VEG6PRAG.cjs');
+var _WH4I6OSNcjs = require('../__chunks/WH4I6OSN.cjs');
+require('../__chunks/3WCBE6SU.cjs');
 require('../__chunks/UZNYSPKP.cjs');
 require('../__chunks/BZTDJIVT.cjs');
 require('../__chunks/7BSMGTGR.cjs');
@@ -20,4 +20,4 @@ require('../__chunks/AV6KTKLE.cjs');
 
 
 
-exports.ComboboxList = _QU2266CJcjs.ComboboxList; exports.useComboboxList = _QU2266CJcjs.useComboboxList;
+exports.ComboboxList = _WH4I6OSNcjs.ComboboxList; exports.useComboboxList = _WH4I6OSNcjs.useComboboxList;

package/cjs/combobox/combobox-popover.cjs

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _QU2266CJcjs = require('../__chunks/QU2266CJ.cjs');
+var _WH4I6OSNcjs = require('../__chunks/WH4I6OSN.cjs');
 
 
-var _VEG6PRAGcjs = require('../__chunks/VEG6PRAG.cjs');
+var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
 require('../__chunks/UZNYSPKP.cjs');
 require('../__chunks/BZTDJIVT.cjs');
 
@@ -84,14 +84,14 @@ var useComboboxPopover = _RNZNGEL4cjs.createHook.call(void 0,
       "alwaysVisible",
       "hideOnInteractOutside"
     ]);
-    const context = _VEG6PRAGcjs.useComboboxProviderContext.call(void 0, );
+    const context = _3WCBE6SUcjs.useComboboxProviderContext.call(void 0, );
     store = store || context;
     _misc.invariant.call(void 0, 
       store,
       process.env.NODE_ENV !== "production" && "ComboboxPopover must receive a `store` prop or be wrapped in a ComboboxProvider component."
     );
     const baseElement = store.useState("baseElement");
-    props = _QU2266CJcjs.useComboboxList.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, alwaysVisible }, props));
+    props = _WH4I6OSNcjs.useComboboxList.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, alwaysVisible }, props));
     props = _RIZYIKBEcjs.usePopover.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
       store,
       alwaysVisible,
@@ -126,7 +126,7 @@ var ComboboxPopover = _XFPRAS3Jcjs.createDialogComponent.call(void 0,
     const htmlProps = useComboboxPopover(props);
     return _RNZNGEL4cjs.createElement.call(void 0, "div", htmlProps);
   }),
-  _VEG6PRAGcjs.useComboboxProviderContext
+  _3WCBE6SUcjs.useComboboxProviderContext
 );
 if (process.env.NODE_ENV !== "production") {
   ComboboxPopover.displayName = "ComboboxPopover";

package/cjs/combobox/combobox-provider.cjs

@@ -1,10 +1,10 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _AYDXWQBFcjs = require('../__chunks/AYDXWQBF.cjs');
+var _L3WS5HGIcjs = require('../__chunks/L3WS5HGI.cjs');
 
 
-var _VEG6PRAGcjs = require('../__chunks/VEG6PRAG.cjs');
+var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
 require('../__chunks/A5RWZSX7.cjs');
 require('../__chunks/TUVU5ERH.cjs');
 require('../__chunks/UZNYSPKP.cjs');
@@ -24,8 +24,8 @@ require('../__chunks/AV6KTKLE.cjs');
 // src/combobox/combobox-provider.tsx
 var _jsxruntime = require('react/jsx-runtime');
 function ComboboxProvider(props = {}) {
-  const store = _AYDXWQBFcjs.useComboboxStore.call(void 0, props);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _VEG6PRAGcjs.ComboboxContextProvider, { value: store, children: props.children });
+  const store = _L3WS5HGIcjs.useComboboxStore.call(void 0, props);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _3WCBE6SUcjs.ComboboxContextProvider, { value: store, children: props.children });
 }
 
 

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

@@ -1,5 +1,7 @@
-import type { ReactNode } from "react";
-import type { ComboboxStoreProps } from "./combobox-store.js";
+import type { ReactElement, ReactNode } from "react";
+import type { PickRequired } from "@ariakit/core/utils/types";
+import type { ComboboxStoreProps, ComboboxStoreSelectedValue } from "./combobox-store.js";
+type Value = ComboboxStoreSelectedValue;
 /**
  * Provides a combobox store to Combobox components.
  * @see https://ariakit.org/components/combobox
@@ -15,7 +17,9 @@ import type { ComboboxStoreProps } from "./combobox-store.js";
  * </ComboboxProvider>
  * ```
  */
-export declare function ComboboxProvider(props?: ComboboxProviderProps): import("react/jsx-runtime").JSX.Element;
-export interface ComboboxProviderProps extends ComboboxStoreProps {
+export declare function ComboboxProvider<T extends Value = Value>(props: PickRequired<ComboboxProviderProps<T>, "selectedValue" | "defaultSelectedValue">): ReactElement;
+export declare function ComboboxProvider(props?: ComboboxProviderProps): ReactElement;
+export interface ComboboxProviderProps<T extends Value = Value> extends ComboboxStoreProps<T> {
     children?: ReactNode;
 }
+export {};

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

@@ -1,5 +1,7 @@
-import type { ReactNode } from "react";
-import type { ComboboxStoreProps } from "./combobox-store.js";
+import type { ReactElement, ReactNode } from "react";
+import type { PickRequired } from "@ariakit/core/utils/types";
+import type { ComboboxStoreProps, ComboboxStoreSelectedValue } from "./combobox-store.js";
+type Value = ComboboxStoreSelectedValue;
 /**
  * Provides a combobox store to Combobox components.
  * @see https://ariakit.org/components/combobox
@@ -15,7 +17,9 @@ import type { ComboboxStoreProps } from "./combobox-store.js";
  * </ComboboxProvider>
  * ```
  */
-export declare function ComboboxProvider(props?: ComboboxProviderProps): import("react/jsx-runtime").JSX.Element;
-export interface ComboboxProviderProps extends ComboboxStoreProps {
+export declare function ComboboxProvider<T extends Value = Value>(props: PickRequired<ComboboxProviderProps<T>, "selectedValue" | "defaultSelectedValue">): ReactElement;
+export declare function ComboboxProvider(props?: ComboboxProviderProps): ReactElement;
+export interface ComboboxProviderProps<T extends Value = Value> extends ComboboxStoreProps<T> {
     children?: ReactNode;
 }
+export {};

package/cjs/combobox/combobox-row.cjs

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _VEG6PRAGcjs = require('../__chunks/VEG6PRAG.cjs');
+var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
 
 
 var _GJX4AG2Lcjs = require('../__chunks/GJX4AG2L.cjs');
@@ -28,7 +28,7 @@ var _misc = require('@ariakit/core/utils/misc');
 var useComboboxRow = _RNZNGEL4cjs.createHook.call(void 0, 
   (_a) => {
     var _b = _a, { store } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store"]);
-    const context = _VEG6PRAGcjs.useComboboxScopedContext.call(void 0, );
+    const context = _3WCBE6SUcjs.useComboboxScopedContext.call(void 0, );
     store = store || context;
     _misc.invariant.call(void 0, 
       store,

package/cjs/combobox/combobox-separator.cjs

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _VEG6PRAGcjs = require('../__chunks/VEG6PRAG.cjs');
+var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
 
 
 var _F34KLJKGcjs = require('../__chunks/F34KLJKG.cjs');
@@ -28,7 +28,7 @@ var _misc = require('@ariakit/core/utils/misc');
 var useComboboxSeparator = _RNZNGEL4cjs.createHook.call(void 0, 
   (_a) => {
     var _b = _a, { store } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store"]);
-    const context = _VEG6PRAGcjs.useComboboxScopedContext.call(void 0, );
+    const context = _3WCBE6SUcjs.useComboboxScopedContext.call(void 0, );
     store = store || context;
     _misc.invariant.call(void 0, 
       store,

package/cjs/combobox/combobox-store.cjs

@@ -2,7 +2,7 @@
 
 
 
-var _AYDXWQBFcjs = require('../__chunks/AYDXWQBF.cjs');
+var _L3WS5HGIcjs = require('../__chunks/L3WS5HGI.cjs');
 require('../__chunks/A5RWZSX7.cjs');
 require('../__chunks/TUVU5ERH.cjs');
 require('../__chunks/65GJIQK5.cjs');
@@ -15,4 +15,4 @@ require('../__chunks/AV6KTKLE.cjs');
 
 
 
-exports.useComboboxStore = _AYDXWQBFcjs.useComboboxStore; exports.useComboboxStoreProps = _AYDXWQBFcjs.useComboboxStoreProps;
+exports.useComboboxStore = _L3WS5HGIcjs.useComboboxStore; exports.useComboboxStoreProps = _L3WS5HGIcjs.useComboboxStoreProps;

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

@@ -1,7 +1,9 @@
 import * as Core from "@ariakit/core/combobox/combobox-store";
+import type { PickRequired } from "@ariakit/core/utils/types";
 import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
 import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
 import type { Store } from "../utils/store.js";
+type Value = Core.ComboboxStoreSelectedValue;
 export declare function useComboboxStoreProps<T extends Core.ComboboxStore>(store: T, update: () => void, props: ComboboxStoreProps): T;
 /**
  * Creates a combobox store.
@@ -17,15 +19,19 @@ export declare function useComboboxStoreProps<T extends Core.ComboboxStore>(stor
  * </ComboboxPopover>
  * ```
  */
+export declare function useComboboxStore<T extends Value = Value>(props: PickRequired<ComboboxStoreProps<T>, "selectedValue" | "defaultSelectedValue">): ComboboxStore<T>;
 export declare function useComboboxStore(props?: ComboboxStoreProps): ComboboxStore;
 export type ComboboxStoreItem = Core.ComboboxStoreItem;
-export interface ComboboxStoreState extends Core.ComboboxStoreState, CompositeStoreState<ComboboxStoreItem>, PopoverStoreState {
+export type ComboboxStoreSelectedValue = Core.ComboboxStoreSelectedValue;
+export interface ComboboxStoreState<T extends Value = Value> extends Core.ComboboxStoreState<T>, CompositeStoreState<ComboboxStoreItem>, PopoverStoreState {
 }
-export interface ComboboxStoreFunctions extends Core.ComboboxStoreFunctions, CompositeStoreFunctions<ComboboxStoreItem>, PopoverStoreFunctions {
+export interface ComboboxStoreFunctions<T extends Value = Value> extends Core.ComboboxStoreFunctions<T>, CompositeStoreFunctions<ComboboxStoreItem>, PopoverStoreFunctions {
 }
-export interface ComboboxStoreOptions extends Core.ComboboxStoreOptions, CompositeStoreOptions<ComboboxStoreItem>, PopoverStoreOptions {
+export interface ComboboxStoreOptions<T extends Value = Value> extends Core.ComboboxStoreOptions<T>, CompositeStoreOptions<ComboboxStoreItem>, PopoverStoreOptions {
     /**
-     * A callback that gets called when the `value` state changes.
+     * A callback that gets called when the
+     * [`value`](https://ariakit.org/reference/combobox-provider#value) state
+     * changes.
      *
      * Live examples:
      * - [Combobox with integrated
@@ -36,9 +42,21 @@ export interface ComboboxStoreOptions extends Core.ComboboxStoreOptions, Composi
      *   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)
-     * @param value The new value.
      */
-    setValue?: (value: ComboboxStoreState["value"]) => void;
+    setValue?: (value: ComboboxStoreState<T>["value"]) => void;
+    /**
+     * A callback that gets called when the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * state changes.
+     *
+     * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    setSelectedValue?: (value: ComboboxStoreState<T>["selectedValue"]) => void;
+}
+export interface ComboboxStoreProps<T extends Value = Value> extends ComboboxStoreOptions<T>, Core.ComboboxStoreProps<T> {
+}
+export interface ComboboxStore<T extends Value = Value> extends ComboboxStoreFunctions<T>, Store<Core.ComboboxStore<T>> {
 }
-export type ComboboxStoreProps = ComboboxStoreOptions & Core.ComboboxStoreProps;
-export type ComboboxStore = ComboboxStoreFunctions & Store<Core.ComboboxStore>;
+export {};

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

@@ -1,7 +1,9 @@
 import * as Core from "@ariakit/core/combobox/combobox-store";
+import type { PickRequired } from "@ariakit/core/utils/types";
 import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
 import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
 import type { Store } from "../utils/store.js";
+type Value = Core.ComboboxStoreSelectedValue;
 export declare function useComboboxStoreProps<T extends Core.ComboboxStore>(store: T, update: () => void, props: ComboboxStoreProps): T;
 /**
  * Creates a combobox store.
@@ -17,15 +19,19 @@ export declare function useComboboxStoreProps<T extends Core.ComboboxStore>(stor
  * </ComboboxPopover>
  * ```
  */
+export declare function useComboboxStore<T extends Value = Value>(props: PickRequired<ComboboxStoreProps<T>, "selectedValue" | "defaultSelectedValue">): ComboboxStore<T>;
 export declare function useComboboxStore(props?: ComboboxStoreProps): ComboboxStore;
 export type ComboboxStoreItem = Core.ComboboxStoreItem;
-export interface ComboboxStoreState extends Core.ComboboxStoreState, CompositeStoreState<ComboboxStoreItem>, PopoverStoreState {
+export type ComboboxStoreSelectedValue = Core.ComboboxStoreSelectedValue;
+export interface ComboboxStoreState<T extends Value = Value> extends Core.ComboboxStoreState<T>, CompositeStoreState<ComboboxStoreItem>, PopoverStoreState {
 }
-export interface ComboboxStoreFunctions extends Core.ComboboxStoreFunctions, CompositeStoreFunctions<ComboboxStoreItem>, PopoverStoreFunctions {
+export interface ComboboxStoreFunctions<T extends Value = Value> extends Core.ComboboxStoreFunctions<T>, CompositeStoreFunctions<ComboboxStoreItem>, PopoverStoreFunctions {
 }
-export interface ComboboxStoreOptions extends Core.ComboboxStoreOptions, CompositeStoreOptions<ComboboxStoreItem>, PopoverStoreOptions {
+export interface ComboboxStoreOptions<T extends Value = Value> extends Core.ComboboxStoreOptions<T>, CompositeStoreOptions<ComboboxStoreItem>, PopoverStoreOptions {
     /**
-     * A callback that gets called when the `value` state changes.
+     * A callback that gets called when the
+     * [`value`](https://ariakit.org/reference/combobox-provider#value) state
+     * changes.
      *
      * Live examples:
      * - [Combobox with integrated
@@ -36,9 +42,21 @@ export interface ComboboxStoreOptions extends Core.ComboboxStoreOptions, Composi
      *   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)
-     * @param value The new value.
      */
-    setValue?: (value: ComboboxStoreState["value"]) => void;
+    setValue?: (value: ComboboxStoreState<T>["value"]) => void;
+    /**
+     * A callback that gets called when the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * state changes.
+     *
+     * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    setSelectedValue?: (value: ComboboxStoreState<T>["selectedValue"]) => void;
+}
+export interface ComboboxStoreProps<T extends Value = Value> extends ComboboxStoreOptions<T>, Core.ComboboxStoreProps<T> {
+}
+export interface ComboboxStore<T extends Value = Value> extends ComboboxStoreFunctions<T>, Store<Core.ComboboxStore<T>> {
 }
-export type ComboboxStoreProps = ComboboxStoreOptions & Core.ComboboxStoreProps;
-export type ComboboxStore = ComboboxStoreFunctions & Store<Core.ComboboxStore>;
+export {};

package/cjs/combobox/combobox.cjs

@@ -4,7 +4,7 @@
 var _3QW6ELTGcjs = require('../__chunks/3QW6ELTG.cjs');
 
 
-var _VEG6PRAGcjs = require('../__chunks/VEG6PRAG.cjs');
+var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
 
 
 var _CZOBQEIOcjs = require('../__chunks/CZOBQEIO.cjs');
@@ -101,7 +101,7 @@ var useCombobox = _RNZNGEL4cjs.createHook.call(void 0,
       "moveOnKeyPress",
       "autoComplete"
     ]);
-    const context = _VEG6PRAGcjs.useComboboxProviderContext.call(void 0, );
+    const context = _3WCBE6SUcjs.useComboboxProviderContext.call(void 0, );
     store = store || context;
     _misc.invariant.call(void 0, 
       store,
@@ -231,15 +231,16 @@ var useCombobox = _RNZNGEL4cjs.createHook.call(void 0,
         return;
       canAutoSelectRef.current = false;
     }, [open]);
+    const resetValueOnSelect = store.useState("resetValueOnSelect");
     _EO6LS72Hcjs.useUpdateEffect.call(void 0, () => {
-      var _a2;
+      var _a2, _b2;
       if (!store)
         return;
-      if (!autoSelect)
+      if (!autoSelect && !resetValueOnSelect)
         return;
       if (!canAutoSelectRef.current)
         return;
-      const { baseElement, contentElement: contentElement2 } = store.getState();
+      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")) {
@@ -247,14 +248,23 @@ var useCombobox = _RNZNGEL4cjs.createHook.call(void 0,
         observer.observe(contentElement2, { attributeFilter: ["data-placing"] });
         return () => observer.disconnect();
       }
-      store.move((_a2 = store.first()) != null ? _a2 : null);
+      if (autoSelect) {
+        store.move((_a2 = store.first()) != null ? _a2 : null);
+      } else {
+        const element = (_b2 = store.item(activeId)) == null ? void 0 : _b2.element;
+        if (element && "scrollIntoView" in element) {
+          element.scrollIntoView({ block: "nearest", inline: "nearest" });
+        }
+      }
       return;
-    }, [store, valueUpdated, storeValue, autoSelect, items]);
-    _EO6LS72Hcjs.useSafeLayoutEffect.call(void 0, () => {
-      if (autoSelect)
-        return;
-      store == null ? void 0 : store.setActiveId(null);
-    }, [valueUpdated, autoSelect, store]);
+    }, [
+      store,
+      valueUpdated,
+      storeValue,
+      autoSelect,
+      resetValueOnSelect,
+      items
+    ]);
     _react.useEffect.call(void 0, () => {
       if (!inline)
         return;

package/cjs/composite/composite-hover.d.cts

@@ -46,6 +46,8 @@ export interface CompositeHoverOptions<T extends As = "div"> extends Options<T>
      * Determines if the composite item should be focused on hover.
      *
      * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * - [Combobox with integrated
      *   filter](https://ariakit.org/examples/combobox-filtering-integrated)
      * - [Textarea with inline
@@ -60,6 +62,7 @@ export interface CompositeHoverOptions<T extends As = "div"> extends Options<T>
      * is `true`.
      *
      * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Combobox with integrated
      *   filter](https://ariakit.org/examples/combobox-filtering-integrated)
      */

package/cjs/composite/composite-hover.d.ts

@@ -46,6 +46,8 @@ export interface CompositeHoverOptions<T extends As = "div"> extends Options<T>
      * Determines if the composite item should be focused on hover.
      *
      * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * - [Combobox with integrated
      *   filter](https://ariakit.org/examples/combobox-filtering-integrated)
      * - [Textarea with inline
@@ -60,6 +62,7 @@ export interface CompositeHoverOptions<T extends As = "div"> extends Options<T>
      * is `true`.
      *
      * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Combobox with integrated
      *   filter](https://ariakit.org/examples/combobox-filtering-integrated)
      */

package/cjs/composite/composite-item.d.cts

@@ -84,6 +84,9 @@ export interface CompositeItemOptions<T extends As = "button"> extends CommandOp
      * **Note**: This prop has no effect when the
      * [`virtualFocus`](https://ariakit.org/reference/composite-provider#virtualfocus)
      * option is enabled.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     tabbable?: boolean;
 }

package/cjs/composite/composite-item.d.ts

@@ -84,6 +84,9 @@ export interface CompositeItemOptions<T extends As = "button"> extends CommandOp
      * **Note**: This prop has no effect when the
      * [`virtualFocus`](https://ariakit.org/reference/composite-provider#virtualfocus)
      * option is enabled.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     tabbable?: boolean;
 }

package/cjs/disclosure/disclosure-content.d.cts

@@ -61,6 +61,7 @@ export interface DisclosureContentOptions<T extends As = "div"> extends Options<
      * the DOM when it's hidden.
      *
      * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Combobox with integrated
      *   filter](https://ariakit.org/examples/combobox-filtering-integrated)
      * - [Textarea with inline