@ariakit/react-core 0.3.7 → 0.3.8

package/esm/combobox/combobox-item-check.js

@@ -0,0 +1,50 @@
+"use client";
+import {
+  useCheckboxCheck
+} from "../__chunks/MW2F7SEA.js";
+import "../__chunks/6XBVQI3K.js";
+import {
+  ComboboxItemCheckedContext
+} from "../__chunks/W76OTZCC.js";
+import "../__chunks/IB7YUKH5.js";
+import "../__chunks/4UUKJZ4V.js";
+import "../__chunks/7H5KSHHF.js";
+import "../__chunks/G6BJYYBK.js";
+import "../__chunks/OAYFXAQ2.js";
+import {
+  createComponent,
+  createElement,
+  createHook
+} from "../__chunks/3ORBWXWF.js";
+import "../__chunks/6O5OEQGF.js";
+import "../__chunks/XM66DUTO.js";
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "../__chunks/4R3V3JGP.js";
+
+// src/combobox/combobox-item-check.ts
+import { useContext } from "react";
+var useComboboxItemCheck = createHook(
+  (_a) => {
+    var _b = _a, { store, checked } = _b, props = __objRest(_b, ["store", "checked"]);
+    const context = useContext(ComboboxItemCheckedContext);
+    checked = checked != null ? checked : context;
+    props = useCheckboxCheck(__spreadProps(__spreadValues({}, props), { checked }));
+    return props;
+  }
+);
+var ComboboxItemCheck = createComponent(
+  (props) => {
+    const htmlProps = useComboboxItemCheck(props);
+    return createElement("span", htmlProps);
+  }
+);
+if (process.env.NODE_ENV !== "production") {
+  ComboboxItemCheck.displayName = "ComboboxItemCheck";
+}
+export {
+  ComboboxItemCheck,
+  useComboboxItemCheck
+};

package/esm/combobox/combobox-item-value.js

@@ -2,7 +2,7 @@
 import {
   ComboboxItemValueContext,
   useComboboxScopedContext
-} from "../__chunks/MTC2KUZZ.js";
+} from "../__chunks/W76OTZCC.js";
 import "../__chunks/IB7YUKH5.js";
 import "../__chunks/4UUKJZ4V.js";
 import "../__chunks/7H5KSHHF.js";

package/esm/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/esm/combobox/combobox-item.js

@@ -3,9 +3,10 @@ import {
   useCompositeHover
 } from "../__chunks/G6ONQ5EH.js";
 import {
+  ComboboxItemCheckedContext,
   ComboboxItemValueContext,
   useComboboxScopedContext
-} from "../__chunks/MTC2KUZZ.js";
+} from "../__chunks/W76OTZCC.js";
 import {
   useCompositeItem
 } from "../__chunks/5PEPOQU7.js";
@@ -44,13 +45,24 @@ import { isDownloading, isOpeningInNewTab } from "@ariakit/core/utils/events";
 import { hasFocus } from "@ariakit/core/utils/focus";
 import { invariant } from "@ariakit/core/utils/misc";
 import { jsx } from "react/jsx-runtime";
