@ariakit/react-core 0.3.0 → 0.3.2

package/esm/combobox/combobox.d.ts

@@ -25,31 +25,38 @@ export declare const useCombobox: import("../utils/types.js").Hook<ComboboxOptio
  * @see https://ariakit.org/components/combobox
  * @example
  * ```jsx
- * const combobox = useComboboxStore();
- * <Combobox store={combobox} />
- * <ComboboxPopover store={combobox}>
- *   <ComboboxItem value="Apple" />
- *   <ComboboxItem value="Banana" />
- *   <ComboboxItem value="Orange" />
- * </ComboboxPopover>
+ * <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` hook.
+     * 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` prop:
-     * - If `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` is `list` or `none`, the first item is automatically
-     *   focused when the popup opens, but the input value doesn't change.
+     * 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)
@@ -57,26 +64,39 @@ export interface ComboboxOptions<T extends As = "input"> extends CompositeOption
      * - [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` and whether the input
-     * value will temporarily change based on the active item. If `defaultList` or
-     * `list` are provided, this will be set to `list` by default, otherwise it'll
-     * default to `none`.
-     * - `both`: the items will be filtered based on `value` and the input value
-     *   will temporarily change based on the active item.
-     * - `list`: the items will be filtered based on `value` and the input value
-     *   will NOT change based on the active item.
-     * - `inline`: the items are static, that is, they won't be filtered based on
-     *   `value`, but the input value will temporarily change based on the active
-     *   item.
+     * 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"]>;
     /**
@@ -105,8 +125,9 @@ export interface ComboboxOptions<T extends As = "input"> extends CompositeOption
      */
     setValueOnChange?: BooleanOrCallback<ChangeEvent<HTMLElement>>;
     /**
-     * Whether the combobox list/popover should be shown when the input is
-     * clicked.
+     * 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
@@ -114,15 +135,15 @@ export interface ComboboxOptions<T extends As = "input"> extends CompositeOption
      * @default true
      * @example
      * ```jsx
-     * const combobox = useComboboxStore();
-     * const canShow = combobox.useState((state) => state.value.length > 1);
-     * <Combobox store={combobox} showOnMouseDown={canShow} />
+     * <Combobox showOnMouseDown={value.length > 1} />
      * ```
      */
     showOnMouseDown?: BooleanOrCallback<MouseEvent<HTMLElement>>;
     /**
-     * Whether the combobox list/popover should be shown when the user presses
-     * the arrow up or down keys while focusing on the combobox input element.
+     * 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
@@ -130,9 +151,7 @@ export interface ComboboxOptions<T extends As = "input"> extends CompositeOption
      * @default true
      * @example
      * ```jsx
-     * const combobox = useComboboxStore();
-     * const canShow = combobox.useState((state) => state.value.length > 1);
-     * <Combobox store={combobox} showOnKeyDown={canShow} />
+     * <Combobox showOnKeyDown={value.length > 1} />
      * ```
      */
     showOnKeyDown?: BooleanOrCallback<ReactKeyboardEvent<HTMLElement>>;

package/esm/composite/composite-container.js

@@ -1,12 +1,12 @@
 import {
   CompositeContainer,
   useCompositeContainer
-} from "../__chunks/U47NFJA3.js";
+} from "../__chunks/IZ6ZARCP.js";
 import "../__chunks/OXPV2NBK.js";
 import "../__chunks/5C7J4IAS.js";
 import "../__chunks/74KKBFVP.js";
 import "../__chunks/CFEUKV6C.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/composite/composite-item.js

@@ -1,7 +1,7 @@
 import {
   CompositeItem,
   useCompositeItem
-} from "../__chunks/6TWF32ML.js";
+} from "../__chunks/72OJKUSZ.js";
 import "../__chunks/LND6SMHN.js";
 import "../__chunks/XIA3HAXM.js";
 import "../__chunks/OXPV2NBK.js";
@@ -10,7 +10,7 @@ import "../__chunks/74KKBFVP.js";
 import "../__chunks/M4OAD5XF.js";
 import "../__chunks/BMLNRUFQ.js";
 import "../__chunks/CFEUKV6C.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/composite/composite-overflow-disclosure.js

