@ariakit/react-core 0.3.14 → 0.4.1

package/esm/dialog/dialog-disclosure.js

@@ -2,15 +2,15 @@
 import {
   DialogDisclosure,
   useDialogDisclosure
-} from "../__chunks/H3TG2CZP.js";
-import "../__chunks/BHEJ6NUH.js";
-import "../__chunks/VDNZBO4W.js";
-import "../__chunks/NWCBQ4CV.js";
-import "../__chunks/G6BJYYBK.js";
-import "../__chunks/OAYFXAQ2.js";
-import "../__chunks/KK7H3W2B.js";
+} from "../__chunks/5SF76VVA.js";
+import "../__chunks/AFNONYRE.js";
+import "../__chunks/JJ3MV4KB.js";
+import "../__chunks/KSZPJCUA.js";
+import "../__chunks/XXVAHUAO.js";
+import "../__chunks/J55AVALY.js";
+import "../__chunks/WAZE6NXP.js";
 import "../__chunks/SHA3WOPI.js";
-import "../__chunks/3ORBWXWF.js";
+import "../__chunks/5M6RSQEC.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";
 import "../__chunks/4R3V3JGP.js";

package/esm/dialog/dialog-dismiss.d.ts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { ButtonOptions } from "../button/button.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { DialogStore } from "./dialog-store.js";
+declare const TagName = "button";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `DialogDismiss` component.
  * @see https://ariakit.org/components/dialog
@@ -13,7 +16,7 @@ import type { DialogStore } from "./dialog-store.js";
  * </Dialog>
  * ```
  */
-export declare const useDialogDismiss: import("../utils/types.js").Hook<DialogDismissOptions<"button">>;
+export declare const useDialogDismiss: import("../utils/types.js").Hook<"button", DialogDismissOptions<"button">>;
 /**
  * Renders a button that hides a
  * [`Dialog`](https://ariakit.org/reference/dialog) when clicked.
@@ -27,8 +30,8 @@ export declare const useDialogDismiss: import("../utils/types.js").Hook<DialogDi
  * </Dialog>
  * ```
  */
