@ariakit/react-core 0.3.4 → 0.3.5

package/cjs/combobox/combobox.d.cts

@@ -0,0 +1,168 @@
+import type { AriaAttributes, ChangeEvent, 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 { As, Props } from "../utils/types.js";
+import type { ComboboxStore } from "./combobox-store.js";
+/**
+ * Returns props to create a `Combobox` component.
+ * @see https://ariakit.org/components/combobox
+ * @example
+ * ```jsx
+ * const store = useComboboxStore();
+ * const props = useCombobox({ store });
+ * <Role {...props} />
+ * <ComboboxPopover store={store}>
+ *   <ComboboxItem value="Apple" />
+ *   <ComboboxItem value="Banana" />
+ *   <ComboboxItem value="Orange" />
+ * </ComboboxPopover>
+ * ```
+ */
+export declare const useCombobox: import("../utils/types.js").Hook<ComboboxOptions<"input">>;
+/**
+ * Renders a combobox input.
+ * @see https://ariakit.org/components/combobox
+ * @example
+ * ```jsx
+ * <ComboboxProvider>
+ *   <Combobox />
+ *   <ComboboxPopover>
+ *     <ComboboxItem value="Apple" />
+ *     <ComboboxItem value="Banana" />
+ *     <ComboboxItem value="Orange" />
+ *   </ComboboxPopover>
+ * </ComboboxProvider>
+ * ```
+ */
+export declare const Combobox: import("../utils/types.js").Component<ComboboxOptions<"input">>;
+export interface ComboboxOptions<T extends As = "input"> extends CompositeOptions<T>, PopoverAnchorOptions<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;
+    /**
+     * Whether the first item will be automatically selected when the combobox
+     * input value changes. When it's set to `true`, the exact behavior will
+     * depend on the value of
+     * [`autoComplete`](https://ariakit.org/reference/combobox#autocomplete) prop:
+     * - If [`autoComplete`](https://ariakit.org/reference/combobox#autocomplete)
+     *   is `both` or `inline`, the first item is automatically focused when the
+     *   popup opens, and the input value changes to reflect this. The inline
+     *   completion string will be highlighted and will have a selected state.
+     * - If [`autoComplete`](https://ariakit.org/reference/combobox#autocomplete)
+     *   is `list` or `none`, the first item is automatically focused when the
+     *   popup opens, but the input value doesn't change.
+     *
+     * Live examples:
+     * - [ComboboxCancel](https://ariakit.org/examples/combobox-cancel)
+     * - [ComboboxGroup](https://ariakit.org/examples/combobox-group)
+     * - [Combobox with links](https://ariakit.org/examples/combobox-links)
+     * - [Textarea with inline
+     *   Combobox](https://ariakit.org/examples/combobox-textarea)
+     * - [Menu with Combobox](https://ariakit.org/examples/menu-combobox)
+     * - [Select with Combobox](https://ariakit.org/examples/select-combobox)
+     * @default false
+     */
+    autoSelect?: boolean;
+    /**
+     * Whether the items will be filtered based on
+     * [`value`](https://ariakit.org/reference/combobox-provider#value) and
+     * whether the input value will temporarily change based on the active item.
+     *
+     * This prop is based on the standard
+     * [`aria-autocomplete`](https://w3c.github.io/aria/#aria-autocomplete)
+     * attribute, accepting the same values:
+     * - `both`: indicates that the items will be filtered based on
+     *   [`value`](https://ariakit.org/reference/combobox-provider#value) and the
+     *   input value will temporarily change based on the active item. The
+     *   filtering logic must be implemented by the consumer of this component,
+     *   whereas Ariakit will automatically provide the inline autocompletion
+     *   behavior.
+     * - `list` (default): indicates that the items will be filtered based on
+     *   [`value`](https://ariakit.org/reference/combobox-provider#value) and the
+     *   input value will NOT change based on the active item. The filtering logic
+     *   must be implemented by the consumer of this component.
+     * - `inline`: indicates that the items are static, that is, they won't be
+     *   filtered, but the input value will temporarily change based on the active
+     *   item. Ariakit will automatically provide the inline autocompletion
+     *   behavior
+     * - `none`: the items are static and the input value will NOT change based on
+     *   the active item.
+     *
+     * Live examples:
+     * - [ComboboxGroup](https://ariakit.org/examples/combobox-group)
+     * @default "list"
+     */
+    autoComplete?: StringWithValue<Required<AriaAttributes>["aria-autocomplete"]>;
+    /**
+     * Whether the combobox list/popover should be shown when the input value is
+     * changed.
+     *
+     * Live examples:
+     * - [Textarea with inline
+     *   Combobox](https://ariakit.org/examples/combobox-textarea)
+     * @default true
+     * @example
+     * ```jsx
+     * <Combobox showOnChange={(event) => event.target.value.length > 1} />
+     * ```
+     */
+    showOnChange?: BooleanOrCallback<ChangeEvent<HTMLElement>>;
+    /**
+     * Whether the combobox store value will be updated when the input value
+     * changes. This is useful if you want to customize how the store value is
+     * updated based on the input value.
+     *
+     * Live examples:
+     * - [Textarea with inline
+     *   Combobox](https://ariakit.org/examples/combobox-textarea)
+     * @default true
+     */
+    setValueOnChange?: BooleanOrCallback<ChangeEvent<HTMLElement>>;
+    /**
+     * Whether the [`ComboboxList`](https://ariakit.org/reference/combobox-list)
+     * or [`ComboboxPopover`](https://ariakit.org/reference/combobox-popover)
+     * components should be shown when the input is clicked.
+     *
+     * Live examples:
+     * - [Textarea with inline
+     *   Combobox](https://ariakit.org/examples/combobox-textarea)
+     * @default true
+     * @example
+     * ```jsx
+     * <Combobox showOnMouseDown={value.length > 1} />
+     * ```
+     */
+    showOnMouseDown?: BooleanOrCallback<MouseEvent<HTMLElement>>;
+    /**
+     * Whether the [`ComboboxList`](https://ariakit.org/reference/combobox-list)
+     * or [`ComboboxPopover`](https://ariakit.org/reference/combobox-popover)
+     * components should be shown when the user presses the arrow up or down keys
+     * while focusing on the combobox input element.
+     *
+     * Live examples:
+     * - [Textarea with inline
+     *   Combobox](https://ariakit.org/examples/combobox-textarea)
+     * @default true
+     * @example
+     * ```jsx
+     * <Combobox showOnKeyDown={value.length > 1} />
+     * ```
+     */
+    showOnKeyDown?: BooleanOrCallback<ReactKeyboardEvent<HTMLElement>>;
+    /**
+     * Whether the combobox store value will be updated when the combobox input
+     * element gets clicked. This usually only applies when `autoComplete` is
+     * `both` or `inline`, because the input value will temporarily change based
+     * on the active item and the store value will not be updated until the user
+     * confirms the selection.
+     * @default true
+     */
+    setValueOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
+}
+export type ComboboxProps<T extends As = "input"> = Props<ComboboxOptions<T>>;

