@ariakit/react-core 0.4.3 → 0.4.5

package/esm/__chunks/QNNHZL3W.js

@@ -0,0 +1,25 @@
+"use client";
+import {
+  useCompositeStoreProps
+} from "./ZR5N62ZV.js";
+import {
+  useStore,
+  useStoreProps
+} from "./PWUXK5IM.js";
+
+// src/tag/tag-store.ts
+import * as Core from "@ariakit/core/tag/tag-store";
+function useTagStoreProps(store, update, props) {
+  useStoreProps(store, props, "value", "setValue");
+  useStoreProps(store, props, "values", "setValues");
+  return useCompositeStoreProps(store, update, props);
+}
+function useTagStore(props = {}) {
+  const [store, update] = useStore(Core.createTagStore, props);
+  return useTagStoreProps(store, update, props);
+}
+
+export {
+  useTagStoreProps,
+  useTagStore
+};

package/esm/__chunks/{C5HA76JU.js → QZJOXZKA.js}

@@ -4,7 +4,7 @@ import {
 } from "./MIIHBIKN.js";
 import {
   useCompositeItem
-} from "./ONUY4D7O.js";
+} from "./VGORKDMQ.js";
 import {
   createElement,
   createHook,

package/esm/__chunks/{XK6CE2M5.js → UKDZLPKH.js}

@@ -1,7 +1,7 @@
 "use client";
 import {
   useCompositeItem
-} from "./ONUY4D7O.js";
+} from "./VGORKDMQ.js";
 import {
   useToolbarContext
 } from "./766APSLG.js";

package/esm/__chunks/{ONUY4D7O.js → VGORKDMQ.js}

@@ -1,14 +1,15 @@
 "use client";
-import {
-  useCommand
-} from "./PJ7ERAIM.js";
 import {
   useCollectionItem
 } from "./IFMAUEA7.js";
