@ariakit/react-components 0.1.0

package/dist/tooltip/tooltip-arrow.js

@@ -0,0 +1,54 @@
+"use client";
+import { usePopoverArrow } from "../popover/popover-arrow.js";
+import { useTooltipContext } from "./tooltip-context.js";
+import { createElement, createHook, forwardRef } from "@ariakit/react-utils";
+import { invariant } from "@ariakit/utils";
+//#region src/tooltip/tooltip-arrow.tsx
+const TagName = "div";
+/**
+* Returns props to create a `TooltipArrow` component.
+* @see https://ariakit.com/components/tooltip
+* @example
+* ```jsx
+* const store = useToolTipStore();
+* const props = useTooltipArrow({ store });
+* <TooltipAnchor store={store}>Anchor</TooltipAnchor>
+* <Tooltip store={store}>
+*   <Role {...props} />
+*   Tooltip
+* </Tooltip>
+* ```
+*/
+const useTooltipArrow = createHook(function useTooltipArrow({ store, size = 16, ...props }) {
+	const context = useTooltipContext();
+	store = store || context;
+	invariant(store, "TooltipArrow must be wrapped in a Tooltip component.");
+	props = usePopoverArrow({
+		store,
+		size,
+		...props
+	});
+	return props;
+});
+/**
+* Renders an arrow inside a [`Tooltip`](https://ariakit.com/reference/tooltip)
+* pointing to the anchor element.
+* @see https://ariakit.com/components/tooltip
+* @example
+* ```jsx {4}
+* <TooltipProvider>
+*   <TooltipAnchor>Anchor</TooltipAnchor>
+*   <Tooltip>
+*     <TooltipArrow />
+*     Tooltip
+*   </Tooltip>
+* </TooltipProvider>
+* ```
+*/
+const TooltipArrow = forwardRef(function TooltipArrow(props) {
+	return createElement(TagName, useTooltipArrow(props));
+});
+//#endregion
+export { TooltipArrow, useTooltipArrow };
+
+//# sourceMappingURL=tooltip-arrow.js.map

package/dist/tooltip/tooltip-arrow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-arrow.js","names":[],"sources":["../../src/tooltip/tooltip-arrow.tsx"],"sourcesContent":["import { createElement, createHook, forwardRef } from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport { invariant } from \"@ariakit/utils\";\nimport type { ElementType } from \"react\";\nimport type { PopoverArrowOptions } from \"../popover/popover-arrow.tsx\";\nimport { usePopoverArrow } from \"../popover/popover-arrow.tsx\";\nimport { useTooltipContext } from \"./tooltip-context.tsx\";\nimport type { TooltipStore } from \"./tooltip-store.ts\";\n\nconst TagName = \"div\" satisfies ElementType;\ntype TagName = typeof TagName;\n\n/**\n * Returns props to create a `TooltipArrow` component.\n * @see https://ariakit.com/components/tooltip\n * @example\n * ```jsx\n * const store = useToolTipStore();\n * const props = useTooltipArrow({ store });\n * <TooltipAnchor store={store}>Anchor</TooltipAnchor>\n * <Tooltip store={store}>\n *   <Role {...props} />\n *   Tooltip\n * </Tooltip>\n * ```\n */\nexport const useTooltipArrow = createHook<TagName, TooltipArrowOptions>(\n  function useTooltipArrow({ store, size = 16, ...props }) {\n    // We need to get the tooltip store here because Tooltip is not using the\n    // Popover component, so PopoverArrow can't access the popover context.\n    const context = useTooltipContext();\n    store = store || context;\n\n    invariant(\n      store,\n      process.env.NODE_ENV !== \"production\" &&\n        \"TooltipArrow must be wrapped in a Tooltip component.\",\n    );\n\n    props = usePopoverArrow({ store, size, ...props });\n    return props;\n  },\n);\n\n/**\n * Renders an arrow inside a [`Tooltip`](https://ariakit.com/reference/tooltip)\n * pointing to the anchor element.\n * @see https://ariakit.com/components/tooltip\n * @example\n * ```jsx {4}\n * <TooltipProvider>\n *   <TooltipAnchor>Anchor</TooltipAnchor>\n *   <Tooltip>\n *     <TooltipArrow />\n *     Tooltip\n *   </Tooltip>\n * </TooltipProvider>\n * ```\n */\nexport const TooltipArrow = forwardRef(function TooltipArrow(\n  props: TooltipArrowProps,\n) {\n  const htmlProps = useTooltipArrow(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface TooltipArrowOptions<\n  T extends ElementType = TagName,\n> extends PopoverArrowOptions<T> {\n  /**\n   * Object returned by the\n   * [`useTooltipStore`](https://ariakit.com/reference/use-tooltip-store) hook.\n   * If not provided, the closest\n   * [`Tooltip`](https://ariakit.com/reference/tooltip) or\n   * [`TooltipProvider`](https://ariakit.com/reference/tooltip-provider)\n   * components' context will be used.\n   */\n  store?: TooltipStore;\n}\n\nexport type TooltipArrowProps<T extends ElementType = TagName> = Props<\n  T,\n  TooltipArrowOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;MA8BI,kBAAgB,WAAkB,SAAA,gBAAA,EAAA,OAAA,OAAA,IAAA,GAAA,SAAA;CAClC,MAAA,UAAQ,kBAAS;CAEjB,QAAA,SAGI;CAGJ,UAAQ,OAAA,sDAAgB;SAAE,gBAAA;EAAO;EAAM;EAAU,GAAA;CACjD,CAAA;CAEJ,OAAA;;;;;;;;;;;;;;;;;MAqBE,eAAO,WADW,SAAA,aACqB,OAAA;CACxC,OAAA,cAAA,SAAA,gBAAA,KAAA,CAAA"}

package/dist/tooltip/tooltip-context.d.ts

