@ariakit/react-core 0.3.12 → 0.3.14

package/cjs/menu/menu.d.ts

@@ -17,10 +17,16 @@ import type { MenuListOptions } from "./menu-list.jsx";
  */
 export declare const useMenu: import("../utils/types.js").Hook<MenuOptions<"div">>;
 /**
- * Renders a dropdown menu element.
+ * Renders a dropdown menu element that's controlled by a
+ * [`MenuButton`](https://ariakit.org/reference/menu-button) component.
+ *
+ * This component uses the primitive
+ * [`MenuList`](https://ariakit.org/reference/menu-list) component under the
+ * hood. It renders a popover and automatically focuses on items when the menu
+ * is shown.
  * @see https://ariakit.org/components/menu
  * @example
- * ```jsx
+ * ```jsx {3-6}
  * <MenuProvider>
  *   <MenuButton>Edit</MenuButton>
  *   <Menu>

package/cjs/menubar/menubar-provider.d.cts

@@ -1,7 +1,8 @@
 import type { ReactNode } from "react";
 import type { MenubarStoreProps } from "./menubar-store.js";
 /**
- * Provides a menubar store to Menubar components.
+ * Provides a menubar store to [Menubar](https://ariakit.org/components/menubar)
+ * components.
  * @see https://ariakit.org/components/menubar
  * @example
  * ```jsx

package/cjs/menubar/menubar-provider.d.ts

@@ -1,7 +1,8 @@
 import type { ReactNode } from "react";
 import type { MenubarStoreProps } from "./menubar-store.js";
 /**
- * Provides a menubar store to Menubar components.
+ * Provides a menubar store to [Menubar](https://ariakit.org/components/menubar)
+ * components.
  * @see https://ariakit.org/components/menubar
  * @example
  * ```jsx

package/cjs/menubar/menubar-store.d.cts

@@ -3,11 +3,13 @@ import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreStat
 import type { Store } from "../utils/store.js";
 export declare function useMenubarStoreProps<T extends Core.MenubarStore>(store: T, update: () => void, props: MenubarStoreProps): T;
 /**
- * Creates a menubar store.
+ * Creates a menubar store to control the state of
+ * [Menubar](https://ariakit.org/components/menubar) components.
  * @see https://ariakit.org/components/menubar
  * @example
  * ```jsx
  * const menu = useMenubarStore();
+ *
  * <Menubar store={menu} />
  * ```
  */

package/cjs/menubar/menubar-store.d.ts