-export declare const DialogDismiss: import("../utils/types.js").Component<DialogDismissOptions<"button">>;
-export interface DialogDismissOptions<T extends As = "button"> extends ButtonOptions<T> {
+export declare const DialogDismiss: (props: DialogDismissProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface DialogDismissOptions<T extends ElementType = TagName> extends ButtonOptions<T> {
     /**
      * Object returned by the
      * [`useDialogStore`](https://ariakit.org/reference/use-dialog-store) hook. If
@@ -37,4 +40,5 @@ export interface DialogDismissOptions<T extends As = "button"> extends ButtonOpt
      */
     store?: DialogStore;
 }
-export type DialogDismissProps<T extends As = "button"> = Props<DialogDismissOptions<T>>;
+export type DialogDismissProps<T extends ElementType = TagName> = Props<T, DialogDismissOptions<T>>;
+export {};

package/esm/dialog/dialog-dismiss.js

@@ -2,14 +2,14 @@
 import {
   DialogDismiss,
   useDialogDismiss
-} from "../__chunks/NKXUN25E.js";
-import "../__chunks/VDNZBO4W.js";
-import "../__chunks/NWCBQ4CV.js";
-import "../__chunks/G6BJYYBK.js";
-import "../__chunks/OAYFXAQ2.js";
-import "../__chunks/KK7H3W2B.js";
+} from "../__chunks/5KB2YIDT.js";
+import "../__chunks/JJ3MV4KB.js";
+import "../__chunks/KSZPJCUA.js";
+import "../__chunks/XXVAHUAO.js";
+import "../__chunks/J55AVALY.js";
+import "../__chunks/WAZE6NXP.js";
 import "../__chunks/SHA3WOPI.js";
-import "../__chunks/3ORBWXWF.js";
+import "../__chunks/5M6RSQEC.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";
 import "../__chunks/4R3V3JGP.js";

package/esm/dialog/dialog-heading.d.ts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { HeadingOptions } from "../heading/heading.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { DialogStore } from "./dialog-store.js";
+declare const TagName = "h1";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `DialogHeading` component. This hook must be used
  * in a component that's wrapped with `Dialog` so the `aria-labelledby` prop is
@@ -13,7 +16,7 @@ import type { DialogStore } from "./dialog-store.js";
  * <Role {...props}>Heading</Role>
  * ```
  */
-export declare const useDialogHeading: import("../utils/types.js").Hook<DialogHeadingOptions<"h1">>;
+export declare const useDialogHeading: import("../utils/types.js").Hook<"h1", DialogHeadingOptions<"h1">>;
 /**
  * Renders a heading in a dialog. This component must be wrapped with
  * [`Dialog`](https://ariakit.org/reference/dialog) so the `aria-labelledby`
@@ -28,8 +31,8 @@ export declare const useDialogHeading: import("../utils/types.js").Hook<DialogHe
  * </Dialog>
  * ```
  */
-export declare const DialogHeading: import("../utils/types.js").Component<DialogHeadingOptions<"h1">>;
-export interface DialogHeadingOptions<T extends As = "h1"> extends HeadingOptions<T> {
+export declare const DialogHeading: (props: DialogHeadingProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface DialogHeadingOptions<T extends ElementType = TagName> extends HeadingOptions<T> {
     /**
      * Object returned by the
      * [`useDialogStore`](https://ariakit.org/reference/use-dialog-store) hook. If
@@ -38,4 +41,5 @@ export interface DialogHeadingOptions<T extends As = "h1"> extends HeadingOption
      */
     store?: DialogStore;
 }
-export type DialogHeadingProps<T extends As = "h1"> = Props<DialogHeadingOptions<T>>;
+export type DialogHeadingProps<T extends ElementType = TagName> = Props<T, DialogHeadingOptions<T>>;
+export {};

package/esm/dialog/dialog-heading.js

@@ -2,12 +2,12 @@
 import {
   DialogHeading,
   useDialogHeading
-} from "../__chunks/XHRZYRZ5.js";
-import "../__chunks/P4FX6ZFL.js";
+} from "../__chunks/E47ASM2Y.js";
+import "../__chunks/7HFLDZTS.js";
 import "../__chunks/XPF5GU3Q.js";
-import "../__chunks/G6BJYYBK.js";
-import "../__chunks/OAYFXAQ2.js";
-import "../__chunks/3ORBWXWF.js";
+import "../__chunks/XXVAHUAO.js";
+import "../__chunks/J55AVALY.js";
+import "../__chunks/5M6RSQEC.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";
 import "../__chunks/4R3V3JGP.js";

package/esm/dialog/dialog-provider.js

@@ -1,13 +1,13 @@
 "use client";
 import {
   DialogContextProvider
-} from "../__chunks/G6BJYYBK.js";
-import "../__chunks/OAYFXAQ2.js";
-import "../__chunks/3ORBWXWF.js";
+} from "../__chunks/XXVAHUAO.js";
+import "../__chunks/J55AVALY.js";
+import "../__chunks/5M6RSQEC.js";
 import {
   useDialogStore
-} from "../__chunks/ZSELSBRM.js";
-import "../__chunks/SFCBA2JZ.js";
+} from "../__chunks/I62TROYO.js";
+import "../__chunks/HZJ2XALY.js";
 import "../__chunks/EKQEJRUF.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";

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

@@ -1,7 +1,9 @@
 import * as Core from "@ariakit/core/dialog/dialog-store";
 import type { DisclosureStoreFunctions, DisclosureStoreOptions, DisclosureStoreState } from "../disclosure/disclosure-store.js";
 import type { Store } from "../utils/store.js";