@@ -0,0 +1,24 @@
+import { TooltipStore } from "./tooltip-store.js";
+
+//#region src/tooltip/tooltip-context.d.ts
+/**
+ * Returns the tooltip store from the nearest tooltip container.
+ * @example
+ * function Tooltip() {
+ *   const store = useTooltipContext();
+ *
+ *   if (!store) {
+ *     throw new Error("Tooltip must be wrapped in TooltipProvider");
+ *   }
+ *
+ *   // Use the store...
+ * }
+ */
+declare const useTooltipContext: () => TooltipStore | undefined;
+declare const useTooltipScopedContext: (onlyScoped?: boolean) => TooltipStore | undefined;
+declare const useTooltipProviderContext: () => TooltipStore | undefined;
+declare const TooltipContextProvider: (props: import("react").ProviderProps<TooltipStore | undefined>) => import("react/jsx-runtime").JSX.Element;
+declare const TooltipScopedContextProvider: (props: import("react").ProviderProps<TooltipStore | undefined>) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { TooltipContextProvider, TooltipScopedContextProvider, useTooltipContext, useTooltipProviderContext, useTooltipScopedContext };
+//# sourceMappingURL=tooltip-context.d.ts.map

package/dist/tooltip/tooltip-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-context.d.ts","names":["TooltipStore","useTooltipContext","useTooltipScopedContext","onlyScoped","useTooltipProviderContext","TooltipContextProvider","ProviderProps","props","JSX","Element","TooltipScopedContextProvider"],"sources":["../../src/tooltip/tooltip-context.d.ts"],"mappings":";;;;;AAcA;;;;AAA0D;AAC1D;;;;AAAoF;AACpF;cAFqBC,iBAAAA,QAAyBD,YAAY;AAAA,cACrCE,uBAAAA,GAA0BC,UAAAA,eAAyBH,YAAY;AAAA,cAC/DI,yBAAAA,QAAiCJ,YAAY;AAAA,cAC7CK,sBAAAA,GAAyBE,KAAAA,kBAAuBD,aAAAA,CAAcN,YAAY,8CAA8CQ,GAAAA,CAAIC,OAAAA;AAAAA,cAC5HC,4BAAAA,GAA+BH,KAAAA,kBAAuBD,aAAAA,CAAcN,YAAY,8CAA8CQ,GAAAA,CAAIC,OAAAA"}

package/dist/tooltip/tooltip-context.js

@@ -0,0 +1,27 @@
+"use client";
+import { HovercardContextProvider, HovercardScopedContextProvider } from "../hovercard/hovercard-context.js";
+import { createStoreContext } from "@ariakit/react-utils";
+//#region src/tooltip/tooltip-context.tsx
+const ctx = createStoreContext([HovercardContextProvider], [HovercardScopedContextProvider]);
+/**
+* Returns the tooltip store from the nearest tooltip container.
+* @example
+* function Tooltip() {
+*   const store = useTooltipContext();
+*
+*   if (!store) {
+*     throw new Error("Tooltip must be wrapped in TooltipProvider");
+*   }
+*
+*   // Use the store...
+* }
+*/
+const useTooltipContext = ctx.useContext;
+const useTooltipScopedContext = ctx.useScopedContext;
+const useTooltipProviderContext = ctx.useProviderContext;
+const TooltipContextProvider = ctx.ContextProvider;
+const TooltipScopedContextProvider = ctx.ScopedContextProvider;
+//#endregion
+export { TooltipContextProvider, TooltipScopedContextProvider, useTooltipContext, useTooltipProviderContext, useTooltipScopedContext };
+
+//# sourceMappingURL=tooltip-context.js.map

package/dist/tooltip/tooltip-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-context.js","names":[],"sources":["../../src/tooltip/tooltip-context.tsx"],"sourcesContent":["import { createStoreContext } from \"@ariakit/react-utils\";\nimport {\n  HovercardContextProvider,\n  HovercardScopedContextProvider,\n} from \"../hovercard/hovercard-context.tsx\";\nimport type { TooltipStore } from \"./tooltip-store.ts\";\n\nconst ctx = createStoreContext<TooltipStore>(\n  [HovercardContextProvider],\n  [HovercardScopedContextProvider],\n);\n\n/**\n * Returns the tooltip store from the nearest tooltip container.\n * @example\n * function Tooltip() {\n *   const store = useTooltipContext();\n *\n *   if (!store) {\n *     throw new Error(\"Tooltip must be wrapped in TooltipProvider\");\n *   }\n *\n *   // Use the store...\n * }\n */\nexport const useTooltipContext = ctx.useContext;\n\nexport const useTooltipScopedContext = ctx.useScopedContext;\n\nexport const useTooltipProviderContext = ctx.useProviderContext;\n\nexport const TooltipContextProvider = ctx.ContextProvider;\n\nexport const TooltipScopedContextProvider = ctx.ScopedContextProvider;\n"],"mappings":";;;;;;;;;;;;;;;;;;AA2BA,MAAa,oBAAA,IAAA;AAEb,MAAa,0BAAA,IAA4B;AAEzC,MAAa,4BAAyB,IAAI;AAE1C,MAAa,yBAAA,IAAA"}

package/dist/tooltip/tooltip-provider.d.ts

@@ -0,0 +1,23 @@
+import { TooltipStoreProps } from "./tooltip-store.js";
+import { ReactNode } from "react";
+
+//#region src/tooltip/tooltip-provider.d.ts
+/**
+ * Provides a tooltip store to [Tooltip](https://ariakit.com/components/tooltip)
+ * components.
+ * @see https://ariakit.com/components/tooltip
+ * @example
+ * ```jsx
+ * <TooltipProvider timeout={250}>
+ *   <TooltipAnchor />
+ *   <Tooltip />
+ * </TooltipProvider>
+ * ```
+ */
+declare function TooltipProvider(props?: TooltipProviderProps): import("react/jsx-runtime").JSX.Element;
+interface TooltipProviderProps extends TooltipStoreProps {
+  children?: ReactNode;
+}
+//#endregion
+export { TooltipProvider, TooltipProviderProps };
+//# sourceMappingURL=tooltip-provider.d.ts.map

