@ariakit/react-core 0.3.14 → 0.4.0

package/esm/form/form-error.js

@@ -1,16 +1,17 @@
 "use client";
 import {
   useFormContext
-} from "../__chunks/V4ZFXDFK.js";
+} from "../__chunks/GEIG6TES.js";
 import {
   useCollectionItem
-} from "../__chunks/UH3I23HL.js";
-import "../__chunks/4UUKJZ4V.js";
+} from "../__chunks/7YKLTEOQ.js";
+import "../__chunks/MADQZZRL.js";
 import {
   createElement,
   createHook,
-  createMemoComponent
-} from "../__chunks/3ORBWXWF.js";
+  forwardRef,
+  memo
+} from "../__chunks/5M6RSQEC.js";
 import {
   useId,
   useMergeRefs
@@ -25,9 +26,18 @@ import {
 // src/form/form-error.ts
 import { useCallback, useRef } from "react";
 import { invariant } from "@ariakit/core/utils/misc";
+var TagName = "div";
 var useFormError = createHook(
-  (_a) => {
-    var _b = _a, { store, name: nameProp, getItem: getItemProp } = _b, props = __objRest(_b, ["store", "name", "getItem"]);
+  function useFormError2(_a) {
+    var _b = _a, {
+      store,
+      name: nameProp,
+      getItem: getItemProp
+    } = _b, props = __objRest(_b, [
+      "store",
+      "name",
+      "getItem"
+    ]);
     const context = useFormContext();
     store = store || context;
     invariant(
@@ -66,13 +76,12 @@ var useFormError = createHook(
     return props;
   }
 );
-var FormError = createMemoComponent((props) => {
-  const htmlProps = useFormError(props);
-  return createElement("div", htmlProps);
-});
-if (process.env.NODE_ENV !== "production") {
-  FormError.displayName = "FormError";
-}
+var FormError = memo(
+  forwardRef(function FormError2(props) {
+    const htmlProps = useFormError(props);
+    return createElement(TagName, htmlProps);
+  })
+);
 export {
   FormError,
   useFormError

package/esm/form/form-field.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 { FormControlOptions } from "./form-control.js";
+declare const TagName = "input";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `FormField` component. Unlike `useFormInput`, this
  * hook doesn't automatically returns the `value` and `onChange` props. This is
@@ -24,7 +27,7 @@ import type { FormControlOptions } from "./form-control.js";
  * </Form>
  * ```
  */
-export declare const useFormField: import("../utils/types.js").Hook<FormFieldOptions<"input">>;
+export declare const useFormField: import("../utils/types.js").Hook<"input", FormFieldOptions<"input">>;
 /**
  * Abstract component that renders a form field. Unlike
  * [`FormInput`](https://ariakit.org/reference/form-input), this component
@@ -60,7 +63,8 @@ export declare const useFormField: import("../utils/types.js").Hook<FormFieldOpt
  * </Form>
  * ```
  */
-export declare const FormField: import("../utils/types.js").Component<FormFieldOptions<"input">>;
-export interface FormFieldOptions<T extends As = "input"> extends FormControlOptions<T> {
+export declare const FormField: (props: FormFieldProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface FormFieldOptions<T extends ElementType = TagName> extends FormControlOptions<T> {
 }
-export type FormFieldProps<T extends As = "input"> = Props<FormFieldOptions<T>>;
+export type FormFieldProps<T extends ElementType = TagName> = Props<T, FormFieldOptions<T>>;
+export {};

package/esm/form/form-field.js

@@ -1,30 +1,33 @@
 "use client";
 import {
   useFormControl
-} from "../__chunks/4GO43MST.js";
-import "../__chunks/V4ZFXDFK.js";
-import "../__chunks/UH3I23HL.js";
-import "../__chunks/4UUKJZ4V.js";
+} from "../__chunks/SP3GKE3F.js";
+import "../__chunks/GEIG6TES.js";
+import "../__chunks/7YKLTEOQ.js";
+import "../__chunks/MADQZZRL.js";
 import {
   createElement,
   createHook,
-  createMemoComponent
-} from "../__chunks/3ORBWXWF.js";
+  forwardRef,
+  memo
+} from "../__chunks/5M6RSQEC.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";
 import "../__chunks/4R3V3JGP.js";
 
 // src/form/form-field.ts
-var useFormField = createHook((props) => {
-  return useFormControl(props);
-});
-var FormField = createMemoComponent((props) => {
-  const htmlProps = useFormField(props);
-  return createElement("input", htmlProps);
-});
-if (process.env.NODE_ENV !== "production") {
-  FormField.displayName = "FormField";
-}
+var TagName = "input";
+var useFormField = createHook(
+  function useFormField2(props) {
+    return useFormControl(props);
+  }
+);
+var FormField = memo(
+  forwardRef(function FormField2(props) {
+    const htmlProps = useFormField(props);
+    return createElement(TagName, htmlProps);
+  })
+);
 export {
   FormField,
   useFormField

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

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { GroupLabelOptions } from "../group/group-label.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { FormStore } from "./form-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `FormGroupLabel` component. This hook must be used
  * in a component that's wrapped with `FormGroup` so the `aria-labelledby` prop
@@ -13,7 +16,7 @@ import type { FormStore } from "./form-store.js";
  * <Role {...props}>Label</Role>
  * ```
  */
-export declare const useFormGroupLabel: import("../utils/types.js").Hook<FormGroupLabelOptions<"div">>;
+export declare const useFormGroupLabel: import("../utils/types.js").Hook<"div", FormGroupLabelOptions<"div">>;
 /**
  * Renders a label in a form group. This component must be wrapped with the
  * [`FormGroup`](https://ariakit.org/reference/form-group) or
@@ -40,8 +43,8 @@ export declare const useFormGroupLabel: import("../utils/types.js").Hook<FormGro
  * </Form>
  * ```
  */
-export declare const FormGroupLabel: import("../utils/types.js").Component<FormGroupLabelOptions<"div">>;
-export interface FormGroupLabelOptions<T extends As = "div"> extends GroupLabelOptions<T> {
+export declare const FormGroupLabel: (props: FormGroupLabelProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface FormGroupLabelOptions<T extends ElementType = TagName> extends GroupLabelOptions<T> {
     /**
      * Object returned by the
      * [`useFormStore`](https://ariakit.org/reference/use-form-store) hook. If not
@@ -51,4 +54,5 @@ export interface FormGroupLabelOptions<T extends As = "div"> extends GroupLabelO
      */
     store?: FormStore;
 }
-export type FormGroupLabelProps<T extends As = "div"> = Props<FormGroupLabelOptions<T>>;
+export type FormGroupLabelProps<T extends ElementType = TagName> = Props<T, FormGroupLabelOptions<T>>;
+export {};

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

@@ -1,13 +1,13 @@
 "use client";
 import {
   useGroupLabel
-} from "../__chunks/NT7GEZQU.js";
+} from "../__chunks/TH2YTBRW.js";
 import "../__chunks/3X3MDQGM.js";
 import {
-  createComponent,
   createElement,
-  createHook
-} from "../__chunks/3ORBWXWF.js";
+  createHook,
+  forwardRef
+} from "../__chunks/5M6RSQEC.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";
 import {
@@ -15,22 +15,18 @@ import {
 } from "../__chunks/4R3V3JGP.js";
 
 // src/form/form-group-label.ts
+var TagName = "div";
 var useFormGroupLabel = createHook(
-  (_a) => {
+  function useFormGroupLabel2(_a) {
     var _b = _a, { store } = _b, props = __objRest(_b, ["store"]);
     props = useGroupLabel(props);
     return props;
   }
 );
-var FormGroupLabel = createComponent(
-  (props) => {
-    const htmlProps = useFormGroupLabel(props);
-    return createElement("div", htmlProps);
-  }
-);
-if (process.env.NODE_ENV !== "production") {
-  FormGroupLabel.displayName = "FormGroupLabel";
-}
+var FormGroupLabel = forwardRef(function FormGroupLabel2(props) {
+  const htmlProps = useFormGroupLabel(props);
+  return createElement(TagName, htmlProps);
+});
 export {
   FormGroupLabel,
   useFormGroupLabel

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

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { GroupOptions } from "../group/group.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { FormStore } from "./form-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `FormGroup` component.
  * @see https://ariakit.org/components/form
@@ -15,7 +18,7 @@ import type { FormStore } from "./form-store.js";
  * </Form>
  * ```
  */
-export declare const useFormGroup: import("../utils/types.js").Hook<FormGroupOptions<"div">>;
+export declare const useFormGroup: import("../utils/types.js").Hook<"div", FormGroupOptions<"div">>;
 /**
  * Renders a group element for form controls. The
  * [`FormGroupLabel`](https://ariakit.org/reference/form-group-label) component
@@ -42,8 +45,8 @@ export declare const useFormGroup: import("../utils/types.js").Hook<FormGroupOpt
  * </Form>
  * ```
  */
-export declare const FormGroup: import("../utils/types.js").Component<FormGroupOptions<"div">>;
-export interface FormGroupOptions<T extends As = "div"> extends GroupOptions<T> {
+export declare const FormGroup: (props: FormGroupProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface FormGroupOptions<T extends ElementType = TagName> extends GroupOptions<T> {
     /**
      * Object returned by the
      * [`useFormStore`](https://ariakit.org/reference/use-form-store) hook. If not
@@ -53,4 +56,5 @@ export interface FormGroupOptions<T extends As = "div"> extends GroupOptions<T>
      */
     store?: FormStore;
 }
-export type FormGroupProps<T extends As = "div"> = Props<FormGroupOptions<T>>;
+export type FormGroupProps<T extends ElementType = TagName> = Props<T, FormGroupOptions<T>>;
+export {};

package/esm/form/form-group.js

@@ -2,10 +2,10 @@
 import {
   FormGroup,
   useFormGroup
-} from "../__chunks/P5SOPKIM.js";
-import "../__chunks/R2QZ3KXH.js";
+} from "../__chunks/K3QOUHVI.js";
+import "../__chunks/CWDOOAGR.js";
 import "../__chunks/3X3MDQGM.js";
-import "../__chunks/3ORBWXWF.js";
+import "../__chunks/5M6RSQEC.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";
 import "../__chunks/4R3V3JGP.js";

package/esm/form/form-input.d.ts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { FocusableOptions } from "../focusable/focusable.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { FormControlOptions } from "./form-control.js";
+declare const TagName = "input";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `FormInput` component. Unlike `useFormControl`, this
  * hook returns the `value` and `onChange` props that can be passed to a native
@@ -16,7 +19,7 @@ import type { FormControlOptions } from "./form-control.js";
  * </Form>
  * ```
  */
-export declare const useFormInput: import("../utils/types.js").Hook<FormInputOptions<"input">>;
+export declare const useFormInput: import("../utils/types.js").Hook<"input", FormInputOptions<"input">>;
 /**
  * Renders a form input. Unlike
  * [`FormControl`](https://ariakit.org/reference/form-control), this component
@@ -37,7 +40,8 @@ export declare const useFormInput: import("../utils/types.js").Hook<FormInputOpt
  * </Form>
  * ```
  */
-export declare const FormInput: import("../utils/types.js").Component<FormInputOptions<"input">>;
-export interface FormInputOptions<T extends As = "input"> extends FormControlOptions<T>, FocusableOptions<T> {
+export declare const FormInput: (props: FormInputProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface FormInputOptions<T extends ElementType = TagName> extends FormControlOptions<T>, FocusableOptions<T> {
 }
-export type FormInputProps<T extends As = "input"> = Props<FormInputOptions<T>>;
+export type FormInputProps<T extends ElementType = TagName> = Props<T, FormInputOptions<T>>;
+export {};

package/esm/form/form-input.js

@@ -1,21 +1,22 @@
 "use client";
 import {
   useFormControl
-} from "../__chunks/4GO43MST.js";
+} from "../__chunks/SP3GKE3F.js";
 import {
   useFormContext
-} from "../__chunks/V4ZFXDFK.js";
-import "../__chunks/UH3I23HL.js";
-import "../__chunks/4UUKJZ4V.js";
+} from "../__chunks/GEIG6TES.js";
+import "../__chunks/7YKLTEOQ.js";
+import "../__chunks/MADQZZRL.js";
 import {
   useFocusable
-} from "../__chunks/KK7H3W2B.js";
+} from "../__chunks/VA234QKF.js";
 import "../__chunks/SHA3WOPI.js";
 import {
   createElement,
   createHook,
-  createMemoComponent
-} from "../__chunks/3ORBWXWF.js";
+  forwardRef,
+  memo
+} from "../__chunks/5M6RSQEC.js";
 import {
   useEvent
 } from "../__chunks/6O5OEQGF.js";
@@ -28,8 +29,9 @@ import {
 
 // src/form/form-input.ts
 import { invariant } from "@ariakit/core/utils/misc";
+var TagName = "input";
 var useFormInput = createHook(
-  (_a) => {
+  function useFormInput2(_a) {
     var _b = _a, { store, name: nameProp } = _b, props = __objRest(_b, ["store", "name"]);
     const context = useFormContext();
     store = store || context;
@@ -56,13 +58,12 @@ var useFormInput = createHook(
     return props;
   }
 );
-var FormInput = createMemoComponent((props) => {
-  const htmlProps = useFormInput(props);
-  return createElement("input", htmlProps);
-});
-if (process.env.NODE_ENV !== "production") {
-  FormInput.displayName = "FormInput";
-}
+var FormInput = memo(
+  forwardRef(function FormInput2(props) {
+    const htmlProps = useFormInput(props);
+    return createElement(TagName, htmlProps);
+  })
+);
 export {
   FormInput,
   useFormInput

package/esm/form/form-label.d.ts

@@ -1,7 +1,10 @@
+import type { ElementType } from "react";
 import type { StringLike } from "@ariakit/core/form/types";
 import type { CollectionItemOptions } from "../collection/collection-item.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { FormStore } from "./form-store.js";
+declare const TagName = "label";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `FormLabel` component. If the field is not a native
  * input, select or textarea element, the hook will return props to render a
@@ -19,7 +22,7 @@ import type { FormStore } from "./form-store.js";
  * </Form>
  * ```
  */
-export declare const useFormLabel: import("../utils/types.js").Hook<FormLabelOptions<"label">>;
+export declare const useFormLabel: import("../utils/types.js").Hook<"label", FormLabelOptions<"label">>;
 /**
  * Renders a label associated with a form field, even if the field is not a
  * native input.
@@ -44,8 +47,8 @@ export declare const useFormLabel: import("../utils/types.js").Hook<FormLabelOpt
  * </Form>
  * ```
  */
-export declare const FormLabel: import("../utils/types.js").Component<FormLabelOptions<"label">>;
-export interface FormLabelOptions<T extends As = "label"> extends CollectionItemOptions<T> {
+export declare const FormLabel: (props: FormLabelProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface FormLabelOptions<T extends ElementType = TagName> extends CollectionItemOptions<T> {
     /**
      * Object returned by the
      * [`useFormStore`](https://ariakit.org/reference/use-form-store) hook. If not
@@ -66,4 +69,5 @@ export interface FormLabelOptions<T extends As = "label"> extends CollectionItem
      */
     name: StringLike;
 }
-export type FormLabelProps<T extends As = "label"> = Props<FormLabelOptions<T>>;
+export type FormLabelProps<T extends ElementType = TagName> = Props<T, FormLabelOptions<T>>;
+export {};

package/esm/form/form-label.js

@@ -1,16 +1,17 @@
 "use client";
 import {
   useFormContext
-} from "../__chunks/V4ZFXDFK.js";
+} from "../__chunks/GEIG6TES.js";
 import {
   useCollectionItem
-} from "../__chunks/UH3I23HL.js";
-import "../__chunks/4UUKJZ4V.js";
+} from "../__chunks/7YKLTEOQ.js";
+import "../__chunks/MADQZZRL.js";
 import {
   createElement,
   createHook,
-  createMemoComponent
-} from "../__chunks/3ORBWXWF.js";
+  forwardRef,
+  memo
+} from "../__chunks/5M6RSQEC.js";
 import {
   useEvent,
   useId,
@@ -29,12 +30,21 @@ import { useCallback, useRef } from "react";
 import { getFirstTabbableIn } from "@ariakit/core/utils/focus";
 import { invariant } from "@ariakit/core/utils/misc";
 import { jsx } from "react/jsx-runtime";
+var TagName = "label";
 function supportsNativeLabel(tagName) {
   return tagName === "input" || tagName === "textarea" || tagName === "select" || tagName === "meter" || tagName === "progress";
 }
 var useFormLabel = createHook(
-  (_a) => {
-    var _b = _a, { store, name: nameProp, getItem: getItemProp } = _b, props = __objRest(_b, ["store", "name", "getItem"]);
+  function useFormLabel2(_a) {
+    var _b = _a, {
+      store,
+      name: nameProp,
+      getItem: getItemProp
+    } = _b, props = __objRest(_b, [
+      "store",
+      "name",
+      "getItem"
+    ]);
     const context = useFormContext();
     store = store || context;
     invariant(
@@ -94,13 +104,12 @@ var useFormLabel = createHook(
     return props;
   }
 );
-var FormLabel = createMemoComponent((props) => {
-  const htmlProps = useFormLabel(props);
-  return createElement("label", htmlProps);
-});
-if (process.env.NODE_ENV !== "production") {
-  FormLabel.displayName = "FormLabel";
-}
+var FormLabel = memo(
+  forwardRef(function FormLabel2(props) {
+    const htmlProps = useFormLabel(props);
+    return createElement(TagName, htmlProps);
+  })
+);
 export {
   FormLabel,
   useFormLabel

package/esm/form/form-provider.js

@@ -4,10 +4,10 @@ import {
 } from "../__chunks/SS66VZAQ.js";
 import {
   FormContextProvider
-} from "../__chunks/V4ZFXDFK.js";
+} from "../__chunks/GEIG6TES.js";
 import "../__chunks/Y6GYTNQ2.js";
-import "../__chunks/4UUKJZ4V.js";
-import "../__chunks/3ORBWXWF.js";
+import "../__chunks/MADQZZRL.js";
+import "../__chunks/5M6RSQEC.js";
 import "../__chunks/EKQEJRUF.js";
 import "../__chunks/6O5OEQGF.js";
 import "../__chunks/XM66DUTO.js";

package/esm/form/form-push.d.ts

@@ -1,8 +1,11 @@
+import type { ElementType } from "react";
 import type { StringLike } from "@ariakit/core/form/types";
 import type { ButtonOptions } from "../button/button.js";
 import type { CollectionItemOptions } from "../collection/collection-item.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { FormStore } from "./form-store.js";
+declare const TagName = "button";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `FormPush` component.
  * @see https://ariakit.org/components/form
@@ -28,7 +31,7 @@ import type { FormStore } from "./form-store.js";
  * </Form>
  * ```
  */
-export declare const useFormPush: import("../utils/types.js").Hook<FormPushOptions<"button">>;
+export declare const useFormPush: import("../utils/types.js").Hook<"button", FormPushOptions<"button">>;
 /**
  * Renders a button that will push items to an array value in the form store
  * when clicked.
@@ -63,8 +66,8 @@ export declare const useFormPush: import("../utils/types.js").Hook<FormPushOptio
  * </Form>
  * ```
  */
-export declare const FormPush: import("../utils/types.js").Component<FormPushOptions<"button">>;
-export interface FormPushOptions<T extends As = "button"> extends ButtonOptions<T>, CollectionItemOptions<T> {
+export declare const FormPush: (props: FormPushProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface FormPushOptions<T extends ElementType = TagName> extends ButtonOptions<T>, CollectionItemOptions<T> {
     /**
      * Object returned by the
      * [`useFormStore`](https://ariakit.org/reference/use-form-store) hook. If not
@@ -91,4 +94,5 @@ export interface FormPushOptions<T extends As = "button"> extends ButtonOptions<
      */
     autoFocusOnClick?: boolean;
 }
-export type FormPushProps<T extends As = "button"> = Props<FormPushOptions<T>>;
+export type FormPushProps<T extends ElementType = TagName> = Props<T, FormPushOptions<T>>;
+export {};

package/esm/form/form-push.js

@@ -1,22 +1,22 @@
 "use client";
 import {
   useFormContext
-} from "../__chunks/V4ZFXDFK.js";
+} from "../__chunks/GEIG6TES.js";
 import {
   useButton
-} from "../__chunks/VDNZBO4W.js";
-import "../__chunks/NWCBQ4CV.js";
+} from "../__chunks/ID4VKXL5.js";
+import "../__chunks/ZF6ZK5BT.js";
 import {
   useCollectionItem
-} from "../__chunks/UH3I23HL.js";
-import "../__chunks/4UUKJZ4V.js";
-import "../__chunks/KK7H3W2B.js";
+} from "../__chunks/7YKLTEOQ.js";
+import "../__chunks/MADQZZRL.js";
+import "../__chunks/VA234QKF.js";
 import "../__chunks/SHA3WOPI.js";
 import {
-  createComponent,
   createElement,
-  createHook
-} from "../__chunks/3ORBWXWF.js";
+  createHook,
+  forwardRef
+} from "../__chunks/5M6RSQEC.js";
 import {
   useEvent
 } from "../__chunks/6O5OEQGF.js";
@@ -30,6 +30,7 @@ import {
 // src/form/form-push.ts
 import { useCallback, useEffect, useState } from "react";
 import { invariant } from "@ariakit/core/utils/misc";
+var TagName = "button";
 function getFirstFieldsByName(items, name) {
   if (!items)
     return [];
@@ -48,7 +49,7 @@ function getFirstFieldsByName(items, name) {
   return fields;
 }
 var useFormPush = createHook(
-  (_a) => {
+  function useFormPush2(_a) {
     var _b = _a, {
       store,
       value,
@@ -109,13 +110,10 @@ var useFormPush = createHook(
     return props;
   }
 );
-var FormPush = createComponent((props) => {
+var FormPush = forwardRef(function FormPush2(props) {
   const htmlProps = useFormPush(props);
-  return createElement("button", htmlProps);
+  return createElement(TagName, htmlProps);
 });
-if (process.env.NODE_ENV !== "production") {
-  FormPush.displayName = "FormPush";
-}
 export {
   FormPush,
   useFormPush

package/esm/form/form-radio-group.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 { FormGroupOptions } from "./form-group.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `FormRadioGroup` component.
  * @see https://ariakit.org/components/form
@@ -17,7 +20,7 @@ import type { FormGroupOptions } from "./form-group.js";
  * </Form>
  * ```
  */
-export declare const useFormRadioGroup: import("../utils/types.js").Hook<FormRadioGroupOptions<"div">>;
+export declare const useFormRadioGroup: import("../utils/types.js").Hook<"div", FormRadioGroupOptions<"div">>;
 /**
  * Renders a group element for
  * [`FormRadio`](https://ariakit.org/reference/form-radio) elements. The
@@ -43,6 +46,7 @@ export declare const useFormRadioGroup: import("../utils/types.js").Hook<FormRad
  * </Form>
  * ```
  */
-export declare const FormRadioGroup: import("../utils/types.js").Component<FormRadioGroupOptions<"div">>;
-export type FormRadioGroupOptions<T extends As = "div"> = FormGroupOptions<T>;
-export type FormRadioGroupProps<T extends As = "div"> = Props<FormRadioGroupOptions<T>>;
+export declare const FormRadioGroup: (props: FormRadioGroupProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export type FormRadioGroupOptions<T extends ElementType = TagName> = FormGroupOptions<T>;
+export type FormRadioGroupProps<T extends ElementType = TagName> = Props<T, FormRadioGroupOptions<T>>;
+export {};