-export declare function useDialogStoreProps<T extends Core.DialogStore>(store: T, update: () => void, props: DialogStoreProps): T;
+export declare function useDialogStoreProps<T extends Core.DialogStore>(store: T, update: () => void, props: DialogStoreProps): T & {
+    disclosure: import("../disclosure/disclosure-store.js").DisclosureStore | null | undefined;
+};
 /**
  * Creates a dialog store to control the state of
  * [Dialog](https://ariakit.org/components/dialog) components.
@@ -17,11 +19,11 @@ export declare function useDialogStoreProps<T extends Core.DialogStore>(store: T
 export declare function useDialogStore(props?: DialogStoreProps): DialogStore;
 export interface DialogStoreState extends Core.DialogStoreState, DisclosureStoreState {
 }
-export interface DialogStoreFunctions extends Core.DialogStoreFunctions, DisclosureStoreFunctions {
+export interface DialogStoreFunctions extends Omit<Core.DialogStoreFunctions, "disclosure">, DisclosureStoreFunctions {
 }
-export interface DialogStoreOptions extends Core.DialogStoreOptions, DisclosureStoreOptions {
+export interface DialogStoreOptions extends Omit<Core.DialogStoreOptions, "disclosure">, DisclosureStoreOptions {
 }
-export interface DialogStoreProps extends DialogStoreOptions, Core.DialogStoreProps {
+export interface DialogStoreProps extends DialogStoreOptions, Omit<Core.DialogStoreProps, "disclosure"> {
 }
-export interface DialogStore extends DialogStoreFunctions, Store<Core.DialogStore> {
+export interface DialogStore extends DialogStoreFunctions, Omit<Store<Core.DialogStore>, "disclosure"> {
 }

package/esm/dialog/dialog-store.js

@@ -2,8 +2,8 @@
 import {
   useDialogStore,
   useDialogStoreProps
-} from "../__chunks/ZSELSBRM.js";
-import "../__chunks/SFCBA2JZ.js";
+} from "../__chunks/I62TROYO.js";
+import "../__chunks/HZJ2XALY.js";
 import "../__chunks/EKQEJRUF.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";

package/esm/dialog/dialog.d.ts

@@ -1,10 +1,12 @@
-import type { ComponentPropsWithRef, ElementType, ReactElement, KeyboardEvent as ReactKeyboardEvent, RefObject, SyntheticEvent } from "react";
+import type { ComponentPropsWithRef, ElementType, FC, ReactElement, KeyboardEvent as ReactKeyboardEvent, RefObject, SyntheticEvent } from "react";
 import type { BooleanOrCallback } from "@ariakit/core/utils/types";
 import type { DisclosureContentOptions } from "../disclosure/disclosure-content.js";
 import type { FocusableOptions } from "../focusable/focusable.js";
 import type { PortalOptions } from "../portal/portal.js";
-import type { As, Component, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { DialogStore } from "./dialog-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `Dialog` component.
  * @see https://ariakit.org/components/dialog
@@ -15,8 +17,8 @@ import type { DialogStore } from "./dialog-store.js";
  * <Role {...props}>Dialog</Role>
  * ```
  */
-export declare const useDialog: import("../utils/types.js").Hook<DialogOptions<"div">>;
-export declare function createDialogComponent<T extends DialogOptions>(Component: Component<T>, useProviderContext?: () => DialogStore | undefined): Component<T>;
+export declare const useDialog: import("../utils/types.js").Hook<"div", DialogOptions<"div">>;
+export declare function createDialogComponent<T extends DialogOptions>(Component: FC<T>, useProviderContext?: () => DialogStore | undefined): (props: T) => import("react/jsx-runtime").JSX.Element | null;
 /**
  * Renders a dialog similar to the native `dialog` element that's rendered in a
  * [`portal`](https://ariakit.org/reference/dialog#portal) by default.
@@ -37,8 +39,8 @@ export declare function createDialogComponent<T extends DialogOptions>(Component
  * </Dialog>
  * ```
  */