package/dist/tooltip/tooltip-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-provider.d.ts","names":["ReactNode","TooltipStoreProps","TooltipProvider","TooltipProviderProps","props","JSX","Element","children"],"sources":["../../src/tooltip/tooltip-provider.d.ts"],"mappings":";;;;;;AAcA;;;;;;;;;AAA8G;iBAAtFE,eAAAA,CAAgBE,KAAAA,GAAQD,oBAAoB,+BAA+BE,GAAAA,CAAIC,OAAAA;AAAAA,UACtFH,oBAAAA,SAA6BF,iBAAiB;EAC3DM,QAAAA,GAAWP,SAAAA;AAAAA"}

package/dist/tooltip/tooltip-provider.js

@@ -0,0 +1,27 @@
+"use client";
+import { TooltipContextProvider } from "./tooltip-context.js";
+import { useTooltipStore } from "./tooltip-store.js";
+import { jsx } from "react/jsx-runtime";
+//#region src/tooltip/tooltip-provider.tsx
+/**
+* Provides a tooltip store to [Tooltip](https://ariakit.com/components/tooltip)
+* components.
+* @see https://ariakit.com/components/tooltip
+* @example
+* ```jsx
+* <TooltipProvider timeout={250}>
+*   <TooltipAnchor />
+*   <Tooltip />
+* </TooltipProvider>
+* ```
+*/
+function TooltipProvider(props = {}) {
+	return /* @__PURE__ */ jsx(TooltipContextProvider, {
+		value: useTooltipStore(props),
+		children: props.children
+	});
+}
+//#endregion
+export { TooltipProvider };
+
+//# sourceMappingURL=tooltip-provider.js.map

package/dist/tooltip/tooltip-provider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-provider.js","names":[],"sources":["../../src/tooltip/tooltip-provider.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { TooltipContextProvider } from \"./tooltip-context.tsx\";\nimport type { TooltipStoreProps } from \"./tooltip-store.ts\";\nimport { useTooltipStore } from \"./tooltip-store.ts\";\n\n/**\n * Provides a tooltip store to [Tooltip](https://ariakit.com/components/tooltip)\n * components.\n * @see https://ariakit.com/components/tooltip\n * @example\n * ```jsx\n * <TooltipProvider timeout={250}>\n *   <TooltipAnchor />\n *   <Tooltip />\n * </TooltipProvider>\n * ```\n */\nexport function TooltipProvider(props: TooltipProviderProps = {}) {\n  const store = useTooltipStore(props);\n  return (\n    <TooltipContextProvider value={store}>\n      {props.children}\n    </TooltipContextProvider>\n  );\n}\n\nexport interface TooltipProviderProps extends TooltipStoreProps {\n  children?: ReactNode;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;SAoBI,gBAAA,QAAC,CAAA,GAAA;QAFW,oBAAgB,wBAEO;yBAC1B,KAAA;EACe,UAAA,MAAA;CAE5B,CAAA"}

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

@@ -0,0 +1,30 @@
+import { t as DisclosureStore } from "../disclosure-store-BsaBaRKv.js";
+import { a as HovercardStoreState, n as HovercardStoreFunctions, r as HovercardStoreOptions } from "../hovercard-store-gIeoQEn_.js";
+import { Store } from "@ariakit/react-store";
+import * as Core from "@ariakit/components/tooltip/tooltip-store";
+
+//#region src/tooltip/tooltip-store.d.ts
+declare function useTooltipStoreProps<T extends Core.TooltipStore>(store: T, update: () => void, props: TooltipStoreProps): T & {
+  disclosure: DisclosureStore | null | undefined;
+};
+/**
+ * Creates a tooltip store to control the state of
+ * [Tooltip](https://ariakit.com/components/tooltip) components.
+ * @see https://ariakit.com/components/tooltip
+ * @example
+ * ```jsx
+ * const tooltip = useTooltipStore();
+ *
+ * <TooltipAnchor store={tooltip}>Anchor</TooltipAnchor>
+ * <Tooltip store={tooltip}>Tooltip</Tooltip>
+ * ```
+ */
+declare function useTooltipStore(props?: TooltipStoreProps): TooltipStore;
+interface TooltipStoreState extends Core.TooltipStoreState, HovercardStoreState {}
+interface TooltipStoreFunctions extends Omit<Core.TooltipStoreFunctions, "disclosure">, HovercardStoreFunctions {}
+interface TooltipStoreOptions extends Omit<Core.TooltipStoreOptions, "disclosure">, HovercardStoreOptions {}
+interface TooltipStoreProps extends TooltipStoreOptions, Omit<Core.TooltipStoreProps, "disclosure"> {}
+interface TooltipStore extends TooltipStoreFunctions, Omit<Store<Core.TooltipStore>, "disclosure"> {}
+//#endregion
+export { TooltipStore, TooltipStoreFunctions, TooltipStoreOptions, TooltipStoreProps, TooltipStoreState, useTooltipStore, useTooltipStoreProps };
+//# sourceMappingURL=tooltip-store.d.ts.map

