@ariakit/react-core 0.3.14 → 0.4.1

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

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { CompositeGroupLabelOptions } from "../composite/composite-group-label.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { ComboboxStore } from "./combobox-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `ComboboxGroupLabel` component. This hook should be
  * used in a component that's wrapped with `ComboboxGroup` so the
@@ -13,7 +16,7 @@ import type { ComboboxStore } from "./combobox-store.js";
  * <Role {...props}>Label</Role>
  * ```
  */
-export declare const useComboboxGroupLabel: import("../utils/types.js").Hook<ComboboxGroupLabelOptions<"div">>;
+export declare const useComboboxGroupLabel: import("../utils/types.js").Hook<"div", ComboboxGroupLabelOptions<"div">>;
 /**
  * Renders a label in a combobox group. This component should be wrapped with
  * [`ComboboxGroup`](https://ariakit.org/reference/combobox-group) so the
@@ -33,8 +36,8 @@ export declare const useComboboxGroupLabel: import("../utils/types.js").Hook<Com
  * </ComboboxProvider>
  * ```
  */
-export declare const ComboboxGroupLabel: import("../utils/types.js").Component<ComboboxGroupLabelOptions<"div">>;
-export interface ComboboxGroupLabelOptions<T extends As = "div"> extends CompositeGroupLabelOptions<T> {
+export declare const ComboboxGroupLabel: (props: ComboboxGroupLabelProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ComboboxGroupLabelOptions<T extends ElementType = TagName> extends CompositeGroupLabelOptions<T> {
     /**
      * Object returned by the
      * [`useComboboxStore`](https://ariakit.org/reference/use-combobox-store)
@@ -45,4 +48,5 @@ export interface ComboboxGroupLabelOptions<T extends As = "div"> extends Composi
      */
     store?: ComboboxStore;
 }
-export type ComboboxGroupLabelProps<T extends As = "div"> = Props<ComboboxGroupLabelOptions<T>>;
+export type ComboboxGroupLabelProps<T extends ElementType = TagName> = Props<T, ComboboxGroupLabelOptions<T>>;
+export {};

package/cjs/combobox/combobox-group.cjs

@@ -1,22 +1,22 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _2KDFQUU7cjs = require('../__chunks/2KDFQUU7.cjs');
-require('../__chunks/KSAZE5E2.cjs');
+var _BTE5YB27cjs = require('../__chunks/BTE5YB27.cjs');
+require('../__chunks/47V4ED4R.cjs');
 require('../__chunks/FE3YCURH.cjs');
 
 
-var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
-require('../__chunks/UZNYSPKP.cjs');
-require('../__chunks/BZTDJIVT.cjs');
-require('../__chunks/UVBBMANL.cjs');
-require('../__chunks/F2A2ZQDB.cjs');
-require('../__chunks/S6UU7NA4.cjs');
+var _OBT2YMBCcjs = require('../__chunks/OBT2YMBC.cjs');
+require('../__chunks/4XFLDG56.cjs');
+require('../__chunks/Q6CVYJBO.cjs');
+require('../__chunks/FNVFJ5AF.cjs');
+require('../__chunks/OLPMMKKO.cjs');
+require('../__chunks/XRJBC7H7.cjs');
 
 
 
 
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
 
@@ -27,10 +27,11 @@ var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
 // src/combobox/combobox-group.ts
 var _dom = require('@ariakit/core/utils/dom');
 var _misc = require('@ariakit/core/utils/misc');
-var useComboboxGroup = _RNZNGEL4cjs.createHook.call(void 0, 
-  (_a) => {
+var TagName = "div";
+var useComboboxGroup = _Q67LZMDTcjs.createHook.call(void 0, 
+  function useComboboxGroup2(_a) {
     var _b = _a, { store } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store"]);
-    const context = _3WCBE6SUcjs.useComboboxScopedContext.call(void 0, );
+    const context = _OBT2YMBCcjs.useComboboxScopedContext.call(void 0, );
     store = store || context;
     _misc.invariant.call(void 0, 
       store,
@@ -41,17 +42,14 @@ var useComboboxGroup = _RNZNGEL4cjs.createHook.call(void 0,
     if (popupRole === "grid") {
       props = _AV6KTKLEcjs.__spreadValues.call(void 0, { role: "rowgroup" }, props);
     }
-    props = _2KDFQUU7cjs.useCompositeGroup.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
+    props = _BTE5YB27cjs.useCompositeGroup.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
     return props;
   }
 );
-var ComboboxGroup = _RNZNGEL4cjs.createComponent.call(void 0, (props) => {
+var ComboboxGroup = _Q67LZMDTcjs.forwardRef.call(void 0, function ComboboxGroup2(props) {
   const htmlProps = useComboboxGroup(props);
-  return _RNZNGEL4cjs.createElement.call(void 0, "div", htmlProps);
+  return _Q67LZMDTcjs.createElement.call(void 0, TagName, htmlProps);
 });
-if (process.env.NODE_ENV !== "production") {
-  ComboboxGroup.displayName = "ComboboxGroup";
-}
 
 
 

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

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { CompositeGroupOptions } from "../composite/composite-group.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { ComboboxStore } from "./combobox-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `ComboboxGroup` component.
  * @see https://ariakit.org/components/combobox
@@ -18,7 +21,7 @@ import type { ComboboxStore } from "./combobox-store.js";
  * </ComboboxPopover>
  * ```
  */
-export declare const useComboboxGroup: import("../utils/types.js").Hook<ComboboxGroupOptions<"div">>;
+export declare const useComboboxGroup: import("../utils/types.js").Hook<"div", ComboboxGroupOptions<"div">>;
 /**
  * Renders a group for
  * [`ComboboxItem`](https://ariakit.org/reference/combobox-item) elements.
@@ -40,8 +43,8 @@ export declare const useComboboxGroup: import("../utils/types.js").Hook<Combobox
  * </ComboboxProvider>
  * ```
  */
-export declare const ComboboxGroup: import("../utils/types.js").Component<ComboboxGroupOptions<"div">>;
-export interface ComboboxGroupOptions<T extends As = "div"> extends CompositeGroupOptions<T> {
+export declare const ComboboxGroup: (props: ComboboxGroupProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ComboboxGroupOptions<T extends ElementType = TagName> extends CompositeGroupOptions<T> {
     /**
      * Object returned by the
      * [`useComboboxStore`](https://ariakit.org/reference/use-combobox-store)
@@ -52,4 +55,5 @@ export interface ComboboxGroupOptions<T extends As = "div"> extends CompositeGro
      */
     store?: ComboboxStore;
 }
-export type ComboboxGroupProps<T extends As = "div"> = Props<ComboboxGroupOptions<T>>;
+export type ComboboxGroupProps<T extends ElementType = TagName> = Props<T, ComboboxGroupOptions<T>>;
+export {};

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

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { CompositeGroupOptions } from "../composite/composite-group.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { ComboboxStore } from "./combobox-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `ComboboxGroup` component.
  * @see https://ariakit.org/components/combobox
@@ -18,7 +21,7 @@ import type { ComboboxStore } from "./combobox-store.js";
  * </ComboboxPopover>
  * ```
  */
-export declare const useComboboxGroup: import("../utils/types.js").Hook<ComboboxGroupOptions<"div">>;
+export declare const useComboboxGroup: import("../utils/types.js").Hook<"div", ComboboxGroupOptions<"div">>;
 /**
  * Renders a group for
  * [`ComboboxItem`](https://ariakit.org/reference/combobox-item) elements.
@@ -40,8 +43,8 @@ export declare const useComboboxGroup: import("../utils/types.js").Hook<Combobox
  * </ComboboxProvider>
  * ```
  */
-export declare const ComboboxGroup: import("../utils/types.js").Component<ComboboxGroupOptions<"div">>;
-export interface ComboboxGroupOptions<T extends As = "div"> extends CompositeGroupOptions<T> {
+export declare const ComboboxGroup: (props: ComboboxGroupProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ComboboxGroupOptions<T extends ElementType = TagName> extends CompositeGroupOptions<T> {
     /**
      * Object returned by the
      * [`useComboboxStore`](https://ariakit.org/reference/use-combobox-store)
@@ -52,4 +55,5 @@ export interface ComboboxGroupOptions<T extends As = "div"> extends CompositeGro
      */
     store?: ComboboxStore;
 }
-export type ComboboxGroupProps<T extends As = "div"> = Props<ComboboxGroupOptions<T>>;
+export type ComboboxGroupProps<T extends ElementType = TagName> = Props<T, ComboboxGroupOptions<T>>;
+export {};

package/cjs/combobox/combobox-item-check.cjs

@@ -1,21 +1,21 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _T4KYZJUYcjs = require('../__chunks/T4KYZJUY.cjs');
+var _4ITCBJNTcjs = require('../__chunks/4ITCBJNT.cjs');
 require('../__chunks/ERFHNHON.cjs');
 
 
-var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
-require('../__chunks/UZNYSPKP.cjs');
-require('../__chunks/BZTDJIVT.cjs');
-require('../__chunks/UVBBMANL.cjs');
-require('../__chunks/F2A2ZQDB.cjs');
-require('../__chunks/S6UU7NA4.cjs');
+var _OBT2YMBCcjs = require('../__chunks/OBT2YMBC.cjs');
+require('../__chunks/4XFLDG56.cjs');
+require('../__chunks/Q6CVYJBO.cjs');
+require('../__chunks/FNVFJ5AF.cjs');
+require('../__chunks/OLPMMKKO.cjs');
+require('../__chunks/XRJBC7H7.cjs');
 
 
 
 
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
 
@@ -26,24 +26,18 @@ var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
 
 // src/combobox/combobox-item-check.ts
 var _react = require('react');
-var useComboboxItemCheck = _RNZNGEL4cjs.createHook.call(void 0, 
-  (_a) => {
-    var _b = _a, { store, checked } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store", "checked"]);
-    const context = _react.useContext.call(void 0, _3WCBE6SUcjs.ComboboxItemCheckedContext);
-    checked = checked != null ? checked : context;
-    props = _T4KYZJUYcjs.useCheckboxCheck.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), { checked }));
-    return props;
-  }
-);
-var ComboboxItemCheck = _RNZNGEL4cjs.createComponent.call(void 0, 
-  (props) => {
-    const htmlProps = useComboboxItemCheck(props);
-    return _RNZNGEL4cjs.createElement.call(void 0, "span", htmlProps);
-  }
-);
-if (process.env.NODE_ENV !== "production") {
-  ComboboxItemCheck.displayName = "ComboboxItemCheck";
-}
+var TagName = "span";
+var useComboboxItemCheck = _Q67LZMDTcjs.createHook.call(void 0, function useComboboxItemCheck2(_a) {
+  var _b = _a, { store, checked } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store", "checked"]);
+  const context = _react.useContext.call(void 0, _OBT2YMBCcjs.ComboboxItemCheckedContext);
+  checked = checked != null ? checked : context;
+  props = _4ITCBJNTcjs.useCheckboxCheck.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), { checked }));
+  return props;
+});
+var ComboboxItemCheck = _Q67LZMDTcjs.forwardRef.call(void 0, function ComboboxItemCheck2(props) {
+  const htmlProps = useComboboxItemCheck(props);
+  return _Q67LZMDTcjs.createElement.call(void 0, TagName, htmlProps);
+});
 
 
 

package/cjs/combobox/combobox-item-check.d.cts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { CheckboxCheckOptions } from "../checkbox/checkbox-check.jsx";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { ComboboxStore } from "./combobox-store.js";
+declare const TagName = "span";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `ComboboxItemCheck` component. This hook must be
  * used in a component that's wrapped with `ComboboxItem` or the `checked` prop
@@ -12,7 +15,7 @@ import type { ComboboxStore } from "./combobox-store.js";
  * <Role {...props} />
  * ```
  */
-export declare const useComboboxItemCheck: import("../utils/types.js").Hook<ComboboxItemCheckOptions<"span">>;
+export declare const useComboboxItemCheck: import("../utils/types.js").Hook<"span", ComboboxItemCheckOptions<"span">>;
 /**
  * Renders a checkmark icon when the
  * [`checked`](https://ariakit.org/reference/combobox-item-check#checked) prop
@@ -41,8 +44,8 @@ export declare const useComboboxItemCheck: import("../utils/types.js").Hook<Comb
  * </ComboboxProvider>
  * ```
  */
-export declare const ComboboxItemCheck: import("../utils/types.js").Component<ComboboxItemCheckOptions<"span">>;
-export interface ComboboxItemCheckOptions<T extends As = "span"> extends CheckboxCheckOptions<T> {
+export declare const ComboboxItemCheck: (props: ComboboxItemCheckProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ComboboxItemCheckOptions<T extends ElementType = TagName> extends CheckboxCheckOptions<T> {
     /**
      * Object returned by the
      * [`useComboboxStore`](https://ariakit.org/reference/use-combobox-store)
@@ -50,4 +53,5 @@ export interface ComboboxItemCheckOptions<T extends As = "span"> extends Checkbo
      */
     store?: ComboboxStore;
 }
-export type ComboboxItemCheckProps<T extends As = "span"> = Props<ComboboxItemCheckOptions<T>>;
+export type ComboboxItemCheckProps<T extends ElementType = TagName> = Props<T, ComboboxItemCheckOptions<T>>;
+export {};

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

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { CheckboxCheckOptions } from "../checkbox/checkbox-check.jsx";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { ComboboxStore } from "./combobox-store.js";
+declare const TagName = "span";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `ComboboxItemCheck` component. This hook must be
  * used in a component that's wrapped with `ComboboxItem` or the `checked` prop
@@ -12,7 +15,7 @@ import type { ComboboxStore } from "./combobox-store.js";
  * <Role {...props} />
  * ```
  */
-export declare const useComboboxItemCheck: import("../utils/types.js").Hook<ComboboxItemCheckOptions<"span">>;
+export declare const useComboboxItemCheck: import("../utils/types.js").Hook<"span", ComboboxItemCheckOptions<"span">>;
 /**
  * Renders a checkmark icon when the
  * [`checked`](https://ariakit.org/reference/combobox-item-check#checked) prop
@@ -41,8 +44,8 @@ export declare const useComboboxItemCheck: import("../utils/types.js").Hook<Comb
  * </ComboboxProvider>
  * ```
  */
-export declare const ComboboxItemCheck: import("../utils/types.js").Component<ComboboxItemCheckOptions<"span">>;
-export interface ComboboxItemCheckOptions<T extends As = "span"> extends CheckboxCheckOptions<T> {
+export declare const ComboboxItemCheck: (props: ComboboxItemCheckProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ComboboxItemCheckOptions<T extends ElementType = TagName> extends CheckboxCheckOptions<T> {
     /**
      * Object returned by the
      * [`useComboboxStore`](https://ariakit.org/reference/use-combobox-store)
@@ -50,4 +53,5 @@ export interface ComboboxItemCheckOptions<T extends As = "span"> extends Checkbo
      */
     store?: ComboboxStore;
 }
-export type ComboboxItemCheckProps<T extends As = "span"> = Props<ComboboxItemCheckOptions<T>>;
+export type ComboboxItemCheckProps<T extends ElementType = TagName> = Props<T, ComboboxItemCheckOptions<T>>;
+export {};

package/cjs/combobox/combobox-item-value.cjs

@@ -2,17 +2,17 @@
 
 
 
-var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
-require('../__chunks/UZNYSPKP.cjs');
-require('../__chunks/BZTDJIVT.cjs');
-require('../__chunks/UVBBMANL.cjs');
-require('../__chunks/F2A2ZQDB.cjs');
-require('../__chunks/S6UU7NA4.cjs');
+var _OBT2YMBCcjs = require('../__chunks/OBT2YMBC.cjs');
+require('../__chunks/4XFLDG56.cjs');
+require('../__chunks/Q6CVYJBO.cjs');
+require('../__chunks/FNVFJ5AF.cjs');
+require('../__chunks/OLPMMKKO.cjs');
+require('../__chunks/XRJBC7H7.cjs');
 
 
 
 
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
 
@@ -22,8 +22,13 @@ var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
 
 // src/combobox/combobox-item-value.tsx
 var _react = require('react');
+
+
+
+
 var _misc = require('@ariakit/core/utils/misc');
 var _jsxruntime = require('react/jsx-runtime');
+var TagName = "span";
 function normalizeValue(value) {
   return _misc.normalizeString.call(void 0, value).toLowerCase();
 }
@@ -50,39 +55,32 @@ function splitValue(itemValue, userValue) {
   }
   return parts;
 }
-var useComboboxItemValue = _RNZNGEL4cjs.createHook.call(void 0, 
-  (_a) => {
-    var _b = _a, { store, value } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store", "value"]);
-    const context = _3WCBE6SUcjs.useComboboxScopedContext.call(void 0, );
-    store = store || context;
-    const itemContext = _react.useContext.call(void 0, _3WCBE6SUcjs.ComboboxItemValueContext);
-    const itemValue = value != null ? value : itemContext;
-    _misc.invariant.call(void 0, 
-      store,
-      process.env.NODE_ENV !== "production" && "ComboboxItemValue must be wrapped in a ComboboxItem component."
-    );
-    const stateValue = store.useState(
-      (state) => itemValue && state.value ? state.value : void 0
-    );
-    const children = _react.useMemo.call(void 0, 
-      () => itemValue && stateValue ? splitValue(itemValue, stateValue) : itemValue,
-      [itemValue, stateValue]
-    );
-    props = _AV6KTKLEcjs.__spreadValues.call(void 0, {
-      children
-    }, props);
-    return props;
-  }
-);
-var ComboboxItemValue = _RNZNGEL4cjs.createComponent.call(void 0, 
-  (props) => {
-    const htmlProps = useComboboxItemValue(props);
-    return _RNZNGEL4cjs.createElement.call(void 0, "span", htmlProps);
-  }
-);
-if (process.env.NODE_ENV !== "production") {
-  ComboboxItemValue.displayName = "ComboboxItemValue";
-}
+var useComboboxItemValue = _Q67LZMDTcjs.createHook.call(void 0, function useComboboxItemValue2(_a) {
+  var _b = _a, { store, value } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store", "value"]);
+  const context = _OBT2YMBCcjs.useComboboxScopedContext.call(void 0, );
+  store = store || context;
+  const itemContext = _react.useContext.call(void 0, _OBT2YMBCcjs.ComboboxItemValueContext);
+  const itemValue = value != null ? value : itemContext;
+  _misc.invariant.call(void 0, 
+    store,
+    process.env.NODE_ENV !== "production" && "ComboboxItemValue must be wrapped in a ComboboxItem component."
+  );
+  const stateValue = store.useState(
+    (state) => itemValue && state.value ? state.value : void 0
+  );
+  const children = _react.useMemo.call(void 0, 
+    () => itemValue && stateValue ? splitValue(itemValue, stateValue) : itemValue,
+    [itemValue, stateValue]
+  );
+  props = _AV6KTKLEcjs.__spreadValues.call(void 0, {
+    children
+  }, props);
+  return _misc.removeUndefinedValues.call(void 0, props);
+});
+var ComboboxItemValue = _Q67LZMDTcjs.forwardRef.call(void 0, function ComboboxItemValue2(props) {
+  const htmlProps = useComboboxItemValue(props);
+  return _Q67LZMDTcjs.createElement.call(void 0, TagName, htmlProps);
+});
 
 
 

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

@@ -1,5 +1,8 @@
-import type { As, Options, Props } from "../utils/types.js";
+import type { ElementType, ReactElement } from "react";
+import type { Options, Props } from "../utils/types.js";
 import type { ComboboxStore } from "./combobox-store.js";
+declare const TagName = "span";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `ComboboxItemValue` component that displays a value
  * element inside a combobox item. The value will be split into span elements
@@ -21,7 +24,7 @@ import type { ComboboxStore } from "./combobox-store.js";
  * </span>
  * ```
  */
-export declare const useComboboxItemValue: import("../utils/types.js").Hook<ComboboxItemValueOptions<"span">>;
+export declare const useComboboxItemValue: import("../utils/types.js").Hook<"span", ComboboxItemValueOptions<"span">>;
 /**
  * Renders a value element inside a
  * [`ComboboxItem`](https://ariakit.org/reference/combobox-item). The value will
@@ -51,8 +54,8 @@ export declare const useComboboxItemValue: import("../utils/types.js").Hook<Comb
  * </span>
  * ```
  */
-export declare const ComboboxItemValue: import("../utils/types.js").Component<ComboboxItemValueOptions<"span">>;
-export interface ComboboxItemValueOptions<T extends As = "span"> extends Options<T> {
+export declare const ComboboxItemValue: (props: ComboboxItemValueProps) => ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ComboboxItemValueOptions<_T extends ElementType = TagName> extends Options {
     /**
      * Object returned by the
      * [`useComboboxStore`](https://ariakit.org/reference/use-combobox-store)
@@ -70,4 +73,5 @@ export interface ComboboxItemValueOptions<T extends As = "span"> extends Options
      */
     value?: string;
 }
-export type ComboboxItemValueProps<T extends As = "span"> = Props<ComboboxItemValueOptions<T>>;
+export type ComboboxItemValueProps<T extends ElementType = TagName> = Props<T, ComboboxItemValueOptions<T>>;
+export {};

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

@@ -1,5 +1,8 @@
-import type { As, Options, Props } from "../utils/types.js";
+import type { ElementType, ReactElement } from "react";
+import type { Options, Props } from "../utils/types.js";
 import type { ComboboxStore } from "./combobox-store.js";
+declare const TagName = "span";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `ComboboxItemValue` component that displays a value
  * element inside a combobox item. The value will be split into span elements
@@ -21,7 +24,7 @@ import type { ComboboxStore } from "./combobox-store.js";
  * </span>
  * ```
  */
-export declare const useComboboxItemValue: import("../utils/types.js").Hook<ComboboxItemValueOptions<"span">>;
+export declare const useComboboxItemValue: import("../utils/types.js").Hook<"span", ComboboxItemValueOptions<"span">>;
 /**
  * Renders a value element inside a
  * [`ComboboxItem`](https://ariakit.org/reference/combobox-item). The value will
@@ -51,8 +54,8 @@ export declare const useComboboxItemValue: import("../utils/types.js").Hook<Comb
  * </span>
  * ```
  */
-export declare const ComboboxItemValue: import("../utils/types.js").Component<ComboboxItemValueOptions<"span">>;
-export interface ComboboxItemValueOptions<T extends As = "span"> extends Options<T> {
+export declare const ComboboxItemValue: (props: ComboboxItemValueProps) => ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ComboboxItemValueOptions<_T extends ElementType = TagName> extends Options {
     /**
      * Object returned by the
      * [`useComboboxStore`](https://ariakit.org/reference/use-combobox-store)
@@ -70,4 +73,5 @@ export interface ComboboxItemValueOptions<T extends As = "span"> extends Options
      */
     value?: string;
 }
-export type ComboboxItemValueProps<T extends As = "span"> = Props<ComboboxItemValueOptions<T>>;
+export type ComboboxItemValueProps<T extends ElementType = TagName> = Props<T, ComboboxItemValueOptions<T>>;
+export {};

package/cjs/combobox/combobox-item.cjs

@@ -1,30 +1,31 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _IPYAEPOTcjs = require('../__chunks/IPYAEPOT.cjs');
+var _JAG4YGQZcjs = require('../__chunks/JAG4YGQZ.cjs');
 
 
 
 
-var _3WCBE6SUcjs = require('../__chunks/3WCBE6SU.cjs');
+var _OBT2YMBCcjs = require('../__chunks/OBT2YMBC.cjs');
 
 
-var _IO6J4PANcjs = require('../__chunks/IO6J4PAN.cjs');
-require('../__chunks/DAJUUBUI.cjs');
-require('../__chunks/R5A2WTWB.cjs');
+var _VYKATRVCcjs = require('../__chunks/VYKATRVC.cjs');
+require('../__chunks/Z7QK7V4M.cjs');
+require('../__chunks/XWCNZ2IP.cjs');
 require('../__chunks/6ZZYUFPW.cjs');
-require('../__chunks/UZNYSPKP.cjs');
-require('../__chunks/BZTDJIVT.cjs');
-require('../__chunks/UVBBMANL.cjs');
-require('../__chunks/F2A2ZQDB.cjs');
-require('../__chunks/S6UU7NA4.cjs');
-require('../__chunks/Z3GCTNW4.cjs');
+require('../__chunks/4XFLDG56.cjs');
+require('../__chunks/Q6CVYJBO.cjs');
+require('../__chunks/FNVFJ5AF.cjs');
+require('../__chunks/OLPMMKKO.cjs');
+require('../__chunks/XRJBC7H7.cjs');
+require('../__chunks/XRZ2L7EA.cjs');
 require('../__chunks/75KXQZJX.cjs');
 
 
 
 
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
 require('../__chunks/OLOZ5JT2.cjs');
 
 
@@ -45,6 +46,7 @@ var _events = require('@ariakit/core/utils/events');
 var _focus = require('@ariakit/core/utils/focus');
 var _misc = require('@ariakit/core/utils/misc');
 var _jsxruntime = require('react/jsx-runtime');
+var TagName = "div";
 function isSelected(storeValue, itemValue) {
   if (itemValue == null)
     return;
@@ -55,8 +57,8 @@ function isSelected(storeValue, itemValue) {
   }
   return storeValue === itemValue;
 }
-var useComboboxItem = _RNZNGEL4cjs.createHook.call(void 0, 
-  (_a) => {
+var useComboboxItem = _Q67LZMDTcjs.createHook.call(void 0, 
+  function useComboboxItem2(_a) {
     var _b = _a, {
       store,
       value,
@@ -76,7 +78,7 @@ var useComboboxItem = _RNZNGEL4cjs.createHook.call(void 0,
       "moveOnKeyPress",
       "getItem"
     ]);
-    const context = _3WCBE6SUcjs.useComboboxScopedContext.call(void 0, );
+    const context = _OBT2YMBCcjs.useComboboxScopedContext.call(void 0, );
     store = store || context;
     _misc.invariant.call(void 0, 
       store,
@@ -125,7 +127,6 @@ var useComboboxItem = _RNZNGEL4cjs.createHook.call(void 0,
         }
       }
       if (hideOnClickProp(event)) {
-        store == null ? void 0 : store.move(null);
         store == null ? void 0 : store.hide();
       }
     });
@@ -157,7 +158,7 @@ var useComboboxItem = _RNZNGEL4cjs.createHook.call(void 0,
     }
     props = _EO6LS72Hcjs.useWrapElement.call(void 0, 
       props,
-      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _3WCBE6SUcjs.ComboboxItemValueContext.Provider, { value, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _3WCBE6SUcjs.ComboboxItemCheckedContext.Provider, { value: selected != null ? selected : false, children: element }) }),
+      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _OBT2YMBCcjs.ComboboxItemValueContext.Provider, { value, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _OBT2YMBCcjs.ComboboxItemCheckedContext.Provider, { value: selected != null ? selected : false, children: element }) }),
       [value, selected]
     );
     const contentElement = store.useState("contentElement");
@@ -169,7 +170,7 @@ var useComboboxItem = _RNZNGEL4cjs.createHook.call(void 0,
       onKeyDown
     });
     const moveOnKeyPressProp = _EO6LS72Hcjs.useBooleanEvent.call(void 0, moveOnKeyPress);
-    props = _IO6J4PANcjs.useCompositeItem.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
+    props = _VYKATRVCcjs.useCompositeItem.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
       store
     }, props), {
       getItem,
@@ -185,19 +186,16 @@ var useComboboxItem = _RNZNGEL4cjs.createHook.call(void 0,
         return true;
       }
     }));
-    props = _IPYAEPOTcjs.useCompositeHover.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, focusOnHover }, props));
+    props = _JAG4YGQZcjs.useCompositeHover.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, focusOnHover }, props));
     return props;
   }
 );
-var ComboboxItem = _RNZNGEL4cjs.createMemoComponent.call(void 0, 
-  (props) => {
+var ComboboxItem = _Q67LZMDTcjs.memo.call(void 0, 
+  _Q67LZMDTcjs.forwardRef.call(void 0, function ComboboxItem2(props) {
     const htmlProps = useComboboxItem(props);
-    return _RNZNGEL4cjs.createElement.call(void 0, "div", htmlProps);
-  }
+    return _Q67LZMDTcjs.createElement.call(void 0, TagName, htmlProps);
+  })
 );
-if (process.env.NODE_ENV !== "production") {
-  ComboboxItem.displayName = "ComboboxItem";
-}