-export declare const Dialog: Component<DialogOptions<"div">>;
-export interface DialogOptions<T extends As = "div"> extends FocusableOptions<T>, PortalOptions<T>, DisclosureContentOptions<T> {
+export declare const Dialog: (props: DialogProps<"div">) => import("react/jsx-runtime").JSX.Element | null;
+export interface DialogOptions<T extends ElementType = TagName> extends FocusableOptions<T>, PortalOptions<T>, DisclosureContentOptions<T> {
     /**
      * Object returned by the
      * [`useDialogStore`](https://ariakit.org/reference/use-dialog-store) hook. If
@@ -139,14 +141,6 @@ export interface DialogOptions<T extends As = "div"> extends FocusableOptions<T>
      * ```
      */
     backdrop?: boolean | ReactElement<ComponentPropsWithRef<"div">> | ElementType<ComponentPropsWithRef<"div">>;
-    /**
-     * Props that will be passed to the backdrop element if
-     * [`backdrop`](https://ariakit.org/reference/dialog#backdrop) is `true`.
-     * @deprecated
-     * Use the [`backdrop`](https://ariakit.org/reference/dialog#backdrop) prop
-     * instead.
-     */
-    backdropProps?: ComponentPropsWithRef<"div">;
     /**
      * Determines if the dialog will hide when the user presses the Escape key.
      *
@@ -261,4 +255,5 @@ export interface DialogOptions<T extends As = "div"> extends FocusableOptions<T>
      */
     finalFocus?: HTMLElement | RefObject<HTMLElement> | null;
 }
-export type DialogProps<T extends As = "div"> = Props<DialogOptions<T>>;
+export type DialogProps<T extends ElementType = TagName> = Props<T, DialogOptions<T>>;
+export {};

package/esm/dialog/dialog.js

@@ -3,9 +3,9 @@ import {
   Dialog,
   createDialogComponent,
   useDialog
-} from "../__chunks/NERBASET.js";
-import "../__chunks/LWHPHW7Q.js";
-import "../__chunks/TQYOGOE2.js";
+} from "../__chunks/KXSO5EFT.js";
+import "../__chunks/3N4FFVWW.js";
+import "../__chunks/NOYDL3YS.js";
 import "../__chunks/BULCTPRV.js";
 import "../__chunks/6BJGLK2C.js";
 import "../__chunks/CS347UVZ.js";
@@ -18,22 +18,22 @@ import "../__chunks/OOBDFMJL.js";
 import "../__chunks/X6WIMZJE.js";
 import "../__chunks/677M2CI3.js";
 import "../__chunks/6GXEOXGT.js";
-import "../__chunks/HPP6CWMY.js";
+import "../__chunks/WCIYB4YS.js";
 import "../__chunks/UYRJLDVS.js";
-import "../__chunks/JPXNJYSO.js";
-import "../__chunks/CHKJ74UC.js";
+import "../__chunks/CK3UW3AQ.js";
+import "../__chunks/WKWX2XLD.js";
 import "../__chunks/7452U3HH.js";
 import "../__chunks/XPF5GU3Q.js";
-import "../__chunks/FSFPRQFR.js";
-import "../__chunks/CLE7NTOY.js";
-import "../__chunks/G6BJYYBK.js";
-import "../__chunks/OAYFXAQ2.js";
-import "../__chunks/KK7H3W2B.js";
+import "../__chunks/CBTO7DFZ.js";
+import "../__chunks/RQZGFHI2.js";
+import "../__chunks/XXVAHUAO.js";
+import "../__chunks/J55AVALY.js";
+import "../__chunks/WAZE6NXP.js";
 import "../__chunks/SHA3WOPI.js";
-import "../__chunks/BG6HZDS7.js";
-import "../__chunks/3ORBWXWF.js";
-import "../__chunks/ZSELSBRM.js";
-import "../__chunks/SFCBA2JZ.js";
+import "../__chunks/IFT5JEUU.js";
+import "../__chunks/5M6RSQEC.js";
+import "../__chunks/I62TROYO.js";
+import "../__chunks/HZJ2XALY.js";
 import "../__chunks/EKQEJRUF.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";

