@ariakit/react-core 0.3.14 → 0.4.0

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

@@ -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 {};

package/cjs/tooltip/tooltip-context.cjs

@@ -5,12 +5,12 @@
 
 
 
-var _M5JJ43ATcjs = require('../__chunks/M5JJ43AT.cjs');
-require('../__chunks/3W6FH6JK.cjs');
-require('../__chunks/UVBBMANL.cjs');
-require('../__chunks/F2A2ZQDB.cjs');
-require('../__chunks/S6UU7NA4.cjs');
-require('../__chunks/RNZNGEL4.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/Q67LZMDT.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
 require('../__chunks/AV6KTKLE.cjs');
@@ -20,4 +20,4 @@ require('../__chunks/AV6KTKLE.cjs');
 
 
 
-exports.TooltipContextProvider = _M5JJ43ATcjs.TooltipContextProvider; exports.TooltipScopedContextProvider = _M5JJ43ATcjs.TooltipScopedContextProvider; exports.useTooltipContext = _M5JJ43ATcjs.useTooltipContext; exports.useTooltipProviderContext = _M5JJ43ATcjs.useTooltipProviderContext; exports.useTooltipScopedContext = _M5JJ43ATcjs.useTooltipScopedContext;
+exports.TooltipContextProvider = _V7ENWBONcjs.TooltipContextProvider; exports.TooltipScopedContextProvider = _V7ENWBONcjs.TooltipScopedContextProvider; exports.useTooltipContext = _V7ENWBONcjs.useTooltipContext; exports.useTooltipProviderContext = _V7ENWBONcjs.useTooltipProviderContext; exports.useTooltipScopedContext = _V7ENWBONcjs.useTooltipScopedContext;

package/cjs/tooltip/tooltip-provider.cjs

@@ -1,19 +1,19 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _M5JJ43ATcjs = require('../__chunks/M5JJ43AT.cjs');
-require('../__chunks/3W6FH6JK.cjs');
-require('../__chunks/UVBBMANL.cjs');
-require('../__chunks/F2A2ZQDB.cjs');
-require('../__chunks/S6UU7NA4.cjs');
-require('../__chunks/RNZNGEL4.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/Q67LZMDT.cjs');
 
 
-var _4VMHQGZHcjs = require('../__chunks/4VMHQGZH.cjs');
-require('../__chunks/OZ4FTKEH.cjs');
-require('../__chunks/NRGWVSB5.cjs');
-require('../__chunks/W5LJEMLB.cjs');
-require('../__chunks/JAQJG42R.cjs');
+var _DCVHQ3MNcjs = require('../__chunks/DCVHQ3MN.cjs');
+require('../__chunks/G5BGNCVU.cjs');
+require('../__chunks/GOS3JJKQ.cjs');
+require('../__chunks/AD7LA3CE.cjs');
+require('../__chunks/QJZAESAR.cjs');
 require('../__chunks/OLOZ5JT2.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
@@ -22,8 +22,8 @@ require('../__chunks/AV6KTKLE.cjs');
 // src/tooltip/tooltip-provider.tsx
 var _jsxruntime = require('react/jsx-runtime');
 function TooltipProvider(props = {}) {
-  const store = _4VMHQGZHcjs.useTooltipStore.call(void 0, props);
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _M5JJ43ATcjs.TooltipContextProvider, { value: store, children: props.children });
+  const store = _DCVHQ3MNcjs.useTooltipStore.call(void 0, props);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _V7ENWBONcjs.TooltipContextProvider, { value: store, children: props.children });
 }
 
 

package/cjs/tooltip/tooltip-store.cjs

@@ -2,11 +2,11 @@
 
 
 