@@ -3,11 +3,13 @@ import type { CompositeStoreFunctions, CompositeStoreOptions, CompositeStoreStat
 import type { Store } from "../utils/store.js";
 export declare function useMenubarStoreProps<T extends Core.MenubarStore>(store: T, update: () => void, props: MenubarStoreProps): T;
 /**
- * Creates a menubar store.
+ * Creates a menubar store to control the state of
+ * [Menubar](https://ariakit.org/components/menubar) components.
  * @see https://ariakit.org/components/menubar
  * @example
  * ```jsx
  * const menu = useMenubarStore();
+ *
  * <Menubar store={menu} />
  * ```
  */

package/cjs/menubar/menubar.d.cts

@@ -23,8 +23,9 @@ import type { MenubarStore, MenubarStoreProps } from "./menubar-store.js";
  */
 export declare const useMenubar: import("../utils/types.js").Hook<MenubarOptions<"div">>;
 /**
- * Renders a menu bar that may contain a group of menu items that control other
- * submenus.
+ * Renders a menubar that may contain a group of
+ * [`MenuItem`](https://ariakit.org/reference/menu-item) elements that control
+ * other submenus.
  * @see https://ariakit.org/components/menubar
  * @example
  * ```jsx

package/cjs/menubar/menubar.d.ts

@@ -23,8 +23,9 @@ import type { MenubarStore, MenubarStoreProps } from "./menubar-store.js";
  */
 export declare const useMenubar: import("../utils/types.js").Hook<MenubarOptions<"div">>;
 /**
- * Renders a menu bar that may contain a group of menu items that control other
- * submenus.
+ * Renders a menubar that may contain a group of
+ * [`MenuItem`](https://ariakit.org/reference/menu-item) elements that control
+ * other submenus.
  * @see https://ariakit.org/components/menubar
  * @example
  * ```jsx

package/cjs/popover/popover-anchor.d.cts

@@ -13,11 +13,12 @@ import type { PopoverStore } from "./popover-store.js";
  */
 export declare const usePopoverAnchor: import("../utils/types.js").Hook<PopoverAnchorOptions<"div">>;
 /**
- * Renders an element that will serve as the popover's anchor. The popover will
- * be positioned relative to this element.
+ * Renders an element that acts as the anchor for the popover. The
+ * [`Popover`](https://ariakit.org/reference/popover) component will be
+ * positioned in relation to this element.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {2}
  * <PopoverProvider>
  *   <PopoverAnchor>Anchor</PopoverAnchor>
  *   <Popover>Popover</Popover>

package/cjs/popover/popover-anchor.d.ts

@@ -13,11 +13,12 @@ import type { PopoverStore } from "./popover-store.js";
  */
 export declare const usePopoverAnchor: import("../utils/types.js").Hook<PopoverAnchorOptions<"div">>;
 /**
- * Renders an element that will serve as the popover's anchor. The popover will
- * be positioned relative to this element.
+ * Renders an element that acts as the anchor for the popover. The
+ * [`Popover`](https://ariakit.org/reference/popover) component will be
+ * positioned in relation to this element.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {2}
  * <PopoverProvider>
  *   <PopoverAnchor>Anchor</PopoverAnchor>
  *   <Popover>Popover</Popover>

package/cjs/popover/popover-arrow.d.cts

@@ -16,11 +16,12 @@ import type { PopoverStore } from "./popover-store.js";
 export declare const usePopoverArrow: import("../utils/types.js").Hook<PopoverArrowOptions<"div">>;
 /**
  * Renders an arrow inside a [`Popover`](https://ariakit.org/reference/popover)
- * component.
+ * component pointing to the anchor element.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {4}
  * <PopoverProvider>
+ *   <PopoverAnchor />
  *   <Popover>
  *     <PopoverArrow />
  *     Popover
@@ -41,6 +42,9 @@ export interface PopoverArrowOptions<T extends As = "div"> extends Options<T> {
     store?: PopoverStore;
     /**
      * The size of the arrow.
+     *
+     * Live examples:
+     * - [Selection Popover](https://ariakit.org/examples/popover-selection)
      * @default 30
      */
     size?: number;

package/cjs/popover/popover-arrow.d.ts

@@ -16,11 +16,12 @@ import type { PopoverStore } from "./popover-store.js";
 export declare const usePopoverArrow: import("../utils/types.js").Hook<PopoverArrowOptions<"div">>;
 /**
  * Renders an arrow inside a [`Popover`](https://ariakit.org/reference/popover)
- * component.
+ * component pointing to the anchor element.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {4}
  * <PopoverProvider>
+ *   <PopoverAnchor />
  *   <Popover>
  *     <PopoverArrow />
  *     Popover
@@ -41,6 +42,9 @@ export interface PopoverArrowOptions<T extends As = "div"> extends Options<T> {
     store?: PopoverStore;
     /**
      * The size of the arrow.
+     *
+     * Live examples:
+     * - [Selection Popover](https://ariakit.org/examples/popover-selection)
      * @default 30
      */
     size?: number;

package/cjs/popover/popover-description.d.cts

@@ -20,7 +20,7 @@ export declare const usePopoverDescription: import("../utils/types.js").Hook<Pop
  * prop is properly set on the popover element.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {3}
  * <PopoverProvider>
  *   <Popover>
  *     <PopoverDescription>Description</PopoverDescription>

package/cjs/popover/popover-description.d.ts

@@ -20,7 +20,7 @@ export declare const usePopoverDescription: import("../utils/types.js").Hook<Pop
  * prop is properly set on the popover element.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {3}
  * <PopoverProvider>
  *   <Popover>
  *     <PopoverDescription>Description</PopoverDescription>

package/cjs/popover/popover-disclosure-arrow.d.cts

@@ -21,7 +21,7 @@ export declare const usePopoverDisclosureArrow: import("../utils/types.js").Hook
  * component.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {4}
  * <PopoverProvider>
  *   <PopoverDisclosure>
  *     Disclosure
@@ -43,9 +43,11 @@ export interface PopoverDisclosureArrowOptions<T extends As = "span"> extends Op
      */
     store?: PopoverStore;
     /**
-     * Placement to which the arrow should point. If not provided, the parent
-     * [`PopoverDisclosure`](https://ariakit.org/reference/popover-disclosure)
-     * component's context will be used.
+     * Arrow's placement direction. If not provided, it will be inferred from the
+     * context.
+     *
+     * Live examples:
+     * - [Sliding Menu](https://ariakit.org/examples/menu-slide)
      */
     placement?: PopoverStoreState["placement"];
 }