package/cjs/command/command.cjs

@@ -1,14 +1,15 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _HWZH54NBcjs = require('../__chunks/HWZH54NB.cjs');
-require('../__chunks/GQAB4M3B.cjs');
-require('../__chunks/LHHW5ZQP.cjs');
-require('../__chunks/Z5PUIG6A.cjs');
-require('../__chunks/5WLTMVVQ.cjs');
-require('../__chunks/7WUTS26Y.cjs');
-require('../__chunks/72I2GWXF.cjs');
 
+var _F7HB6RYGcjs = require('../__chunks/F7HB6RYG.cjs');
+require('../__chunks/7ARL6QHN.cjs');
+require('../__chunks/75KXQZJX.cjs');
+require('../__chunks/VKYTJKYN.cjs');
+require('../__chunks/JTVNRMAC.cjs');
+require('../__chunks/LNE2FWJO.cjs');
+require('../__chunks/WYXAWBLE.cjs');
 
 
-exports.Command = _HWZH54NBcjs.Command; exports.useCommand = _HWZH54NBcjs.useCommand;
+
+exports.Command = _F7HB6RYGcjs.Command; exports.useCommand = _F7HB6RYGcjs.useCommand;

package/cjs/command/command.d.cts

@@ -0,0 +1,51 @@
+import type { FocusableOptions } from "../focusable/focusable.js";
+import type { As, Props } from "../utils/types.js";
+/**
+ * Returns props to create a `Command` component. If the element is not a native
+ * clickable element (like a button), this hook will return additional props to
+ * make sure it's accessible.
+ * @see https://ariakit.org/components/command
+ * @example
+ * ```jsx
+ * const props = useCommand({ render: <div /> });
+ * <Role {...props}>Accessible button</Role>
+ * ```
+ */
+export declare const useCommand: import("../utils/types.js").Hook<CommandOptions<"button">>;
+/**
+ * Renders a clickable element, which is a `button` by default, and inherits
+ * features from the [`Focusable`](https://ariakit.org/reference/focusable)
+ * component.
+ *
+ * If the base element isn't a native clickable one, this component will provide
+ * extra attributes and event handlers to ensure accessibility. It can be
+ * activated with the keyboard using the
+ * [`clickOnEnter`](https://ariakit.org/reference/command#clickonenter) and
+ * [`clickOnSpace`](https://ariakit.org/reference/command#clickonspace)
+ * props. Both are set to `true` by default.
+ * @see https://ariakit.org/components/command
+ * @example
+ * ```jsx
+ * <Command render={<div />}>Accessible button</Command>
+ * ```
+ */
+export declare const Command: import("../utils/types.js").Component<CommandOptions<"button">>;
+export interface CommandOptions<T extends As = "button"> extends FocusableOptions<T> {
+    /**
+     * If set to `true`, pressing the enter key while this element is focused will
+     * trigger a click on the element, regardless of whether it's a native button
+     * or not. If this prop is set to `false`, pressing enter will not initiate a
+     * click.
+     * @default true
+     */
+    clickOnEnter?: boolean;
+    /**
+     * If set to `true`, pressing and releasing the space key while this element
+     * is focused will trigger a click on the element, regardless of whether it's
+     * a native button or not. If this prop is set to `false`, space will not
+     * initiate a click.
+     * @default true
+     */
+    clickOnSpace?: boolean;
+}
+export type CommandProps<T extends As = "button"> = Props<CommandOptions<T>>;