package/esm/dialog/utils/disable-tree.js

@@ -2,7 +2,7 @@
 import {
   disableTree,
   disableTreeOutside
-} from "../../__chunks/TQYOGOE2.js";
+} from "../../__chunks/NOYDL3YS.js";
 import "../../__chunks/BULCTPRV.js";
 import "../../__chunks/MKDDWKFK.js";
 import "../../__chunks/72E5EPFF.js";

package/esm/disclosure/disclosure-content.d.ts

@@ -1,5 +1,8 @@
-import type { As, Options, Props } from "../utils/types.js";
+import type { ElementType } from "react";
+import type { Options, Props } from "../utils/types.js";
 import type { DisclosureStore } from "./disclosure-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 export declare function isHidden(mounted: boolean, hidden?: boolean | null, alwaysVisible?: boolean | null): boolean;
 /**
  * Returns props to create a `DislosureContent` component.
@@ -12,7 +15,7 @@ export declare function isHidden(mounted: boolean, hidden?: boolean | null, alwa
  * <Role {...props}>Content</Role>
  * ```
  */
-export declare const useDisclosureContent: import("../utils/types.js").Hook<DisclosureContentOptions<"div">>;
+export declare const useDisclosureContent: import("../utils/types.js").Hook<"div", DisclosureContentOptions<"div">>;
 /**
  * Renders an element that can be shown or hidden by a
  * [`Disclosure`](https://ariakit.org/components/disclosure) component.
@@ -25,8 +28,8 @@ export declare const useDisclosureContent: import("../utils/types.js").Hook<Disc
  * </DisclosureProvider>
  * ```
  */
-export declare const DisclosureContent: import("../utils/types.js").Component<DisclosureContentOptions<"div">>;
-export interface DisclosureContentOptions<T extends As = "div"> extends Options<T> {
+export declare const DisclosureContent: ({ unmountOnHide, ...props }: DisclosureContentProps) => import("react/jsx-runtime").JSX.Element | null;
+export interface DisclosureContentOptions<_T extends ElementType = TagName> extends Options {
     /**
      * Object returned by the
      * [`useDisclosureStore`](https://ariakit.org/reference/use-disclosure-store)
@@ -74,4 +77,5 @@ export interface DisclosureContentOptions<T extends As = "div"> extends Options<
      */
     unmountOnHide?: boolean;
 }
-export type DisclosureContentProps<T extends As = "div"> = Props<DisclosureContentOptions<T>>;
+export type DisclosureContentProps<T extends ElementType = TagName> = Props<T, DisclosureContentOptions<T>>;
+export {};

package/esm/disclosure/disclosure-content.js

@@ -3,10 +3,10 @@ import {
   DisclosureContent,
   isHidden,
   useDisclosureContent
-} from "../__chunks/CLE7NTOY.js";
-import "../__chunks/G6BJYYBK.js";
-import "../__chunks/OAYFXAQ2.js";
-import "../__chunks/3ORBWXWF.js";
+} from "../__chunks/RQZGFHI2.js";
+import "../__chunks/XXVAHUAO.js";
+import "../__chunks/J55AVALY.js";
+import "../__chunks/5M6RSQEC.js";
 import "../__chunks/EKQEJRUF.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";

package/esm/disclosure/disclosure-context.js

@@ -5,8 +5,8 @@ import {
   useDisclosureContext,
   useDisclosureProviderContext,
   useDisclosureScopedContext
-} from "../__chunks/OAYFXAQ2.js";
-import "../__chunks/3ORBWXWF.js";
+} from "../__chunks/J55AVALY.js";
+import "../__chunks/5M6RSQEC.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";
 import "../__chunks/4R3V3JGP.js";

package/esm/disclosure/disclosure-provider.js