+function isSelected(storeValue, itemValue) {
+  if (itemValue == null)
+    return;
+  if (storeValue == null)
+    return false;
+  if (Array.isArray(storeValue)) {
+    return storeValue.includes(itemValue);
+  }
+  return storeValue === itemValue;
+}
 var useComboboxItem = createHook(
   (_a) => {
     var _b = _a, {
       store,
       value,
-      hideOnClick = value != null,
-      setValueOnClick = true,
+      hideOnClick,
+      selectValueOnClick = true,
+      setValueOnClick,
       focusOnHover = false,
       moveOnKeyPress = true,
       getItem: getItemProp
@@ -58,6 +70,7 @@ var useComboboxItem = createHook(
       "store",
       "value",
       "hideOnClick",
+      "selectValueOnClick",
       "setValueOnClick",
       "focusOnHover",
       "moveOnKeyPress",
@@ -79,8 +92,14 @@ var useComboboxItem = createHook(
       },
       [value, getItemProp]
     );
+    const multiSelectable = store.useState(
+      (state) => Array.isArray(state.selectedValue)
+    );
+    setValueOnClick = setValueOnClick != null ? setValueOnClick : !multiSelectable;
+    hideOnClick = hideOnClick != null ? hideOnClick : value != null && !multiSelectable;
     const onClickProp = props.onClick;
     const setValueOnClickProp = useBooleanEvent(setValueOnClick);
+    const selectValueOnClickProp = useBooleanEvent(selectValueOnClick);
     const hideOnClickProp = useBooleanEvent(hideOnClick);
     const onClick = useEvent((event) => {
       onClickProp == null ? void 0 : onClickProp(event);
@@ -90,8 +109,20 @@ var useComboboxItem = createHook(
         return;
       if (isOpeningInNewTab(event))
         return;
-      if (value != null && setValueOnClickProp(event)) {
-        store == null ? void 0 : store.setValue(value);
+      if (value != null) {
+        if (selectValueOnClickProp(event)) {
+          store == null ? void 0 : store.setSelectedValue((prevValue) => {
+            if (!Array.isArray(prevValue))
+              return value;
+            if (prevValue.includes(value)) {
+              return prevValue.filter((v) => v !== value);
+            }
+            return [...prevValue, value];
+          });
+        }
+        if (setValueOnClickProp(event)) {
+          store == null ? void 0 : store.setValue(value);
+        }
       }
       if (hideOnClickProp(event)) {
         store == null ? void 0 : store.move(null);
@@ -116,10 +147,16 @@ var useComboboxItem = createHook(
         }
       }
     });
+    const selected = store.useState(
+      (state) => isSelected(state.selectedValue, value)
+    );
+    if (multiSelectable && selected != null) {
+      props["aria-selected"] = selected;
+    }
     props = useWrapElement(
       props,
-      (element) => /* @__PURE__ */ jsx(ComboboxItemValueContext.Provider, { value, children: element }),
-      [value]
+      (element) => /* @__PURE__ */ jsx(ComboboxItemValueContext.Provider, { value, children: /* @__PURE__ */ jsx(ComboboxItemCheckedContext.Provider, { value: selected != null ? selected : false, children: element }) }),
+      [value, selected]
     );
     const contentElement = store.useState("contentElement");
     props = __spreadProps(__spreadValues({

package/esm/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/esm/combobox/combobox-label.js

@@ -0,0 +1,55 @@
+"use client";
+import {
+  useComboboxProviderContext
+} from "../__chunks/W76OTZCC.js";
+import "../__chunks/IB7YUKH5.js";
+import "../__chunks/4UUKJZ4V.js";
+import "../__chunks/7H5KSHHF.js";
+import "../__chunks/G6BJYYBK.js";
+import "../__chunks/OAYFXAQ2.js";
+import {
+  createElement,
+  createHook,
+  createMemoComponent
+} from "../__chunks/3ORBWXWF.js";
+import "../__chunks/6O5OEQGF.js";
+import "../__chunks/XM66DUTO.js";
+import {
+  __objRest,
+  __spreadValues
+} from "../__chunks/4R3V3JGP.js";
+
+// src/combobox/combobox-label.ts
+import { invariant } from "@ariakit/core/utils/misc";
+var useComboboxLabel = createHook(
+  (_a) => {
+    var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
+    const context = useComboboxProviderContext();
+    store = store || context;
+    invariant(
+      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 = __spreadValues({
+      htmlFor: comboboxId
+    }, props);
+    return props;
+  }
+);
+var ComboboxLabel = createMemoComponent(
+  (props) => {
+    const htmlProps = useComboboxLabel(props);
+    return createElement("label", htmlProps);
+  }
+);
+if (process.env.NODE_ENV !== "production") {
+  ComboboxLabel.displayName = "ComboboxLabel";
+}
+export {
+  ComboboxLabel,
+  useComboboxLabel
+};

package/esm/combobox/combobox-list.js

@@ -2,8 +2,8 @@
 import {
   ComboboxList,
   useComboboxList
-} from "../__chunks/KFUKDUTY.js";
-import "../__chunks/MTC2KUZZ.js";
+} from "../__chunks/4AMOOZBQ.js";
+import "../__chunks/W76OTZCC.js";
 import "../__chunks/IB7YUKH5.js";
 import "../__chunks/4UUKJZ4V.js";
 import "../__chunks/A7CE3X6M.js";

package/esm/combobox/combobox-popover.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   useComboboxList
-} from "../__chunks/KFUKDUTY.js";
+} from "../__chunks/4AMOOZBQ.js";
 import {
   useComboboxProviderContext
-} from "../__chunks/MTC2KUZZ.js";
+} from "../__chunks/W76OTZCC.js";
 import "../__chunks/IB7YUKH5.js";
 import "../__chunks/4UUKJZ4V.js";
 import {

package/esm/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/esm/combobox/combobox-provider.js

@@ -1,10 +1,10 @@
 "use client";
 import {
   useComboboxStore
-} from "../__chunks/24AKC2LC.js";
+} from "../__chunks/ZETMAOTK.js";
 import {
   ComboboxContextProvider
-} from "../__chunks/MTC2KUZZ.js";
+} from "../__chunks/W76OTZCC.js";
 import "../__chunks/ELWRSPQ7.js";
 import "../__chunks/5A2VZUUV.js";
 import "../__chunks/IB7YUKH5.js";

package/esm/combobox/combobox-row.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   useComboboxScopedContext
-} from "../__chunks/MTC2KUZZ.js";
+} from "../__chunks/W76OTZCC.js";
 import {
   useCompositeRow
 } from "../__chunks/BNUFNEVY.js";

package/esm/combobox/combobox-separator.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   useComboboxScopedContext
-} from "../__chunks/MTC2KUZZ.js";
+} from "../__chunks/W76OTZCC.js";
 import {
   useCompositeSeparator
 } from "../__chunks/ENRQQ6LK.js";