package/cjs/composite/composite-container.cjs

@@ -1,16 +1,17 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _UK2DHDQUcjs = require('../__chunks/UK2DHDQU.cjs');
-require('../__chunks/KLZID3QO.cjs');
-require('../__chunks/H7R5D2FR.cjs');
-require('../__chunks/NHZBX2RS.cjs');
-require('../__chunks/Z5PUIG6A.cjs');
-require('../__chunks/EVNF7KMT.cjs');
-require('../__chunks/5WLTMVVQ.cjs');
-require('../__chunks/7WUTS26Y.cjs');
-require('../__chunks/72I2GWXF.cjs');
 
+var _JLZMDZGEcjs = require('../__chunks/JLZMDZGE.cjs');
+require('../__chunks/RV3PHHWM.cjs');
+require('../__chunks/FQGSRSYD.cjs');
+require('../__chunks/JVORNAMD.cjs');
+require('../__chunks/VKYTJKYN.cjs');
+require('../__chunks/WLJVTO7A.cjs');
+require('../__chunks/JTVNRMAC.cjs');
+require('../__chunks/LNE2FWJO.cjs');
+require('../__chunks/WYXAWBLE.cjs');
 
 
-exports.CompositeContainer = _UK2DHDQUcjs.CompositeContainer; exports.useCompositeContainer = _UK2DHDQUcjs.useCompositeContainer;
+
+exports.CompositeContainer = _JLZMDZGEcjs.CompositeContainer; exports.useCompositeContainer = _JLZMDZGEcjs.useCompositeContainer;

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

