@ariakit/react-core 0.1.8 → 0.2.1

package/cjs/tooltip/tooltip-arrow.cjs

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _ACYEPHBQcjs = require('../__chunks/ACYEPHBQ.cjs');
+var _BCZSOD7Rcjs = require('../__chunks/BCZSOD7R.cjs');
 require('../__chunks/4K6QJIPX.cjs');
 require('../__chunks/W5PBA4D6.cjs');
 
@@ -10,7 +10,7 @@ var _ESS3KXVEcjs = require('../__chunks/ESS3KXVE.cjs');
 
 
 
-var _7NAIPZYNcjs = require('../__chunks/7NAIPZYN.cjs');
+var _5U7AP6Y2cjs = require('../__chunks/5U7AP6Y2.cjs');
 require('../__chunks/NREUHWTU.cjs');
 require('../__chunks/2X5K3J7Y.cjs');
 
@@ -21,7 +21,7 @@ var _6455U47Tcjs = require('../__chunks/6455U47T.cjs');
 // src/tooltip/tooltip-arrow.ts
 var _react = require('react');
 var _misc = require('@ariakit/core/utils/misc');
-var useTooltipArrow = _7NAIPZYNcjs.createHook.call(void 0, 
+var useTooltipArrow = _5U7AP6Y2cjs.createHook.call(void 0, 
   (_a) => {
     var _b = _a, { store, size = 16 } = _b, props = _6455U47Tcjs.__objRest.call(void 0, _b, ["store", "size"]);
     const context = _react.useContext.call(void 0, _ESS3KXVEcjs.TooltipContext);
@@ -30,13 +30,13 @@ var useTooltipArrow = _7NAIPZYNcjs.createHook.call(void 0,
       store,
       process.env.NODE_ENV !== "production" && "TooltipArrow must be wrapped in a Tooltip component"
     );
-    props = _ACYEPHBQcjs.usePopoverArrow.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, { store, size }, props));
+    props = _BCZSOD7Rcjs.usePopoverArrow.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, { store, size }, props));
     return props;
   }
 );