package/dist/tooltip/tooltip-store.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-store.d.ts","names":["Core","Store","HovercardStoreFunctions","HovercardStoreOptions","HovercardStoreState","useTooltipStoreProps","T","TooltipStore","TooltipStoreProps","_$___disclosure_disclosure_store_ts0","DisclosureStore","store","update","props","disclosure","useTooltipStore","TooltipStoreState","TooltipStoreFunctions","Omit","TooltipStoreOptions"],"sources":["../../src/tooltip/tooltip-store.d.ts"],"mappings":";;;;;;iBAGwBK,oBAAAA,WAA+BL,IAAAA,CAAKO,YAAAA,CAAAA,CAAcI,KAAAA,EAAOL,CAAAA,EAAGM,MAAAA,cAAoBC,KAAAA,EAAOL,iBAAAA,GAAoBF,CAAAA;EAC/HQ,UAAAA,EADgIL,eAAAA;AAAAA;AAApI;;;;;;;;;;;;AAAA,iBAewBM,eAAAA,CAAgBF,KAAAA,GAAQL,iBAAAA,GAAoBD,YAAY;AAAA,UAC/DS,iBAAAA,SAA0BhB,IAAAA,CAAKgB,iBAAAA,EAAmBZ,mBAAmB;AAAA,UAErEa,qBAAAA,SAA8BC,IAAAA,CAAKlB,IAAAA,CAAKiB,qBAAAA,iBAAsCf,uBAAAA;AAAAA,UAE9EiB,mBAAAA,SAA4BD,IAAAA,CAAKlB,IAAAA,CAAKmB,mBAAAA,iBAAoChB,qBAAAA;AAAAA,UAE1EK,iBAAAA,SAA0BW,mBAAAA,EAAqBD,IAAAA,CAAKlB,IAAAA,CAAKQ,iBAAAA;AAAAA,UAEzDD,YAAAA,SAAqBU,qBAAAA,EAAuBC,IAAAA,CAAKjB,KAAAA,CAAMD,IAAAA,CAAKO,YAAAA"}

package/dist/tooltip/tooltip-store.js

@@ -0,0 +1,30 @@
+"use client";
+import { useHovercardStoreProps } from "../hovercard/hovercard-store.js";
+import { useStore, useStoreProps } from "@ariakit/react-store";
+import * as Core from "@ariakit/components/tooltip/tooltip-store";
+//#region src/tooltip/tooltip-store.ts
+function useTooltipStoreProps(store, update, props) {
+	useStoreProps(store, props, "type");
+	useStoreProps(store, props, "skipTimeout");
+	return useHovercardStoreProps(store, update, props);
+}
+/**
+* Creates a tooltip store to control the state of
+* [Tooltip](https://ariakit.com/components/tooltip) components.
+* @see https://ariakit.com/components/tooltip
+* @example
+* ```jsx
+* const tooltip = useTooltipStore();
+*
+* <TooltipAnchor store={tooltip}>Anchor</TooltipAnchor>
+* <Tooltip store={tooltip}>Tooltip</Tooltip>
+* ```
+*/
+function useTooltipStore(props = {}) {
+	const [store, update] = useStore(Core.createTooltipStore, props);
+	return useTooltipStoreProps(store, update, props);
+}
+//#endregion
+export { useTooltipStore, useTooltipStoreProps };
+
+//# sourceMappingURL=tooltip-store.js.map

package/dist/tooltip/tooltip-store.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip-store.js","names":[],"sources":["../../src/tooltip/tooltip-store.ts"],"sourcesContent":["import * as Core from \"@ariakit/components/tooltip/tooltip-store\";\nimport { useStore, useStoreProps } from \"@ariakit/react-store\";\nimport type { Store } from \"@ariakit/react-store\";\nimport type {\n  HovercardStoreFunctions,\n  HovercardStoreOptions,\n  HovercardStoreState,\n} from \"../hovercard/hovercard-store.ts\";\nimport { useHovercardStoreProps } from \"../hovercard/hovercard-store.ts\";\n\nexport function useTooltipStoreProps<T extends Core.TooltipStore>(\n  store: T,\n  update: () => void,\n  props: TooltipStoreProps,\n) {\n  useStoreProps(store, props, \"type\");\n  useStoreProps(store, props, \"skipTimeout\");\n  return useHovercardStoreProps(store, update, props);\n}\n\n/**\n * Creates a tooltip store to control the state of\n * [Tooltip](https://ariakit.com/components/tooltip) components.\n * @see https://ariakit.com/components/tooltip\n * @example\n * ```jsx\n * const tooltip = useTooltipStore();\n *\n * <TooltipAnchor store={tooltip}>Anchor</TooltipAnchor>\n * <Tooltip store={tooltip}>Tooltip</Tooltip>\n * ```\n */\nexport function useTooltipStore(props: TooltipStoreProps = {}): TooltipStore {\n  const [store, update] = useStore(Core.createTooltipStore, props);\n  return useTooltipStoreProps(store, update, props);\n}\n\nexport interface TooltipStoreState\n  extends Core.TooltipStoreState, HovercardStoreState {}\n\nexport interface TooltipStoreFunctions\n  extends\n    Omit<Core.TooltipStoreFunctions, \"disclosure\">,\n    HovercardStoreFunctions {}\n\nexport interface TooltipStoreOptions\n  extends Omit<Core.TooltipStoreOptions, \"disclosure\">, HovercardStoreOptions {}\n\nexport interface TooltipStoreProps\n  extends TooltipStoreOptions, Omit<Core.TooltipStoreProps, \"disclosure\"> {}\n\nexport interface TooltipStore\n  extends TooltipStoreFunctions, Omit<Store<Core.TooltipStore>, \"disclosure\"> {}\n"],"mappings":";;;;;SAeE,qBAA4B,OAAM,QAAA,OAAA;CAClC,cAAc,OAAO,OAAO,MAAA;CAC5B,cAAO,OAAA,OAAA,aAA8B;CACvC,OAAA,uBAAA,OAAA,QAAA,KAAA;;;;;;;;;;;;;;SAeS,gBAAiB,QAAA,CAAS,GAAA;CACjC,MAAA,CAAO,OAAA,UAAA,SAAqB,KAAO,oBAAa,KAAA;CAClD,OAAA,qBAAA,OAAA,QAAA,KAAA"}