@@ -0,0 +1,44 @@
+import type { As, Options, Props } from "../utils/types.js";
+import type { CompositeStore } from "./composite-store.js";
+/**
+ * Returns props to create a `CompositeContainer` component. This component
+ * renders interactive widgets inside composite items. This should be used in
+ * conjunction with the `CompositeItem` component, the `useCompositeItem` hook,
+ * or any other component/hook that uses `CompositeItem` underneath.
+ * @see https://ariakit.org/components/composite
+ * @example
+ * ```jsx
+ * const store = useCompositeStore();
+ * const props = useCompositeContainer({ store });
+ * <Composite store={store}>
+ *   <CompositeItem {...props}>
+ *     <input type="text" />
+ *   </CompositeItem>
+ * </Composite>
+ * ```
+ */
+export declare const useCompositeContainer: import("../utils/types.js").Hook<CompositeContainerOptions<"div">>;
+/**
+ * Renders a container for interactive widgets inside composite items. This
+ * should be used in conjunction with the `CompositeItem` component or a
+ * component that uses `CompositeItem` underneath.
+ * @see https://ariakit.org/components/composite
+ * @example
+ * ```jsx
+ * const composite = useCompositeStore();
+ * <Composite store={composite}>
+ *   <CompositeItem render={<CompositeContainer />}>
+ *     <input type="text" />
+ *   </CompositeItem>
+ * </Composite>
+ * ```
+ */
+export declare const CompositeContainer: import("../utils/types.js").Component<CompositeContainerOptions<"div">>;
+export interface CompositeContainerOptions<T extends As = "div"> extends Options<T> {
+    /**
+     * Object returned by the `useCompositeStore` hook. If not provided, the
+     * parent `Composite` component's context will be used.
+     */
+    store?: CompositeStore;
+}
+export type CompositeContainerProps<T extends As = "div"> = Props<CompositeContainerOptions<T>>;

package/cjs/composite/composite-context.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
 
@@ -6,13 +6,13 @@
 
 
 
-var _H7R5D2FRcjs = require('../__chunks/H7R5D2FR.cjs');
-require('../__chunks/NHZBX2RS.cjs');
-require('../__chunks/Z5PUIG6A.cjs');
-require('../__chunks/5WLTMVVQ.cjs');
-require('../__chunks/7WUTS26Y.cjs');
-require('../__chunks/72I2GWXF.cjs');
 
+var _FQGSRSYDcjs = require('../__chunks/FQGSRSYD.cjs');
+require('../__chunks/JVORNAMD.cjs');
+require('../__chunks/VKYTJKYN.cjs');
+require('../__chunks/JTVNRMAC.cjs');
+require('../__chunks/LNE2FWJO.cjs');
+require('../__chunks/WYXAWBLE.cjs');
 
 
 
@@ -20,4 +20,5 @@ require('../__chunks/72I2GWXF.cjs');
 
 
 
-exports.CompositeContextProvider = _H7R5D2FRcjs.CompositeContextProvider; exports.CompositeItemContext = _H7R5D2FRcjs.CompositeItemContext; exports.CompositeRowContext = _H7R5D2FRcjs.CompositeRowContext; exports.CompositeScopedContextProvider = _H7R5D2FRcjs.CompositeScopedContextProvider; exports.useCompositeContext = _H7R5D2FRcjs.useCompositeContext; exports.useCompositeProviderContext = _H7R5D2FRcjs.useCompositeProviderContext; exports.useCompositeScopedContext = _H7R5D2FRcjs.useCompositeScopedContext;
+
+exports.CompositeContextProvider = _FQGSRSYDcjs.CompositeContextProvider; exports.CompositeItemContext = _FQGSRSYDcjs.CompositeItemContext; exports.CompositeRowContext = _FQGSRSYDcjs.CompositeRowContext; exports.CompositeScopedContextProvider = _FQGSRSYDcjs.CompositeScopedContextProvider; exports.useCompositeContext = _FQGSRSYDcjs.useCompositeContext; exports.useCompositeProviderContext = _FQGSRSYDcjs.useCompositeProviderContext; exports.useCompositeScopedContext = _FQGSRSYDcjs.useCompositeScopedContext;

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