package/esm/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/esm/combobox/combobox-store.js

@@ -2,7 +2,7 @@
 import {
   useComboboxStore,
   useComboboxStoreProps
-} from "../__chunks/24AKC2LC.js";
+} from "../__chunks/ZETMAOTK.js";
 import "../__chunks/ELWRSPQ7.js";
 import "../__chunks/5A2VZUUV.js";
 import "../__chunks/UNZQE6T7.js";

package/esm/combobox/combobox.js

@@ -4,7 +4,7 @@ import {
 } from "../__chunks/JCH6MLL2.js";
 import {
   useComboboxProviderContext
-} from "../__chunks/MTC2KUZZ.js";
+} from "../__chunks/W76OTZCC.js";
 import {
   useComposite
 } from "../__chunks/FHDXHZLB.js";
@@ -231,15 +231,16 @@ var useCombobox = createHook(
         return;
       canAutoSelectRef.current = false;
     }, [open]);
+    const resetValueOnSelect = store.useState("resetValueOnSelect");
     useUpdateEffect(() => {
-      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 && !hasFocus(baseElement))
         return;
       if (contentElement2 == null ? void 0 : contentElement2.hasAttribute("data-placing")) {
@@ -247,14 +248,23 @@ var useCombobox = createHook(
         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]);
-    useSafeLayoutEffect(() => {
-      if (autoSelect)
-        return;
-      store == null ? void 0 : store.setActiveId(null);
-    }, [valueUpdated, autoSelect, store]);
+    }, [
+      store,
+      valueUpdated,
+      storeValue,
+      autoSelect,
+      resetValueOnSelect,
+      items
+    ]);
     useEffect(() => {
       if (!inline)
         return;

package/esm/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/esm/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/esm/disclosure/disclosure-content.d.ts

@@ -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

package/esm/disclosure/disclosure.d.ts

@@ -42,6 +42,9 @@ export interface DisclosureOptions<T extends As = "button"> extends ButtonOption
      * [`toggle`](https://ariakit.org/reference/use-disclosure-store#toggle) will
      * be called on click. This is useful if you want to handle the toggle logic
      * yourself.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * @default true
      */
     toggleOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;

package/esm/focusable/focusable.d.ts

@@ -106,6 +106,7 @@ export interface FocusableOptions<T extends As = "div"> extends Options<T> {
      * programmatic equivalent of the `data-focus-visible` attribute.
      *
      * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Custom Checkbox](https://ariakit.org/examples/checkbox-custom)
      */
     onFocusVisible?: BivariantCallback<(event: SyntheticEvent<HTMLElement>) => void>;

package/esm/form/form-checkbox.js

@@ -8,10 +8,10 @@ import {
 import {
   useCheckbox
 } from "../__chunks/D42GAV4S.js";
+import "../__chunks/VPR2WHQV.js";
 import {
   useCheckboxStore
 } from "../__chunks/BI7ZXWGY.js";
-import "../__chunks/VPR2WHQV.js";
 import "../__chunks/6XBVQI3K.js";
 import "../__chunks/NWCBQ4CV.js";
 import "../__chunks/UH3I23HL.js";

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

@@ -39,6 +39,9 @@ export interface HovercardAnchorOptions<T extends As = "a"> extends FocusableOpt
     store?: HovercardStore;
     /**
      * Whether to show the hovercard on mouse move.
+     *
+     * Live examples:
+     * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * @default true
      */
     showOnHover?: BooleanOrCallback<ReactMouseEvent<HTMLElement>>;

package/esm/menu/menu-item-checkbox.js

@@ -2,10 +2,10 @@
 import {
   useCheckbox
 } from "../__chunks/D42GAV4S.js";
+import "../__chunks/VPR2WHQV.js";
 import {
   useCheckboxStore
 } from "../__chunks/BI7ZXWGY.js";
-import "../__chunks/VPR2WHQV.js";
 import {
   useMenuItem
 } from "../__chunks/JRUYDVPB.js";

package/esm/menu/menu-provider.js

@@ -1,12 +1,12 @@
 "use client";
 import {
   useMenuStore
-} from "../__chunks/PHTJ3BCW.js";
+} from "../__chunks/7HYEBVZE.js";
 import {
   MenuContextProvider
 } from "../__chunks/YGMEBI3A.js";
 import "../__chunks/KA4GX64Z.js";
-import "../__chunks/MTC2KUZZ.js";
+import "../__chunks/W76OTZCC.js";
 import "../__chunks/ELWRSPQ7.js";
 import "../__chunks/5A2VZUUV.js";
 import "../__chunks/IB7YUKH5.js";