@ariakit/core 0.3.6 → 0.3.7

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @ariakit/core
 
+## 0.3.7
+
+### Multi-selectable Combobox
+
+We've added support for the [Combobox](https://ariakit.org/components/combobox) with multiple selection capabilities using a new [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue) prop, along with [`defaultSelectedValue`](https://ariakit.org/reference/combobox-provider#defaultselectedvalue) and [`setSelectedValue`](https://ariakit.org/reference/combobox-provider#setselectedvalue).
+
+This works similarly to the [`value`](https://ariakit.org/reference/select-provider#value) prop on [Select](https://ariakit.org/components/select) components. If it receives an array, the combobox will allow multiple selections. By default, it's a string that represents the selected value in a single-select combobox.
+
+Check out the [Multi-selectable Combobox](https://ariakit.org/examples/combobox-multiple) example to see it in action.
+
+### Other updates
+
+- Added [`resetValueOnSelect`](https://ariakit.org/reference/combobox-provider#resetvalueonselect) state to [Combobox](https://ariakit.org/components/combobox) components.
+
 ## 0.3.6
 
 - Fixed `setSelectionRange` error when used with [unsupported](https://html.spec.whatwg.org/multipage/input.html#concept-input-apply) input types.

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

@@ -1,9 +1,9 @@
 import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
 import type { BivariantCallback } from "../utils/types.js";
-type Item = {
+interface Item {
     id: string;
     element?: HTMLElement | null;
-};
+}
 /**
  * Creates a collection store.
  */
@@ -60,6 +60,8 @@ export interface CollectionStoreOptions<T extends Item = Item> extends StoreOpti
      */
     defaultItems?: CollectionStoreState<T>["items"];
 }
-export type CollectionStoreProps<T extends Item = Item> = CollectionStoreOptions<T> & StoreProps<CollectionStoreState<T>>;
-export type CollectionStore<T extends Item = Item> = CollectionStoreFunctions<T> & Store<CollectionStoreState<T>>;
+export interface CollectionStoreProps<T extends Item = Item> extends CollectionStoreOptions<T>, StoreProps<CollectionStoreState<T>> {
+}
+export interface CollectionStore<T extends Item = Item> extends CollectionStoreFunctions<T>, Store<CollectionStoreState<T>> {
+}
 export {};

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

@@ -1,9 +1,9 @@
 import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
 import type { BivariantCallback } from "../utils/types.js";
-type Item = {
+interface Item {
     id: string;
     element?: HTMLElement | null;
-};
+}
 /**
  * Creates a collection store.
  */
@@ -60,6 +60,8 @@ export interface CollectionStoreOptions<T extends Item = Item> extends StoreOpti
      */
     defaultItems?: CollectionStoreState<T>["items"];
 }
-export type CollectionStoreProps<T extends Item = Item> = CollectionStoreOptions<T> & StoreProps<CollectionStoreState<T>>;
-export type CollectionStore<T extends Item = Item> = CollectionStoreFunctions<T> & Store<CollectionStoreState<T>>;
+export interface CollectionStoreProps<T extends Item = Item> extends CollectionStoreOptions<T>, StoreProps<CollectionStoreState<T>> {
+}
+export interface CollectionStore<T extends Item = Item> extends CollectionStoreFunctions<T>, Store<CollectionStoreState<T>> {
+}
 export {};

package/cjs/combobox/combobox-store.cjs

@@ -68,18 +68,31 @@ function createComboboxStore(props = {}) {
       "bottom-start"
     )
   }));
-  const initialValue = _3UT5FE6Kcjs.defaultValue.call(void 0, 
+  const value = _3UT5FE6Kcjs.defaultValue.call(void 0, 
     props.value,
     syncState == null ? void 0 : syncState.value,
     props.defaultValue,
     ""
   );
+  const selectedValue = _3UT5FE6Kcjs.defaultValue.call(void 0, 
+    props.selectedValue,
+    syncState == null ? void 0 : syncState.selectedValue,
+    props.defaultSelectedValue,
+    ""
+  );
+  const multiSelectable = Array.isArray(selectedValue);
   const initialState = _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, composite.getState()), popover.getState()), {
-    value: initialValue,
+    value,
+    selectedValue,
+    resetValueOnSelect: _3UT5FE6Kcjs.defaultValue.call(void 0, 
+      props.resetValueOnSelect,
+      syncState == null ? void 0 : syncState.resetValueOnSelect,
+      multiSelectable
+    ),
     resetValueOnHide: _3UT5FE6Kcjs.defaultValue.call(void 0, 
       props.resetValueOnHide,
       syncState == null ? void 0 : syncState.resetValueOnHide,
-      false
+      multiSelectable
     ),
     activeValue: syncState == null ? void 0 : syncState.activeValue
   });
@@ -91,7 +104,15 @@ function createComboboxStore(props = {}) {
         return;
       if (state.mounted)
         return;
-      combobox.setState("value", initialValue);
+      combobox.setState("value", value);
+    })
+  );
+  _46BH65MCcjs.setup.call(void 0, 
+    combobox,
+    () => _46BH65MCcjs.sync.call(void 0, combobox, ["resetValueOnSelect", "selectedValue"], (state) => {
+      if (!state.resetValueOnSelect)
+        return;
+      combobox.setState("value", value);
     })
   );
   _46BH65MCcjs.setup.call(void 0, 
@@ -122,7 +143,8 @@ function createComboboxStore(props = {}) {
     })
   );
   return _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, popover), composite), combobox), {
-    setValue: (value) => combobox.setState("value", value)
+    setValue: (value2) => combobox.setState("value", value2),
+    setSelectedValue: (selectedValue2) => combobox.setState("selectedValue", selectedValue2)
   });
 }
 

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