@@ -0,0 +1,30 @@
+import type { CompositeStore } from "./composite-store.js";
+/**
+ * Returns the composite store from the nearest composite container.
+ * @example
+ * function CompositeItem() {
+ *   const store = useCompositeContext();
+ *
+ *   if (!store) {
+ *     throw new Error("CompositeItem must be wrapped in CompositeProvider");
+ *   }
+ *
+ *   // Use the store...
+ * }
+ */
+export declare const useCompositeContext: () => CompositeStore | undefined;
+export declare const useCompositeScopedContext: (onlyScoped?: boolean) => CompositeStore | undefined;
+export declare const useCompositeProviderContext: () => CompositeStore | undefined;
+export declare const CompositeContextProvider: (props: import("react").ProviderProps<CompositeStore | undefined>) => import("react/jsx-runtime").JSX.Element;
+export declare const CompositeScopedContextProvider: (props: import("react").ProviderProps<CompositeStore | undefined>) => import("react/jsx-runtime").JSX.Element;
+interface ItemContext {
+    baseElement?: HTMLElement;
+    id?: string;
+}
+export declare const CompositeItemContext: import("react").Context<ItemContext | undefined>;
+interface RowContext extends ItemContext {
+    ariaSetSize?: number;
+    ariaPosInSet?: number;
+}
+export declare const CompositeRowContext: import("react").Context<RowContext | undefined>;
+export {};

package/cjs/composite/composite-group-label.cjs

@@ -1,14 +1,15 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _DGL5AMAWcjs = require('../__chunks/DGL5AMAW.cjs');
-require('../__chunks/TDUVWW2F.cjs');
-require('../__chunks/K56WQU76.cjs');
-require('../__chunks/Z5PUIG6A.cjs');
-require('../__chunks/5WLTMVVQ.cjs');
-require('../__chunks/7WUTS26Y.cjs');
-require('../__chunks/72I2GWXF.cjs');
 
+var _NKMUYKJAcjs = require('../__chunks/NKMUYKJA.cjs');
+require('../__chunks/VZI5MZ7D.cjs');
+require('../__chunks/FE3YCURH.cjs');
+require('../__chunks/VKYTJKYN.cjs');
+require('../__chunks/JTVNRMAC.cjs');
+require('../__chunks/LNE2FWJO.cjs');
+require('../__chunks/WYXAWBLE.cjs');
 
 
-exports.CompositeGroupLabel = _DGL5AMAWcjs.CompositeGroupLabel; exports.useCompositeGroupLabel = _DGL5AMAWcjs.useCompositeGroupLabel;
+
+exports.CompositeGroupLabel = _NKMUYKJAcjs.CompositeGroupLabel; exports.useCompositeGroupLabel = _NKMUYKJAcjs.useCompositeGroupLabel;

package/cjs/composite/composite-group-label.d.cts

@@ -0,0 +1,42 @@
+import type { GroupLabelOptions } from "../group/group-label.js";
+import type { As, Props } from "../utils/types.js";
+import type { CompositeStore } from "./composite-store.js";
+/**
+ * Returns props to create a `CompositeGroupLabel` component. This hook must be
+ * used in a component that's wrapped with `CompositeGroup` so the
+ * `aria-labelledby` prop is properly set on the composite group element.
+ * @see https://ariakit.org/components/composite
+ * @example
+ * ```jsx
+ * // This component must be wrapped with CompositeGroup
+ * const props = useCompositeGroupLabel();
+ * <Role {...props}>Label</Role>
+ * ```
+ */
+export declare const useCompositeGroupLabel: import("../utils/types.js").Hook<CompositeGroupLabelOptions<"div">>;
+/**
+ * Renders a label in a composite group. This component must be wrapped with
+ * `CompositeGroup` so the `aria-labelledby` prop is properly set on the
+ * composite group element.
+ * @see https://ariakit.org/components/composite
+ * @example
+ * ```jsx
+ * const composite = useCompositeStore();
+ * <Composite store={composite}>
+ *   <CompositeGroup>
+ *     <CompositeGroupLabel>Label</CompositeGroupLabel>
+ *     <CompositeItem>Item 1</CompositeItem>
+ *     <CompositeItem>Item 2</CompositeItem>
+ *   </CompositeGroup>
+ * </Composite>
+ * ```
+ */
+export declare const CompositeGroupLabel: import("../utils/types.js").Component<CompositeGroupLabelOptions<"div">>;
+export interface CompositeGroupLabelOptions<T extends As = "div"> extends GroupLabelOptions<T> {
+    /**
+     * Object returned by the `useCompositeStore` hook. If not provided, the
+     * parent `Composite` component's context will be used.
+     */
+    store?: CompositeStore;
+}
+export type CompositeGroupLabelProps<T extends As = "div"> = Props<CompositeGroupLabelOptions<T>>;

