@ariakit/react-core 0.4.4 → 0.4.6

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

@@ -1,10 +1,13 @@
 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";
+import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreState } from "../composite/composite-store.ts";
+import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.ts";
+import type { TagStore } from "../tag/tag-store.ts";
+import type { Store } from "../utils/store.tsx";
 export declare function useComboboxStoreProps<T extends Core.ComboboxStore>(store: T, update: () => void, props: ComboboxStoreProps): T & {
-    disclosure: import("../disclosure/disclosure-store.js").DisclosureStore | null | undefined;
+    disclosure: import("../disclosure/disclosure-store.ts").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,15 +2,19 @@
 import {
   useComboboxStore,
   useComboboxStoreProps
-} from "../__chunks/ZFEEEZVE.js";
-import "../__chunks/ZR5N62ZV.js";
-import "../__chunks/LGWSZOP2.js";
-import "../__chunks/JNGHG5BN.js";
-import "../__chunks/2KACNUKS.js";
-import "../__chunks/ZIX5D53S.js";
-import "../__chunks/PWUXK5IM.js";
-import "../__chunks/WOWUAP42.js";
-import "../__chunks/XM66DUTO.js";
+} from "../__chunks/XMSX63X6.js";
+import "../__chunks/2TL4Z4I4.js";
+import "../__chunks/HVBTERMS.js";
+import "../__chunks/DYZ3QKCZ.js";
+import "../__chunks/RA2MZPUM.js";
+import "../__chunks/J4JPXPLD.js";
+import "../__chunks/I6MSISV2.js";
+import "../__chunks/BJY6QMBB.js";
+import "../__chunks/QX2CMDZ5.js";
+import "../__chunks/D6UA6CB7.js";
+import "../__chunks/S67MTDSB.js";
+import "../__chunks/FPBGCFAS.js";
+import "../__chunks/KQWO6ME3.js";
 import "../__chunks/4R3V3JGP.js";
 export {
   useComboboxStore,

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

@@ -0,0 +1,41 @@
+import type { ReactNode } from "react";
+import type { ComboboxStore, ComboboxStoreState } from "./combobox-store.ts";
+/**
+ * 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/WJUQFF4Z.js";
+import "../__chunks/RA2MZPUM.js";
+import "../__chunks/J4JPXPLD.js";
+import "../__chunks/THGRQCVD.js";
+import "../__chunks/UUT76IPH.js";
+import "../__chunks/JS4W7WDG.js";
+import "../__chunks/I6MSISV2.js";
+import "../__chunks/FPBGCFAS.js";
+import "../__chunks/KQWO6ME3.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
+};

package/esm/combobox/combobox.d.ts

@@ -1,9 +1,9 @@
 import type { AriaAttributes, ChangeEvent, ElementType, MouseEvent, KeyboardEvent as ReactKeyboardEvent } from "react";
 import type { BooleanOrCallback, StringWithValue } from "@ariakit/core/utils/types";
-import type { CompositeOptions } from "../composite/composite.js";
-import type { PopoverAnchorOptions } from "../popover/popover-anchor.js";
-import type { Props } from "../utils/types.js";
-import type { ComboboxStore, ComboboxStoreState } from "./combobox-store.js";
+import type { CompositeOptions } from "../composite/composite.tsx";
+import type { PopoverAnchorOptions } from "../popover/popover-anchor.tsx";
+import type { Props } from "../utils/types.ts";
+import type { ComboboxStore, ComboboxStoreState } from "./combobox-store.ts";
 declare const TagName = "input";
 type TagName = typeof TagName;
 /**
@@ -21,7 +21,7 @@ type TagName = typeof TagName;
  * </ComboboxPopover>
  * ```
  */
-export declare const useCombobox: import("../utils/types.js").Hook<"input", ComboboxOptions<"input">>;
+export declare const useCombobox: import("../utils/types.ts").Hook<"input", ComboboxOptions<"input">>;
 /**
  * Renders a combobox input element that can be used to filter a list of items.
  * @see https://ariakit.org/components/combobox

package/esm/combobox/combobox.js

@@ -1,26 +1,26 @@
 "use client";
-import {
-  usePopoverAnchor
-} from "../__chunks/DYQUE3V3.js";
 import {
   useComboboxProviderContext
-} from "../__chunks/N4X7J4OQ.js";
+} from "../__chunks/WJUQFF4Z.js";
+import {
+  usePopoverAnchor
+} from "../__chunks/BEM72Z3B.js";
 import {
   useComposite
-} from "../__chunks/CDZXDIC7.js";
+} from "../__chunks/YRRYMVMY.js";
 import "../__chunks/3IEDWLST.js";
-import "../__chunks/QFI3MCMR.js";
-import "../__chunks/6LTHW2TQ.js";
-import "../__chunks/5B3U64HV.js";
-import "../__chunks/IWHI6Y45.js";
-import "../__chunks/RG6J4TID.js";
-import "../__chunks/7JCFLN3D.js";
-import "../__chunks/SHA3WOPI.js";
+import "../__chunks/RA2MZPUM.js";
+import "../__chunks/J4JPXPLD.js";
+import "../__chunks/THGRQCVD.js";
+import "../__chunks/UUT76IPH.js";
+import "../__chunks/JS4W7WDG.js";
+import "../__chunks/CGG6F755.js";
+import "../__chunks/SWN3JYXT.js";
 import {
   createElement,
   createHook,
   forwardRef
-} from "../__chunks/GUCZNEAD.js";
+} from "../__chunks/I6MSISV2.js";
 import {
   useBooleanEvent,
   useEvent,
@@ -30,8 +30,8 @@ import {
   useSafeLayoutEffect,
   useUpdateEffect,
   useUpdateLayoutEffect
-} from "../__chunks/WOWUAP42.js";
-import "../__chunks/XM66DUTO.js";
+} from "../__chunks/FPBGCFAS.js";
+import "../__chunks/KQWO6ME3.js";
 import {
   __objRest,
   __spreadProps,
@@ -43,6 +43,7 @@ import { useEffect, useMemo, useRef, useState } from "react";
 import {
   getPopupRole,
   getScrollingElement,
+  getTextboxSelection,
   setSelectionRange
 } from "@ariakit/core/utils/dom";
 import {
@@ -53,9 +54,10 @@ import { hasFocus } from "@ariakit/core/utils/focus";
 import {
   invariant,
   isFalsyBooleanCallback,
+  noop,
   normalizeString
 } from "@ariakit/core/utils/misc";
-import { flushSync } from "react-dom";
+import { sync } from "@ariakit/core/utils/store";
 var TagName = "input";
 function isFirstItemAutoSelected(items, activeValue, autoSelect) {
   if (!autoSelect)
@@ -93,7 +95,7 @@ var useCombobox = createHook(
       focusable = true,
       autoSelect: autoSelectProp = false,
       getAutoSelectId,
-      setValueOnChange = true,
+      setValueOnChange,
       showMinLength = 0,
       showOnChange,
       showOnMouseDown,
@@ -142,9 +144,26 @@ var useCombobox = createHook(
       setCanInline(true);
     }, [inline]);
     const storeValue = store.useState("value");
-    const activeValue = store.useState(
-      (state) => inline && canInline ? state.activeValue : void 0
-    );
+    const prevSelectedValueRef = useRef();
+    useEffect(() => {
+      return sync(store, ["selectedValue", "activeId"], (_, prev) => {
+        prevSelectedValueRef.current = prev.selectedValue;
+      });
+    }, []);
+    const inlineActiveValue = store.useState((state) => {
+      var _a2;
+      if (!inline)
+        return;
+      if (!canInline)
+        return;
+      if (state.activeValue && Array.isArray(state.selectedValue)) {
+        if (state.selectedValue.includes(state.activeValue))
+          return;
+        if ((_a2 = prevSelectedValueRef.current) == null ? void 0 : _a2.includes(state.activeValue))
+          return;
+      }
+      return state.activeValue;
+    });
     const items = store.useState("renderedItems");
     const open = store.useState("open");
     const contentElement = store.useState("contentElement");
@@ -155,18 +174,18 @@ var useCombobox = createHook(
         return storeValue;
       const firstItemAutoSelected = isFirstItemAutoSelected(
         items,
-        activeValue,
+        inlineActiveValue,
         autoSelect
       );
       if (firstItemAutoSelected) {
-        if (hasCompletionString(storeValue, activeValue)) {
-          const slice = (activeValue == null ? void 0 : activeValue.slice(storeValue.length)) || "";
+        if (hasCompletionString(storeValue, inlineActiveValue)) {
+          const slice = (inlineActiveValue == null ? void 0 : inlineActiveValue.slice(storeValue.length)) || "";
           return storeValue + slice;
         }
         return storeValue;
       }
-      return activeValue || storeValue;
-    }, [inline, canInline, items, activeValue, autoSelect, storeValue]);
+      return inlineActiveValue || storeValue;
+    }, [inline, canInline, items, inlineActiveValue, autoSelect, storeValue]);
     useEffect(() => {
       const element = ref.current;
       if (!element)
@@ -182,28 +201,43 @@ var useCombobox = createHook(
         return;
       if (!canInline)
         return;
-      if (!activeValue)
+      if (!inlineActiveValue)
         return;
       const firstItemAutoSelected = isFirstItemAutoSelected(
         items,
-        activeValue,
+        inlineActiveValue,
         autoSelect
       );
       if (!firstItemAutoSelected)
         return;
-      if (!hasCompletionString(storeValue, activeValue))
+      if (!hasCompletionString(storeValue, inlineActiveValue))
         return;
+      let cleanup = noop;
       queueMicrotask(() => {
         const element = ref.current;
         if (!element)
           return;
-        setSelectionRange(element, storeValue.length, activeValue.length);
+        const { start: prevStart, end: prevEnd } = getTextboxSelection(element);
+        const nextStart = storeValue.length;
+        const nextEnd = inlineActiveValue.length;
+        setSelectionRange(element, nextStart, nextEnd);
+        cleanup = () => {
+          if (!hasFocus(element))
+            return;
+          const { start, end } = getTextboxSelection(element);
+          if (start !== nextStart)
+            return;
+          if (end !== nextEnd)
+            return;
+          setSelectionRange(element, prevStart, prevEnd);
+        };
       });
+      return () => cleanup();
     }, [
       valueUpdated,
       inline,
       canInline,
-      activeValue,
+      inlineActiveValue,
       items,
       autoSelect,
       storeValue
@@ -314,17 +348,25 @@ var useCombobox = createHook(
         elements.forEach((el) => el.removeEventListener("focusout", onBlur2));
       };
     }, [inline, contentElement, store, value]);
-    const canShow = value.length >= showMinLength;
+    const canShow = (event) => {
+      const currentTarget = event.currentTarget;
+      return currentTarget.value.length >= showMinLength;
+    };
     const onChangeProp = props.onChange;
     const showOnChangeProp = useBooleanEvent(showOnChange != null ? showOnChange : canShow);
-    const setValueOnChangeProp = useBooleanEvent(setValueOnChange);
+    const setValueOnChangeProp = useBooleanEvent(
+      // If the combobox is combined with tags, the value will be set by the tag
+      // input component.
+      setValueOnChange != null ? setValueOnChange : !store.tag
+    );
     const onChange = useEvent((event) => {
       onChangeProp == null ? void 0 : onChangeProp(event);
       if (event.defaultPrevented)
         return;
       if (!store)
         return;
-      const { value: value2, selectionStart, selectionEnd } = event.target;
+      const currentTarget = event.currentTarget;
+      const { value: value2, selectionStart, selectionEnd } = currentTarget;
       const nativeEvent = event.nativeEvent;
       canAutoSelectRef.current = true;
       if (isInputEvent(nativeEvent)) {
@@ -340,8 +382,10 @@ var useCombobox = createHook(
       }
       if (setValueOnChangeProp(event)) {
         const isSameValue = value2 === store.getState().value;
-        flushSync(() => store == null ? void 0 : store.setValue(value2));
-        setSelectionRange(event.currentTarget, selectionStart, selectionEnd);
+        store.setValue(value2);
+        queueMicrotask(() => {
+          setSelectionRange(currentTarget, selectionStart, selectionEnd);
+        });
         if (inline && autoSelect && isSameValue) {
           forceValueUpdate();
         }

package/esm/command/command.d.ts

@@ -1,6 +1,6 @@
 import type { ElementType } from "react";
-import type { FocusableOptions } from "../focusable/focusable.js";
-import type { Props } from "../utils/types.js";
+import type { FocusableOptions } from "../focusable/focusable.tsx";
+import type { Props } from "../utils/types.ts";
 declare const TagName = "button";
 type TagName = typeof TagName;
 /**
@@ -14,7 +14,7 @@ type TagName = typeof TagName;
  * <Role {...props}>Accessible button</Role>
  * ```
  */
-export declare const useCommand: import("../utils/types.js").Hook<"button", CommandOptions<"button">>;
+export declare const useCommand: import("../utils/types.ts").Hook<"button", CommandOptions<"button">>;
 /**
  * Renders a clickable element, which is a `button` by default, and inherits
  * features from the [`Focusable`](https://ariakit.org/reference/focusable)

package/esm/command/command.js

@@ -2,12 +2,12 @@
 import {
   Command,
   useCommand
-} from "../__chunks/PJ7ERAIM.js";
-import "../__chunks/7JCFLN3D.js";
-import "../__chunks/SHA3WOPI.js";
-import "../__chunks/GUCZNEAD.js";
-import "../__chunks/WOWUAP42.js";
-import "../__chunks/XM66DUTO.js";
+} from "../__chunks/57DQFKOT.js";
+import "../__chunks/CGG6F755.js";
+import "../__chunks/SWN3JYXT.js";
+import "../__chunks/I6MSISV2.js";
+import "../__chunks/FPBGCFAS.js";
+import "../__chunks/KQWO6ME3.js";
 import "../__chunks/4R3V3JGP.js";
 export {
   Command,

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

@@ -1,6 +1,6 @@
 import type { ElementType } from "react";
-import type { Options, Props } from "../utils/types.js";
-import type { CompositeStore } from "./composite-store.js";
+import type { Options, Props } from "../utils/types.ts";
+import type { CompositeStore } from "./composite-store.ts";
 declare const TagName = "div";
 type TagName = typeof TagName;
 /**
@@ -20,7 +20,7 @@ type TagName = typeof TagName;
  * </Composite>
  * ```
  */
-export declare const useCompositeContainer: import("../utils/types.js").Hook<"div", CompositeContainerOptions<"div">>;
+export declare const useCompositeContainer: import("../utils/types.ts").Hook<"div", CompositeContainerOptions<"div">>;
 /**
  * Renders a container for interactive widgets inside composite items. This
  * should be used in conjunction with the

package/esm/composite/composite-container.js

@@ -2,14 +2,14 @@
 import {
   CompositeContainer,
   useCompositeContainer
-} from "../__chunks/LQCUPYIB.js";
+} from "../__chunks/RNXBTOTE.js";
 import "../__chunks/3IEDWLST.js";
-import "../__chunks/QFI3MCMR.js";
-import "../__chunks/6LTHW2TQ.js";
-import "../__chunks/GUCZNEAD.js";
-import "../__chunks/PWUXK5IM.js";
-import "../__chunks/WOWUAP42.js";
-import "../__chunks/XM66DUTO.js";
+import "../__chunks/RA2MZPUM.js";
+import "../__chunks/J4JPXPLD.js";
+import "../__chunks/I6MSISV2.js";
+import "../__chunks/S67MTDSB.js";
+import "../__chunks/FPBGCFAS.js";
+import "../__chunks/KQWO6ME3.js";
 import "../__chunks/4R3V3JGP.js";
 export {
   CompositeContainer,

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

@@ -1,4 +1,4 @@
-import type { CompositeStore } from "./composite-store.js";
+import type { CompositeStore } from "./composite-store.ts";
 /**
  * Returns the composite store from the nearest composite container.
  * @example
@@ -12,11 +12,11 @@ import type { CompositeStore } from "./composite-store.js";
  *   // Use the store...
  * }
  */
-export declare const useCompositeContext: () => CompositeStore<import("./composite-store.js").CompositeStoreItem> | undefined;
-export declare const useCompositeScopedContext: (onlyScoped?: boolean) => CompositeStore<import("./composite-store.js").CompositeStoreItem> | undefined;
-export declare const useCompositeProviderContext: () => CompositeStore<import("./composite-store.js").CompositeStoreItem> | undefined;
-export declare const CompositeContextProvider: (props: import("react").ProviderProps<CompositeStore<import("./composite-store.js").CompositeStoreItem> | undefined>) => import("react/jsx-runtime").JSX.Element;
-export declare const CompositeScopedContextProvider: (props: import("react").ProviderProps<CompositeStore<import("./composite-store.js").CompositeStoreItem> | undefined>) => import("react/jsx-runtime").JSX.Element;
+export declare const useCompositeContext: () => CompositeStore<import("./composite-store.ts").CompositeStoreItem> | undefined;
+export declare const useCompositeScopedContext: (onlyScoped?: boolean) => CompositeStore<import("./composite-store.ts").CompositeStoreItem> | undefined;
+export declare const useCompositeProviderContext: () => CompositeStore<import("./composite-store.ts").CompositeStoreItem> | undefined;
+export declare const CompositeContextProvider: (props: import("react").ProviderProps<CompositeStore<import("./composite-store.ts").CompositeStoreItem> | undefined>) => import("react/jsx-runtime").JSX.Element;
+export declare const CompositeScopedContextProvider: (props: import("react").ProviderProps<CompositeStore<import("./composite-store.ts").CompositeStoreItem> | undefined>) => import("react/jsx-runtime").JSX.Element;
 interface ItemContext {
     baseElement?: HTMLElement;
     id?: string;

package/esm/composite/composite-context.js

@@ -7,11 +7,11 @@ import {
   useCompositeContext,
   useCompositeProviderContext,
   useCompositeScopedContext
-} from "../__chunks/QFI3MCMR.js";
-import "../__chunks/6LTHW2TQ.js";
-import "../__chunks/GUCZNEAD.js";
-import "../__chunks/WOWUAP42.js";
-import "../__chunks/XM66DUTO.js";
+} from "../__chunks/RA2MZPUM.js";
+import "../__chunks/J4JPXPLD.js";
+import "../__chunks/I6MSISV2.js";
+import "../__chunks/FPBGCFAS.js";
+import "../__chunks/KQWO6ME3.js";
 import "../__chunks/4R3V3JGP.js";
 export {
   CompositeContextProvider,

package/esm/composite/composite-group-label.d.ts

@@ -1,7 +1,7 @@
 import type { ElementType } from "react";
-import type { GroupLabelOptions } from "../group/group-label.js";
-import type { Props } from "../utils/types.js";
-import type { CompositeStore } from "./composite-store.js";
+import type { GroupLabelOptions } from "../group/group-label.tsx";
+import type { Props } from "../utils/types.ts";
+import type { CompositeStore } from "./composite-store.ts";
 declare const TagName = "div";
 type TagName = typeof TagName;
 /**
@@ -16,7 +16,7 @@ type TagName = typeof TagName;
  * <Role {...props}>Label</Role>
  * ```
  */
-export declare const useCompositeGroupLabel: import("../utils/types.js").Hook<"div", CompositeGroupLabelOptions<"div">>;
+export declare const useCompositeGroupLabel: import("../utils/types.ts").Hook<"div", CompositeGroupLabelOptions<"div">>;
 /**
  * Renders a label in a composite group. This component must be wrapped with
  * [`CompositeGroup`](https://ariakit.org/reference/composite-group) so the

package/esm/composite/composite-group-label.js

@@ -2,12 +2,12 @@
 import {
   CompositeGroupLabel,
   useCompositeGroupLabel
-} from "../__chunks/MZOHHXHK.js";
-import "../__chunks/7MLCLLFD.js";
-import "../__chunks/3X3MDQGM.js";
-import "../__chunks/GUCZNEAD.js";
-import "../__chunks/WOWUAP42.js";
-import "../__chunks/XM66DUTO.js";
+} from "../__chunks/FFXEMTZO.js";
+import "../__chunks/JQTJY6G3.js";
+import "../__chunks/7HVFURXT.js";
+import "../__chunks/I6MSISV2.js";
+import "../__chunks/FPBGCFAS.js";
+import "../__chunks/KQWO6ME3.js";
 import "../__chunks/4R3V3JGP.js";
 export {
   CompositeGroupLabel,

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

@@ -1,7 +1,7 @@
 import type { ElementType } from "react";
-import type { GroupOptions } from "../group/group.js";
-import type { Props } from "../utils/types.js";
-import type { CompositeStore } from "./composite-store.js";
+import type { GroupOptions } from "../group/group.tsx";
+import type { Props } from "../utils/types.ts";
+import type { CompositeStore } from "./composite-store.ts";
 declare const TagName = "div";
 type TagName = typeof TagName;
 /**
@@ -20,7 +20,7 @@ type TagName = typeof TagName;
  * </Composite>
  * ```
  */
-export declare const useCompositeGroup: import("../utils/types.js").Hook<"div", CompositeGroupOptions<"div">>;
+export declare const useCompositeGroup: import("../utils/types.ts").Hook<"div", CompositeGroupOptions<"div">>;
 /**
  * Renders a group element for composite items. The
  * [`CompositeGroupLabel`](https://ariakit.org/reference/composite-group-label)

package/esm/composite/composite-group.js

@@ -2,12 +2,12 @@
 import {
   CompositeGroup,
   useCompositeGroup
-} from "../__chunks/75M4HBQU.js";
-import "../__chunks/QY7ICDXC.js";
-import "../__chunks/3X3MDQGM.js";
-import "../__chunks/GUCZNEAD.js";
-import "../__chunks/WOWUAP42.js";
-import "../__chunks/XM66DUTO.js";
+} from "../__chunks/LTJ75W3G.js";
+import "../__chunks/RIR54EMZ.js";
+import "../__chunks/7HVFURXT.js";
+import "../__chunks/I6MSISV2.js";
+import "../__chunks/FPBGCFAS.js";
+import "../__chunks/KQWO6ME3.js";
 import "../__chunks/4R3V3JGP.js";
 export {
   CompositeGroup,

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

@@ -1,7 +1,7 @@
 import type { ElementType, MouseEvent as ReactMouseEvent } from "react";
 import type { BooleanOrCallback } from "@ariakit/core/utils/types";
-import type { Options, Props } from "../utils/types.js";
-import type { CompositeStore } from "./composite-store.js";
+import type { Options, Props } from "../utils/types.ts";
+import type { CompositeStore } from "./composite-store.ts";
 declare const TagName = "div";
 type TagName = typeof TagName;
 /**
@@ -18,7 +18,7 @@ type TagName = typeof TagName;
  * <CompositeItem store={store} {...props}>Item</CompositeItem>
  * ```
  */
-export declare const useCompositeHover: import("../utils/types.js").Hook<"div", CompositeHoverOptions<"div">>;
+export declare const useCompositeHover: import("../utils/types.ts").Hook<"div", CompositeHoverOptions<"div">>;
 /**
  * Renders an element in a composite widget that receives focus on mouse move
  * and loses focus to the composite base element on mouse leave.

package/esm/composite/composite-hover.js

@@ -2,12 +2,12 @@
 import {
   CompositeHover,
   useCompositeHover
-} from "../__chunks/VXKKJNIF.js";
-import "../__chunks/QFI3MCMR.js";
-import "../__chunks/6LTHW2TQ.js";
-import "../__chunks/GUCZNEAD.js";
-import "../__chunks/WOWUAP42.js";
-import "../__chunks/XM66DUTO.js";
+} from "../__chunks/UVJHXCCZ.js";
+import "../__chunks/RA2MZPUM.js";
+import "../__chunks/J4JPXPLD.js";
+import "../__chunks/I6MSISV2.js";
+import "../__chunks/FPBGCFAS.js";
+import "../__chunks/KQWO6ME3.js";
 import "../__chunks/4R3V3JGP.js";
 export {
   CompositeHover,