-var TooltipArrow = _7NAIPZYNcjs.createComponent.call(void 0, (props) => {
+var TooltipArrow = _5U7AP6Y2cjs.createComponent.call(void 0, (props) => {
   const htmlProps = useTooltipArrow(props);
-  return _7NAIPZYNcjs.createElement.call(void 0, "div", htmlProps);
+  return _5U7AP6Y2cjs.createElement.call(void 0, "div", htmlProps);
 });
 if (process.env.NODE_ENV !== "production") {
   TooltipArrow.displayName = "TooltipArrow";

package/cjs/tooltip/tooltip-store.cjs

@@ -1,7 +1,8 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }
 
 
-var _AUDANYMJcjs = require('../__chunks/AUDANYMJ.cjs');
+var _27JG67F3cjs = require('../__chunks/27JG67F3.cjs');
+require('../__chunks/W2XKIB23.cjs');
 require('../__chunks/RD47UJK7.cjs');
 require('../__chunks/P7TWEJ6I.cjs');
 
@@ -16,10 +17,10 @@ var _6455U47Tcjs = require('../__chunks/6455U47T.cjs');
 // src/tooltip/tooltip-store.ts
 var _tooltipstore = require('@ariakit/core/tooltip/tooltip-store'); var Core = _interopRequireWildcard(_tooltipstore);
 function useTooltipStoreOptions(props) {
-  return _AUDANYMJcjs.usePopoverStoreOptions.call(void 0, props);
+  return _27JG67F3cjs.useHovercardStoreOptions.call(void 0, props);
 }
 function useTooltipStoreProps(store, props) {
-  return _AUDANYMJcjs.usePopoverStoreProps.call(void 0, store, props);
+  return _27JG67F3cjs.useHovercardStoreProps.call(void 0, store, props);
 }
 function useTooltipStore(props = {}) {
   const options = useTooltipStoreOptions(props);

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

@@ -1,19 +1,7 @@
 import * as Core from "@ariakit/core/tooltip/tooltip-store";
-import type { PopoverStoreFunctions, PopoverStoreOptions, PopoverStoreState } from "../popover/popover-store.js";
+import type { HovercardStoreFunctions, HovercardStoreOptions, HovercardStoreState } from "../hovercard/hovercard-store.js";
 import type { Store } from "../utils/store.js";
-export declare function useTooltipStoreOptions(props: TooltipStoreProps): {
-    getAnchorRect: ((anchor: HTMLElement | null) => {
-        x?: number | undefined;
-        y?: number | undefined;
-        width?: number | undefined;
-        height?: number | undefined;
-    } | null) | undefined;
-    renderCallback: ((props: import("@ariakit/core/popover/popover-store").PopoverStoreRenderCallbackProps) => void | (() => void)) | undefined;
-    setOpen?: ((open: boolean) => void) | undefined;
-    defaultOpen?: boolean | undefined;
-    open?: boolean | undefined;
-    animated?: number | boolean | undefined;
-};
+export declare function useTooltipStoreOptions(props: TooltipStoreProps): Partial<import("../disclosure/disclosure-store.js").DisclosureStoreOptions>;
 export declare function useTooltipStoreProps<T extends TooltipStore>(store: T, props: TooltipStoreProps): T;
 /**
  * Creates a tooltip store.
@@ -26,11 +14,11 @@ export declare function useTooltipStoreProps<T extends TooltipStore>(store: T, p
  * ```
  */
 export declare function useTooltipStore(props?: TooltipStoreProps): TooltipStore;
-export interface TooltipStoreState extends Core.TooltipStoreState, PopoverStoreState {
+export interface TooltipStoreState extends Core.TooltipStoreState, HovercardStoreState {
 }
-export interface TooltipStoreFunctions extends Core.TooltipStoreFunctions, PopoverStoreFunctions {
+export interface TooltipStoreFunctions extends Core.TooltipStoreFunctions, HovercardStoreFunctions {
 }
-export interface TooltipStoreOptions extends Core.TooltipStoreOptions, PopoverStoreOptions {
+export interface TooltipStoreOptions extends Core.TooltipStoreOptions, HovercardStoreOptions {
 }
 export type TooltipStoreProps = TooltipStoreOptions & Core.TooltipStoreProps;
 export type TooltipStore = TooltipStoreFunctions & Store<Core.TooltipStore>;

package/cjs/tooltip/tooltip.cjs

@@ -1,22 +1,42 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _PFD4TS6Bcjs = require('../__chunks/PFD4TS6B.cjs');
-require('../__chunks/C7Y26CUV.cjs');
+var _CKE57WQNcjs = require('../__chunks/CKE57WQN.cjs');
+require('../__chunks/OLGMV24U.cjs');
+require('../__chunks/VGBJOLSN.cjs');
+require('../__chunks/TUFFT567.cjs');
+require('../__chunks/XUWGEELZ.cjs');
+require('../__chunks/O45IXGJW.cjs');
+require('../__chunks/TVZPJJTX.cjs');
+require('../__chunks/QRAQT522.cjs');
+require('../__chunks/NZYGNCZL.cjs');
+require('../__chunks/E5VOJWDR.cjs');
+require('../__chunks/56NPFF7P.cjs');
+require('../__chunks/W32FX7DM.cjs');
+require('../__chunks/CARNFZQT.cjs');
+require('../__chunks/NR3SJH64.cjs');
+require('../__chunks/4OQMTZXW.cjs');
+require('../__chunks/EE6OIU6X.cjs');
+require('../__chunks/X2GXTE3P.cjs');
+require('../__chunks/SOPRUU56.cjs');
+require('../__chunks/UVIQSLIV.cjs');
+require('../__chunks/E33OSNZR.cjs');
 require('../__chunks/NS56XHXG.cjs');
-
-
-var _EM2PMFEWcjs = require('../__chunks/EM2PMFEW.cjs');
+require('../__chunks/CQSUIL2D.cjs');
+require('../__chunks/N2VCZZLP.cjs');
+require('../__chunks/245ESIYY.cjs');
+require('../__chunks/BICG74YF.cjs');
+require('../__chunks/W5PBA4D6.cjs');
 
 
 var _ESS3KXVEcjs = require('../__chunks/ESS3KXVE.cjs');
-require('../__chunks/QTPUX3NM.cjs');
-
+require('../__chunks/FXWXPSLI.cjs');
+require('../__chunks/LHHW5ZQP.cjs');
+require('../__chunks/VYKCWICK.cjs');
 
 
 
-var _7NAIPZYNcjs = require('../__chunks/7NAIPZYN.cjs');
-
 
+var _5U7AP6Y2cjs = require('../__chunks/5U7AP6Y2.cjs');
 
 
 var _NREUHWTUcjs = require('../__chunks/NREUHWTU.cjs');
@@ -28,88 +48,67 @@ require('../__chunks/2X5K3J7Y.cjs');
 var _6455U47Tcjs = require('../__chunks/6455U47T.cjs');
 
 // src/tooltip/tooltip.tsx
-var _react = require('react');
-var _events = require('@ariakit/core/utils/events');
+var _dom = require('@ariakit/core/utils/dom');
+var _misc = require('@ariakit/core/utils/misc');
 var _jsxruntime = require('react/jsx-runtime');
-var useTooltip = _7NAIPZYNcjs.createHook.call(void 0, 
+var useTooltip = _5U7AP6Y2cjs.createHook.call(void 0, 
   (_a) => {
     var _b = _a, {
       store,
       portal = true,
-      hideOnEscape = true,
-      hideOnControl = false,
-      wrapperProps
+      gutter = 8,
+      preserveTabOrder = false,
+      hideOnHoverOutside = true,
+      hideOnInteractOutside = true
     } = _b, props = _6455U47Tcjs.__objRest.call(void 0, _b, [
       "store",
       "portal",
-      "hideOnEscape",
-      "hideOnControl",
-      "wrapperProps"
+      "gutter",
+      "preserveTabOrder",
+      "hideOnHoverOutside",
+      "hideOnInteractOutside"
     ]);
-    const popoverElement = store.useState("popoverElement");
-    const contentElement = store.useState("contentElement");
-    _NREUHWTUcjs.useSafeLayoutEffect.call(void 0, () => {
-      const wrapper = popoverElement;
-      const popover = contentElement;
-      if (!wrapper)
-        return;
-      if (!popover)
-        return;
-      wrapper.style.zIndex = getComputedStyle(popover).zIndex;
-    }, [popoverElement, contentElement]);
-    const hideOnEscapeProp = _NREUHWTUcjs.useBooleanEvent.call(void 0, hideOnEscape);
-    const hideOnControlProp = _NREUHWTUcjs.useBooleanEvent.call(void 0, hideOnControl);
-    const open = store.useState("open");
-    _react.useEffect.call(void 0, () => {
-      if (!open)
-        return;
-      return _events.addGlobalEventListener.call(void 0, "keydown", (event) => {
-        if (event.defaultPrevented)
-          return;
-        const isEscape = event.key === "Escape" && hideOnEscapeProp(event);
-        const isControl = event.key === "Control" && hideOnControlProp(event);
-        if (isEscape || isControl) {
-          store.hide();
-        }
-      });
-    }, [store, open, hideOnEscapeProp, hideOnControlProp]);
-    const position = store.useState(
-      (state) => state.fixed ? "fixed" : "absolute"
-    );
-    props = _NREUHWTUcjs.useWrapElement.call(void 0, 
-      props,
-      (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        "div",
-        _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {
-          role: "presentation"
-        }, wrapperProps), {
-          style: _6455U47Tcjs.__spreadValues.call(void 0, {
-            position,
-            top: 0,
-            left: 0
-          }, wrapperProps == null ? void 0 : wrapperProps.style),
-          ref: store.setPopoverElement,
-          children: element
-        })
-      ),
-      [store, position, wrapperProps]
-    );
     props = _NREUHWTUcjs.useWrapElement.call(void 0, 
       props,
       (element) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ESS3KXVEcjs.TooltipContext.Provider, { value: store, children: element }),
       [store]
     );
-    props = _6455U47Tcjs.__spreadValues.call(void 0, {
-      role: "tooltip"
-    }, props);
-    props = _EM2PMFEWcjs.useDisclosureContent.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, { store }, props));
-    props = _PFD4TS6Bcjs.usePortal.call(void 0, _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, { portal }, props), { preserveTabOrder: false }));
+    const role = store.useState(
+      (state) => state.type === "description" ? "tooltip" : "none"
+    );
+    props = _6455U47Tcjs.__spreadValues.call(void 0, { role }, props);
+    props = _CKE57WQNcjs.useHovercard.call(void 0, _6455U47Tcjs.__spreadProps.call(void 0, _6455U47Tcjs.__spreadValues.call(void 0, {}, props), {
+      store,
+      portal,
+      gutter,
+      preserveTabOrder,
+      hideOnHoverOutside: (event) => {
+        if (_misc.isFalsyBooleanCallback.call(void 0, hideOnHoverOutside, event))
+          return false;
+        const { anchorElement } = store.getState();
+        if (!anchorElement)
+          return true;
+        if ("focusVisible" in anchorElement.dataset)
+          return false;
+        return true;
+      },
+      hideOnInteractOutside: (event) => {
+        if (_misc.isFalsyBooleanCallback.call(void 0, hideOnInteractOutside, event))
+          return false;
+        const { anchorElement } = store.getState();
+        if (!anchorElement)
+          return true;
+        if (_dom.contains.call(void 0, anchorElement, event.target))
+          return false;
+        return true;
+      }
+    }));
     return props;
   }
 );