@@ -1,11 +1,11 @@
 "use client";
 import {
   DisclosureContextProvider
-} from "../__chunks/OAYFXAQ2.js";
-import "../__chunks/3ORBWXWF.js";
+} from "../__chunks/J55AVALY.js";
+import "../__chunks/5M6RSQEC.js";
 import {
   useDisclosureStore
-} from "../__chunks/SFCBA2JZ.js";
+} from "../__chunks/HZJ2XALY.js";
 import "../__chunks/EKQEJRUF.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";

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

@@ -1,6 +1,8 @@
 import * as Core from "@ariakit/core/disclosure/disclosure-store";
 import type { Store } from "../utils/store.js";
-export declare function useDisclosureStoreProps<T extends Core.DisclosureStore>(store: T, update: () => void, props: DisclosureStoreProps): T;
+export declare function useDisclosureStoreProps<T extends Core.DisclosureStore>(store: T, update: () => void, props: DisclosureStoreProps): T & {
+    disclosure: DisclosureStore | null | undefined;
+};
 /**
  * Creates a disclosure store to control the state of
  * [Disclosure](https://ariakit.org/components/disclosure) components.
@@ -16,7 +18,7 @@ export declare function useDisclosureStoreProps<T extends Core.DisclosureStore>(
 export declare function useDisclosureStore(props?: DisclosureStoreProps): DisclosureStore;
 export interface DisclosureStoreState extends Core.DisclosureStoreState {
 }
-export interface DisclosureStoreFunctions extends Core.DisclosureStoreFunctions {
+export interface DisclosureStoreFunctions extends Pick<DisclosureStoreOptions, "disclosure">, Omit<Core.DisclosureStoreFunctions, "disclosure"> {
 }
 export interface DisclosureStoreOptions extends Core.DisclosureStoreOptions {
     /**
@@ -35,8 +37,19 @@ export interface DisclosureStoreOptions extends Core.DisclosureStoreOptions {
      * const disclosure = useDisclosureStore({ setMounted });
      */
     setMounted?: (mounted: DisclosureStoreState["mounted"]) => void;
+    /**
+     * A reference to another disclosure store that controls another disclosure
+     * component to keep them in sync. Element states like `contentElement` and
+     * `disclosureElement` won't be synced. For that, use the
+     * [`store`](https://ariakit.org/reference/disclosure-provider#store) prop
+     * instead.
+     *
+     * Live examples:
+     * - [Command Menu](https://ariakit.org/examples/dialog-combobox-command-menu)
+     */
+    disclosure?: DisclosureStore | null;
 }