@@ -7,7 +7,7 @@ import "../__chunks/4FNI7F6H.js";
 import "../__chunks/QPWEKAWF.js";
 import {
   useCompositeItem
-} from "../__chunks/6TWF32ML.js";
+} from "../__chunks/72OJKUSZ.js";
 import "../__chunks/LND6SMHN.js";
 import "../__chunks/XIA3HAXM.js";
 import "../__chunks/OXPV2NBK.js";
@@ -23,7 +23,7 @@ import {
   createElement,
   createHook
 } from "../__chunks/CFEUKV6C.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/XXO3VVQU.js";
 import {
   useEvent,
   useMergeRefs

package/esm/composite/composite-overflow-store.js

@@ -1,11 +1,11 @@
 import {
   usePopoverStoreProps
-} from "../__chunks/DORFNB2S.js";
-import "../__chunks/6X2TPJLY.js";
-import "../__chunks/UHPQRTV4.js";
+} from "../__chunks/H2BG4QDT.js";
+import "../__chunks/UY3UQ4QI.js";
+import "../__chunks/A2ONBKVT.js";
 import {
   useStore
-} from "../__chunks/L3AX6U5E.js";
+} from "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/composite/composite-overflow.js

@@ -1,8 +1,8 @@
 import {
   usePopover
-} from "../__chunks/XWFU333Y.js";
-import "../__chunks/D4PXCBCI.js";
-import "../__chunks/HJPDTCDL.js";
+} from "../__chunks/GP4UGJIZ.js";
+import "../__chunks/4RP654JS.js";
+import "../__chunks/W575AF63.js";
 import "../__chunks/PLOINBVB.js";
 import "../__chunks/HAVCR65N.js";
 import "../__chunks/62DFK33R.js";
@@ -35,8 +35,8 @@ import {
   createElement,
   createHook
 } from "../__chunks/CFEUKV6C.js";
-import "../__chunks/UHPQRTV4.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/A2ONBKVT.js";
+import "../__chunks/XXO3VVQU.js";
 import {
   useEvent
 } from "../__chunks/J7Q2EO23.js";

package/esm/composite/composite-provider.js

@@ -1,13 +1,13 @@
 import {
   useCompositeStore
-} from "../__chunks/FGP6QO3O.js";
-import "../__chunks/JEQRR7AL.js";
+} from "../__chunks/WGAKICTY.js";
+import "../__chunks/NWDF5QDV.js";
 import {
   CompositeContextProvider
 } from "../__chunks/5C7J4IAS.js";
 import "../__chunks/74KKBFVP.js";
 import "../__chunks/CFEUKV6C.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/composite/composite-renderer.js

@@ -1,15 +1,15 @@
 import {
   CompositeRenderer,
   useCompositeRenderer
-} from "../__chunks/43SODXOT.js";
+} from "../__chunks/C5JX5C3O.js";
 import {
   getCollectionRendererItem,
   getCollectionRendererItemId
-} from "../__chunks/XIRNSMZD.js";
+} from "../__chunks/3HFOFZP4.js";
 import "../__chunks/5C7J4IAS.js";
 import "../__chunks/74KKBFVP.js";
 import "../__chunks/CFEUKV6C.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/composite/composite-store.js

@@ -1,9 +1,9 @@
 import {
   useCompositeStore,
   useCompositeStoreProps
-} from "../__chunks/FGP6QO3O.js";
-import "../__chunks/JEQRR7AL.js";
-import "../__chunks/L3AX6U5E.js";
+} from "../__chunks/WGAKICTY.js";
+import "../__chunks/NWDF5QDV.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/dialog/dialog-backdrop.js

@@ -1,6 +1,6 @@
 import {
   DialogBackdrop
-} from "../__chunks/HJPDTCDL.js";
+} from "../__chunks/W575AF63.js";
 import "../__chunks/KGDYSCOM.js";
 import "../__chunks/IXXFVVA2.js";
 import "../__chunks/5M4ITSXL.js";
@@ -10,8 +10,8 @@ import "../__chunks/3D7ZB3CS.js";
 import "../__chunks/5YYGDU4E.js";
 import "../__chunks/56KWVYDN.js";
 import "../__chunks/CFEUKV6C.js";