package/cjs/composite/composite-group.cjs

@@ -1,14 +1,15 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _7VE7IIRWcjs = require('../__chunks/7VE7IIRW.cjs');
-require('../__chunks/ZMSJUL55.cjs');
-require('../__chunks/K56WQU76.cjs');
-require('../__chunks/Z5PUIG6A.cjs');
-require('../__chunks/5WLTMVVQ.cjs');
-require('../__chunks/7WUTS26Y.cjs');
-require('../__chunks/72I2GWXF.cjs');
 
+var _5NKFHQZ2cjs = require('../__chunks/5NKFHQZ2.cjs');
+require('../__chunks/4NC3T4TV.cjs');
+require('../__chunks/FE3YCURH.cjs');
+require('../__chunks/VKYTJKYN.cjs');
+require('../__chunks/JTVNRMAC.cjs');
+require('../__chunks/LNE2FWJO.cjs');
+require('../__chunks/WYXAWBLE.cjs');
 
 
-exports.CompositeGroup = _7VE7IIRWcjs.CompositeGroup; exports.useCompositeGroup = _7VE7IIRWcjs.useCompositeGroup;
+
+exports.CompositeGroup = _5NKFHQZ2cjs.CompositeGroup; exports.useCompositeGroup = _5NKFHQZ2cjs.useCompositeGroup;

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

@@ -0,0 +1,44 @@
+import type { GroupOptions } from "../group/group.js";
+import type { As, Props } from "../utils/types.js";
+import type { CompositeStore } from "./composite-store.js";
+/**
+ * Returns props to create a `CompositeGroup` component.
+ * @see https://ariakit.org/components/composite
+ * @example
+ * ```jsx
+ * const store = useCompositeStore();
+ * const props = useCompositeGroup({ store });
+ * <Composite store={store}>
+ *   <Role {...props}>
+ *     <CompositeGroupLabel>Label</CompositeGroupLabel>
+ *     <CompositeItem>Item 1</CompositeItem>
+ *     <CompositeItem>Item 2</CompositeItem>
+ *   </Role>
+ * </Composite>
+ * ```
+ */
+export declare const useCompositeGroup: import("../utils/types.js").Hook<CompositeGroupOptions<"div">>;
+/**
+ * Renders a group element for composite items.
+ * @see https://ariakit.org/components/composite
+ * @example
+ * ```jsx
+ * const composite = useCompositeStore();
+ * <Composite store={composite}>
+ *   <CompositeGroup>
+ *     <CompositeGroupLabel>Label</CompositeGroupLabel>
+ *     <CompositeItem>Item 1</CompositeItem>
+ *     <CompositeItem>Item 2</CompositeItem>
+ *   </CompositeGroup>
+ * </Composite>
+ * ```
+ */
+export declare const CompositeGroup: import("../utils/types.js").Component<CompositeGroupOptions<"div">>;
+export interface CompositeGroupOptions<T extends As = "div"> extends GroupOptions<T> {
+    /**
+     * Object returned by the `useCompositeStore` hook. If not provided, the
+     * parent `Composite` component's context will be used.
+     */
+    store?: CompositeStore;
+}
+export type CompositeGroupProps<T extends As = "div"> = Props<CompositeGroupOptions<T>>;

package/cjs/composite/composite-hover.cjs

@@ -1,14 +1,15 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _LPFT4ZFHcjs = require('../__chunks/LPFT4ZFH.cjs');
-require('../__chunks/H7R5D2FR.cjs');
-require('../__chunks/NHZBX2RS.cjs');
-require('../__chunks/Z5PUIG6A.cjs');
-require('../__chunks/5WLTMVVQ.cjs');
-require('../__chunks/7WUTS26Y.cjs');
-require('../__chunks/72I2GWXF.cjs');
 