+import {
+  useCommand
+} from "./PJ7ERAIM.js";
 import {
   focusSilently,
   getEnabledItem,
-  isItem
+  isItem,
+  selectTextField
 } from "./3IEDWLST.js";
 import {
   CompositeItemContext,
@@ -42,8 +43,11 @@ import {
 import { useCallback, useContext, useMemo, useRef, useState } from "react";
 import {
   getScrollingElement,
+  getTextboxSelection,
+  getTextboxValue,
   isButton,
-  isTextField
+  isTextField,
+  isTextbox
 } from "@ariakit/core/utils/dom";
 import { isPortalEvent, isSelfTarget } from "@ariakit/core/utils/events";
 import {
@@ -53,9 +57,7 @@ import {
 import { jsx } from "react/jsx-runtime";
 var TagName = "button";
 function isEditableElement(element) {
-  if (element.isContentEditable)
-    return true;
-  if (isTextField(element))
+  if (isTextbox(element))
     return true;
   return element.tagName === "INPUT" && !isButton(element);
 }
@@ -217,6 +219,9 @@ var useCompositeItem = createHook(
         return;
       const { virtualFocus: virtualFocus2, baseElement: baseElement2 } = store.getState();
       store.setActiveId(id);
+      if (isTextbox(event.currentTarget)) {
+        selectTextField(event.currentTarget);
+      }
       if (!virtualFocus2)
         return;
       if (!isSelfTarget(event))
@@ -303,6 +308,19 @@ var useCompositeItem = createHook(
       };
       const action = keyMap[event.key];
       if (action) {
+        if (isTextbox(currentTarget)) {
+          const selection = getTextboxSelection(currentTarget);
+          const isLeft = isHorizontal && event.key === "ArrowLeft";
+          const isRight = isHorizontal && event.key === "ArrowRight";
+          const isUp = isVertical && event.key === "ArrowUp";
+          const isDown = isVertical && event.key === "ArrowDown";
+          if (isRight || isDown) {
+            const { length: valueLength } = getTextboxValue(currentTarget);
+            if (selection.end !== valueLength)
+              return;
+          } else if ((isLeft || isUp) && selection.start !== 0)
+            return;
+        }
         const nextId = action();
         if (preventScrollOnKeyDownProp(event) || nextId !== void 0) {
           if (!moveOnKeyPressProp(event))

package/esm/__chunks/WYDDZRWN.js

@@ -0,0 +1,34 @@
+"use client";
+import {
+  CompositeContextProvider,
+  CompositeScopedContextProvider
+} from "./QFI3MCMR.js";
+import {
+  createStoreContext
+} from "./GUCZNEAD.js";
+
+// src/tag/tag-context.tsx
+import { createContext } from "react";
+var TagValueContext = createContext(null);
+var TagRemoveIdContext = createContext(
+  null
+);
+var ctx = createStoreContext(
+  [CompositeContextProvider],
+  [CompositeScopedContextProvider]
+);
+var useTagContext = ctx.useContext;
+var useTagScopedContext = ctx.useScopedContext;
+var useTagProviderContext = ctx.useProviderContext;
+var TagContextProvider = ctx.ContextProvider;
+var TagScopedContextProvider = ctx.ScopedContextProvider;
+
+export {
+  TagValueContext,
+  TagRemoveIdContext,
+  useTagContext,
+  useTagScopedContext,
+  useTagProviderContext,
+  TagContextProvider,
+  TagScopedContextProvider
+};

package/esm/checkbox/checkbox-check.js

@@ -2,7 +2,7 @@
 import {
   CheckboxCheck,
   useCheckboxCheck
-} from "../__chunks/RAKW656I.js";
+} from "../__chunks/Q4PZFBSW.js";
 import "../__chunks/6XBVQI3K.js";
 import "../__chunks/GUCZNEAD.js";
 import "../__chunks/WOWUAP42.js";

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

@@ -296,9 +296,7 @@ export declare function useCollectionRenderer<T extends Item = any>({ store, ite
     onPointerCancel?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
     onPointerCancelCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
     onPointerEnter?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerEnterCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
     onPointerLeave?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
-    onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
     onPointerOver?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
     onPointerOverCapture?: import("react").PointerEventHandler<HTMLDivElement> | undefined;
     onPointerOut?: import("react").PointerEventHandler<HTMLDivElement> | undefined;

package/esm/combobox/combobox-cancel.js

@@ -1,11 +1,11 @@
 "use client";
+import {
+  useComboboxProviderContext
+} from "../__chunks/N4X7J4OQ.js";
 import {
   useButton
 } from "../__chunks/CKAOM5LG.js";
 import "../__chunks/PJ7ERAIM.js";
-import {
-  useComboboxProviderContext
-} from "../__chunks/N4X7J4OQ.js";
 import "../__chunks/QFI3MCMR.js";
 import "../__chunks/6LTHW2TQ.js";
 import "../__chunks/5B3U64HV.js";
@@ -44,7 +44,7 @@ var children = /* @__PURE__ */ jsxs(
     stroke: "currentColor",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    strokeWidth: "1pt",
+    strokeWidth: 1.5,
     width: "1em",
     height: "1em",
     pointerEvents: "none",

package/esm/combobox/combobox-disclosure.js

@@ -1,13 +1,13 @@
 "use client";
+import {
+  useComboboxProviderContext
+} from "../__chunks/N4X7J4OQ.js";
 import {
   useDialogDisclosure
 } from "../__chunks/LTYBQEWX.js";
 import "../__chunks/R6SM2O47.js";
 import "../__chunks/CKAOM5LG.js";
 import "../__chunks/PJ7ERAIM.js";
-import {
-  useComboboxProviderContext
-} from "../__chunks/N4X7J4OQ.js";
 import "../__chunks/QFI3MCMR.js";
 import "../__chunks/6LTHW2TQ.js";
 import "../__chunks/5B3U64HV.js";
@@ -43,7 +43,7 @@ var children = /* @__PURE__ */ jsx(
     stroke: "currentColor",
     strokeLinecap: "round",
     strokeLinejoin: "round",
-    strokeWidth: "1.5pt",
+    strokeWidth: 1.5,
     viewBox: "0 0 16 16",
     height: "1em",
     width: "1em",

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

@@ -1,7 +1,7 @@
 "use client";
 import {
   useCheckboxCheck
-} from "../__chunks/RAKW656I.js";
+} from "../__chunks/Q4PZFBSW.js";
 import "../__chunks/6XBVQI3K.js";
 import {
   ComboboxItemCheckedContext

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

@@ -93,6 +93,20 @@ export interface ComboboxItemOptions<T extends ElementType = TagName> extends Co
      * - [Command Menu](https://ariakit.org/examples/dialog-combobox-command-menu)
      */
     hideOnClick?: 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)
+     * - [Submenu with
+     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
+     */
+    setValueOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
     /**
      * Whether to set the
      * [`selectedValue`](https://ariakit.org/reference/combobox-provider#selectedvalue)
@@ -108,19 +122,15 @@ export interface ComboboxItemOptions<T extends ElementType = TagName> extends Co
      */
     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)
-     * - [Submenu with
-     *   Combobox](https://ariakit.org/examples/menu-nested-combobox)
+     * Whether to reset the the combobox input value when this item is selected or
+     * unselected by click. This prop is 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.
      */
-    setValueOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
+    resetValueOnSelect?: BooleanOrCallback<MouseEvent<HTMLElement>>;
     /**
      * @default false
      */

package/esm/combobox/combobox-item.js

@@ -2,17 +2,17 @@
 import {
   useCompositeHover
 } from "../__chunks/VXKKJNIF.js";
-import {
-  useCompositeItem
-} from "../__chunks/ONUY4D7O.js";
-import "../__chunks/PJ7ERAIM.js";
 import {
   ComboboxItemCheckedContext,
   ComboboxItemValueContext,
   ComboboxListRoleContext,
   useComboboxScopedContext
 } from "../__chunks/N4X7J4OQ.js";
+import {
+  useCompositeItem
+} from "../__chunks/VGORKDMQ.js";
 import "../__chunks/IFMAUEA7.js";
+import "../__chunks/PJ7ERAIM.js";
 import "../__chunks/3IEDWLST.js";
 import "../__chunks/QFI3MCMR.js";
 import "../__chunks/6LTHW2TQ.js";
@@ -74,8 +74,9 @@ var useComboboxItem = createHook(
       store,
       value,
       hideOnClick,
-      selectValueOnClick = true,
       setValueOnClick,
+      selectValueOnClick = true,
+      resetValueOnSelect,
       focusOnHover = false,
       moveOnKeyPress = true,
       getItem: getItemProp
@@ -83,12 +84,14 @@ var useComboboxItem = createHook(
       "store",
       "value",
       "hideOnClick",
-      "selectValueOnClick",
       "setValueOnClick",
+      "selectValueOnClick",
+      "resetValueOnSelect",
       "focusOnHover",
       "moveOnKeyPress",
       "getItem"
     ]);
+    var _a2;
     const context = useComboboxScopedContext();
     store = store || context;
     invariant(
@@ -108,11 +111,18 @@ var useComboboxItem = createHook(
     const multiSelectable = store.useState(
       (state) => Array.isArray(state.selectedValue)
     );
+    const selected = store.useState(
+      (state) => isSelected(state.selectedValue, value)
+    );
+    const resetValueOnSelectState = store.useState("resetValueOnSelect");
     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 resetValueOnSelectProp = useBooleanEvent(
+      (_a2 = resetValueOnSelect != null ? resetValueOnSelect : resetValueOnSelectState) != null ? _a2 : multiSelectable
+    );
     const hideOnClickProp = useBooleanEvent(hideOnClick);
     const onClick = useEvent((event) => {
       onClickProp == null ? void 0 : onClickProp(event);
@@ -124,6 +134,9 @@ var useComboboxItem = createHook(
         return;
       if (value != null) {
         if (selectValueOnClickProp(event)) {
+          if (resetValueOnSelectProp(event)) {
+            store == null ? void 0 : store.resetValue();
+          }
           store == null ? void 0 : store.setSelectedValue((prevValue) => {
             if (!Array.isArray(prevValue))
               return value;
@@ -159,9 +172,6 @@ var useComboboxItem = createHook(
         }
       }
     });
-    const selected = store.useState(
-      (state) => isSelected(state.selectedValue, value)
-    );
     if (multiSelectable && selected != null) {
       props = __spreadValues({
         "aria-selected": selected

package/esm/combobox/combobox-popover.js

@@ -9,32 +9,32 @@ import "../__chunks/QFI3MCMR.js";
 import "../__chunks/6LTHW2TQ.js";
 import {
   usePopover
-} from "../__chunks/X3V2DT2U.js";
+} from "../__chunks/6YVAEELE.js";
 import {
   createDialogComponent
-} from "../__chunks/NQ4PTILT.js";
-import "../__chunks/GOXKZAQI.js";
-import "../__chunks/6GXEOXGT.js";
-import "../__chunks/PTPUIM7N.js";
-import "../__chunks/4ZRXV5C7.js";
-import "../__chunks/U2L67A6K.js";
-import "../__chunks/4KKLZMKS.js";
+} from "../__chunks/FGHVVLPU.js";
+import "../__chunks/CMFBAHKI.js";
 import "../__chunks/HSFE2URL.js";
 import "../__chunks/H2NVVTJB.js";
+import "../__chunks/6GXEOXGT.js";
 import "../__chunks/YNKDLCEK.js";
+import "../__chunks/3TEK3C5Q.js";
+import "../__chunks/4ZRXV5C7.js";
+import "../__chunks/677M2CI3.js";
 import "../__chunks/MKDDWKFK.js";
 import "../__chunks/5QL6BP6J.js";
 import "../__chunks/OOBDFMJL.js";
+import "../__chunks/BC72XE6E.js";
 import "../__chunks/53CQGCDZ.js";
-import "../__chunks/677M2CI3.js";
+import "../__chunks/4KKLZMKS.js";
 import "../__chunks/UHSH3H5I.js";
 import "../__chunks/UYRJLDVS.js";
+import "../__chunks/XPF5GU3Q.js";
 import "../__chunks/JPQNKTGF.js";
 import "../__chunks/LQTCWTYB.js";
 import "../__chunks/7452U3HH.js";
-import "../__chunks/XPF5GU3Q.js";
-import "../__chunks/4MFOHMLS.js";
 import "../__chunks/KCMTTTFR.js";
+import "../__chunks/4MFOHMLS.js";
 import "../__chunks/5B3U64HV.js";
 import "../__chunks/IWHI6Y45.js";
 import "../__chunks/RG6J4TID.js";
@@ -48,7 +48,9 @@ import {
 } from "../__chunks/GUCZNEAD.js";
 import "../__chunks/2KACNUKS.js";
 import "../__chunks/ZIX5D53S.js";
-import "../__chunks/PWUXK5IM.js";
+import {
+  useStoreState
+} from "../__chunks/PWUXK5IM.js";
 import "../__chunks/WOWUAP42.js";
 import "../__chunks/XM66DUTO.js";
 import {
@@ -58,8 +60,9 @@ import {
 } from "../__chunks/4R3V3JGP.js";
 
 // src/combobox/combobox-popover.tsx
+import { useRef } from "react";
 import { getDocument, matches } from "@ariakit/core/utils/dom";
-import { invariant } from "@ariakit/core/utils/misc";
+import { invariant, isFalsyBooleanCallback } from "@ariakit/core/utils/misc";
 var TagName = "div";
 function isController(target, ...ids) {
   if (!target)
@@ -79,12 +82,14 @@ var useComboboxPopover = createHook(
       modal,
       tabIndex,
       alwaysVisible,
+      autoFocusOnHide = true,
       hideOnInteractOutside = true
     } = _b, props = __objRest(_b, [
       "store",
       "modal",
       "tabIndex",
       "alwaysVisible",
+      "autoFocusOnHide",
       "hideOnInteractOutside"
     ]);
     const context = useComboboxProviderContext();
@@ -94,6 +99,11 @@ var useComboboxPopover = createHook(
       process.env.NODE_ENV !== "production" && "ComboboxPopover must receive a `store` prop or be wrapped in a ComboboxProvider component."
     );
     const baseElement = store.useState("baseElement");
+    const hiddenByClickOutsideRef = useRef(false);
+    const treeSnapshotKey = useStoreState(
+      store.tag,
+      (state) => state == null ? void 0 : state.renderedItems.length
+    );
     props = useComboboxList(__spreadValues({ store, alwaysVisible }, props));
     props = usePopover(__spreadProps(__spreadValues({
       store,
@@ -101,9 +111,9 @@ var useComboboxPopover = createHook(
       alwaysVisible,
       backdrop: false,
       autoFocusOnShow: false,
-      autoFocusOnHide: false,
       finalFocus: baseElement,
-      preserveTabOrderAnchor: null
+      preserveTabOrderAnchor: null,
+      unstable_treeSnapshotKey: treeSnapshotKey
     }, props), {
       // When the combobox popover is modal, we make sure to include the
       // combobox input and all the combobox controls (cancel, disclosure) in
@@ -133,6 +143,18 @@ var useComboboxPopover = createHook(
         const controlElements = doc.querySelectorAll(selector);
         return [...elements, ...controlElements];
       },
+      // The combobox popover should focus on the combobox input when it hides,
+      // unless the event was triggered by a click outside the popover, in which
+      // case the input shouldn't be re-focused.
+      autoFocusOnHide(element) {
+        if (isFalsyBooleanCallback(autoFocusOnHide, element))
+          return false;
+        if (hiddenByClickOutsideRef.current) {
+          hiddenByClickOutsideRef.current = false;
+          return false;
+        }
+        return true;
+      },
       // Make sure we don't hide the popover when the user interacts with the
       // combobox cancel or the combobox disclosure buttons. They will have the
       // aria-controls attribute pointing to either the combobox input or the
@@ -145,6 +167,9 @@ var useComboboxPopover = createHook(
         if (isController(event.target, contentId, baseId))
           return false;
         const result = typeof hideOnInteractOutside === "function" ? hideOnInteractOutside(event) : hideOnInteractOutside;
+        if (result) {
+          hiddenByClickOutsideRef.current = event.type === "click";
+        }
         return result;
       }
     }));

package/esm/combobox/combobox-provider.js

@@ -1,10 +1,11 @@
 "use client";
 import {
   useComboboxStore
-} from "../__chunks/ZFEEEZVE.js";
+} from "../__chunks/DLLQM6DZ.js";
 import {
   ComboboxContextProvider
 } from "../__chunks/N4X7J4OQ.js";
+import "../__chunks/WYDDZRWN.js";
 import "../__chunks/ZR5N62ZV.js";
 import "../__chunks/LGWSZOP2.js";
 import "../__chunks/QFI3MCMR.js";

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

@@ -2,9 +2,12 @@ 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 { TagStore } from "../tag/tag-store.js";
 import type { Store } from "../utils/store.js";
 export declare function useComboboxStoreProps<T extends Core.ComboboxStore>(store: T, update: () => void, props: ComboboxStoreProps): T & {
     disclosure: import("../disclosure/disclosure-store.js").DisclosureStore | null | undefined;
+} & {
+    tag: TagStore | null | undefined;
 };
 /**
  * Creates a combobox store to control the state of
@@ -31,9 +34,9 @@ export interface ComboboxStoreItem extends Core.ComboboxStoreItem {
 }
 export interface ComboboxStoreState<T extends ComboboxStoreSelectedValue = ComboboxStoreSelectedValue> extends Core.ComboboxStoreState<T>, CompositeStoreState<ComboboxStoreItem>, PopoverStoreState {
 }
-export interface ComboboxStoreFunctions<T extends ComboboxStoreSelectedValue = ComboboxStoreSelectedValue> extends Omit<Core.ComboboxStoreFunctions<T>, "disclosure">, CompositeStoreFunctions<ComboboxStoreItem>, PopoverStoreFunctions {
+export interface ComboboxStoreFunctions<T extends ComboboxStoreSelectedValue = ComboboxStoreSelectedValue> extends Pick<ComboboxStoreOptions<T>, "tag">, Omit<Core.ComboboxStoreFunctions<T>, "tag" | "disclosure">, CompositeStoreFunctions<ComboboxStoreItem>, PopoverStoreFunctions {
 }
-export interface ComboboxStoreOptions<T extends ComboboxStoreSelectedValue = ComboboxStoreSelectedValue> extends Omit<Core.ComboboxStoreOptions<T>, "disclosure">, CompositeStoreOptions<ComboboxStoreItem>, PopoverStoreOptions {
+export interface ComboboxStoreOptions<T extends ComboboxStoreSelectedValue = ComboboxStoreSelectedValue> extends Omit<Core.ComboboxStoreOptions<T>, "tag" | "disclosure">, CompositeStoreOptions<ComboboxStoreItem>, PopoverStoreOptions {
     /**
      * A callback that gets called when the
      * [`value`](https://ariakit.org/reference/combobox-provider#value) state
@@ -61,8 +64,13 @@ export interface ComboboxStoreOptions<T extends ComboboxStoreSelectedValue = Com
      *   Combobox](https://ariakit.org/examples/combobox-multiple)
      */
     setSelectedValue?: (value: ComboboxStoreState<T>["selectedValue"]) => void;
+    /**
+     * A reference to a [tag store](https://ariakit.org/apis/use-tag-store). It's
+     * automatically set when rendering a combobox within a tag list.
+     */
+    tag?: TagStore | null;
 }
-export interface ComboboxStoreProps<T extends ComboboxStoreSelectedValue = ComboboxStoreSelectedValue> extends ComboboxStoreOptions<T>, Omit<Core.ComboboxStoreProps<T>, "disclosure"> {
+export interface ComboboxStoreProps<T extends ComboboxStoreSelectedValue = ComboboxStoreSelectedValue> extends ComboboxStoreOptions<T>, Omit<Core.ComboboxStoreProps<T>, "tag" | "disclosure"> {
 }
-export interface ComboboxStore<T extends ComboboxStoreSelectedValue = ComboboxStoreSelectedValue> extends ComboboxStoreFunctions<T>, Omit<Store<Core.ComboboxStore<T>>, "disclosure"> {
+export interface ComboboxStore<T extends ComboboxStoreSelectedValue = ComboboxStoreSelectedValue> extends ComboboxStoreFunctions<T>, Omit<Store<Core.ComboboxStore<T>>, "tag" | "disclosure"> {
 }

package/esm/combobox/combobox-store.js

@@ -2,9 +2,13 @@
 import {
   useComboboxStore,
   useComboboxStoreProps
-} from "../__chunks/ZFEEEZVE.js";
+} from "../__chunks/DLLQM6DZ.js";
+import "../__chunks/WYDDZRWN.js";
 import "../__chunks/ZR5N62ZV.js";
 import "../__chunks/LGWSZOP2.js";
+import "../__chunks/QFI3MCMR.js";
+import "../__chunks/6LTHW2TQ.js";
+import "../__chunks/GUCZNEAD.js";
 import "../__chunks/JNGHG5BN.js";
 import "../__chunks/2KACNUKS.js";
 import "../__chunks/ZIX5D53S.js";

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

@@ -0,0 +1,41 @@
+import type { ReactNode } from "react";
+import type { ComboboxStore, ComboboxStoreState } from "./combobox-store.js";
+/**
+ * Renders the current
+ * [`value`](https://ariakit.org/reference/use-combobox-store#value) state in
+ * the [combobox store](https://ariakit.org/reference/use-combobox-store).
+ *
+ * As a value component, it doesn't render any DOM elements and therefore
+ * doesn't accept HTML props.
+ *
+ * It takes a
+ * [`children`](https://ariakit.org/reference/combobox-value#children) function
+ * that gets called with the current value as an argument. This can be used as
+ * an uncontrolled API to render the combobox value in a custom way.
+ * @see https://ariakit.org/components/combobox
+ * @example
+ * ```jsx {3-5}
+ * <ComboboxProvider>
+ *   <Combobox />
+ *   <ComboboxValue>
+ *     {(value) => `Current value: ${value}`}
+ *   </ComboboxValue>
+ * </ComboboxProvider>
+ * ```
+ */
+export declare function ComboboxValue({ store, children }?: ComboboxValueProps): ReactNode;
+export interface ComboboxValueProps {
+    /**
+     * 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;
+    /**
+     * A function that gets called with the current value as an argument. It can
+     * be used to render the combobox value in a custom way.
+     */
+    children?: (value: ComboboxStoreState["value"]) => ReactNode;
+}

package/esm/combobox/combobox-value.js

@@ -0,0 +1,32 @@
+"use client";
+import {
+  useComboboxContext
+} from "../__chunks/N4X7J4OQ.js";
+import "../__chunks/QFI3MCMR.js";
+import "../__chunks/6LTHW2TQ.js";
+import "../__chunks/5B3U64HV.js";
+import "../__chunks/IWHI6Y45.js";
+import "../__chunks/RG6J4TID.js";
+import "../__chunks/GUCZNEAD.js";
+import "../__chunks/WOWUAP42.js";
+import "../__chunks/XM66DUTO.js";
+import "../__chunks/4R3V3JGP.js";
+
+// src/combobox/combobox-value.tsx
+import { invariant } from "@ariakit/core/utils/misc";
+function ComboboxValue({ store, children } = {}) {
+  const context = useComboboxContext();
+  store = store || context;
+  invariant(
+    store,
+    process.env.NODE_ENV !== "production" && "ComboboxValue must receive a `store` prop or be wrapped in a ComboboxProvider component."
+  );
+  const value = store.useState("value");
+  if (children) {
+    return children(value);
+  }
+  return value;
+}
+export {
+  ComboboxValue
+};