-import "../__chunks/UHPQRTV4.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/A2ONBKVT.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/dialog/dialog-provider.js

@@ -5,9 +5,9 @@ import "../__chunks/56KWVYDN.js";
 import "../__chunks/CFEUKV6C.js";
 import {
   useDialogStore
-} from "../__chunks/6X2TPJLY.js";
-import "../__chunks/UHPQRTV4.js";
-import "../__chunks/L3AX6U5E.js";
+} from "../__chunks/UY3UQ4QI.js";
+import "../__chunks/A2ONBKVT.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/dialog/dialog-store.js

@@ -1,9 +1,9 @@
 import {
   useDialogStore,
   useDialogStoreProps
-} from "../__chunks/6X2TPJLY.js";
-import "../__chunks/UHPQRTV4.js";
-import "../__chunks/L3AX6U5E.js";
+} from "../__chunks/UY3UQ4QI.js";
+import "../__chunks/A2ONBKVT.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/dialog/dialog.js

@@ -1,8 +1,8 @@
 import {
   Dialog,
   useDialog
-} from "../__chunks/D4PXCBCI.js";
-import "../__chunks/HJPDTCDL.js";
+} from "../__chunks/4RP654JS.js";
+import "../__chunks/W575AF63.js";
 import "../__chunks/PLOINBVB.js";
 import "../__chunks/HAVCR65N.js";
 import "../__chunks/62DFK33R.js";
@@ -30,8 +30,8 @@ import "../__chunks/M4OAD5XF.js";
 import "../__chunks/BMLNRUFQ.js";
 import "../__chunks/6XXSNRNX.js";
 import "../__chunks/CFEUKV6C.js";
-import "../__chunks/UHPQRTV4.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/A2ONBKVT.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

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

@@ -18,15 +18,20 @@ export declare const useDisclosureContent: import("../utils/types.js").Hook<Disc
  * @see https://ariakit.org/components/disclosure
  * @example
  * ```jsx
- * const disclosure = useDisclosureStore();
- * <Disclosure store={disclosure}>Disclosure</Disclosure>
- * <DisclosureContent store={disclosure}>Content</DisclosureContent>
+ * <DisclosureProvider>
+ *   <Disclosure>Disclosure</Disclosure>
+ *   <DisclosureContent>Content</DisclosureContent>
+ * </DisclosureProvider>
  * ```
  */
 export declare const DisclosureContent: import("../utils/types.js").Component<DisclosureContentOptions<"div">>;
 export interface DisclosureContentOptions<T extends As = "div"> extends Options<T> {
     /**
-     * Object returned by the `useDisclosureStore` hook.
+     * Object returned by the
+     * [`useDisclosureStore`](https://ariakit.org/reference/use-disclosure-store)
+     * hook. If not provided, the closest
+     * [`DisclosureProvider`](https://ariakit.org/reference/disclosure-provider)
+     * component's context will be used.
      */
     store?: DisclosureStore;
     /**

package/esm/disclosure/disclosure-provider.js

@@ -4,8 +4,8 @@ import {
 import "../__chunks/CFEUKV6C.js";
 import {
   useDisclosureStore
-} from "../__chunks/UHPQRTV4.js";
-import "../__chunks/L3AX6U5E.js";
+} from "../__chunks/A2ONBKVT.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

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

@@ -1,7 +1,6 @@
-import type { DependencyList } from "react";
 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, deps?: DependencyList): T;
+export declare function useDisclosureStoreProps<T extends Core.DisclosureStore>(store: T, update: () => void, props: DisclosureStoreProps): T;
 /**
  * Creates a disclosure store.
  * @see https://ariakit.org/components/disclosure
@@ -24,6 +23,14 @@ export interface DisclosureStoreOptions extends Core.DisclosureStoreOptions {
      * const disclosure = useDisclosureStore({ open, setOpen });
      */
     setOpen?: (open: DisclosureStoreState["open"]) => void;
+    /**
+     * A callback that gets called when the `mounted` state changes.
+     * @param mounted The new mounted value.
+     * @example
+     * const [mounted, setMounted] = useState(false);
+     * const disclosure = useDisclosureStore({ setMounted });
+     */
+    setMounted?: (mounted: DisclosureStoreState["mounted"]) => void;
 }
 export type DisclosureStoreProps = DisclosureStoreOptions & Core.DisclosureStoreProps;
 export type DisclosureStore = DisclosureStoreFunctions & Store<Core.DisclosureStore>;