package/dist/tooltip/tooltip.d.ts

@@ -0,0 +1,61 @@
+import { HovercardOptions } from "../hovercard/hovercard.js";
+import { TooltipStore } from "./tooltip-store.js";
+import { Props } from "@ariakit/react-utils";
+import { ElementType } from "react";
+
+//#region src/tooltip/tooltip.d.ts
+declare const TagName = "div";
+type TagName = typeof TagName;
+/**
+ * Returns props to create a `Tooltip` component.
+ * @see https://ariakit.com/components/tooltip
+ * @example
+ * ```jsx
+ * const store = useToolTipStore();
+ * const props = useTooltip({ store });
+ * <TooltipAnchor store={store}>Anchor</TooltipAnchor>
+ * <Role {...props}>Tooltip</Role>
+ * ```
+ */
+declare const useTooltip: import("@ariakit/react-utils").Hook<"div", TooltipOptions<"div">>;
+/**
+ * Renders a tooltip element that visually describes a
+ * [`TooltipAnchor`](https://ariakit.com/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.com/components/tooltip#tooltip-anchors-must-have-accessible-names)
+ * @see https://ariakit.com/components/tooltip
+ * @example
+ * ```jsx {3}
+ * <TooltipProvider>
+ *   <TooltipAnchor>Anchor</TooltipAnchor>
+ *   <Tooltip>Tooltip</Tooltip>
+ * </TooltipProvider>
+ * ```
+ */
+declare const Tooltip: (props: TooltipProps<"div">) => import("react/jsx-runtime").JSX.Element | null;
+interface TooltipOptions<T extends ElementType = TagName> extends HovercardOptions<T> {
+  /**
+   * Object returned by the
+   * [`useTooltipStore`](https://ariakit.com/reference/use-tooltip-store) hook.
+   * If not provided, the closest
+   * [`TooltipProvider`](https://ariakit.com/reference/tooltip-provider)
+   * component's context will be used.
+   */
+  store?: TooltipStore;
+  /**
+   * @default true
+   */
+  portal?: HovercardOptions<T>["portal"];
+  /**
+   * @default 8
+   */
+  gutter?: HovercardOptions<T>["gutter"];
+}
+type TooltipProps<T extends ElementType = TagName> = Props<T, TooltipOptions<T>>;
+//#endregion
+export { Tooltip, TooltipOptions, TooltipProps, useTooltip };
+//# sourceMappingURL=tooltip.d.ts.map

package/dist/tooltip/tooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.d.ts","names":["Props","ElementType","HovercardOptions","TooltipStore","TagName","useTooltip","TooltipOptions","Hook","Tooltip","TooltipProps","props","JSX","Element","T","store","portal","gutter"],"sources":["../../src/tooltip/tooltip.d.ts"],"mappings":";;;;;;cAIcI,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAF0B;;;;AAClC;AAAA;;;;AACQ;AAY7B;AAduD,cAclCC,UAAAA,iCAA2CE,IAAAA,QAAYD,cAAc;;;AAAA;AAmB1F;;;;;;;;;AAAqG;AACrG;;;;;cADqBE,OAAAA,GAAUE,KAAAA,EAAOD,YAAY,wCAAwCE,GAAAA,CAAIC,OAAAA;AAAAA,UAC7EN,cAAAA,WAAyBL,WAAAA,GAAcG,OAAAA,UAAiBF,gBAAAA,CAAiBW,CAAAA;EAY5DA;;;;;;;EAJ1BC,KAAAA,GAAQX,YAAAA;EAR8BF;;;EAYtCc,MAAAA,GAASb,gBAAAA,CAAiBW,CAAAA;EAJ1BC;;;EAQAE,MAAAA,GAASd,gBAAAA,CAAiBW,CAAAA;AAAAA;AAAAA,KAElBJ,YAAAA,WAAuBR,WAAAA,GAAcG,OAAAA,IAAWJ,KAAAA,CAAMa,CAAAA,EAAGP,cAAAA,CAAeO,CAAAA"}

package/dist/tooltip/tooltip.js

@@ -0,0 +1,81 @@
+"use client";
+import { createDialogComponent } from "../dialog/dialog.js";
+import { useHovercard } from "../hovercard/hovercard.js";
+import { TooltipScopedContextProvider, useTooltipProviderContext } from "./tooltip-context.js";
+import { createElement, createHook, forwardRef, useWrapElement } from "@ariakit/react-utils";
+import { contains, invariant, isFalsyBooleanCallback } from "@ariakit/utils";
+import { jsx } from "react/jsx-runtime";
+import { useStoreState } from "@ariakit/react-store";
+//#region src/tooltip/tooltip.tsx
+const TagName = "div";
+/**
+* Returns props to create a `Tooltip` component.
+* @see https://ariakit.com/components/tooltip
+* @example
+* ```jsx
+* const store = useToolTipStore();
+* const props = useTooltip({ store });
+* <TooltipAnchor store={store}>Anchor</TooltipAnchor>
+* <Role {...props}>Tooltip</Role>
+* ```
+*/
+const useTooltip = createHook(function useTooltip({ store, portal = true, gutter = 8, preserveTabOrder = false, hideOnHoverOutside = true, hideOnInteractOutside = true, ...props }) {
+	const context = useTooltipProviderContext();
+	store = store || context;
+	invariant(store, "Tooltip must receive a `store` prop or be wrapped in a TooltipProvider component.");
+	props = useWrapElement(props, (element) => /* @__PURE__ */ jsx(TooltipScopedContextProvider, {
+		value: store,
+		children: element
+	}), [store]);
+	props = {
+		role: useStoreState(store, (state) => state.type === "description" ? "tooltip" : "none"),
+		...props
+	};
+	props = useHovercard({
+		...props,
+		store,
+		portal,
+		gutter,
+		preserveTabOrder,
+		hideOnHoverOutside(event) {
+			if (isFalsyBooleanCallback(hideOnHoverOutside, event)) return false;
+			const anchorElement = store?.getState().anchorElement;
+			if (!anchorElement) return true;
+			if ("focusVisible" in anchorElement.dataset) return false;
+			return true;
+		},
+		hideOnInteractOutside: (event) => {
+			if (isFalsyBooleanCallback(hideOnInteractOutside, event)) return false;
+			const anchorElement = store?.getState().anchorElement;
+			if (!anchorElement) return true;
+			if (contains(anchorElement, event.target)) return false;
+			return true;
+		}
+	});
+	return props;
+});
+/**
+* Renders a tooltip element that visually describes a
+* [`TooltipAnchor`](https://ariakit.com/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.com/components/tooltip#tooltip-anchors-must-have-accessible-names)
+* @see https://ariakit.com/components/tooltip
+* @example
+* ```jsx {3}
+* <TooltipProvider>
+*   <TooltipAnchor>Anchor</TooltipAnchor>
+*   <Tooltip>Tooltip</Tooltip>
+* </TooltipProvider>
+* ```
+*/
+const Tooltip = createDialogComponent(forwardRef(function Tooltip(props) {
+	return createElement(TagName, useTooltip(props));
+}), useTooltipProviderContext);
+//#endregion
+export { Tooltip, useTooltip };
+
+//# sourceMappingURL=tooltip.js.map