-var _4VMHQGZHcjs = require('../__chunks/4VMHQGZH.cjs');
-require('../__chunks/OZ4FTKEH.cjs');
-require('../__chunks/NRGWVSB5.cjs');
-require('../__chunks/W5LJEMLB.cjs');
-require('../__chunks/JAQJG42R.cjs');
+var _DCVHQ3MNcjs = require('../__chunks/DCVHQ3MN.cjs');
+require('../__chunks/G5BGNCVU.cjs');
+require('../__chunks/GOS3JJKQ.cjs');
+require('../__chunks/AD7LA3CE.cjs');
+require('../__chunks/QJZAESAR.cjs');
 require('../__chunks/OLOZ5JT2.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
@@ -14,4 +14,4 @@ require('../__chunks/AV6KTKLE.cjs');
 
 
 
-exports.useTooltipStore = _4VMHQGZHcjs.useTooltipStore; exports.useTooltipStoreProps = _4VMHQGZHcjs.useTooltipStoreProps;
+exports.useTooltipStore = _DCVHQ3MNcjs.useTooltipStore; exports.useTooltipStoreProps = _DCVHQ3MNcjs.useTooltipStoreProps;

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

@@ -1,7 +1,9 @@
 import * as Core from "@ariakit/core/tooltip/tooltip-store";
 import type { HovercardStoreFunctions, HovercardStoreOptions, HovercardStoreState } from "../hovercard/hovercard-store.js";
 import type { Store } from "../utils/store.js";
-export declare function useTooltipStoreProps<T extends TooltipStore>(store: T, update: () => void, props: TooltipStoreProps): T;
+export declare function useTooltipStoreProps<T extends Core.TooltipStore>(store: T, update: () => void, props: TooltipStoreProps): T & {
+    disclosure: import("../disclosure/disclosure-store.js").DisclosureStore | null | undefined;
+};
 /**
  * Creates a tooltip store to control the state of
  * [Tooltip](https://ariakit.org/components/tooltip) components.
@@ -17,11 +19,11 @@ export declare function useTooltipStoreProps<T extends TooltipStore>(store: T, u
 export declare function useTooltipStore(props?: TooltipStoreProps): TooltipStore;
 export interface TooltipStoreState extends Core.TooltipStoreState, HovercardStoreState {
 }
-export interface TooltipStoreFunctions extends Core.TooltipStoreFunctions, HovercardStoreFunctions {
+export interface TooltipStoreFunctions extends Omit<Core.TooltipStoreFunctions, "disclosure">, HovercardStoreFunctions {
 }
-export interface TooltipStoreOptions extends Core.TooltipStoreOptions, HovercardStoreOptions {
+export interface TooltipStoreOptions extends Omit<Core.TooltipStoreOptions, "disclosure">, HovercardStoreOptions {
 }
-export interface TooltipStoreProps extends TooltipStoreOptions, Core.TooltipStoreProps {
+export interface TooltipStoreProps extends TooltipStoreOptions, Omit<Core.TooltipStoreProps, "disclosure"> {
 }
-export interface TooltipStore extends TooltipStoreFunctions, Store<Core.TooltipStore> {
+export interface TooltipStore extends TooltipStoreFunctions, Omit<Store<Core.TooltipStore>, "disclosure"> {
 }

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

@@ -1,7 +1,9 @@
 import * as Core from "@ariakit/core/tooltip/tooltip-store";
 import type { HovercardStoreFunctions, HovercardStoreOptions, HovercardStoreState } from "../hovercard/hovercard-store.js";
 import type { Store } from "../utils/store.js";
-export declare function useTooltipStoreProps<T extends TooltipStore>(store: T, update: () => void, props: TooltipStoreProps): T;
+export declare function useTooltipStoreProps<T extends Core.TooltipStore>(store: T, update: () => void, props: TooltipStoreProps): T & {
+    disclosure: import("../disclosure/disclosure-store.js").DisclosureStore | null | undefined;
+};
 /**
  * Creates a tooltip store to control the state of
  * [Tooltip](https://ariakit.org/components/tooltip) components.
@@ -17,11 +19,11 @@ export declare function useTooltipStoreProps<T extends TooltipStore>(store: T, u
 export declare function useTooltipStore(props?: TooltipStoreProps): TooltipStore;
 export interface TooltipStoreState extends Core.TooltipStoreState, HovercardStoreState {
 }
-export interface TooltipStoreFunctions extends Core.TooltipStoreFunctions, HovercardStoreFunctions {
+export interface TooltipStoreFunctions extends Omit<Core.TooltipStoreFunctions, "disclosure">, HovercardStoreFunctions {
 }
-export interface TooltipStoreOptions extends Core.TooltipStoreOptions, HovercardStoreOptions {
+export interface TooltipStoreOptions extends Omit<Core.TooltipStoreOptions, "disclosure">, HovercardStoreOptions {
 }
-export interface TooltipStoreProps extends TooltipStoreOptions, Core.TooltipStoreProps {
+export interface TooltipStoreProps extends TooltipStoreOptions, Omit<Core.TooltipStoreProps, "disclosure"> {
 }
-export interface TooltipStore extends TooltipStoreFunctions, Store<Core.TooltipStore> {
+export interface TooltipStore extends TooltipStoreFunctions, Omit<Store<Core.TooltipStore>, "disclosure"> {
 }

package/cjs/tooltip/tooltip.cjs

@@ -1,14 +1,14 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";
 
 
-var _I2KHXDVLcjs = require('../__chunks/I2KHXDVL.cjs');
+var _2FVHSC23cjs = require('../__chunks/2FVHSC23.cjs');
 require('../__chunks/KXQOQQ5B.cjs');
-require('../__chunks/OUEE5HOS.cjs');
+require('../__chunks/ID5QP4WT.cjs');
 
 
-var _ZL5DC555cjs = require('../__chunks/ZL5DC555.cjs');
-require('../__chunks/WZ3DRKGP.cjs');
-require('../__chunks/KSPMHEYZ.cjs');
+var _YHNU4DBCcjs = require('../__chunks/YHNU4DBC.cjs');
+require('../__chunks/6RCPYDT6.cjs');
+require('../__chunks/4OFNVXGN.cjs');
 require('../__chunks/PZL34OVO.cjs');
 require('../__chunks/344F3DYO.cjs');
 require('../__chunks/KREY6HXD.cjs');
@@ -21,32 +21,32 @@ require('../__chunks/7TN63K2T.cjs');
 require('../__chunks/V24PR4PW.cjs');
 require('../__chunks/6IUEXB4L.cjs');
 require('../__chunks/JF225FQ5.cjs');
-require('../__chunks/7566TIRW.cjs');
+require('../__chunks/5SRODZ4B.cjs');
 require('../__chunks/J3OG6T3B.cjs');
-require('../__chunks/65LGW5LY.cjs');
-require('../__chunks/XB3G2EO2.cjs');
+require('../__chunks/BBRNIJWO.cjs');
+require('../__chunks/O2WTAUCQ.cjs');
 require('../__chunks/CVD2AZE2.cjs');
 require('../__chunks/2BIO7R5N.cjs');
-require('../__chunks/LAUATD5O.cjs');
-require('../__chunks/YPVQYY4J.cjs');
+require('../__chunks/SFDUOV6F.cjs');
+require('../__chunks/JFOUIQSF.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');
-require('../__chunks/R66IWXK6.cjs');
+require('../__chunks/HQKST6ZJ.cjs');
 
 
 
 
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
-require('../__chunks/W5LJEMLB.cjs');
-require('../__chunks/JAQJG42R.cjs');
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
+require('../__chunks/AD7LA3CE.cjs');
+require('../__chunks/QJZAESAR.cjs');
 require('../__chunks/OLOZ5JT2.cjs');
 
 
@@ -62,8 +62,9 @@ var _AV6KTKLEcjs = require('../__chunks/AV6KTKLE.cjs');
 var _dom = require('@ariakit/core/utils/dom');
 var _misc = require('@ariakit/core/utils/misc');
 var _jsxruntime = require('react/jsx-runtime');
-var useTooltip = _RNZNGEL4cjs.createHook.call(void 0, 
-  (_a) => {
+var TagName = "div";
+var useTooltip = _Q67LZMDTcjs.createHook.call(void 0, 
+  function useTooltip2(_a) {
     var _b = _a, {
       store,
       portal = true,
@@ -79,7 +80,7 @@ var useTooltip = _RNZNGEL4cjs.createHook.call(void 0,
       "hideOnHoverOutside",
       "hideOnInteractOutside"
     ]);
-    const context = _M5JJ43ATcjs.useTooltipProviderContext.call(void 0, );
+    const context = _V7ENWBONcjs.useTooltipProviderContext.call(void 0, );
     store = store || context;
     _misc.invariant.call(void 0, 
       store,
@@ -87,19 +88,19 @@ var useTooltip = _RNZNGEL4cjs.createHook.call(void 0,
     );
     props = _EO6LS72Hcjs.useWrapElement.call(void 0, 
       props,
-      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _M5JJ43ATcjs.TooltipScopedContextProvider, { value: store, children: element }),
+      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _V7ENWBONcjs.TooltipScopedContextProvider, { value: store, children: element }),
       [store]
     );
     const role = store.useState(
       (state) => state.type === "description" ? "tooltip" : "none"
     );
     props = _AV6KTKLEcjs.__spreadValues.call(void 0, { role }, props);
-    props = _I2KHXDVLcjs.useHovercard.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
+    props = _2FVHSC23cjs.useHovercard.call(void 0, _AV6KTKLEcjs.__spreadProps.call(void 0, _AV6KTKLEcjs.__spreadValues.call(void 0, {}, props), {
       store,
       portal,
       gutter,
       preserveTabOrder,
-      hideOnHoverOutside: (event) => {
+      hideOnHoverOutside(event) {
         if (_misc.isFalsyBooleanCallback.call(void 0, hideOnHoverOutside, event))
           return false;
         const anchorElement = store == null ? void 0 : store.getState().anchorElement;
@@ -123,16 +124,13 @@ var useTooltip = _RNZNGEL4cjs.createHook.call(void 0,
     return props;
   }
 );
-var Tooltip = _ZL5DC555cjs.createDialogComponent.call(void 0, 
-  _RNZNGEL4cjs.createComponent.call(void 0, (props) => {
+var Tooltip = _YHNU4DBCcjs.createDialogComponent.call(void 0, 
+  _Q67LZMDTcjs.forwardRef.call(void 0, function Tooltip2(props) {
     const htmlProps = useTooltip(props);
-    return _RNZNGEL4cjs.createElement.call(void 0, "div", htmlProps);
+    return _Q67LZMDTcjs.createElement.call(void 0, TagName, htmlProps);
   }),
-  _M5JJ43ATcjs.useTooltipProviderContext
+  _V7ENWBONcjs.useTooltipProviderContext
 );
-if (process.env.NODE_ENV !== "production") {
-  Tooltip.displayName = "Tooltip";
-}
 
 
 

package/cjs/tooltip/tooltip.d.cts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { HovercardOptions } from "../hovercard/hovercard.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 `Tooltip` component.
  * @see https://ariakit.org/components/tooltip
@@ -12,11 +15,16 @@ import type { TooltipStore } from "./tooltip-store.js";
  * <Role {...props}>Tooltip</Role>
  * ```
  */
-export declare const useTooltip: import("../utils/types.js").Hook<TooltipOptions<"div">>;
+export declare const useTooltip: import("../utils/types.js").Hook<"div", TooltipOptions<"div">>;
 /**
  * Renders a tooltip element that visually describes a
  * [`TooltipAnchor`](https://ariakit.org/reference/tooltip-anchor) when it
  * receives focus or is hovered.
+ *
+ * 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 {3}
@@ -26,8 +34,8 @@ export declare const useTooltip: import("../utils/types.js").Hook<TooltipOptions
  * </TooltipProvider>
  * ```
  */
-export declare const Tooltip: import("../utils/types.js").Component<TooltipOptions<"div">>;
-export interface TooltipOptions<T extends As = "div"> extends HovercardOptions<T> {
+export declare const Tooltip: (props: TooltipProps<"div">) => import("react/jsx-runtime").JSX.Element | null;
+export interface TooltipOptions<T extends ElementType = TagName> extends HovercardOptions<T> {
     /**
      * Object returned by the
      * [`useTooltipStore`](https://ariakit.org/reference/use-tooltip-store) hook.
@@ -41,4 +49,5 @@ export interface TooltipOptions<T extends As = "div"> extends HovercardOptions<T
     /** @default 8 */
     gutter?: HovercardOptions<T>["gutter"];
 }
-export type TooltipProps<T extends As = "div"> = Props<TooltipOptions<T>>;
+export type TooltipProps<T extends ElementType = TagName> = Props<T, TooltipOptions<T>>;
+export {};

package/cjs/tooltip/tooltip.d.ts

@@ -1,6 +1,9 @@
+import type { ElementType } from "react";
 import type { HovercardOptions } from "../hovercard/hovercard.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 `Tooltip` component.
  * @see https://ariakit.org/components/tooltip
@@ -12,11 +15,16 @@ import type { TooltipStore } from "./tooltip-store.js";
  * <Role {...props}>Tooltip</Role>
  * ```
  */
-export declare const useTooltip: import("../utils/types.js").Hook<TooltipOptions<"div">>;
+export declare const useTooltip: import("../utils/types.js").Hook<"div", TooltipOptions<"div">>;
 /**
  * Renders a tooltip element that visually describes a
  * [`TooltipAnchor`](https://ariakit.org/reference/tooltip-anchor) when it
  * receives focus or is hovered.
+ *
+ * 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 {3}
@@ -26,8 +34,8 @@ export declare const useTooltip: import("../utils/types.js").Hook<TooltipOptions
  * </TooltipProvider>
  * ```
  */
-export declare const Tooltip: import("../utils/types.js").Component<TooltipOptions<"div">>;
-export interface TooltipOptions<T extends As = "div"> extends HovercardOptions<T> {
+export declare const Tooltip: (props: TooltipProps<"div">) => import("react/jsx-runtime").JSX.Element | null;
+export interface TooltipOptions<T extends ElementType = TagName> extends HovercardOptions<T> {
     /**
      * Object returned by the
      * [`useTooltipStore`](https://ariakit.org/reference/use-tooltip-store) hook.
@@ -41,4 +49,5 @@ export interface TooltipOptions<T extends As = "div"> extends HovercardOptions<T
     /** @default 8 */
     gutter?: HovercardOptions<T>["gutter"];
 }
-export type TooltipProps<T extends As = "div"> = Props<TooltipOptions<T>>;
+export type TooltipProps<T extends ElementType = TagName> = Props<T, TooltipOptions<T>>;
+export {};

package/cjs/utils/system.cjs

@@ -5,9 +5,7 @@
 
 
 
-
-
-var _RNZNGEL4cjs = require('../__chunks/RNZNGEL4.cjs');
+var _Q67LZMDTcjs = require('../__chunks/Q67LZMDT.cjs');
 require('../__chunks/EO6LS72H.cjs');
 require('../__chunks/CJDHQUBR.cjs');
 require('../__chunks/AV6KTKLE.cjs');
@@ -17,6 +15,4 @@ require('../__chunks/AV6KTKLE.cjs');
 
 
 
-
-
-exports.createComponent = _RNZNGEL4cjs.createComponent; exports.createElement = _RNZNGEL4cjs.createElement; exports.createHook = _RNZNGEL4cjs.createHook; exports.createMemoComponent = _RNZNGEL4cjs.createMemoComponent; exports.createStoreContext = _RNZNGEL4cjs.createStoreContext; exports.forwardRef = _RNZNGEL4cjs.forwardRef; exports.memo = _RNZNGEL4cjs.memo;
+exports.createElement = _Q67LZMDTcjs.createElement; exports.createHook = _Q67LZMDTcjs.createHook; exports.createStoreContext = _Q67LZMDTcjs.createStoreContext; exports.forwardRef = _Q67LZMDTcjs.forwardRef; exports.memo = _Q67LZMDTcjs.memo;

package/cjs/utils/system.d.cts

@@ -1,84 +1,25 @@
 import * as React from "react";
+import type { AnyObject, EmptyObject } from "@ariakit/core/utils/types";
 import type { Store } from "./store.js";
-import type { Component, HTMLProps, Hook, Options, Props } from "./types.js";
+import type { HTMLProps, Hook, Options, Props } from "./types.js";
 /**
  * The same as `React.forwardRef` but passes the `ref` as a prop and returns a
  * component with the same generic type.
  */
-export declare function forwardRef<T extends React.FC>(render: T): T;
+export declare function forwardRef<T extends React.FC<any>>(render: T): T;
 /**
  * The same as `React.memo` but returns a component with the same generic type.
  */
-export declare function memo<P, T extends React.FC<P>>(Component: T, propsAreEqual?: (prevProps: Readonly<P>, nextProps: Readonly<P>) => boolean): T;
-/**
- * Creates a type-safe component with the `as` prop and `React.forwardRef`.
- *
- * @example
- * import { createComponent } from "@ariakit/react-core/utils/system";
- *
- * type Props = {
- *   as?: "div";
- *   customProp?: boolean;
- * };
- *
- * const Component = createComponent<Props>(({ customProp, ...props }) => {
- *   return <div {...props} />;
- * });
- *
- * <Component customProp render={<button />} />
- */
-export declare function createComponent<O extends Options>(render: (props: Props<O>) => React.ReactElement | null): Component<O>;
-/**
- * Creates a type-safe component with the `as` prop, `React.forwardRef` and
- * `React.memo`.
- *
- * @example
- * import { createMemoComponent } from "@ariakit/react-core/utils/system";
- *
- * type Props = {
- *   as?: "div";
- *   customProp?: boolean;
- * };
- *
- * const Component = createMemoComponent<Props>(({ customProp, ...props }) => {
- *   return <div {...props} />;
- * });
- *
- * <Component customProp render={<button />} />
- */
-export declare function createMemoComponent<O extends Options>(render: (props: Props<O>) => React.ReactElement | null): Component<O>;
+export declare function memo<T extends React.FC<any>>(Component: T, propsAreEqual?: (prevProps: Readonly<React.ComponentPropsWithoutRef<T>>, nextProps: Readonly<React.ComponentPropsWithoutRef<T>>) => boolean): T;
 /**
  * Creates a React element that supports the `render` and `wrapElement` props.
- * @example
- * import { createElement } from "@ariakit/react-core/utils/system";
- *
- * function Component() {
- *   const props = {
- *     render: (htmlProps) => <button {...htmlProps} />,
- *     wrapElement: (element) => <div>{element}</div>,
- *   };
- *   return createElement("div", props);
- * }
  */
-export declare function createElement(Type: React.ElementType, props: HTMLProps<Options>): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+export declare function createElement(Type: React.ElementType, props: Props<React.ElementType, Options>): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
 /**
  * Creates a component hook that accepts props and returns props so they can be
  * passed to a React element.
- *
- * @example
- * import { Options, createHook } from "@ariakit/react-core/utils/system";
- *
- * type Props = Options<"div"> & {
- *   customProp?: boolean;
- * };
- *
- * const useComponent = createHook<Props>(({ customProp, ...props }) => {
- *   return props;
- * });
- *
- * const props = useComponent({ as: "button", customProp: true });
  */
-export declare function createHook<O extends Options>(useProps: (props: Props<O>) => HTMLProps<O>): Hook<O>;
+export declare function createHook<T extends React.ElementType, P extends AnyObject = EmptyObject>(useProps: (props: Props<T, P>) => HTMLProps<T, P>): Hook<T, P>;
 type StoreProvider<T extends Store> = React.ComponentType<{
     value: T | undefined;
     children?: React.ReactNode;

package/cjs/utils/system.d.ts

@@ -1,84 +1,25 @@
 import * as React from "react";
+import type { AnyObject, EmptyObject } from "@ariakit/core/utils/types";
 import type { Store } from "./store.js";
-import type { Component, HTMLProps, Hook, Options, Props } from "./types.js";
+import type { HTMLProps, Hook, Options, Props } from "./types.js";
 /**
  * The same as `React.forwardRef` but passes the `ref` as a prop and returns a
  * component with the same generic type.
  */
-export declare function forwardRef<T extends React.FC>(render: T): T;
+export declare function forwardRef<T extends React.FC<any>>(render: T): T;
 /**
  * The same as `React.memo` but returns a component with the same generic type.
  */
-export declare function memo<P, T extends React.FC<P>>(Component: T, propsAreEqual?: (prevProps: Readonly<P>, nextProps: Readonly<P>) => boolean): T;
-/**
- * Creates a type-safe component with the `as` prop and `React.forwardRef`.
- *
- * @example
- * import { createComponent } from "@ariakit/react-core/utils/system";
- *
- * type Props = {
- *   as?: "div";
- *   customProp?: boolean;
- * };
- *
- * const Component = createComponent<Props>(({ customProp, ...props }) => {
- *   return <div {...props} />;
- * });
- *
- * <Component customProp render={<button />} />
- */
-export declare function createComponent<O extends Options>(render: (props: Props<O>) => React.ReactElement | null): Component<O>;
-/**
- * Creates a type-safe component with the `as` prop, `React.forwardRef` and
- * `React.memo`.
- *
- * @example
- * import { createMemoComponent } from "@ariakit/react-core/utils/system";
- *
- * type Props = {
- *   as?: "div";
- *   customProp?: boolean;
- * };
- *
- * const Component = createMemoComponent<Props>(({ customProp, ...props }) => {
- *   return <div {...props} />;
- * });
- *
- * <Component customProp render={<button />} />
- */
-export declare function createMemoComponent<O extends Options>(render: (props: Props<O>) => React.ReactElement | null): Component<O>;
+export declare function memo<T extends React.FC<any>>(Component: T, propsAreEqual?: (prevProps: Readonly<React.ComponentPropsWithoutRef<T>>, nextProps: Readonly<React.ComponentPropsWithoutRef<T>>) => boolean): T;
 /**
  * Creates a React element that supports the `render` and `wrapElement` props.
- * @example
- * import { createElement } from "@ariakit/react-core/utils/system";
- *
- * function Component() {
- *   const props = {
- *     render: (htmlProps) => <button {...htmlProps} />,
- *     wrapElement: (element) => <div>{element}</div>,
- *   };
- *   return createElement("div", props);
- * }
  */
-export declare function createElement(Type: React.ElementType, props: HTMLProps<Options>): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+export declare function createElement(Type: React.ElementType, props: Props<React.ElementType, Options>): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
 /**
  * Creates a component hook that accepts props and returns props so they can be
  * passed to a React element.
- *
- * @example
- * import { Options, createHook } from "@ariakit/react-core/utils/system";
- *
- * type Props = Options<"div"> & {
- *   customProp?: boolean;
- * };
- *
- * const useComponent = createHook<Props>(({ customProp, ...props }) => {
- *   return props;
- * });
- *
- * const props = useComponent({ as: "button", customProp: true });
  */
-export declare function createHook<O extends Options>(useProps: (props: Props<O>) => HTMLProps<O>): Hook<O>;
+export declare function createHook<T extends React.ElementType, P extends AnyObject = EmptyObject>(useProps: (props: Props<T, P>) => HTMLProps<T, P>): Hook<T, P>;
 type StoreProvider<T extends Store> = React.ComponentType<{
     value: T | undefined;
     children?: React.ReactNode;