package/esm/disclosure/disclosure-store.js

@@ -1,8 +1,8 @@
 import {
   useDisclosureStore,
   useDisclosureStoreProps
-} from "../__chunks/UHPQRTV4.js";
-import "../__chunks/L3AX6U5E.js";
+} from "../__chunks/A2ONBKVT.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import "../__chunks/PNRLI7OV.js";

package/esm/disclosure/disclosure.d.ts

@@ -21,20 +21,27 @@ export declare const useDisclosure: import("../utils/types.js").Hook<DisclosureO
  * @see https://ariakit.org/components/disclosure
  * @example
  * ```jsx
- * const disclosure = useDisclosureStore();
- * <Disclosure store={disclosure}>Disclosure</Disclosure>
- * <DisclosureContent store={disclosure}>Content</DisclosureContent>
+ * <DisclosureProvider>
+ *   <Disclosure>Disclosure</Disclosure>
+ *   <DisclosureContent>Content</DisclosureContent>
+ * </DisclosureProvider>
  * ```
  */
 export declare const Disclosure: import("../utils/types.js").Component<DisclosureOptions<"button">>;
 export interface DisclosureOptions<T extends As = "button"> extends ButtonOptions<T> {
     /**
-     * Object returned by the `useDisclosureStore` hook.
+     * Object returned by the
+     * [`useDisclosureStore`](https://ariakit.org/reference/use-disclosure-store)
+     * hook. If not provided, the closest
+     * [`DisclosureProvider`](https://ariakit.org/reference/disclosure-provider)
+     * component's context will be used.
      */
     store?: DisclosureStore;
     /**
-     * Determines whether `store.toggle()` will be called on click. This is useful
-     * if you want to handle the toggle logic yourself.
+     * Determines whether
+     * [`toggle`](https://ariakit.org/reference/use-disclosure-store#toggle) will
+     * be called on click. This is useful if you want to handle the toggle logic
+     * yourself.
      * @default true
      */
     toggleOnClick?: BooleanOrCallback<MouseEvent<HTMLElement>>;

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

@@ -22,7 +22,11 @@ export declare const useFormCheckbox: import("../utils/types.js").Hook<FormCheck
  * @see https://ariakit.org/components/form
  * @example
  * ```jsx
- * const form = useFormStore({ defaultValues: { acceptTerms: false } });
+ * const form = useFormStore({
+ *   defaultValues: {
+ *     acceptTerms: false,
+ *   },
+ * });
  * <Form store={form}>
  *   <label>
  *     <FormCheckbox name={form.names.acceptTerms} />

package/esm/form/form-checkbox.js

@@ -6,10 +6,10 @@ import {
 } from "../__chunks/NJS632IW.js";
 import {
   useCheckbox
-} from "../__chunks/665VBEVH.js";
+} from "../__chunks/HGW6FZYU.js";
 import {
   useCheckboxStore
-} from "../__chunks/TUPK6PWU.js";
+} from "../__chunks/KZMKUBQH.js";
 import "../__chunks/ICL2YIES.js";
 import "../__chunks/M5KYRTQG.js";
 import "../__chunks/LND6SMHN.js";
@@ -22,7 +22,7 @@ import {
   createHook,
   createMemoComponent
 } from "../__chunks/CFEUKV6C.js";
-import "../__chunks/L3AX6U5E.js";
+import "../__chunks/XXO3VVQU.js";
 import "../__chunks/J7Q2EO23.js";
 import "../__chunks/CP3U4HPL.js";
 import {

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

@@ -22,7 +22,11 @@ export declare const useFormDescription: import("../utils/types.js").Hook<FormDe
  * @see https://ariakit.org/components/form
  * @example
  * ```jsx
- * const form = useFormStore({ defaultValues: { password: "" } });
+ * const form = useFormStore({
+ *   defaultValues: {
+ *     password: "",
+ *   },
+ * });
  * <Form store={form}>
  *   <FormLabel name={form.names.password}>Password</FormLabel>
  *   <FormInput name={form.names.password} type="password" />
@@ -35,8 +39,11 @@ export declare const useFormDescription: import("../utils/types.js").Hook<FormDe
 export declare const FormDescription: import("../utils/types.js").Component<FormDescriptionOptions<"div">>;
 export interface FormDescriptionOptions<T extends As = "div"> extends CollectionItemOptions<T> {
     /**
-     * Object returned by the `useFormStore` hook. If not provided, the parent
-     * `Form` component's context will be used.
+     * Object returned by the
+     * [`useFormStore`](https://ariakit.org/reference/use-form-store) hook. If not
+     * provided, the closest [`Form`](https://ariakit.org/reference/form) or
+     * [`FormProvider`](https://ariakit.org/reference/form-provider) components'
+     * context will be used.
      */
     store?: FormStore;
     /**

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

@@ -30,7 +30,11 @@ export declare const useFormError: import("../utils/types.js").Hook<FormErrorOpt
  * @see https://ariakit.org/components/form
  * @example
  * ```jsx
- * const form = useFormStore({ defaultValues: { email: "" } });
+ * const form = useFormStore({
+ *   defaultValues: {
+ *     email: "",
+ *   },
+ * });
  *
  * form.useValidate(() => {
  *   if (!form.values.email) {
@@ -48,8 +52,11 @@ export declare const useFormError: import("../utils/types.js").Hook<FormErrorOpt
 export declare const FormError: import("../utils/types.js").Component<FormErrorOptions<"div">>;
 export interface FormErrorOptions<T extends As = "div"> extends CollectionItemOptions<T> {
     /**
-     * Object returned by the `useFormStore` hook. If not provided, the parent
-     * `Form` component's context will be used.
+     * Object returned by the
+     * [`useFormStore`](https://ariakit.org/reference/use-form-store) hook. If not
+     * provided, the closest [`Form`](https://ariakit.org/reference/form) or
+     * [`FormProvider`](https://ariakit.org/reference/form-provider) components'
+     * context will be used.
      */
     store?: FormStore;
     /**

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

@@ -30,21 +30,26 @@ import type { FormStore } from "./form-store.js";
  */
 export declare const useFormField: import("../utils/types.js").Hook<FormFieldOptions<"input">>;
 /**
- * Renders a form field. Unlike `FormInput`, this component doesn't
- * automatically pass the `value` and `onChange` props down to the underlying
- * element. This is so we can use it not only for native form elements but also
- * for custom components whose value is not controlled by the native `value` and
- * `onChange` props.
+ * Renders a form field. Unlike
+ * [`FormInput`](https://ariakit.org/reference/form-input), this component
+ * doesn't automatically pass the `value` and `onChange` props down to the
+ * underlying element. This is so we can use it not only for native form
+ * elements but also for custom components whose value is not controlled by the
+ * native `value` and `onChange` props.
  * @see https://ariakit.org/components/form
  * @example
  * ```jsx
- * const form = useFormStore({ defaultValues: { content: "" } });
+ * const form = useFormStore({
+ *   defaultValues: {
+ *     content: "",
+ *   },
+ * });
+ *
  * const value = form.useValue(form.names.content);
  *
  * <Form store={form}>
  *   <FormLabel name={form.names.content}>Content</FormLabel>
  *   <FormField
- *     {...props}
  *     value={value}
  *     onChange={(value) => form.setValue(form.names.content, value)}
  *     render={<Editor />}
@@ -55,8 +60,11 @@ export declare const useFormField: import("../utils/types.js").Hook<FormFieldOpt
 export declare const FormField: import("../utils/types.js").Component<FormFieldOptions<"input">>;
 export interface FormFieldOptions<T extends As = "input"> extends CollectionItemOptions<T> {
     /**
-     * Object returned by the `useFormStore` hook. If not provided, the parent
-     * `Form` component's context will be used.
+     * Object returned by the
+     * [`useFormStore`](https://ariakit.org/reference/use-form-store) hook. If not
+     * provided, the closest [`Form`](https://ariakit.org/reference/form) or
+     * [`FormProvider`](https://ariakit.org/reference/form-provider) components'
+     * context will be used.
      */
     store?: FormStore;
     /**