package/dist/tooltip/tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tooltip.js","names":[],"sources":["../../src/tooltip/tooltip.tsx"],"sourcesContent":["import { useStoreState } from \"@ariakit/react-store\";\nimport {\n  useWrapElement,\n  createElement,\n  createHook,\n  forwardRef,\n} from \"@ariakit/react-utils\";\nimport type { Props } from \"@ariakit/react-utils\";\nimport { contains, invariant, isFalsyBooleanCallback } from \"@ariakit/utils\";\nimport type { ElementType } from \"react\";\nimport { createDialogComponent } from \"../dialog/dialog.tsx\";\nimport type { HovercardOptions } from \"../hovercard/hovercard.tsx\";\nimport { useHovercard } from \"../hovercard/hovercard.tsx\";\nimport {\n  TooltipScopedContextProvider,\n  useTooltipProviderContext,\n} from \"./tooltip-context.tsx\";\nimport type { TooltipStore } from \"./tooltip-store.ts\";\n\nconst TagName = \"div\" satisfies ElementType;\ntype TagName = typeof TagName;\n\n/**\n * Returns props to create a `Tooltip` component.\n * @see https://ariakit.com/components/tooltip\n * @example\n * ```jsx\n * const store = useToolTipStore();\n * const props = useTooltip({ store });\n * <TooltipAnchor store={store}>Anchor</TooltipAnchor>\n * <Role {...props}>Tooltip</Role>\n * ```\n */\nexport const useTooltip = createHook<TagName, TooltipOptions>(\n  function useTooltip({\n    store,\n    portal = true,\n    gutter = 8,\n    preserveTabOrder = false,\n    hideOnHoverOutside = true,\n    hideOnInteractOutside = true,\n    ...props\n  }) {\n    const context = useTooltipProviderContext();\n    store = store || context;\n\n    invariant(\n      store,\n      process.env.NODE_ENV !== \"production\" &&\n        \"Tooltip must receive a `store` prop or be wrapped in a TooltipProvider component.\",\n    );\n\n    props = useWrapElement(\n      props,\n      (element) => (\n        <TooltipScopedContextProvider value={store}>\n          {element}\n        </TooltipScopedContextProvider>\n      ),\n      [store],\n    );\n\n    const role = useStoreState(store, (state) =>\n      state.type === \"description\" ? \"tooltip\" : \"none\",\n    );\n\n    props = { role, ...props };\n\n    props = useHovercard({\n      ...props,\n      store,\n      portal,\n      gutter,\n      preserveTabOrder,\n      hideOnHoverOutside(event) {\n        if (isFalsyBooleanCallback(hideOnHoverOutside, event)) return false;\n        const anchorElement = store?.getState().anchorElement;\n        if (!anchorElement) return true;\n        // If the anchor element has the `data-focus-visible` attribute (added\n        // by the `Focusable` component that is used by several components), we\n        // don't hide the tooltip when the mouse leaves the anchor element. In\n        // this case, the tooltip will be hidden only if the user presses the\n        // Escape key or if the anchor element loses focus.\n        if (\"focusVisible\" in anchorElement.dataset) return false;\n        return true;\n      },\n      hideOnInteractOutside: (event) => {\n        if (isFalsyBooleanCallback(hideOnInteractOutside, event)) return false;\n        const anchorElement = store?.getState().anchorElement;\n        if (!anchorElement) return true;\n        // Prevent hiding the tooltip when the user interacts with the anchor\n        // element. It's up to the developer to hide the tooltip when the user\n        // clicks on the anchor element if that's the intended behavior.\n        if (contains(anchorElement, event.target as Node)) return false;\n        return true;\n      },\n    });\n\n    return props;\n  },\n);\n\n/**\n * Renders a tooltip element that visually describes a\n * [`TooltipAnchor`](https://ariakit.com/reference/tooltip-anchor) when it\n * receives focus or is hovered.\n *\n * The tooltip is strictly for visual purposes. It's your responsibility to\n * ensure the anchor element has an accessible name. See [Tooltip anchors must\n * have accessible\n * names](https://ariakit.com/components/tooltip#tooltip-anchors-must-have-accessible-names)\n * @see https://ariakit.com/components/tooltip\n * @example\n * ```jsx {3}\n * <TooltipProvider>\n *   <TooltipAnchor>Anchor</TooltipAnchor>\n *   <Tooltip>Tooltip</Tooltip>\n * </TooltipProvider>\n * ```\n */\nexport const Tooltip = createDialogComponent(\n  forwardRef(function Tooltip(props: TooltipProps) {\n    const htmlProps = useTooltip(props);\n    return createElement(TagName, htmlProps);\n  }),\n  useTooltipProviderContext,\n);\n\nexport interface TooltipOptions<\n  T extends ElementType = TagName,\n> extends HovercardOptions<T> {\n  /**\n   * Object returned by the\n   * [`useTooltipStore`](https://ariakit.com/reference/use-tooltip-store) hook.\n   * If not provided, the closest\n   * [`TooltipProvider`](https://ariakit.com/reference/tooltip-provider)\n   * component's context will be used.\n   */\n  store?: TooltipStore;\n  /**\n   * @default true\n   */\n  portal?: HovercardOptions<T>[\"portal\"];\n  /**\n   * @default 8\n   */\n  gutter?: HovercardOptions<T>[\"gutter\"];\n}\n\nexport type TooltipProps<T extends ElementType = TagName> = Props<\n  T,\n  TooltipOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;MA2CI,aAAgB,WAAA,SAAA,WAA0B,EAAA,OAAA,SAAA,MAAA,SAAA,GAAA,mBAAA,OAAA,qBAAA,MAAA,wBAAA,MAAA,GAAA,SAAA;CAC1C,MAAA,UAAQ,0BAAS;CAEjB,QAAA,SAGI;CAGJ,UAAQ,OAAA,mFAGJ;SAAqC,eAAA,QAAA,YAAA,oBAAA,8BAAA;;EAEP,UAGlC;CAMA,CAAA,GAAA,CAAA,KAAQ,CAAA;SAJK;EAIG,MAAG,cAAA,QAAA,UAAA,MAAA,SAAA,gBAAA,YAAA,MAAA;EAAM,GAAA;CAEzB;SACK,aAAA;EACH,GAAA;EACA;EACA;EACA;EACA;qBACM,OAAA;GACJ,IAAA,uBAAsB,oBAAkB,KAAA,GAAA,OAAA;GACxC,MAAK,gBAAe,OAAO,SAAA,EAAA;GAM3B,IAAI,CAAA,eAAA,OAAkB;GACtB,IAAA,kBAAO,cAAA,SAAA,OAAA;GACT,OAAA;EACA;0BACM,UAAuB;GAC3B,IAAA,uBAAsB,uBAAkB,KAAA,GAAA,OAAA;GACxC,MAAK,gBAAe,OAAO,SAAA,EAAA;GAI3B,IAAI,CAAA,eAAS,OAAA;GACb,IAAA,SAAO,eAAA,MAAA,MAAA,GAAA,OAAA;GACT,OAAA;EACD;CAED,CAAA;CAEJ,OAAA;;;;;;;;;;;;;;;;;;;;MAuBI,UAAO,sBADW,WACqB,SAAA,QAAA,OAAA;CACxC,OACD,cAAA,SACF,WAAA,KAAA,CAAA"}