+var _QWH4QBHAcjs = require('../__chunks/QWH4QBHA.cjs');
+require('../__chunks/FQGSRSYD.cjs');
+require('../__chunks/JVORNAMD.cjs');
+require('../__chunks/VKYTJKYN.cjs');
+require('../__chunks/JTVNRMAC.cjs');
+require('../__chunks/LNE2FWJO.cjs');
+require('../__chunks/WYXAWBLE.cjs');
 
 
-exports.CompositeHover = _LPFT4ZFHcjs.CompositeHover; exports.useCompositeHover = _LPFT4ZFHcjs.useCompositeHover;
+
+exports.CompositeHover = _QWH4QBHAcjs.CompositeHover; exports.useCompositeHover = _QWH4QBHAcjs.useCompositeHover;

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

@@ -0,0 +1,51 @@
+import type { MouseEvent as ReactMouseEvent } from "react";
+import type { BooleanOrCallback } from "@ariakit/core/utils/types";
+import type { As, Options, Props } from "../utils/types.js";
+import type { CompositeStore } from "./composite-store.js";
+/**
+ * Returns props to create a `CompositeHover` component. The composite item that
+ * receives these props will get focused on mouse move and lose focus to the
+ * composite base element on mouse leave. This should be combined with the
+ * `CompositeItem` component, the `useCompositeItem` hook or any component/hook
+ * that uses them underneath.
+ * @see https://ariakit.org/components/composite
+ * @example
+ * ```jsx
+ * const store = useCompositeStore();
+ * const props = useCompositeHover({ store });
+ * <CompositeItem store={store} {...props}>Item</CompositeItem>
+ * ```
+ */
+export declare const useCompositeHover: import("../utils/types.js").Hook<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. This should be
+ * combined with the `CompositeItem` component, the `useCompositeItem` hook or
+ * any component/hook that uses them underneath.
+ * @see https://ariakit.org/components/composite
+ * @example
+ * ```jsx
+ * const composite = useCompositeStore();
+ * <Composite store={composite}>
+ *   <CompositeHover render={<CompositeItem />}>Item</CompositeHover>
+ * </Composite>
+ * ```
+ */
+export declare const CompositeHover: import("../utils/types.js").Component<CompositeHoverOptions<"div">>;
+export interface CompositeHoverOptions<T extends As = "div"> extends Options<T> {
+    /**
+     * Object returned by the `useCompositeStore` hook. If not provided, the
+     * parent `Composite` component's context will be used.
+     */
+    store?: CompositeStore;
+    /**
+     * Whether to focus the composite item on hover.
+     *
+     * Live examples:
+     * - [Textarea with inline
+     *   Combobox](https://ariakit.org/examples/combobox-textarea)
+     * @default true
+     */
+    focusOnHover?: BooleanOrCallback<ReactMouseEvent<HTMLElement>>;
+}
+export type CompositeHoverProps<T extends As = "div"> = Props<CompositeHoverOptions<T>>;

package/cjs/composite/composite-input.cjs

@@ -1,13 +1,14 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _YJVXQQJ3cjs = require('../__chunks/YJVXQQJ3.cjs');
-require('../__chunks/KLZID3QO.cjs');
-require('../__chunks/Z5PUIG6A.cjs');
-require('../__chunks/5WLTMVVQ.cjs');
-require('../__chunks/7WUTS26Y.cjs');
-require('../__chunks/72I2GWXF.cjs');
 
+var _I2Z34PEHcjs = require('../__chunks/I2Z34PEH.cjs');
+require('../__chunks/RV3PHHWM.cjs');
+require('../__chunks/VKYTJKYN.cjs');
+require('../__chunks/JTVNRMAC.cjs');
+require('../__chunks/LNE2FWJO.cjs');
+require('../__chunks/WYXAWBLE.cjs');
 
 
-exports.CompositeInput = _YJVXQQJ3cjs.CompositeInput; exports.useCompositeInput = _YJVXQQJ3cjs.useCompositeInput;
+
+exports.CompositeInput = _I2Z34PEHcjs.CompositeInput; exports.useCompositeInput = _I2Z34PEHcjs.useCompositeInput;