@@ -1,22 +1,26 @@
 import type { CompositeStoreFunctions, CompositeStoreItem, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
 import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
 import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
-import type { SetState } from "../utils/types.js";
-type Item = CompositeStoreItem & {
+import type { PickRequired, SetState } from "../utils/types.js";
+type Value = string | string[];
+type MutableValue<T extends Value = Value> = T extends string ? string : T;
+interface Item extends CompositeStoreItem {
     value?: string;
-};
+}
 /**
  * Creates a combobox store.
  */
+export declare function createComboboxStore<T extends Value = Value>(props: PickRequired<ComboboxStoreProps<T>, "selectedValue" | "defaultSelectedValue">): ComboboxStore<T>;
 export declare function createComboboxStore(props?: ComboboxStoreProps): ComboboxStore;
 export type ComboboxStoreItem = Item;
-export interface ComboboxStoreState extends CompositeStoreState<Item>, PopoverStoreState {
+export type ComboboxStoreSelectedValue = Value;
+export interface ComboboxStoreState<T extends Value = Value> extends CompositeStoreState<Item>, PopoverStoreState {
     /**
      * @default true
      */
     includesBaseElement: boolean;
     /**
-     * The input value.
+     * The combobox input value.
      *
      * Live examples:
      * - [Combobox with integrated
@@ -34,47 +38,88 @@ export interface ComboboxStoreState extends CompositeStoreState<Item>, PopoverSt
      */
     activeValue: string | undefined;
     /**
-     * Whether to reset the value when the combobox popover is hidden.
+     * The value(s) of the currently selected item(s). This can be a string or an
+     * array of strings. If it's an array, the combobox is considered
+     * [multi-selectable](https://ariakit.org/examples/combobox-multiple).
+     *
+     * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    selectedValue: MutableValue<T>;
+    /**
+     * Whether to reset the value when the combobox popover closes. This prop is
+     * automatically set to `true` by default if the combobox supports multiple
+     * selections. In other words, if the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * or
+     * [`defaultSelectedValue`](https://ariakit.org/reference/combobox-provider#defaultselectedvalue)
+     * props are arrays.
      *
      * Live examples:
      * - [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)
-     * @default false
      */
     resetValueOnHide: boolean;
-}
-export interface ComboboxStoreFunctions extends CompositeStoreFunctions<Item>, PopoverStoreFunctions {
     /**
-     * Sets the `value` state.
+     * Whether to reset the value when an item is selected. This prop is
+     * automatically set to `true` by default if the combobox supports multiple
+     * selections. In other words, if the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * or
+     * [`defaultSelectedValue`](https://ariakit.org/reference/combobox-provider#defaultselectedvalue)
+     * props are arrays.
      *
      * Live examples:
      * - [Multi-selectable
      *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    resetValueOnSelect: boolean;
+}
+export interface ComboboxStoreFunctions<T extends Value = Value> extends CompositeStoreFunctions<Item>, PopoverStoreFunctions {
+    /**
+     * Sets the [`value`](https://ariakit.org/reference/combobox-provider#value)
+     * state.
+     *
+     * Live examples:
      * - [Textarea with inline
      *   Combobox](https://ariakit.org/examples/combobox-textarea)
      * @example
      * store.setValue("Hello world");
      * store.setValue((value) => value + "!");
      */
-    setValue: SetState<ComboboxStoreState["value"]>;
+    setValue: SetState<ComboboxStoreState<T>["value"]>;
+    /**
+     * Sets the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * state.
+     */
+    setSelectedValue: SetState<ComboboxStoreState<T>["selectedValue"]>;
 }
-export interface ComboboxStoreOptions extends StoreOptions<ComboboxStoreState, "includesBaseElement" | "value" | "resetValueOnHide">, CompositeStoreOptions<Item>, PopoverStoreOptions {
+export interface ComboboxStoreOptions<T extends Value = Value> extends StoreOptions<ComboboxStoreState<T>, "includesBaseElement" | "value" | "selectedValue" | "resetValueOnHide" | "resetValueOnSelect">, CompositeStoreOptions<Item>, PopoverStoreOptions {
     /**
      * @default null
      */
     defaultActiveId?: CompositeStoreOptions<Item>["activeId"];
     /**
-     * The combobox initial value.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     * The initial value of the combobox input.
+     * @default ""
+     */
+    defaultValue?: ComboboxStoreState<T>["value"];
+    /**
+     * The initial value of the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * state. This can be a string or an array of strings. If it's an array, the
+     * combobox is considered
+     * [multi-selectable](https://ariakit.org/examples/combobox-multiple).
      * @default ""
      */
-    defaultValue?: ComboboxStoreState["value"];
+    defaultSelectedValue?: ComboboxStoreState<T>["selectedValue"];
+}
+export interface ComboboxStoreProps<T extends Value = Value> extends ComboboxStoreOptions<T>, StoreProps<ComboboxStoreState<T>> {
+}
+export interface ComboboxStore<T extends Value = Value> extends ComboboxStoreFunctions<T>, Store<ComboboxStoreState<T>> {
 }
-export type ComboboxStoreProps = ComboboxStoreOptions & StoreProps<ComboboxStoreState>;
-export type ComboboxStore = ComboboxStoreFunctions & Store<ComboboxStoreState>;
 export {};

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

@@ -1,22 +1,26 @@
 import type { CompositeStoreFunctions, CompositeStoreItem, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
 import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
 import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
-import type { SetState } from "../utils/types.js";
-type Item = CompositeStoreItem & {
+import type { PickRequired, SetState } from "../utils/types.js";
+type Value = string | string[];
+type MutableValue<T extends Value = Value> = T extends string ? string : T;
+interface Item extends CompositeStoreItem {
     value?: string;
-};
+}
 /**
  * Creates a combobox store.
  */
+export declare function createComboboxStore<T extends Value = Value>(props: PickRequired<ComboboxStoreProps<T>, "selectedValue" | "defaultSelectedValue">): ComboboxStore<T>;
 export declare function createComboboxStore(props?: ComboboxStoreProps): ComboboxStore;
 export type ComboboxStoreItem = Item;
-export interface ComboboxStoreState extends CompositeStoreState<Item>, PopoverStoreState {
+export type ComboboxStoreSelectedValue = Value;
+export interface ComboboxStoreState<T extends Value = Value> extends CompositeStoreState<Item>, PopoverStoreState {
     /**
      * @default true
      */
     includesBaseElement: boolean;
     /**
-     * The input value.
+     * The combobox input value.
      *
      * Live examples:
      * - [Combobox with integrated
@@ -34,47 +38,88 @@ export interface ComboboxStoreState extends CompositeStoreState<Item>, PopoverSt
      */
     activeValue: string | undefined;
     /**
-     * Whether to reset the value when the combobox popover is hidden.
+     * The value(s) of the currently selected item(s). This can be a string or an
+     * array of strings. If it's an array, the combobox is considered
+     * [multi-selectable](https://ariakit.org/examples/combobox-multiple).
+     *
+     * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    selectedValue: MutableValue<T>;
+    /**
+     * Whether to reset the value when the combobox popover closes. This prop is
+     * automatically set to `true` by default if the combobox supports multiple
+     * selections. In other words, if the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * or
+     * [`defaultSelectedValue`](https://ariakit.org/reference/combobox-provider#defaultselectedvalue)
+     * props are arrays.
      *
      * Live examples:
      * - [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)
-     * @default false
      */
     resetValueOnHide: boolean;
-}
-export interface ComboboxStoreFunctions extends CompositeStoreFunctions<Item>, PopoverStoreFunctions {
     /**
-     * Sets the `value` state.
+     * Whether to reset the value when an item is selected. This prop is
+     * automatically set to `true` by default if the combobox supports multiple
+     * selections. In other words, if the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * or
+     * [`defaultSelectedValue`](https://ariakit.org/reference/combobox-provider#defaultselectedvalue)
+     * props are arrays.
      *
      * Live examples:
      * - [Multi-selectable
      *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    resetValueOnSelect: boolean;
+}
+export interface ComboboxStoreFunctions<T extends Value = Value> extends CompositeStoreFunctions<Item>, PopoverStoreFunctions {
+    /**
+     * Sets the [`value`](https://ariakit.org/reference/combobox-provider#value)
+     * state.
+     *
+     * Live examples:
      * - [Textarea with inline
      *   Combobox](https://ariakit.org/examples/combobox-textarea)
      * @example
      * store.setValue("Hello world");
      * store.setValue((value) => value + "!");
      */
-    setValue: SetState<ComboboxStoreState["value"]>;
+    setValue: SetState<ComboboxStoreState<T>["value"]>;
+    /**
+     * Sets the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * state.
+     */
+    setSelectedValue: SetState<ComboboxStoreState<T>["selectedValue"]>;
 }
-export interface ComboboxStoreOptions extends StoreOptions<ComboboxStoreState, "includesBaseElement" | "value" | "resetValueOnHide">, CompositeStoreOptions<Item>, PopoverStoreOptions {
+export interface ComboboxStoreOptions<T extends Value = Value> extends StoreOptions<ComboboxStoreState<T>, "includesBaseElement" | "value" | "selectedValue" | "resetValueOnHide" | "resetValueOnSelect">, CompositeStoreOptions<Item>, PopoverStoreOptions {
     /**
      * @default null
      */
     defaultActiveId?: CompositeStoreOptions<Item>["activeId"];
     /**
-     * The combobox initial value.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     * The initial value of the combobox input.
+     * @default ""
+     */
+    defaultValue?: ComboboxStoreState<T>["value"];
+    /**
+     * The initial value of the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * state. This can be a string or an array of strings. If it's an array, the
+     * combobox is considered
+     * [multi-selectable](https://ariakit.org/examples/combobox-multiple).
      * @default ""
      */
-    defaultValue?: ComboboxStoreState["value"];
+    defaultSelectedValue?: ComboboxStoreState<T>["selectedValue"];
+}
+export interface ComboboxStoreProps<T extends Value = Value> extends ComboboxStoreOptions<T>, StoreProps<ComboboxStoreState<T>> {
+}
+export interface ComboboxStore<T extends Value = Value> extends ComboboxStoreFunctions<T>, Store<ComboboxStoreState<T>> {
 }
-export type ComboboxStoreProps = ComboboxStoreOptions & StoreProps<ComboboxStoreState>;
-export type ComboboxStore = ComboboxStoreFunctions & Store<ComboboxStoreState>;
 export {};

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

@@ -2,11 +2,11 @@ import type { CollectionStoreFunctions, CollectionStoreItem, CollectionStoreOpti
 import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
 import type { SetState } from "../utils/types.js";
 type Orientation = "horizontal" | "vertical" | "both";
-type Item = CollectionStoreItem & {
+interface Item extends CollectionStoreItem {
     rowId?: string;
     disabled?: boolean;
     children?: string;
-};
+}
 /**
  * Creates a composite store.
  */
@@ -25,10 +25,6 @@ export interface CompositeStoreState<T extends Item = Item> extends CollectionSt
      * tabindex](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex).
      * DOM focus will remain on the composite element while its items receive
      * virtual focus.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * @default false
      */
     virtualFocus: boolean;
@@ -201,6 +197,8 @@ export interface CompositeStoreOptions<T extends Item = Item> extends StoreOptio
      */
     defaultActiveId?: CompositeStoreState<T>["activeId"];
 }
-export type CompositeStoreProps<T extends Item = Item> = CompositeStoreOptions<T> & StoreProps<CompositeStoreState<T>>;
-export type CompositeStore<T extends Item = Item> = CompositeStoreFunctions<T> & Store<CompositeStoreState<T>>;
+export interface CompositeStoreProps<T extends Item = Item> extends CompositeStoreOptions<T>, StoreProps<CompositeStoreState<T>> {
+}
+export interface CompositeStore<T extends Item = Item> extends CompositeStoreFunctions<T>, Store<CompositeStoreState<T>> {
+}
 export {};

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

@@ -2,11 +2,11 @@ import type { CollectionStoreFunctions, CollectionStoreItem, CollectionStoreOpti
 import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
 import type { SetState } from "../utils/types.js";
 type Orientation = "horizontal" | "vertical" | "both";
-type Item = CollectionStoreItem & {
+interface Item extends CollectionStoreItem {
     rowId?: string;
     disabled?: boolean;
     children?: string;
-};
+}
 /**
  * Creates a composite store.
  */
@@ -25,10 +25,6 @@ export interface CompositeStoreState<T extends Item = Item> extends CollectionSt
      * tabindex](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex).
      * DOM focus will remain on the composite element while its items receive
      * virtual focus.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * @default false
      */
     virtualFocus: boolean;
@@ -201,6 +197,8 @@ export interface CompositeStoreOptions<T extends Item = Item> extends StoreOptio
      */
     defaultActiveId?: CompositeStoreState<T>["activeId"];
 }
-export type CompositeStoreProps<T extends Item = Item> = CompositeStoreOptions<T> & StoreProps<CompositeStoreState<T>>;
-export type CompositeStore<T extends Item = Item> = CompositeStoreFunctions<T> & Store<CompositeStoreState<T>>;
+export interface CompositeStoreProps<T extends Item = Item> extends CompositeStoreOptions<T>, StoreProps<CompositeStoreState<T>> {
+}
+export interface CompositeStore<T extends Item = Item> extends CompositeStoreFunctions<T>, Store<CompositeStoreState<T>> {
+}
 export {};

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

@@ -36,6 +36,7 @@ export interface DisclosureStoreState {
      *   milliseconds to pass before becoming `false`.
      *
      * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Animated Combobox](https://ariakit.org/examples/combobox-animated)
      * - [Animated Dialog](https://ariakit.org/examples/dialog-animated)
      * - [Animated Select](https://ariakit.org/examples/select-animated)
@@ -73,6 +74,7 @@ export interface DisclosureStoreFunctions {
      * Sets the `open` state to `true`.
      *
      * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Textarea with inline
      *   Combobox](https://ariakit.org/examples/combobox-textarea)
      */

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

@@ -36,6 +36,7 @@ export interface DisclosureStoreState {
      *   milliseconds to pass before becoming `false`.
      *
      * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Animated Combobox](https://ariakit.org/examples/combobox-animated)
      * - [Animated Dialog](https://ariakit.org/examples/dialog-animated)
      * - [Animated Select](https://ariakit.org/examples/select-animated)
@@ -73,6 +74,7 @@ export interface DisclosureStoreFunctions {
      * Sets the `open` state to `true`.
      *
      * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Textarea with inline
      *   Combobox](https://ariakit.org/examples/combobox-textarea)
      */

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

@@ -20,11 +20,17 @@ export interface HovercardStoreState extends PopoverStoreState {
     /**
      * The amount of time in milliseconds to wait before **showing** the popover.
      * It defaults to the value passed to `timeout`.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     showTimeout?: number;
     /**
      * The amount of time in milliseconds to wait before **hiding** the popover.
      * It defaults to the value passed to `timeout`.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     hideTimeout?: number;
     /**

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

@@ -20,11 +20,17 @@ export interface HovercardStoreState extends PopoverStoreState {
     /**
      * The amount of time in milliseconds to wait before **showing** the popover.
      * It defaults to the value passed to `timeout`.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     showTimeout?: number;
     /**
      * The amount of time in milliseconds to wait before **hiding** the popover.
      * It defaults to the value passed to `timeout`.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     hideTimeout?: number;
     /**

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

@@ -28,6 +28,9 @@ export interface PopoverStoreState extends DialogStoreState {
     currentPlacement: Placement;
     /**
      * The placement of the popover.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * @default "bottom"
      */
     placement: Placement;

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

@@ -28,6 +28,9 @@ export interface PopoverStoreState extends DialogStoreState {
     currentPlacement: Placement;
     /**
      * The placement of the popover.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * @default "bottom"
      */
     placement: Placement;

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

@@ -5,9 +5,9 @@ import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
 import type { PickRequired, SetState } from "../utils/types.js";
 type Value = string | string[];
 type MutableValue<T extends Value = Value> = T extends string ? string : T;
-type Item = CompositeStoreItem & {
+interface Item extends CompositeStoreItem {
     value?: string;
-};
+}
 export declare function createSelectStore<T extends Value = Value>(props: PickRequired<SelectStoreProps<T>, "value" | "defaultValue">): SelectStore<T>;
 export declare function createSelectStore(props?: SelectStoreProps): SelectStore;
 export type SelectStoreItem = Item;
@@ -27,18 +27,32 @@ export interface SelectStoreState<T extends Value = Value> extends CompositeStor
      * The select value.
      *
      * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     * - [Form with Select](https://ariakit.org/examples/form-select)
+     * - [Select Grid](https://ariakit.org/examples/select-grid)
+     * - [Select with custom
+     *   items](https://ariakit.org/examples/select-item-custom)
+     * - [Multi-Select](https://ariakit.org/examples/select-multiple)
+     * - [Toolbar with Select](https://ariakit.org/examples/toolbar-select)
      */
     value: MutableValue<T>;
     /**
-     * Whether the select value should be set when the active item changes by
-     * moving (which usually happens when moving to an item using the keyboard).
+     * Whether the select
+     * [`value`](https://ariakit.org/reference/select-provider#value) should be
+     * set when the active item changes by moving (which usually happens when
+     * moving to an item using the keyboard).
+     *
+     * Live examples:
+     * - [Select Grid](https://ariakit.org/examples/select-grid)
+     * - [Select with custom
+     *   items](https://ariakit.org/examples/select-item-custom)
      * @default false
      */
     setValueOnMove: boolean;
     /**
      * The select button element.
+     *
+     * Live examples:
+     * - [Form with Select](https://ariakit.org/examples/form-select)
      */
     selectElement: HTMLElement | null;
     /**
@@ -49,10 +63,6 @@ export interface SelectStoreState<T extends Value = Value> extends CompositeStor
 export interface SelectStoreFunctions<T extends Value = Value> extends Pick<SelectStoreOptions<T>, "combobox">, CompositeStoreFunctions<Item>, PopoverStoreFunctions {
     /**
      * Sets the `value` state.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * @example
      * store.setValue("Apple");
      * store.setValue(["Apple", "Banana"]);
@@ -73,21 +83,21 @@ export interface SelectStoreOptions<T extends Value = Value> extends StoreOption
      * A reference to a combobox store. This is used when combining the combobox
      * with a select (e.g., select with a search input). The stores will share the
      * same state.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      */
     combobox?: ComboboxStore | null;
     /**
      * The default value. If not set, the first non-disabled item will be used.
      *
      * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     * - [Form with Select](https://ariakit.org/examples/form-select)
+     * - [Animated Select](https://ariakit.org/examples/select-animated)
+     * - [Select with Combobox](https://ariakit.org/examples/select-combobox)
+     * - [SelectGroup](https://ariakit.org/examples/select-group)
      */
     defaultValue?: SelectStoreState<T>["value"];
 }
-export type SelectStoreProps<T extends Value = Value> = SelectStoreOptions<T> & StoreProps<SelectStoreState<T>>;
-export type SelectStore<T extends Value = Value> = SelectStoreFunctions<T> & Store<SelectStoreState<T>>;
+export interface SelectStoreProps<T extends Value = Value> extends SelectStoreOptions<T>, StoreProps<SelectStoreState<T>> {
+}
+export interface SelectStore<T extends Value = Value> extends SelectStoreFunctions<T>, Store<SelectStoreState<T>> {
+}
 export {};

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

@@ -5,9 +5,9 @@ import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
 import type { PickRequired, SetState } from "../utils/types.js";
 type Value = string | string[];
 type MutableValue<T extends Value = Value> = T extends string ? string : T;
-type Item = CompositeStoreItem & {
+interface Item extends CompositeStoreItem {
     value?: string;
-};
+}
 export declare function createSelectStore<T extends Value = Value>(props: PickRequired<SelectStoreProps<T>, "value" | "defaultValue">): SelectStore<T>;
 export declare function createSelectStore(props?: SelectStoreProps): SelectStore;
 export type SelectStoreItem = Item;
@@ -27,18 +27,32 @@ export interface SelectStoreState<T extends Value = Value> extends CompositeStor
      * The select value.
      *
      * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     * - [Form with Select](https://ariakit.org/examples/form-select)
+     * - [Select Grid](https://ariakit.org/examples/select-grid)
+     * - [Select with custom
+     *   items](https://ariakit.org/examples/select-item-custom)
+     * - [Multi-Select](https://ariakit.org/examples/select-multiple)
+     * - [Toolbar with Select](https://ariakit.org/examples/toolbar-select)
      */
     value: MutableValue<T>;
     /**
-     * Whether the select value should be set when the active item changes by
-     * moving (which usually happens when moving to an item using the keyboard).
+     * Whether the select
+     * [`value`](https://ariakit.org/reference/select-provider#value) should be
+     * set when the active item changes by moving (which usually happens when
+     * moving to an item using the keyboard).
+     *
+     * Live examples:
+     * - [Select Grid](https://ariakit.org/examples/select-grid)
+     * - [Select with custom
+     *   items](https://ariakit.org/examples/select-item-custom)
      * @default false
      */
     setValueOnMove: boolean;
     /**
      * The select button element.
+     *
+     * Live examples:
+     * - [Form with Select](https://ariakit.org/examples/form-select)
      */
     selectElement: HTMLElement | null;
     /**
@@ -49,10 +63,6 @@ export interface SelectStoreState<T extends Value = Value> extends CompositeStor
 export interface SelectStoreFunctions<T extends Value = Value> extends Pick<SelectStoreOptions<T>, "combobox">, CompositeStoreFunctions<Item>, PopoverStoreFunctions {
     /**
      * Sets the `value` state.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * @example
      * store.setValue("Apple");
      * store.setValue(["Apple", "Banana"]);
@@ -73,21 +83,21 @@ export interface SelectStoreOptions<T extends Value = Value> extends StoreOption
      * A reference to a combobox store. This is used when combining the combobox
      * with a select (e.g., select with a search input). The stores will share the
      * same state.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      */
     combobox?: ComboboxStore | null;
     /**
      * The default value. If not set, the first non-disabled item will be used.
      *
      * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     * - [Form with Select](https://ariakit.org/examples/form-select)
+     * - [Animated Select](https://ariakit.org/examples/select-animated)
+     * - [Select with Combobox](https://ariakit.org/examples/select-combobox)
+     * - [SelectGroup](https://ariakit.org/examples/select-group)
      */
     defaultValue?: SelectStoreState<T>["value"];
 }
-export type SelectStoreProps<T extends Value = Value> = SelectStoreOptions<T> & StoreProps<SelectStoreState<T>>;
-export type SelectStore<T extends Value = Value> = SelectStoreFunctions<T> & Store<SelectStoreState<T>>;
+export interface SelectStoreProps<T extends Value = Value> extends SelectStoreOptions<T>, StoreProps<SelectStoreState<T>> {
+}
+export interface SelectStore<T extends Value = Value> extends SelectStoreFunctions<T>, Store<SelectStoreState<T>> {
+}
 export {};

package/cjs/utils/store.d.cts

@@ -46,6 +46,9 @@ export type StoreOptions<S extends State, K extends keyof S> = Partial<Pick<S, K
 export type StoreProps<S extends State = State> = {
     /**
      * Another store object that will be kept in sync with the original store.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     store?: Store<Partial<S>>;
 };

package/cjs/utils/store.d.ts

@@ -46,6 +46,9 @@ export type StoreOptions<S extends State, K extends keyof S> = Partial<Pick<S, K
 export type StoreProps<S extends State = State> = {
     /**
      * Another store object that will be kept in sync with the original store.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     store?: Store<Partial<S>>;
 };

package/esm/collection/collection-store.d.ts

@@ -1,9 +1,9 @@
 import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
 import type { BivariantCallback } from "../utils/types.js";
-type Item = {
+interface Item {
     id: string;
     element?: HTMLElement | null;
-};
+}
 /**
  * Creates a collection store.
  */
@@ -60,6 +60,8 @@ export interface CollectionStoreOptions<T extends Item = Item> extends StoreOpti
      */
     defaultItems?: CollectionStoreState<T>["items"];
 }
-export type CollectionStoreProps<T extends Item = Item> = CollectionStoreOptions<T> & StoreProps<CollectionStoreState<T>>;
-export type CollectionStore<T extends Item = Item> = CollectionStoreFunctions<T> & Store<CollectionStoreState<T>>;
+export interface CollectionStoreProps<T extends Item = Item> extends CollectionStoreOptions<T>, StoreProps<CollectionStoreState<T>> {
+}
+export interface CollectionStore<T extends Item = Item> extends CollectionStoreFunctions<T>, Store<CollectionStoreState<T>> {
+}
 export {};

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

@@ -1,22 +1,26 @@
 import type { CompositeStoreFunctions, CompositeStoreItem, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.js";
 import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
 import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
-import type { SetState } from "../utils/types.js";
-type Item = CompositeStoreItem & {
+import type { PickRequired, SetState } from "../utils/types.js";
+type Value = string | string[];
+type MutableValue<T extends Value = Value> = T extends string ? string : T;
+interface Item extends CompositeStoreItem {
     value?: string;
-};
+}
 /**
  * Creates a combobox store.
  */
+export declare function createComboboxStore<T extends Value = Value>(props: PickRequired<ComboboxStoreProps<T>, "selectedValue" | "defaultSelectedValue">): ComboboxStore<T>;
 export declare function createComboboxStore(props?: ComboboxStoreProps): ComboboxStore;
 export type ComboboxStoreItem = Item;
-export interface ComboboxStoreState extends CompositeStoreState<Item>, PopoverStoreState {
+export type ComboboxStoreSelectedValue = Value;
+export interface ComboboxStoreState<T extends Value = Value> extends CompositeStoreState<Item>, PopoverStoreState {
     /**
      * @default true
      */
     includesBaseElement: boolean;
     /**
-     * The input value.
+     * The combobox input value.
      *
      * Live examples:
      * - [Combobox with integrated
@@ -34,47 +38,88 @@ export interface ComboboxStoreState extends CompositeStoreState<Item>, PopoverSt
      */
     activeValue: string | undefined;
     /**
-     * Whether to reset the value when the combobox popover is hidden.
+     * The value(s) of the currently selected item(s). This can be a string or an
+     * array of strings. If it's an array, the combobox is considered
+     * [multi-selectable](https://ariakit.org/examples/combobox-multiple).
+     *
+     * Live examples:
+     * - [Multi-selectable
+     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    selectedValue: MutableValue<T>;
+    /**
+     * Whether to reset the value when the combobox popover closes. This prop is
+     * automatically set to `true` by default if the combobox supports multiple
+     * selections. In other words, if the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * or
+     * [`defaultSelectedValue`](https://ariakit.org/reference/combobox-provider#defaultselectedvalue)
+     * props are arrays.
      *
      * Live examples:
      * - [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)
-     * @default false
      */
     resetValueOnHide: boolean;
-}
-export interface ComboboxStoreFunctions extends CompositeStoreFunctions<Item>, PopoverStoreFunctions {
     /**
-     * Sets the `value` state.
+     * Whether to reset the value when an item is selected. This prop is
+     * automatically set to `true` by default if the combobox supports multiple
+     * selections. In other words, if the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * or
+     * [`defaultSelectedValue`](https://ariakit.org/reference/combobox-provider#defaultselectedvalue)
+     * props are arrays.
      *
      * Live examples:
      * - [Multi-selectable
      *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     */
+    resetValueOnSelect: boolean;
+}
+export interface ComboboxStoreFunctions<T extends Value = Value> extends CompositeStoreFunctions<Item>, PopoverStoreFunctions {
+    /**
+     * Sets the [`value`](https://ariakit.org/reference/combobox-provider#value)
+     * state.
+     *
+     * Live examples:
      * - [Textarea with inline
      *   Combobox](https://ariakit.org/examples/combobox-textarea)
      * @example
      * store.setValue("Hello world");
      * store.setValue((value) => value + "!");
      */
-    setValue: SetState<ComboboxStoreState["value"]>;
+    setValue: SetState<ComboboxStoreState<T>["value"]>;
+    /**
+     * Sets the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * state.
+     */
+    setSelectedValue: SetState<ComboboxStoreState<T>["selectedValue"]>;
 }
-export interface ComboboxStoreOptions extends StoreOptions<ComboboxStoreState, "includesBaseElement" | "value" | "resetValueOnHide">, CompositeStoreOptions<Item>, PopoverStoreOptions {
+export interface ComboboxStoreOptions<T extends Value = Value> extends StoreOptions<ComboboxStoreState<T>, "includesBaseElement" | "value" | "selectedValue" | "resetValueOnHide" | "resetValueOnSelect">, CompositeStoreOptions<Item>, PopoverStoreOptions {
     /**
      * @default null
      */
     defaultActiveId?: CompositeStoreOptions<Item>["activeId"];
     /**
-     * The combobox initial value.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     * The initial value of the combobox input.
+     * @default ""
+     */
+    defaultValue?: ComboboxStoreState<T>["value"];
+    /**
+     * The initial value of the
+     * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
+     * state. This can be a string or an array of strings. If it's an array, the
+     * combobox is considered
+     * [multi-selectable](https://ariakit.org/examples/combobox-multiple).
      * @default ""
      */
-    defaultValue?: ComboboxStoreState["value"];
+    defaultSelectedValue?: ComboboxStoreState<T>["selectedValue"];
+}
+export interface ComboboxStoreProps<T extends Value = Value> extends ComboboxStoreOptions<T>, StoreProps<ComboboxStoreState<T>> {
+}
+export interface ComboboxStore<T extends Value = Value> extends ComboboxStoreFunctions<T>, Store<ComboboxStoreState<T>> {
 }
-export type ComboboxStoreProps = ComboboxStoreOptions & StoreProps<ComboboxStoreState>;
-export type ComboboxStore = ComboboxStoreFunctions & Store<ComboboxStoreState>;
 export {};

package/esm/combobox/combobox-store.js

@@ -68,18 +68,31 @@ function createComboboxStore(props = {}) {
       "bottom-start"
     )
   }));
-  const initialValue = defaultValue(
+  const value = defaultValue(
     props.value,
     syncState == null ? void 0 : syncState.value,
     props.defaultValue,
     ""
   );
+  const selectedValue = defaultValue(
+    props.selectedValue,
+    syncState == null ? void 0 : syncState.selectedValue,
+    props.defaultSelectedValue,
+    ""
+  );
+  const multiSelectable = Array.isArray(selectedValue);
   const initialState = __spreadProps(__spreadValues(__spreadValues({}, composite.getState()), popover.getState()), {
-    value: initialValue,
+    value,
+    selectedValue,
+    resetValueOnSelect: defaultValue(
+      props.resetValueOnSelect,
+      syncState == null ? void 0 : syncState.resetValueOnSelect,
+      multiSelectable
+    ),
     resetValueOnHide: defaultValue(
       props.resetValueOnHide,
       syncState == null ? void 0 : syncState.resetValueOnHide,
-      false
+      multiSelectable
     ),
     activeValue: syncState == null ? void 0 : syncState.activeValue
   });
@@ -91,7 +104,15 @@ function createComboboxStore(props = {}) {
         return;
       if (state.mounted)
         return;
-      combobox.setState("value", initialValue);
+      combobox.setState("value", value);
+    })
+  );
+  setup(
+    combobox,
+    () => sync(combobox, ["resetValueOnSelect", "selectedValue"], (state) => {
+      if (!state.resetValueOnSelect)
+        return;
+      combobox.setState("value", value);
     })
   );
   setup(
@@ -122,7 +143,8 @@ function createComboboxStore(props = {}) {
     })
   );
   return __spreadProps(__spreadValues(__spreadValues(__spreadValues({}, popover), composite), combobox), {
-    setValue: (value) => combobox.setState("value", value)
+    setValue: (value2) => combobox.setState("value", value2),
+    setSelectedValue: (selectedValue2) => combobox.setState("selectedValue", selectedValue2)
   });
 }
 export {

package/esm/composite/composite-store.d.ts

@@ -2,11 +2,11 @@ import type { CollectionStoreFunctions, CollectionStoreItem, CollectionStoreOpti
 import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
 import type { SetState } from "../utils/types.js";
 type Orientation = "horizontal" | "vertical" | "both";
-type Item = CollectionStoreItem & {
+interface Item extends CollectionStoreItem {
     rowId?: string;
     disabled?: boolean;
     children?: string;
-};
+}
 /**
  * Creates a composite store.
  */
@@ -25,10 +25,6 @@ export interface CompositeStoreState<T extends Item = Item> extends CollectionSt
      * tabindex](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#kbd_roving_tabindex).
      * DOM focus will remain on the composite element while its items receive
      * virtual focus.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * @default false
      */
     virtualFocus: boolean;
@@ -201,6 +197,8 @@ export interface CompositeStoreOptions<T extends Item = Item> extends StoreOptio
      */
     defaultActiveId?: CompositeStoreState<T>["activeId"];
 }
-export type CompositeStoreProps<T extends Item = Item> = CompositeStoreOptions<T> & StoreProps<CompositeStoreState<T>>;
-export type CompositeStore<T extends Item = Item> = CompositeStoreFunctions<T> & Store<CompositeStoreState<T>>;
+export interface CompositeStoreProps<T extends Item = Item> extends CompositeStoreOptions<T>, StoreProps<CompositeStoreState<T>> {
+}
+export interface CompositeStore<T extends Item = Item> extends CompositeStoreFunctions<T>, Store<CompositeStoreState<T>> {
+}
 export {};

package/esm/disclosure/disclosure-store.d.ts

@@ -36,6 +36,7 @@ export interface DisclosureStoreState {
      *   milliseconds to pass before becoming `false`.
      *
      * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Animated Combobox](https://ariakit.org/examples/combobox-animated)
      * - [Animated Dialog](https://ariakit.org/examples/dialog-animated)
      * - [Animated Select](https://ariakit.org/examples/select-animated)
@@ -73,6 +74,7 @@ export interface DisclosureStoreFunctions {
      * Sets the `open` state to `true`.
      *
      * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Textarea with inline
      *   Combobox](https://ariakit.org/examples/combobox-textarea)
      */

package/esm/hovercard/hovercard-store.d.ts

@@ -20,11 +20,17 @@ export interface HovercardStoreState extends PopoverStoreState {
     /**
      * The amount of time in milliseconds to wait before **showing** the popover.
      * It defaults to the value passed to `timeout`.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     showTimeout?: number;
     /**
      * The amount of time in milliseconds to wait before **hiding** the popover.
      * It defaults to the value passed to `timeout`.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     hideTimeout?: number;
     /**

package/esm/popover/popover-store.d.ts

@@ -28,6 +28,9 @@ export interface PopoverStoreState extends DialogStoreState {
     currentPlacement: Placement;
     /**
      * The placement of the popover.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * @default "bottom"
      */
     placement: Placement;

package/esm/select/select-store.d.ts

@@ -5,9 +5,9 @@ import type { Store, StoreOptions, StoreProps } from "../utils/store.js";
 import type { PickRequired, SetState } from "../utils/types.js";
 type Value = string | string[];
 type MutableValue<T extends Value = Value> = T extends string ? string : T;
-type Item = CompositeStoreItem & {
+interface Item extends CompositeStoreItem {
     value?: string;
-};
+}
 export declare function createSelectStore<T extends Value = Value>(props: PickRequired<SelectStoreProps<T>, "value" | "defaultValue">): SelectStore<T>;
 export declare function createSelectStore(props?: SelectStoreProps): SelectStore;
 export type SelectStoreItem = Item;
@@ -27,18 +27,32 @@ export interface SelectStoreState<T extends Value = Value> extends CompositeStor
      * The select value.
      *
      * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     * - [Form with Select](https://ariakit.org/examples/form-select)
+     * - [Select Grid](https://ariakit.org/examples/select-grid)
+     * - [Select with custom
+     *   items](https://ariakit.org/examples/select-item-custom)
+     * - [Multi-Select](https://ariakit.org/examples/select-multiple)
+     * - [Toolbar with Select](https://ariakit.org/examples/toolbar-select)
      */
     value: MutableValue<T>;
     /**
-     * Whether the select value should be set when the active item changes by
-     * moving (which usually happens when moving to an item using the keyboard).
+     * Whether the select
+     * [`value`](https://ariakit.org/reference/select-provider#value) should be
+     * set when the active item changes by moving (which usually happens when
+     * moving to an item using the keyboard).
+     *
+     * Live examples:
+     * - [Select Grid](https://ariakit.org/examples/select-grid)
+     * - [Select with custom
+     *   items](https://ariakit.org/examples/select-item-custom)
      * @default false
      */
     setValueOnMove: boolean;
     /**
      * The select button element.
+     *
+     * Live examples:
+     * - [Form with Select](https://ariakit.org/examples/form-select)
      */
     selectElement: HTMLElement | null;
     /**
@@ -49,10 +63,6 @@ export interface SelectStoreState<T extends Value = Value> extends CompositeStor
 export interface SelectStoreFunctions<T extends Value = Value> extends Pick<SelectStoreOptions<T>, "combobox">, CompositeStoreFunctions<Item>, PopoverStoreFunctions {
     /**
      * Sets the `value` state.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      * @example
      * store.setValue("Apple");
      * store.setValue(["Apple", "Banana"]);
@@ -73,21 +83,21 @@ export interface SelectStoreOptions<T extends Value = Value> extends StoreOption
      * A reference to a combobox store. This is used when combining the combobox
      * with a select (e.g., select with a search input). The stores will share the
      * same state.
-     *
-     * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
      */
     combobox?: ComboboxStore | null;
     /**
      * The default value. If not set, the first non-disabled item will be used.
      *
      * Live examples:
-     * - [Multi-selectable
-     *   Combobox](https://ariakit.org/examples/combobox-multiple)
+     * - [Form with Select](https://ariakit.org/examples/form-select)
+     * - [Animated Select](https://ariakit.org/examples/select-animated)
+     * - [Select with Combobox](https://ariakit.org/examples/select-combobox)
+     * - [SelectGroup](https://ariakit.org/examples/select-group)
      */
     defaultValue?: SelectStoreState<T>["value"];
 }
-export type SelectStoreProps<T extends Value = Value> = SelectStoreOptions<T> & StoreProps<SelectStoreState<T>>;
-export type SelectStore<T extends Value = Value> = SelectStoreFunctions<T> & Store<SelectStoreState<T>>;
+export interface SelectStoreProps<T extends Value = Value> extends SelectStoreOptions<T>, StoreProps<SelectStoreState<T>> {
+}
+export interface SelectStore<T extends Value = Value> extends SelectStoreFunctions<T>, Store<SelectStoreState<T>> {
+}
 export {};

package/esm/utils/store.d.ts

@@ -46,6 +46,9 @@ export type StoreOptions<S extends State, K extends keyof S> = Partial<Pick<S, K
 export type StoreProps<S extends State = State> = {
     /**
      * Another store object that will be kept in sync with the original store.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      */
     store?: Store<Partial<S>>;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ariakit/core",
-  "version": "0.3.6",
+  "version": "0.3.7",
   "description": "Ariakit core",
   "sideEffects": false,
   "license": "MIT",