package/dist/utils-DUF1aMov.d.ts

@@ -0,0 +1,5 @@
+//#region src/heading/utils.d.ts
+type HeadingLevels = 1 | 2 | 3 | 4 | 5 | 6;
+//#endregion
+export { HeadingLevels as t };
+//# sourceMappingURL=utils-DUF1aMov.d.ts.map

package/dist/utils-DUF1aMov.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils-DUF1aMov.d.ts","names":["HeadingLevels"],"sources":["../src/heading/utils.d.ts"],"mappings":";KAAYA,aAAAA"}

package/dist/visually-hidden/visually-hidden.d.ts

@@ -0,0 +1,37 @@
+import { Options, Props } from "@ariakit/react-utils";
+import { ElementType } from "react";
+
+//#region src/visually-hidden/visually-hidden.d.ts
+declare const TagName = "span";
+type TagName = typeof TagName;
+/**
+ * Returns props to create a `VisuallyHidden` component. When applying the props
+ * returned by this hook to a component, the component will be visually hidden,
+ * but still accessible to screen readers.
+ * @see https://ariakit.com/components/visually-hidden
+ * @example
+ * ```jsx
+ * const props = useVisuallyHidden();
+ * <a href="#">
+ *   Learn more<Role {...props}> about the Solar System</Role>.
+ * </a>
+ * ```
+ */
+declare const useVisuallyHidden: import("@ariakit/react-utils").Hook<"span", VisuallyHiddenOptions<"span">>;
+/**
+ * Renders an element that's visually hidden, but still accessible to screen
+ * readers.
+ * @see https://ariakit.com/components/visually-hidden
+ * @example
+ * ```jsx
+ * <a href="#">
+ *   Learn more<VisuallyHidden> about the Solar System</VisuallyHidden>.
+ * </a>
+ * ```
+ */
+declare const VisuallyHidden: (props: VisuallyHiddenProps) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+interface VisuallyHiddenOptions<_T extends ElementType = TagName> extends Options {}
+type VisuallyHiddenProps<T extends ElementType = TagName> = Props<T, VisuallyHiddenOptions<T>>;
+//#endregion
+export { VisuallyHidden, VisuallyHiddenOptions, VisuallyHiddenProps, useVisuallyHidden };
+//# sourceMappingURL=visually-hidden.d.ts.map