-export interface DisclosureStoreProps extends DisclosureStoreOptions, Core.DisclosureStoreProps {
+export interface DisclosureStoreProps extends DisclosureStoreOptions, Omit<Core.DisclosureStoreProps, "disclosure"> {
 }
-export interface DisclosureStore extends DisclosureStoreFunctions, Store<Core.DisclosureStore> {
+export interface DisclosureStore extends DisclosureStoreFunctions, Omit<Store<Core.DisclosureStore>, "disclosure"> {
 }

package/esm/disclosure/disclosure-store.js

@@ -2,7 +2,7 @@
 import {
   useDisclosureStore,
   useDisclosureStoreProps
-} from "../__chunks/SFCBA2JZ.js";
+} from "../__chunks/HZJ2XALY.js";
 import "../__chunks/EKQEJRUF.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";

package/esm/disclosure/disclosure.d.ts

@@ -1,8 +1,10 @@
-import type { MouseEvent } from "react";
+import type { ElementType, MouseEvent } from "react";
 import type { BooleanOrCallback } from "@ariakit/core/utils/types";
 import type { ButtonOptions } from "../button/button.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { DisclosureStore } from "./disclosure-store.js";
+declare const TagName = "button";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `Disclosure` component.
  * @see https://ariakit.org/components/disclosure
@@ -14,7 +16,7 @@ import type { DisclosureStore } from "./disclosure-store.js";
  * <DisclosureContent store={store}>Content</DisclosureContent>
  * ```
  */
-export declare const useDisclosure: import("../utils/types.js").Hook<DisclosureOptions<"button">>;
+export declare const useDisclosure: import("../utils/types.js").Hook<"button", DisclosureOptions<"button">>;
 /**
  * Renders an element that controls the visibility of a
  * [`DisclosureContent`](https://ariakit.org/reference/disclosure-content)
@@ -28,8 +30,8 @@ export declare const useDisclosure: import("../utils/types.js").Hook<DisclosureO
  * </DisclosureProvider>
  * ```
  */
-export declare const Disclosure: import("../utils/types.js").Component<DisclosureOptions<"button">>;
-export interface DisclosureOptions<T extends As = "button"> extends ButtonOptions<T> {
+export declare const Disclosure: (props: DisclosureProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface DisclosureOptions<T extends ElementType = TagName> extends ButtonOptions<T> {
     /**
      * Object returned by the
      * [`useDisclosureStore`](https://ariakit.org/reference/use-disclosure-store)
@@ -50,4 +52,5 @@ export interface DisclosureOptions<T extends As = "button"> extends ButtonOption
      */
     toggleOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;
 }
-export type DisclosureProps<T extends As = "button"> = Props<DisclosureOptions<T>>;
+export type DisclosureProps<T extends ElementType = TagName> = Props<T, DisclosureOptions<T>>;
+export {};

package/esm/disclosure/disclosure.js

@@ -2,13 +2,13 @@
 import {
   Disclosure,
   useDisclosure
-} from "../__chunks/BHEJ6NUH.js";
-import "../__chunks/VDNZBO4W.js";
-import "../__chunks/NWCBQ4CV.js";
-import "../__chunks/OAYFXAQ2.js";
-import "../__chunks/KK7H3W2B.js";
+} from "../__chunks/AFNONYRE.js";
+import "../__chunks/JJ3MV4KB.js";
+import "../__chunks/KSZPJCUA.js";
+import "../__chunks/J55AVALY.js";
+import "../__chunks/WAZE6NXP.js";
 import "../__chunks/SHA3WOPI.js";
-import "../__chunks/3ORBWXWF.js";
+import "../__chunks/5M6RSQEC.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";
 import "../__chunks/4R3V3JGP.js";

package/esm/focus-trap/focus-trap-region.d.ts

@@ -1,4 +1,7 @@
-import type { As, Options, Props } from "../utils/types.js";
+import type { ElementType } from "react";
+import type { Options, Props } from "../utils/types.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `FocusTrapRegion` component.
  * @see https://ariakit.org/components/focus-trap-region
@@ -8,7 +11,7 @@ import type { As, Options, Props } from "../utils/types.js";
  * <Role {...props} />
  * ```
  */
-export declare const useFocusTrapRegion: import("../utils/types.js").Hook<FocusTrapRegionOptions<"div">>;
+export declare const useFocusTrapRegion: import("../utils/types.js").Hook<"div", FocusTrapRegionOptions<"div">>;
 /**
  * Renders a wrapper element that traps the focus inside it when the
  * [`enabled`](https://ariakit.org/reference/focus-trap-region#enabled) prop is
@@ -23,12 +26,13 @@ export declare const useFocusTrapRegion: import("../utils/types.js").Hook<FocusT
  * </FocusTrapRegion>
  * ```
  */
-export declare const FocusTrapRegion: import("../utils/types.js").Component<FocusTrapRegionOptions<"div">>;
-export interface FocusTrapRegionOptions<T extends As = "div"> extends Options<T> {
+export declare const FocusTrapRegion: (props: FocusTrapRegionProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface FocusTrapRegionOptions<_T extends ElementType = TagName> extends Options {
     /**
      * If true, it will trap the focus in the region.
      * @default false
      */
     enabled?: boolean;
 }
-export type FocusTrapRegionProps<T extends As = "div"> = Props<FocusTrapRegionOptions<T>>;
+export type FocusTrapRegionProps<T extends ElementType = TagName> = Props<T, FocusTrapRegionOptions<T>>;
+export {};

package/esm/focus-trap/focus-trap-region.js

@@ -1,13 +1,13 @@
 "use client";
 import {
   FocusTrap
-} from "../__chunks/CHKJ74UC.js";
-import "../__chunks/BG6HZDS7.js";
+} from "../__chunks/WKWX2XLD.js";
+import "../__chunks/IFT5JEUU.js";
 import {
-  createComponent,
   createElement,
-  createHook
-} from "../__chunks/3ORBWXWF.js";
+  createHook,
+  forwardRef
+} from "../__chunks/5M6RSQEC.js";
 import {
   useMergeRefs,
   useWrapElement
@@ -22,9 +22,11 @@ import {
 // src/focus-trap/focus-trap-region.tsx
 import { useRef } from "react";
 import { getAllTabbableIn } from "@ariakit/core/utils/focus";
+import { removeUndefinedValues } from "@ariakit/core/utils/misc";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var TagName = "div";
 var useFocusTrapRegion = createHook(
-  (_a) => {
+  function useFocusTrapRegion2(_a) {
     var _b = _a, { enabled = false } = _b, props = __objRest(_b, ["enabled"]);
     const ref = useRef(null);
     props = useWrapElement(
@@ -67,18 +69,13 @@ var useFocusTrapRegion = createHook(
     props = __spreadProps(__spreadValues({}, props), {
       ref: useMergeRefs(ref, props.ref)
     });
-    return props;
+    return removeUndefinedValues(props);
   }
 );
-var FocusTrapRegion = createComponent(
-  (props) => {
-    const htmlProps = useFocusTrapRegion(props);
-    return createElement("div", htmlProps);
-  }
-);
-if (process.env.NODE_ENV !== "production") {
-  FocusTrapRegion.displayName = "FocusTrapRegion";
-}
+var FocusTrapRegion = forwardRef(function FocusTrapRegion2(props) {
+  const htmlProps = useFocusTrapRegion(props);
+  return createElement(TagName, htmlProps);
+});
 export {
   FocusTrapRegion,
   useFocusTrapRegion

package/esm/focus-trap/focus-trap.d.ts

@@ -1,5 +1,8 @@
-import type { As, Props } from "../utils/types.js";
+import type { ElementType } from "react";
+import type { Props } from "../utils/types.js";
 import type { VisuallyHiddenOptions } from "../visually-hidden/visually-hidden.js";
+declare const TagName = "span";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `FocusTrap` component.
  * @see https://ariakit.org/components/focus-trap
@@ -9,7 +12,7 @@ import type { VisuallyHiddenOptions } from "../visually-hidden/visually-hidden.j
  * <Role {...props} />
  * ```
  */
-export declare const useFocusTrap: import("../utils/types.js").Hook<FocusTrapOptions<"span">>;
+export declare const useFocusTrap: import("../utils/types.js").Hook<"span", FocusTrapOptions<"span">>;
 /**
  * Renders a focus trap element.
  * @see https://ariakit.org/components/focus-trap
@@ -18,6 +21,7 @@ export declare const useFocusTrap: import("../utils/types.js").Hook<FocusTrapOpt
  * <FocusTrap onFocus={focusSomethingElse} />
  * ```
  */
-export declare const FocusTrap: import("../utils/types.js").Component<FocusTrapOptions<"span">>;
-export type FocusTrapOptions<T extends As = "span"> = VisuallyHiddenOptions<T>;
-export type FocusTrapProps<T extends As = "span"> = Props<FocusTrapOptions<T>>;
+export declare const FocusTrap: (props: FocusTrapProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export type FocusTrapOptions<T extends ElementType = TagName> = VisuallyHiddenOptions<T>;
+export type FocusTrapProps<T extends ElementType = TagName> = Props<T, FocusTrapOptions<T>>;
+export {};