package/cjs/popover/popover-disclosure-arrow.d.ts

@@ -21,7 +21,7 @@ export declare const usePopoverDisclosureArrow: import("../utils/types.js").Hook
  * component.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {4}
  * <PopoverProvider>
  *   <PopoverDisclosure>
  *     Disclosure
@@ -43,9 +43,11 @@ export interface PopoverDisclosureArrowOptions<T extends As = "span"> extends Op
      */
     store?: PopoverStore;
     /**
-     * Placement to which the arrow should point. If not provided, the parent
-     * [`PopoverDisclosure`](https://ariakit.org/reference/popover-disclosure)
-     * component's context will be used.
+     * Arrow's placement direction. If not provided, it will be inferred from the
+     * context.
+     *
+     * Live examples:
+     * - [Sliding Menu](https://ariakit.org/examples/menu-slide)
      */
     placement?: PopoverStoreState["placement"];
 }

package/cjs/popover/popover-disclosure.d.cts

@@ -14,10 +14,11 @@ import type { PopoverAnchorOptions } from "./popover-anchor.js";
  */
 export declare const usePopoverDisclosure: import("../utils/types.js").Hook<PopoverDisclosureOptions<"button">>;
 /**
- * Renders a button that controls the visibility of the popover when clicked.
+ * Renders a button that controls the visibility of the
+ * [`Popover`](https://ariakit.org/reference/popover) component when clicked.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {2}
  * <PopoverProvider>
  *   <PopoverDisclosure>Disclosure</PopoverDisclosure>
  *   <Popover>Popover</Popover>

package/cjs/popover/popover-disclosure.d.ts

@@ -14,10 +14,11 @@ import type { PopoverAnchorOptions } from "./popover-anchor.js";
  */
 export declare const usePopoverDisclosure: import("../utils/types.js").Hook<PopoverDisclosureOptions<"button">>;
 /**
- * Renders a button that controls the visibility of the popover when clicked.
+ * Renders a button that controls the visibility of the
+ * [`Popover`](https://ariakit.org/reference/popover) component when clicked.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {2}
  * <PopoverProvider>
  *   <PopoverDisclosure>Disclosure</PopoverDisclosure>
  *   <Popover>Popover</Popover>

package/cjs/popover/popover-dismiss.d.cts

@@ -19,7 +19,7 @@ export declare const usePopoverDismiss: import("../utils/types.js").Hook<Popover
  * [`Popover`](https://ariakit.org/reference/popover) component when clicked.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {3}
  * <PopoverProvider>
  *   <Popover>
  *     <PopoverDismiss />

package/cjs/popover/popover-dismiss.d.ts

@@ -19,7 +19,7 @@ export declare const usePopoverDismiss: import("../utils/types.js").Hook<Popover
  * [`Popover`](https://ariakit.org/reference/popover) component when clicked.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {3}
  * <PopoverProvider>
  *   <Popover>
  *     <PopoverDismiss />

package/cjs/popover/popover-heading.d.cts

@@ -20,7 +20,7 @@ export declare const usePopoverHeading: import("../utils/types.js").Hook<Popover
  * prop is properly set on the popover element.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {3}
  * <PopoverProvider>
  *   <Popover>
  *     <PopoverHeading>Heading</PopoverHeading>

package/cjs/popover/popover-heading.d.ts

@@ -20,7 +20,7 @@ export declare const usePopoverHeading: import("../utils/types.js").Hook<Popover
  * prop is properly set on the popover element.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {3}
  * <PopoverProvider>
  *   <Popover>
  *     <PopoverHeading>Heading</PopoverHeading>

package/cjs/popover/popover-provider.d.cts

@@ -1,7 +1,8 @@
 import type { ReactNode } from "react";
 import type { PopoverStoreProps } from "./popover-store.js";
 /**
- * Provides a popover store to Popover components.
+ * Provides a popover store to [Popover](https://ariakit.org/components/popover)
+ * components.
  * @see https://ariakit.org/components/popover
  * @example
  * ```jsx

package/cjs/popover/popover-provider.d.ts

@@ -1,7 +1,8 @@
 import type { ReactNode } from "react";
 import type { PopoverStoreProps } from "./popover-store.js";
 /**
- * Provides a popover store to Popover components.
+ * Provides a popover store to [Popover](https://ariakit.org/components/popover)
+ * components.
  * @see https://ariakit.org/components/popover
  * @example
  * ```jsx

package/cjs/popover/popover-store.d.cts

@@ -3,7 +3,8 @@ import type { DialogStoreFunctions, DialogStoreOptions, DialogStoreState } from
 import type { Store } from "../utils/store.js";
 export declare function usePopoverStoreProps<T extends Core.PopoverStore>(store: T, update: () => void, props: PopoverStoreProps): T;
 /**
- * Creates a popover store.
+ * Creates a popover store to control the state of
+ * [Popover](https://ariakit.org/components/popover) components.
  * @see https://ariakit.org/components/popover
  * @example
  * ```jsx

package/cjs/popover/popover-store.d.ts

@@ -3,7 +3,8 @@ import type { DialogStoreFunctions, DialogStoreOptions, DialogStoreState } from
 import type { Store } from "../utils/store.js";
 export declare function usePopoverStoreProps<T extends Core.PopoverStore>(store: T, update: () => void, props: PopoverStoreProps): T;
 /**
- * Creates a popover store.
+ * Creates a popover store to control the state of
+ * [Popover](https://ariakit.org/components/popover) components.
  * @see https://ariakit.org/components/popover
  * @example
  * ```jsx

package/cjs/popover/popover.cjs

@@ -2,10 +2,10 @@
 
 
 
-var _KDG57VZVcjs = require('../__chunks/KDG57VZV.cjs');
-require('../__chunks/EKB76T2U.cjs');
+var _OUEE5HOScjs = require('../__chunks/OUEE5HOS.cjs');
+require('../__chunks/ZL5DC555.cjs');
 require('../__chunks/WZ3DRKGP.cjs');
-require('../__chunks/NKR65BKC.cjs');
+require('../__chunks/KSPMHEYZ.cjs');
 require('../__chunks/PZL34OVO.cjs');
 require('../__chunks/344F3DYO.cjs');
 require('../__chunks/KREY6HXD.cjs');
@@ -13,11 +13,11 @@ require('../__chunks/5ZOCN23X.cjs');
 require('../__chunks/JVDUGICD.cjs');
 require('../__chunks/VV6WA3I6.cjs');
 require('../__chunks/7YLCVXZ7.cjs');
+require('../__chunks/5GTNIPQ6.cjs');
 require('../__chunks/7TN63K2T.cjs');
+require('../__chunks/V24PR4PW.cjs');
 require('../__chunks/6IUEXB4L.cjs');
 require('../__chunks/JF225FQ5.cjs');
-require('../__chunks/5GTNIPQ6.cjs');
-require('../__chunks/V24PR4PW.cjs');
 require('../__chunks/7566TIRW.cjs');
 require('../__chunks/J3OG6T3B.cjs');
 require('../__chunks/65LGW5LY.cjs');
@@ -42,4 +42,4 @@ require('../__chunks/AV6KTKLE.cjs');
 
 
 
-exports.Popover = _KDG57VZVcjs.Popover; exports.usePopover = _KDG57VZVcjs.usePopover;
+exports.Popover = _OUEE5HOScjs.Popover; exports.usePopover = _OUEE5HOScjs.usePopover;

package/cjs/popover/popover.d.cts

@@ -20,10 +20,11 @@ type AnchorRect = {
  */
 export declare const usePopover: import("../utils/types.js").Hook<PopoverOptions<"div">>;
 /**
- * Renders a popover element.
+ * Renders a popover element that's automatically positioned relative to an
+ * anchor element.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {3}
  * <PopoverProvider>
  *   <PopoverDisclosure>Disclosure</PopoverDisclosure>
  *   <Popover>Popover</Popover>
@@ -46,6 +47,7 @@ export interface PopoverOptions<T extends As = "div"> extends DialogOptions<T> {
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
+     * - [Sliding Menu](https://ariakit.org/examples/menu-slide)
      */
     wrapperProps?: HTMLAttributes<HTMLDivElement>;
     /**
@@ -71,6 +73,7 @@ export interface PopoverOptions<T extends As = "div"> extends DialogOptions<T> {
      * negative values to make the popover shift to the opposite side.
      *
      * Live examples:
+     * - [Combobox with tabs](https://ariakit.org/examples/combobox-tabs)
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Submenu](https://ariakit.org/examples/menu-nested)
      * - [Menubar](https://ariakit.org/components/menubar)
@@ -136,6 +139,9 @@ export interface PopoverOptions<T extends As = "div"> extends DialogOptions<T> {
      * The minimum padding between the popover and the viewport edge. This will be
      * exposed to CSS as
      * [`--popover-overflow-padding`](https://ariakit.org/guide/styling#--popover-overflow-padding).
+     *
+     * Live examples:
+     * - [Sliding Menu](https://ariakit.org/examples/menu-slide)
      * @default 8
      */
     overflowPadding?: number;