package/dist/visually-hidden/visually-hidden.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"visually-hidden.d.ts","names":["Options","Props","ElementType","TagName","useVisuallyHidden","VisuallyHiddenOptions","Hook","VisuallyHidden","VisuallyHiddenProps","props","ReactElement","JSXElementConstructor","_T","T"],"sources":["../../src/visually-hidden/visually-hidden.d.ts"],"mappings":";;;;cAEcG,OAAAA;AAAAA,KACTA,OAAAA,UAAiBA,OAAO;AAFY;;;;AACpB;AAAA;;;;AACQ;AAc7B;;;AAhByC,cAgBpBC,iBAAAA,iCAAkDE,IAAAA,SAAaD,qBAAqB;AAAA;AAYzG;;;;;;;;;AAAqJ;AAZ5C,cAYpFE,cAAAA,GAAiBE,KAAAA,EAAOD,mBAAmB,qBAAqBE,YAAAA,+BAA2CC,qBAAAA;AAAAA,UAC/GN,qBAAAA,YAAiCH,WAAAA,GAAcC,OAAAA,UAAiBH,OAAAA;AAAAA,KAErEQ,mBAAAA,WAA8BN,WAAAA,GAAcC,OAAAA,IAAWF,KAAAA,CAAMY,CAAAA,EAAGR,qBAAAA,CAAsBQ,CAAAA"}

package/dist/visually-hidden/visually-hidden.js

@@ -0,0 +1,53 @@
+"use client";
+import { createElement, createHook, forwardRef } from "@ariakit/react-utils";
+//#region src/visually-hidden/visually-hidden.tsx
+const TagName = "span";
+/**
+* Returns props to create a `VisuallyHidden` component. When applying the props
+* returned by this hook to a component, the component will be visually hidden,
+* but still accessible to screen readers.
+* @see https://ariakit.com/components/visually-hidden
+* @example
+* ```jsx
+* const props = useVisuallyHidden();
+* <a href="#">
+*   Learn more<Role {...props}> about the Solar System</Role>.
+* </a>
+* ```
+*/
+const useVisuallyHidden = createHook(function useVisuallyHidden(props) {
+	props = {
+		...props,
+		style: {
+			border: 0,
+			clip: "rect(0 0 0 0)",
+			height: "1px",
+			margin: "-1px",
+			overflow: "hidden",
+			padding: 0,
+			position: "absolute",
+			whiteSpace: "nowrap",
+			width: "1px",
+			...props.style
+		}
+	};
+	return props;
+});
+/**
+* Renders an element that's visually hidden, but still accessible to screen
+* readers.
+* @see https://ariakit.com/components/visually-hidden
+* @example
+* ```jsx
+* <a href="#">
+*   Learn more<VisuallyHidden> about the Solar System</VisuallyHidden>.
+* </a>
+* ```
+*/
+const VisuallyHidden = forwardRef(function VisuallyHidden(props) {
+	return createElement(TagName, useVisuallyHidden(props));
+});
+//#endregion
+export { VisuallyHidden, useVisuallyHidden };
+
+//# sourceMappingURL=visually-hidden.js.map

package/dist/visually-hidden/visually-hidden.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"visually-hidden.js","names":[],"sources":["../../src/visually-hidden/visually-hidden.tsx"],"sourcesContent":["import { createElement, createHook, forwardRef } from \"@ariakit/react-utils\";\nimport type { Options, Props } from \"@ariakit/react-utils\";\nimport type { ElementType } from \"react\";\n\nconst TagName = \"span\" satisfies ElementType;\ntype TagName = typeof TagName;\n\n/**\n * Returns props to create a `VisuallyHidden` component. When applying the props\n * returned by this hook to a component, the component will be visually hidden,\n * but still accessible to screen readers.\n * @see https://ariakit.com/components/visually-hidden\n * @example\n * ```jsx\n * const props = useVisuallyHidden();\n * <a href=\"#\">\n *   Learn more<Role {...props}> about the Solar System</Role>.\n * </a>\n * ```\n */\nexport const useVisuallyHidden = createHook<TagName, VisuallyHiddenOptions>(\n  function useVisuallyHidden(props) {\n    props = {\n      ...props,\n      style: {\n        border: 0,\n        clip: \"rect(0 0 0 0)\",\n        height: \"1px\",\n        margin: \"-1px\",\n        overflow: \"hidden\",\n        padding: 0,\n        position: \"absolute\",\n        whiteSpace: \"nowrap\",\n        width: \"1px\",\n        ...props.style,\n      },\n    };\n    return props;\n  },\n);\n\n/**\n * Renders an element that's visually hidden, but still accessible to screen\n * readers.\n * @see https://ariakit.com/components/visually-hidden\n * @example\n * ```jsx\n * <a href=\"#\">\n *   Learn more<VisuallyHidden> about the Solar System</VisuallyHidden>.\n * </a>\n * ```\n */\nexport const VisuallyHidden = forwardRef(function VisuallyHidden(\n  props: VisuallyHiddenProps,\n) {\n  const htmlProps = useVisuallyHidden(props);\n  return createElement(TagName, htmlProps);\n});\n\nexport interface VisuallyHiddenOptions<\n  _T extends ElementType = TagName,\n> extends Options {}\n\nexport type VisuallyHiddenProps<T extends ElementType = TagName> = Props<\n  T,\n  VisuallyHiddenOptions<T>\n>;\n"],"mappings":";;;;;;;;;;;;;;;;;MAsBI,oBAAQ,WAAA,SAAA,kBAAA,OAAA;SACH;EACH,GAAA;SACE;GACA,QAAM;GACN,MAAA;GACA,QAAQ;GACR,QAAA;GACA,UAAS;GACT,SAAA;GACA,UAAA;GACA,YAAO;GACP,OAAG;GACL,GAAA,MAAA;EACF;CACA;CAEJ,OAAA;;;;;;;;;;;;;MAiBE,iBAAqB,WADH,SAAA,eACqB,OAAA;CACxC,OAAA,cAAA,SAAA,kBAAA,KAAA,CAAA"}

package/license

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025-present Ariakit FZ-LLC
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.