@ariakit/react-core 0.3.14 → 0.4.0

package/cjs/toolbar/toolbar-item.d.ts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { CompositeItemOptions } from "../composite/composite-item.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { ToolbarStore } from "./toolbar-store.js";
+declare const TagName = "button";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `ToolbarItem` component.
  * @see https://ariakit.org/components/toolbar
@@ -13,7 +16,7 @@ import type { ToolbarStore } from "./toolbar-store.js";
  * </Toolbar>
  * ```
  */
-export declare const useToolbarItem: import("../utils/types.js").Hook<ToolbarItemOptions<"button">>;
+export declare const useToolbarItem: import("../utils/types.js").Hook<"button", ToolbarItemOptions<"button">>;
 /**
  * Renders an interactive element inside a
  * [`Toolbar`](https://ariakit.org/reference/toolbar).
@@ -25,8 +28,8 @@ export declare const useToolbarItem: import("../utils/types.js").Hook<ToolbarIte
  * </Toolbar>
  * ```
  */
-export declare const ToolbarItem: import("../utils/types.js").Component<ToolbarItemOptions<"button">>;
-export interface ToolbarItemOptions<T extends As = "button"> extends CompositeItemOptions<T> {
+export declare const ToolbarItem: (props: ToolbarItemProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ToolbarItemOptions<T extends ElementType = TagName> extends CompositeItemOptions<T> {
     /**
      * Object returned by the
      * [`useToolbarStore`](https://ariakit.org/reference/use-toolbar-store) hook.
@@ -36,4 +39,5 @@ export interface ToolbarItemOptions<T extends As = "button"> extends CompositeIt
      */
     store?: ToolbarStore;
 }
-export type ToolbarItemProps<T extends As = "button"> = Props<ToolbarItemOptions<T>>;
+export type ToolbarItemProps<T extends ElementType = TagName> = Props<T, ToolbarItemOptions<T>>;
+export {};

package/cjs/toolbar/toolbar-provider.cjs

@@ -6,10 +6,10 @@ require('../__chunks/LUL2YWZ3.cjs');
 require('../__chunks/CDNJPIEG.cjs');
 
 
-var _LYIGAIJFcjs = require('../__chunks/LYIGAIJF.cjs');
-require('../__chunks/UZNYSPKP.cjs');
-require('../__chunks/BZTDJIVT.cjs');
-require('../__chunks/RNZNGEL4.cjs');
+var _VNRUW2L6cjs = require('../__chunks/VNRUW2L6.cjs');
+require('../__chunks/4XFLDG56.cjs');
+require('../__chunks/Q6CVYJBO.cjs');
+require('../__chunks/Q67LZMDT.cjs');
 require('../__chunks/OLOZ5JT2.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
@@ -19,7 +19,7 @@ require('../__chunks/AV6KTKLE.cjs');
 var _jsxruntime = require('react/jsx-runtime');
 function ToolbarProvider(props = {}) {
   const store = _KIDFNQ4Ecjs.useToolbarStore.call(void 0, props);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _LYIGAIJFcjs.ToolbarContextProvider, { value: store, children: props.children });
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _VNRUW2L6cjs.ToolbarContextProvider, { value: store, children: props.children });
 }
 
 

package/cjs/toolbar/toolbar-separator.cjs

@@ -1,18 +1,18 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _F34KLJKGcjs = require('../__chunks/F34KLJKG.cjs');
-require('../__chunks/QOD2KY3N.cjs');
+var _AIKNQVVLcjs = require('../__chunks/AIKNQVVL.cjs');
+require('../__chunks/FG4Y7VYM.cjs');
 
 
-var _LYIGAIJFcjs = require('../__chunks/LYIGAIJF.cjs');
-require('../__chunks/UZNYSPKP.cjs');
-require('../__chunks/BZTDJIVT.cjs');
+var _VNRUW2L6cjs = require('../__chunks/VNRUW2L6.cjs');
+require('../__chunks/4XFLDG56.cjs');
+require('../__chunks/Q6CVYJBO.cjs');
 
 
 
 
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
 
@@ -21,24 +21,20 @@ require('../__chunks/CJDHQUBR.cjs');
 var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
 
 // src/toolbar/toolbar-separator.ts
-var useToolbarSeparator = _RNZNGEL4cjs.createHook.call(void 0, 
-  (_a) => {
+var TagName = "hr";
+var useToolbarSeparator = _Q67LZMDTcjs.createHook.call(void 0, 
+  function useToolbarSeparator2(_a) {
     var _b = _a, { store } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store"]);
-    const context = _LYIGAIJFcjs.useToolbarContext.call(void 0, );
+    const context = _VNRUW2L6cjs.useToolbarContext.call(void 0, );
     store = store || context;
-    props = _F34KLJKGcjs.useCompositeSeparator.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
+    props = _AIKNQVVLcjs.useCompositeSeparator.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
     return props;
   }
 );
-var ToolbarSeparator = _RNZNGEL4cjs.createComponent.call(void 0, 
-  (props) => {
-    const htmlProps = useToolbarSeparator(props);
-    return _RNZNGEL4cjs.createElement.call(void 0, "hr", htmlProps);
-  }
-);
-if (process.env.NODE_ENV !== "production") {
-  ToolbarSeparator.displayName = "ToolbarSeparator";
-}
+var ToolbarSeparator = _Q67LZMDTcjs.forwardRef.call(void 0, function ToolbarSeparator2(props) {
+  const htmlProps = useToolbarSeparator(props);
+  return _Q67LZMDTcjs.createElement.call(void 0, TagName, htmlProps);
+});
 
 
 

package/cjs/toolbar/toolbar-separator.d.cts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { CompositeSeparatorOptions } from "../composite/composite-separator.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { ToolbarStore } from "./toolbar-store.js";
+declare const TagName = "hr";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `ToolbarSeparator` component.
  * @see https://ariakit.org/components/toolbar
@@ -15,7 +18,7 @@ import type { ToolbarStore } from "./toolbar-store.js";
  * </Toolbar>
  * ```
  */
-export declare const useToolbarSeparator: import("../utils/types.js").Hook<ToolbarSeparatorOptions<"hr">>;
+export declare const useToolbarSeparator: import("../utils/types.js").Hook<"hr", ToolbarSeparatorOptions<"hr">>;
 /**
  * Renders a divider between
  * [`ToolbarItem`](https://ariakit.org/reference/toolbar-item) elements.
@@ -29,8 +32,8 @@ export declare const useToolbarSeparator: import("../utils/types.js").Hook<Toolb
  * </Toolbar>
  * ```
  */
-export declare const ToolbarSeparator: import("../utils/types.js").Component<ToolbarSeparatorOptions<"hr">>;
-export interface ToolbarSeparatorOptions<T extends As = "hr"> extends CompositeSeparatorOptions<T> {
+export declare const ToolbarSeparator: (props: ToolbarSeparatorProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ToolbarSeparatorOptions<T extends ElementType = TagName> extends CompositeSeparatorOptions<T> {
     /**
      * Object returned by the
      * [`useToolbarStore`](https://ariakit.org/reference/use-toolbar-store) hook.
@@ -40,4 +43,5 @@ export interface ToolbarSeparatorOptions<T extends As = "hr"> extends CompositeS
      */
     store?: ToolbarStore;
 }
-export type ToolbarSeparatorProps<T extends As = "hr"> = Props<ToolbarSeparatorOptions<T>>;
+export type ToolbarSeparatorProps<T extends ElementType = TagName> = Props<T, ToolbarSeparatorOptions<T>>;
+export {};

package/cjs/toolbar/toolbar-separator.d.ts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { CompositeSeparatorOptions } from "../composite/composite-separator.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { ToolbarStore } from "./toolbar-store.js";
+declare const TagName = "hr";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `ToolbarSeparator` component.
  * @see https://ariakit.org/components/toolbar
@@ -15,7 +18,7 @@ import type { ToolbarStore } from "./toolbar-store.js";
  * </Toolbar>
  * ```
  */
-export declare const useToolbarSeparator: import("../utils/types.js").Hook<ToolbarSeparatorOptions<"hr">>;
+export declare const useToolbarSeparator: import("../utils/types.js").Hook<"hr", ToolbarSeparatorOptions<"hr">>;
 /**
  * Renders a divider between
  * [`ToolbarItem`](https://ariakit.org/reference/toolbar-item) elements.
@@ -29,8 +32,8 @@ export declare const useToolbarSeparator: import("../utils/types.js").Hook<Toolb
  * </Toolbar>
  * ```
  */
-export declare const ToolbarSeparator: import("../utils/types.js").Component<ToolbarSeparatorOptions<"hr">>;
-export interface ToolbarSeparatorOptions<T extends As = "hr"> extends CompositeSeparatorOptions<T> {
+export declare const ToolbarSeparator: (props: ToolbarSeparatorProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ToolbarSeparatorOptions<T extends ElementType = TagName> extends CompositeSeparatorOptions<T> {
     /**
      * Object returned by the
      * [`useToolbarStore`](https://ariakit.org/reference/use-toolbar-store) hook.
@@ -40,4 +43,5 @@ export interface ToolbarSeparatorOptions<T extends As = "hr"> extends CompositeS
      */
     store?: ToolbarStore;
 }
-export type ToolbarSeparatorProps<T extends As = "hr"> = Props<ToolbarSeparatorOptions<T>>;
+export type ToolbarSeparatorProps<T extends ElementType = TagName> = Props<T, ToolbarSeparatorOptions<T>>;
+export {};

package/cjs/toolbar/toolbar.cjs

@@ -1,7 +1,7 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _H6OLBVHAcjs = require('../__chunks/H6OLBVHA.cjs');
+var _NCXCQQBNcjs = require('../__chunks/NCXCQQBN.cjs');
 require('../__chunks/6ZZYUFPW.cjs');
 
 
@@ -11,16 +11,16 @@ require('../__chunks/CDNJPIEG.cjs');
 
 
 
-var _LYIGAIJFcjs = require('../__chunks/LYIGAIJF.cjs');
-require('../__chunks/UZNYSPKP.cjs');
-require('../__chunks/BZTDJIVT.cjs');
-require('../__chunks/Z3GCTNW4.cjs');
+var _VNRUW2L6cjs = require('../__chunks/VNRUW2L6.cjs');
+require('../__chunks/4XFLDG56.cjs');
+require('../__chunks/Q6CVYJBO.cjs');
+require('../__chunks/5QD55NKL.cjs');
 require('../__chunks/75KXQZJX.cjs');
 
 
 
 
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
 require('../__chunks/OLOZ5JT2.cjs');
 
 
@@ -33,8 +33,9 @@ var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
 
 // src/toolbar/toolbar.tsx
 var _jsxruntime = require('react/jsx-runtime');
-var useToolbar = _RNZNGEL4cjs.createHook.call(void 0, 
-  (_a) => {
+var TagName = "div";
+var useToolbar = _Q67LZMDTcjs.createHook.call(void 0, 
+  function useToolbar2(_a) {
     var _b = _a, {
       store: storeProp,
       orientation: orientationProp,
@@ -48,7 +49,7 @@ var useToolbar = _RNZNGEL4cjs.createHook.call(void 0,
       "focusLoop",
       "rtl"
     ]);
-    const context = _LYIGAIJFcjs.useToolbarProviderContext.call(void 0, );
+    const context = _VNRUW2L6cjs.useToolbarProviderContext.call(void 0, );
     storeProp = storeProp || context;
     const store = _KIDFNQ4Ecjs.useToolbarStore.call(void 0, {
       store: storeProp,
@@ -62,24 +63,21 @@ var useToolbar = _RNZNGEL4cjs.createHook.call(void 0,
     );
     props = _EO6LS72Hcjs.useWrapElement.call(void 0, 
       props,
-      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _LYIGAIJFcjs.ToolbarScopedContextProvider, { value: store, children: element }),
+      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _VNRUW2L6cjs.ToolbarScopedContextProvider, { value: store, children: element }),
       [store]
     );
     props = _AV6KTKLEcjs.__spreadValues.call(void 0, {
       role: "toolbar",
       "aria-orientation": orientation
     }, props);
-    props = _H6OLBVHAcjs.useComposite.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
+    props = _NCXCQQBNcjs.useComposite.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store }, props));
     return props;
   }
 );
-var Toolbar = _RNZNGEL4cjs.createComponent.call(void 0, (props) => {
+var Toolbar = _Q67LZMDTcjs.forwardRef.call(void 0, function Toolbar2(props) {
   const htmlProps = useToolbar(props);
-  return _RNZNGEL4cjs.createElement.call(void 0, "div", htmlProps);
+  return _Q67LZMDTcjs.createElement.call(void 0, TagName, htmlProps);
 });
-if (process.env.NODE_ENV !== "production") {
-  Toolbar.displayName = "Toolbar";
-}
 
 
 

package/cjs/toolbar/toolbar.d.cts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { CompositeOptions } from "../composite/composite.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { ToolbarStore, ToolbarStoreProps } from "./toolbar-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `Toolbar` component.
  * @see https://ariakit.org/components/toolbar
@@ -14,7 +17,7 @@ import type { ToolbarStore, ToolbarStoreProps } from "./toolbar-store.js";
  * </Role>
  * ```
  */
-export declare const useToolbar: import("../utils/types.js").Hook<ToolbarOptions<"div">>;
+export declare const useToolbar: import("../utils/types.js").Hook<"div", ToolbarOptions<"div">>;
 /**
  * Renders a toolbar element that groups interactive elements together.
  * @see https://ariakit.org/components/toolbar
@@ -26,8 +29,8 @@ export declare const useToolbar: import("../utils/types.js").Hook<ToolbarOptions
  * </Toolbar>
  * ```
  */
-export declare const Toolbar: import("../utils/types.js").Component<ToolbarOptions<"div">>;
-export interface ToolbarOptions<T extends As = "div"> extends CompositeOptions<T>, Pick<ToolbarStoreProps, "focusLoop" | "orientation" | "rtl" | "virtualFocus"> {
+export declare const Toolbar: (props: ToolbarProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ToolbarOptions<T extends ElementType = TagName> extends CompositeOptions<T>, Pick<ToolbarStoreProps, "focusLoop" | "orientation" | "rtl" | "virtualFocus"> {
     /**
      * Object returned by the
      * [`useToolbarStore`](https://ariakit.org/reference/use-toolbar-store) hook.
@@ -39,4 +42,5 @@ export interface ToolbarOptions<T extends As = "div"> extends CompositeOptions<T
      */
     store?: ToolbarStore;
 }
-export type ToolbarProps<T extends As = "div"> = Props<ToolbarOptions<T>>;
+export type ToolbarProps<T extends ElementType = TagName> = Props<T, ToolbarOptions<T>>;
+export {};

package/cjs/toolbar/toolbar.d.ts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { CompositeOptions } from "../composite/composite.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { ToolbarStore, ToolbarStoreProps } from "./toolbar-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `Toolbar` component.
  * @see https://ariakit.org/components/toolbar
@@ -14,7 +17,7 @@ import type { ToolbarStore, ToolbarStoreProps } from "./toolbar-store.js";
  * </Role>
  * ```
  */
-export declare const useToolbar: import("../utils/types.js").Hook<ToolbarOptions<"div">>;
+export declare const useToolbar: import("../utils/types.js").Hook<"div", ToolbarOptions<"div">>;
 /**
  * Renders a toolbar element that groups interactive elements together.
  * @see https://ariakit.org/components/toolbar
@@ -26,8 +29,8 @@ export declare const useToolbar: import("../utils/types.js").Hook<ToolbarOptions
  * </Toolbar>
  * ```
  */
-export declare const Toolbar: import("../utils/types.js").Component<ToolbarOptions<"div">>;
-export interface ToolbarOptions<T extends As = "div"> extends CompositeOptions<T>, Pick<ToolbarStoreProps, "focusLoop" | "orientation" | "rtl" | "virtualFocus"> {
+export declare const Toolbar: (props: ToolbarProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface ToolbarOptions<T extends ElementType = TagName> extends CompositeOptions<T>, Pick<ToolbarStoreProps, "focusLoop" | "orientation" | "rtl" | "virtualFocus"> {
     /**
      * Object returned by the
      * [`useToolbarStore`](https://ariakit.org/reference/use-toolbar-store) hook.
@@ -39,4 +42,5 @@ export interface ToolbarOptions<T extends As = "div"> extends CompositeOptions<T
      */
     store?: ToolbarStore;
 }
-export type ToolbarProps<T extends As = "div"> = Props<ToolbarOptions<T>>;
+export type ToolbarProps<T extends ElementType = TagName> = Props<T, ToolbarOptions<T>>;
+export {};

package/cjs/tooltip/tooltip-anchor.cjs

@@ -1,21 +1,21 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _TGTVGYEZcjs = require('../__chunks/TGTVGYEZ.cjs');
+var _YEAKVHCKcjs = require('../__chunks/YEAKVHCK.cjs');
 
 
-var _M5JJ43ATcjs = require('../__chunks/M5JJ43AT.cjs');
-require('../__chunks/3W6FH6JK.cjs');
-require('../__chunks/UVBBMANL.cjs');
-require('../__chunks/F2A2ZQDB.cjs');
-require('../__chunks/S6UU7NA4.cjs');
-require('../__chunks/Z3GCTNW4.cjs');
+var _V7ENWBONcjs = require('../__chunks/V7ENWBON.cjs');
+require('../__chunks/M5PQIWTW.cjs');
+require('../__chunks/FNVFJ5AF.cjs');
+require('../__chunks/OLPMMKKO.cjs');
+require('../__chunks/XRJBC7H7.cjs');
+require('../__chunks/5QD55NKL.cjs');
 require('../__chunks/75KXQZJX.cjs');
 
 
 
 
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
 
 
 var _EO6LS72Hcjs = require('../__chunks/EO6LS72H.cjs');
@@ -30,13 +30,14 @@ var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
 var _react = require('react');
 var _misc = require('@ariakit/core/utils/misc');
 var _store = require('@ariakit/core/utils/store');
+var TagName = "div";
 var globalStore = _store.createStore.call(void 0, {
   activeStore: null
 });
-var useTooltipAnchor = _RNZNGEL4cjs.createHook.call(void 0, 
-  (_a) => {
+var useTooltipAnchor = _Q67LZMDTcjs.createHook.call(void 0, 
+  function useTooltipAnchor2(_a) {
     var _b = _a, { store, showOnHover = true } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store", "showOnHover"]);
-    const context = _M5JJ43ATcjs.useTooltipProviderContext.call(void 0, );
+    const context = _V7ENWBONcjs.useTooltipProviderContext.call(void 0, );
     store = store || context;
     _misc.invariant.call(void 0, 
       store,
@@ -99,16 +100,15 @@ var useTooltipAnchor = _RNZNGEL4cjs.createHook.call(void 0,
       return (_a2 = state.contentElement) == null ? void 0 : _a2.id;
     });
     props = _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
-      "aria-labelledby": type === "label" ? contentId : void 0,
-      "aria-describedby": type === "description" ? contentId : void 0
+      "aria-labelledby": type === "label" ? contentId : void 0
     }, props), {
       onMouseEnter,
       onFocusVisible,
       onBlur
     });
-    props = _TGTVGYEZcjs.useHovercardAnchor.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
+    props = _YEAKVHCKcjs.useHovercardAnchor.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {
       store,
-      showOnHover: (event) => {
+      showOnHover(event) {
         if (!canShowOnHoverRef.current)
           return false;
         if (_misc.isFalsyBooleanCallback.call(void 0, showOnHover, event))
@@ -123,13 +123,10 @@ var useTooltipAnchor = _RNZNGEL4cjs.createHook.call(void 0,
     return props;
   }
 );
-var TooltipAnchor = _RNZNGEL4cjs.createComponent.call(void 0, (props) => {
+var TooltipAnchor = _Q67LZMDTcjs.forwardRef.call(void 0, function TooltipAnchor2(props) {
   const htmlProps = useTooltipAnchor(props);
-  return _RNZNGEL4cjs.createElement.call(void 0, "div", htmlProps);
+  return _Q67LZMDTcjs.createElement.call(void 0, TagName, htmlProps);
 });
-if (process.env.NODE_ENV !== "production") {
-  TooltipAnchor.displayName = "TooltipAnchor";
-}
 
 
 

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

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { HovercardAnchorOptions } from "../hovercard/hovercard-anchor.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { TooltipStore } from "./tooltip-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `TooltipAnchor` component.
  * @see https://ariakit.org/components/tooltip
@@ -12,11 +15,16 @@ import type { TooltipStore } from "./tooltip-store.js";
  * <Tooltip store={store}>Tooltip</Tooltip>
  * ```
  */
-export declare const useTooltipAnchor: import("../utils/types.js").Hook<TooltipAnchorOptions<"div">>;
+export declare const useTooltipAnchor: import("../utils/types.js").Hook<"div", TooltipAnchorOptions<"div">>;
 /**
  * Renders a reference element for a
  * [`Tooltip`](https://ariakit.org/reference/tooltip), which is triggered by
  * focusing or hovering over the anchor.
+ *
+ * The tooltip is strictly for visual purposes. It's your responsibility to
+ * ensure the anchor element has an accessible name. See [Tooltip anchors must
+ * have accessible
+ * names](https://ariakit.org/components/tooltip#tooltip-anchors-must-have-accessible-names)
  * @see https://ariakit.org/components/tooltip
  * @example
  * ```jsx {2}
@@ -26,8 +34,8 @@ export declare const useTooltipAnchor: import("../utils/types.js").Hook<TooltipA
  * </TooltipProvider>
  * ```
  */
-export declare const TooltipAnchor: import("../utils/types.js").Component<TooltipAnchorOptions<"div">>;
-export interface TooltipAnchorOptions<T extends As = "div"> extends HovercardAnchorOptions<T> {
+export declare const TooltipAnchor: (props: TooltipAnchorProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface TooltipAnchorOptions<T extends ElementType = TagName> extends HovercardAnchorOptions<T> {
     /**
      * Object returned by the
      * [`useTooltipStore`](https://ariakit.org/reference/use-tooltip-store) hook.
@@ -37,4 +45,5 @@ export interface TooltipAnchorOptions<T extends As = "div"> extends HovercardAnc
      */
     store?: TooltipStore;
 }
-export type TooltipAnchorProps<T extends As = "div"> = Props<TooltipAnchorOptions<T>>;
+export type TooltipAnchorProps<T extends ElementType = TagName> = Props<T, TooltipAnchorOptions<T>>;
+export {};

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

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { HovercardAnchorOptions } from "../hovercard/hovercard-anchor.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { TooltipStore } from "./tooltip-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `TooltipAnchor` component.
  * @see https://ariakit.org/components/tooltip
@@ -12,11 +15,16 @@ import type { TooltipStore } from "./tooltip-store.js";
  * <Tooltip store={store}>Tooltip</Tooltip>
  * ```
  */
-export declare const useTooltipAnchor: import("../utils/types.js").Hook<TooltipAnchorOptions<"div">>;
+export declare const useTooltipAnchor: import("../utils/types.js").Hook<"div", TooltipAnchorOptions<"div">>;
 /**
  * Renders a reference element for a
  * [`Tooltip`](https://ariakit.org/reference/tooltip), which is triggered by
  * focusing or hovering over the anchor.
+ *
+ * The tooltip is strictly for visual purposes. It's your responsibility to
+ * ensure the anchor element has an accessible name. See [Tooltip anchors must
+ * have accessible
+ * names](https://ariakit.org/components/tooltip#tooltip-anchors-must-have-accessible-names)
  * @see https://ariakit.org/components/tooltip
  * @example
  * ```jsx {2}
@@ -26,8 +34,8 @@ export declare const useTooltipAnchor: import("../utils/types.js").Hook<TooltipA
  * </TooltipProvider>
  * ```
  */
-export declare const TooltipAnchor: import("../utils/types.js").Component<TooltipAnchorOptions<"div">>;
-export interface TooltipAnchorOptions<T extends As = "div"> extends HovercardAnchorOptions<T> {
+export declare const TooltipAnchor: (props: TooltipAnchorProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface TooltipAnchorOptions<T extends ElementType = TagName> extends HovercardAnchorOptions<T> {
     /**
      * Object returned by the
      * [`useTooltipStore`](https://ariakit.org/reference/use-tooltip-store) hook.
@@ -37,4 +45,5 @@ export interface TooltipAnchorOptions<T extends As = "div"> extends HovercardAnc
      */
     store?: TooltipStore;
 }
-export type TooltipAnchorProps<T extends As = "div"> = Props<TooltipAnchorOptions<T>>;
+export type TooltipAnchorProps<T extends ElementType = TagName> = Props<T, TooltipAnchorOptions<T>>;
+export {};

package/cjs/tooltip/tooltip-arrow.cjs

@@ -1,20 +1,20 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _AZV52Y77cjs = require('../__chunks/AZV52Y77.cjs');
+var _LTCHZ5L3cjs = require('../__chunks/LTCHZ5L3.cjs');
 require('../__chunks/AH3CUB6N.cjs');
 
 
-var _M5JJ43ATcjs = require('../__chunks/M5JJ43AT.cjs');
-require('../__chunks/3W6FH6JK.cjs');
-require('../__chunks/UVBBMANL.cjs');
-require('../__chunks/F2A2ZQDB.cjs');
-require('../__chunks/S6UU7NA4.cjs');
+var _V7ENWBONcjs = require('../__chunks/V7ENWBON.cjs');
+require('../__chunks/M5PQIWTW.cjs');
+require('../__chunks/FNVFJ5AF.cjs');
+require('../__chunks/OLPMMKKO.cjs');
+require('../__chunks/XRJBC7H7.cjs');
 
 
 
 
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
 
@@ -24,26 +24,24 @@ var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
 
 // src/tooltip/tooltip-arrow.ts
 var _misc = require('@ariakit/core/utils/misc');
-var useTooltipArrow = _RNZNGEL4cjs.createHook.call(void 0, 
-  (_a) => {
+var TagName = "div";
+var useTooltipArrow = _Q67LZMDTcjs.createHook.call(void 0, 
+  function useTooltipArrow2(_a) {
     var _b = _a, { store, size = 16 } = _b, props = _AV6KTKLEcjs.__objRest.call(void 0, _b, ["store", "size"]);
-    const context = _M5JJ43ATcjs.useTooltipContext.call(void 0, );
+    const context = _V7ENWBONcjs.useTooltipContext.call(void 0, );
     store = store || context;
     _misc.invariant.call(void 0, 
       store,
       process.env.NODE_ENV !== "production" && "TooltipArrow must be wrapped in a Tooltip component."
     );
-    props = _AZV52Y77cjs.usePopoverArrow.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, size }, props));
+    props = _LTCHZ5L3cjs.usePopoverArrow.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, { store, size }, props));
     return props;
   }
 );
-var TooltipArrow = _RNZNGEL4cjs.createComponent.call(void 0, (props) => {
+var TooltipArrow = _Q67LZMDTcjs.forwardRef.call(void 0, function TooltipArrow2(props) {
   const htmlProps = useTooltipArrow(props);
-  return _RNZNGEL4cjs.createElement.call(void 0, "div", htmlProps);
+  return _Q67LZMDTcjs.createElement.call(void 0, TagName, htmlProps);
 });
-if (process.env.NODE_ENV !== "production") {
-  TooltipArrow.displayName = "TooltipArrow";
-}
 
 
 

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

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { PopoverArrowOptions } from "../popover/popover-arrow.js";
-import type { As, Props } from "../utils/types.js";
+import type { Props } from "../utils/types.js";
 import type { TooltipStore } from "./tooltip-store.js";
+declare const TagName = "div";
+type TagName = typeof TagName;
 /**
  * Returns props to create a `TooltipArrow` component.
  * @see https://ariakit.org/components/tooltip
@@ -15,7 +18,7 @@ import type { TooltipStore } from "./tooltip-store.js";
  * </Tooltip>
  * ```
  */
-export declare const useTooltipArrow: import("../utils/types.js").Hook<TooltipArrowOptions<"div">>;
+export declare const useTooltipArrow: import("../utils/types.js").Hook<"div", TooltipArrowOptions<"div">>;
 /**
  * Renders an arrow inside a [`Tooltip`](https://ariakit.org/reference/tooltip)
  * pointing to the anchor element.
@@ -31,8 +34,8 @@ export declare const useTooltipArrow: import("../utils/types.js").Hook<TooltipAr
  * </TooltipProvider>
  * ```
  */
-export declare const TooltipArrow: import("../utils/types.js").Component<TooltipArrowOptions<"div">>;
-export interface TooltipArrowOptions<T extends As = "div"> extends PopoverArrowOptions<T> {
+export declare const TooltipArrow: (props: TooltipArrowProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+export interface TooltipArrowOptions<T extends ElementType = TagName> extends PopoverArrowOptions<T> {
     /**
      * Object returned by the
      * [`useTooltipStore`](https://ariakit.org/reference/use-tooltip-store) hook.
@@ -43,4 +46,5 @@ export interface TooltipArrowOptions<T extends As = "div"> extends PopoverArrowO
      */
     store?: TooltipStore;
 }
-export type TooltipArrowProps<T extends As = "div"> = Props<TooltipArrowOptions<T>>;
+export type TooltipArrowProps<T extends ElementType = TagName> = Props<T, TooltipArrowOptions<T>>;
+export {};