-var Tooltip = _7NAIPZYNcjs.createComponent.call(void 0, (props) => {
+var Tooltip = _5U7AP6Y2cjs.createComponent.call(void 0, (props) => {
   const htmlProps = useTooltip(props);
-  return _7NAIPZYNcjs.createElement.call(void 0, "div", htmlProps);
+  return _5U7AP6Y2cjs.createElement.call(void 0, "div", htmlProps);
 });
 if (process.env.NODE_ENV !== "production") {
   Tooltip.displayName = "Tooltip";

package/cjs/tooltip/tooltip.d.ts

@@ -1,7 +1,4 @@
-import type { HTMLAttributes } from "react";
-import type { BooleanOrCallback } from "@ariakit/core/utils/types";
-import type { DisclosureContentOptions } from "../disclosure/disclosure-content.js";
-import type { PortalOptions } from "../portal/portal.js";
+import type { HovercardOptions } from "../hovercard/hovercard.js";
 import type { As, Props } from "../utils/types.js";
 import type { TooltipStore } from "./tooltip-store.js";
 /**
@@ -27,30 +24,14 @@ export declare const useTooltip: import("../utils/types.js").Hook<TooltipOptions
  * ```
  */
 export declare const Tooltip: import("../utils/types.js").Component<TooltipOptions<"div">>;
-export interface TooltipOptions<T extends As = "div"> extends DisclosureContentOptions<T>, Omit<PortalOptions<T>, "preserveTabOrder"> {
+export interface TooltipOptions<T extends As = "div"> extends HovercardOptions<T> {
     /**
      * Object returned by the `useTooltipStore` hook.
      */
     store: TooltipStore;
-    /**
-     * Determines whether the tooltip will be hidden when the user presses the
-     * Escape key.
-     * @default true
-     */
-    hideOnEscape?: BooleanOrCallback<KeyboardEvent>;
-    /**
-     * Determines whether the tooltip will be hidden when the user presses the
-     * Control key. This has been proposed as an alternative to the Escape key,
-     * which may introduce some issues, especially when tooltips are used within
-     * dialogs that also hide on Escape. See
-     * https://github.com/w3c/aria-practices/issues/1506
-     * @default false
-     */
-    hideOnControl?: BooleanOrCallback<KeyboardEvent>;
-    /**
-     * Props that will be passed to the popover wrapper element. This element
-     * will be used to position the popover.
-     */
-    wrapperProps?: HTMLAttributes<HTMLDivElement>;
+    /** @default true */
+    portal?: HovercardOptions<T>["portal"];
+    /** @default 8 */
+    gutter?: HovercardOptions<T>["gutter"];
 }
 export type TooltipProps<T extends As = "div"> = Props<TooltipOptions<T>>;