@@ -148,7 +154,6 @@ export interface PopoverOptions<T extends As = "div"> extends DialogOptions<T> {
      *  - [Standalone Popover](https://ariakit.org/examples/popover-standalone)
      *  - [Context menu](https://ariakit.org/examples/menu-context-menu)
      *  - [Selection Popover](https://ariakit.org/examples/popover-selection)
-     * @param anchor The anchor element.
      */
     getAnchorRect?: (anchor: HTMLElement | null) => AnchorRect | null;
     /**

package/cjs/popover/popover.d.ts

@@ -20,10 +20,11 @@ type AnchorRect = {
  */
 export declare const usePopover: import("../utils/types.js").Hook<PopoverOptions<"div">>;
 /**
- * Renders a popover element.
+ * Renders a popover element that's automatically positioned relative to an
+ * anchor element.
  * @see https://ariakit.org/components/popover
  * @example
- * ```jsx
+ * ```jsx {3}
  * <PopoverProvider>
  *   <PopoverDisclosure>Disclosure</PopoverDisclosure>
  *   <Popover>Popover</Popover>
@@ -46,6 +47,7 @@ export interface PopoverOptions<T extends As = "div"> extends DialogOptions<T> {
      *
      * Live examples:
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
+     * - [Sliding Menu](https://ariakit.org/examples/menu-slide)
      */
     wrapperProps?: HTMLAttributes<HTMLDivElement>;
     /**
@@ -71,6 +73,7 @@ export interface PopoverOptions<T extends As = "div"> extends DialogOptions<T> {
      * negative values to make the popover shift to the opposite side.
      *
      * Live examples:
+     * - [Combobox with tabs](https://ariakit.org/examples/combobox-tabs)
      * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)
      * - [Submenu](https://ariakit.org/examples/menu-nested)
      * - [Menubar](https://ariakit.org/components/menubar)
@@ -136,6 +139,9 @@ export interface PopoverOptions<T extends As = "div"> extends DialogOptions<T> {
      * The minimum padding between the popover and the viewport edge. This will be
      * exposed to CSS as
      * [`--popover-overflow-padding`](https://ariakit.org/guide/styling#--popover-overflow-padding).
+     *
+     * Live examples:
+     * - [Sliding Menu](https://ariakit.org/examples/menu-slide)
      * @default 8
      */
     overflowPadding?: number;
@@ -148,7 +154,6 @@ export interface PopoverOptions<T extends As = "div"> extends DialogOptions<T> {
      *  - [Standalone Popover](https://ariakit.org/examples/popover-standalone)
      *  - [Context menu](https://ariakit.org/examples/menu-context-menu)
      *  - [Selection Popover](https://ariakit.org/examples/popover-selection)
-     * @param anchor The anchor element.
      */
     getAnchorRect?: (anchor: HTMLElement | null) => AnchorRect | null;
     /**

package/cjs/portal/portal.d.cts

@@ -11,7 +11,21 @@ import type { As, Options, Props } from "../utils/types.js";
  */
 export declare const usePortal: import("../utils/types.js").Hook<PortalOptions<"div">>;
 /**
- * Renders an element using `ReactDOM.createPortal`.
+ * Renders an element using [React
+ * Portal](https://react.dev/reference/react-dom/createPortal).
+ *
+ * By default, the portal element is a `div` element appended to the
+ * `document.body` element. You can customize this with the
+ * [`portalElement`](https://ariakit.org/reference/portal#portalelement) prop.
+ *
+ * The
+ * [`preserveTabOrder`](https://ariakit.org/reference/portal#preservetaborder)
+ * prop allows this component to manage the tab order of the elements. It
+ * ensures the tab order remains consistent with the original location where the
+ * portal was rendered in the React tree, instead of the final location in the
+ * DOM. The
+ * [`preserveTabOrderAnchor`](https://ariakit.org/reference/portal#preservetaborderanchor)
+ * prop can specify a different location from which the tab order is preserved.
  * @see https://ariakit.org/components/portal
  * @example
  * ```jsx
@@ -71,6 +85,9 @@ export interface PortalOptions<T extends As = "div"> extends Options<T> {
      * `portalRef` is similar to `ref` but is scoped to the portal node. It's
      * useful when you need to be informed when the portal element is appended to
      * the DOM or removed from the DOM.
+     *
+     * Live examples:
+     * - [Form with Select](https://ariakit.org/examples/form-select)
      * @example
      * ```jsx
      * const [portalElement, setPortalElement] = useState(null);

package/cjs/portal/portal.d.ts

@@ -11,7 +11,21 @@ import type { As, Options, Props } from "../utils/types.js";
  */
 export declare const usePortal: import("../utils/types.js").Hook<PortalOptions<"div">>;
 /**
- * Renders an element using `ReactDOM.createPortal`.
+ * Renders an element using [React
+ * Portal](https://react.dev/reference/react-dom/createPortal).
+ *
+ * By default, the portal element is a `div` element appended to the
+ * `document.body` element. You can customize this with the
+ * [`portalElement`](https://ariakit.org/reference/portal#portalelement) prop.
+ *
+ * The
+ * [`preserveTabOrder`](https://ariakit.org/reference/portal#preservetaborder)
+ * prop allows this component to manage the tab order of the elements. It
+ * ensures the tab order remains consistent with the original location where the
+ * portal was rendered in the React tree, instead of the final location in the
+ * DOM. The
+ * [`preserveTabOrderAnchor`](https://ariakit.org/reference/portal#preservetaborderanchor)
+ * prop can specify a different location from which the tab order is preserved.
  * @see https://ariakit.org/components/portal
  * @example
  * ```jsx
@@ -71,6 +85,9 @@ export interface PortalOptions<T extends As = "div"> extends Options<T> {
      * `portalRef` is similar to `ref` but is scoped to the portal node. It's
      * useful when you need to be informed when the portal element is appended to
      * the DOM or removed from the DOM.
+     *
+     * Live examples:
+     * - [Form with Select](https://ariakit.org/examples/form-select)
      * @example
      * ```jsx
      * const [portalElement, setPortalElement] = useState(null);

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

@@ -16,15 +16,17 @@ import type { RadioStore } from "./radio-store.js";
  */
 export declare const useRadioGroup: import("../utils/types.js").Hook<RadioGroupOptions<"div">>;
 /**
- * Renders a radio group element.
+ * Renders a [`radiogroup`](https://w3c.github.io/aria/#radiogroup) element that
+ * manages a group of [`Radio`](https://ariakit.org/reference/radio) elements.
  * @see https://ariakit.org/components/radio
  * @example
  * ```jsx
- * const radio = useRadioStore();
- * <RadioGroup store={radio}>
- *   <Radio value="Apple" />
- *   <Radio value="Orange" />
- * </RadioGroup>
+ * <RadioProvider>
+ *   <RadioGroup>
+ *     <Radio value="Apple" />
+ *     <Radio value="Orange" />
+ *   </RadioGroup>
+ * </RadioProvider>
  * ```
  */
 export declare const RadioGroup: import("../utils/types.js").Component<RadioGroupOptions<"div">>;

package/cjs/radio/radio-group.d.ts

@@ -16,15 +16,17 @@ import type { RadioStore } from "./radio-store.js";
  */
 export declare const useRadioGroup: import("../utils/types.js").Hook<RadioGroupOptions<"div">>;
 /**
- * Renders a radio group element.
+ * Renders a [`radiogroup`](https://w3c.github.io/aria/#radiogroup) element that
+ * manages a group of [`Radio`](https://ariakit.org/reference/radio) elements.
  * @see https://ariakit.org/components/radio
  * @example
  * ```jsx
- * const radio = useRadioStore();
- * <RadioGroup store={radio}>
- *   <Radio value="Apple" />
- *   <Radio value="Orange" />
- * </RadioGroup>
+ * <RadioProvider>
+ *   <RadioGroup>
+ *     <Radio value="Apple" />
+ *     <Radio value="Orange" />
+ *   </RadioGroup>
+ * </RadioProvider>
  * ```
  */
 export declare const RadioGroup: import("../utils/types.js").Component<RadioGroupOptions<"div">>;

package/cjs/radio/radio-provider.d.cts

@@ -1,7 +1,8 @@
 import type { ReactNode } from "react";
 import type { RadioStoreProps } from "./radio-store.js";
 /**
- * Provides a radio store to Radio components.
+ * Provides a radio store to [Radio](https://ariakit.org/components/radio)
+ * components.
  * @see https://ariakit.org/components/radio
  * @example
  * ```jsx

package/cjs/radio/radio-provider.d.ts

@@ -1,7 +1,8 @@
 import type { ReactNode } from "react";
 import type { RadioStoreProps } from "./radio-store.js";
 /**
- * Provides a radio store to Radio components.
+ * Provides a radio store to [Radio](https://ariakit.org/components/radio)
+ * components.
  * @see https://ariakit.org/components/radio
  * @example
  * ```jsx