@vx-oss/heroui-v2-tooltip 2.2.25-alpha.0

package/dist/use-tooltip.js

@@ -0,0 +1,230 @@
+"use client";
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/use-tooltip.ts
+var use_tooltip_exports = {};
+__export(use_tooltip_exports, {
+  useTooltip: () => useTooltip
+});
+module.exports = __toCommonJS(use_tooltip_exports);
+var import_react = require("react");
+var import_tooltip = require("@react-stately/tooltip");
+var import_tooltip2 = require("@react-aria/tooltip");
+var import_overlays = require("@react-aria/overlays");
+var import_heroui_v2_system = require("@vx-oss/heroui-v2-system");
+var import_heroui_v2_theme = require("@vx-oss/heroui-v2-theme");
+var import_heroui_v2_shared_utils = require("@vx-oss/heroui-v2-shared-utils");
+var import_heroui_v2_react_utils = require("@vx-oss/heroui-v2-react-utils");
+var import_heroui_v2_react_utils2 = require("@vx-oss/heroui-v2-react-utils");
+var import_react2 = require("react");
+var import_heroui_v2_aria_utils = require("@vx-oss/heroui-v2-aria-utils");
+var import_heroui_v2_use_safe_layout_effect = require("@vx-oss/heroui-v2-use-safe-layout-effect");
+var import_heroui_v2_use_aria_overlay = require("@vx-oss/heroui-v2-use-aria-overlay");
+function useTooltip(originalProps) {
+  var _a, _b;
+  const globalContext = (0, import_heroui_v2_system.useProviderContext)();
+  const [props, variantProps] = (0, import_heroui_v2_system.mapPropsVariants)(originalProps, import_heroui_v2_theme.popover.variantKeys);
+  const {
+    ref,
+    as,
+    isOpen: isOpenProp,
+    content,
+    children,
+    defaultOpen,
+    onOpenChange,
+    isDisabled,
+    trigger: triggerAction,
+    shouldFlip = true,
+    containerPadding = 12,
+    placement: placementProp = "top",
+    delay = 0,
+    closeDelay = 500,
+    showArrow = false,
+    offset = 7,
+    crossOffset = 0,
+    isDismissable,
+    shouldCloseOnBlur = true,
+    portalContainer,
+    isKeyboardDismissDisabled = false,
+    updatePositionDeps = [],
+    shouldCloseOnInteractOutside,
+    className,
+    onClose,
+    motionProps,
+    classNames,
+    ...otherProps
+  } = props;
+  const Component = as || "div";
+  const disableAnimation = (_b = (_a = originalProps == null ? void 0 : originalProps.disableAnimation) != null ? _a : globalContext == null ? void 0 : globalContext.disableAnimation) != null ? _b : false;
+  const state = (0, import_tooltip.useTooltipTriggerState)({
+    delay,
+    closeDelay,
+    isDisabled,
+    defaultOpen,
+    isOpen: isOpenProp,
+    onOpenChange: (isOpen2) => {
+      onOpenChange == null ? void 0 : onOpenChange(isOpen2);
+      if (!isOpen2) {
+        onClose == null ? void 0 : onClose();
+      }
+    }
+  });
+  const triggerRef = (0, import_react2.useRef)(null);
+  const overlayRef = (0, import_react2.useRef)(null);
+  const tooltipId = (0, import_react.useId)();
+  const isOpen = state.isOpen && !isDisabled;
+  (0, import_react.useImperativeHandle)(
+    ref,
+    () => (
+      // @ts-ignore
+      (0, import_heroui_v2_react_utils2.createDOMRef)(overlayRef)
+    )
+  );
+  const { triggerProps, tooltipProps: triggerTooltipProps } = (0, import_tooltip2.useTooltipTrigger)(
+    {
+      isDisabled,
+      trigger: triggerAction
+    },
+    state,
+    triggerRef
+  );
+  const { tooltipProps } = (0, import_tooltip2.useTooltip)(
+    {
+      isOpen,
+      ...(0, import_heroui_v2_shared_utils.mergeProps)(props, triggerTooltipProps)
+    },
+    state
+  );
+  const {
+    overlayProps: positionProps,
+    placement,
+    updatePosition
+  } = (0, import_overlays.useOverlayPosition)({
+    isOpen,
+    targetRef: triggerRef,
+    placement: (0, import_heroui_v2_aria_utils.toReactAriaPlacement)(placementProp),
+    overlayRef,
+    offset: showArrow ? offset + 3 : offset,
+    crossOffset,
+    shouldFlip,
+    containerPadding
+  });
+  (0, import_heroui_v2_use_safe_layout_effect.useSafeLayoutEffect)(() => {
+    if (!updatePositionDeps.length) return;
+    updatePosition();
+  }, updatePositionDeps);
+  const { overlayProps } = (0, import_heroui_v2_use_aria_overlay.useAriaOverlay)(
+    {
+      isOpen,
+      onClose: state.close,
+      isDismissable,
+      shouldCloseOnBlur,
+      isKeyboardDismissDisabled,
+      shouldCloseOnInteractOutside
+    },
+    overlayRef
+  );
+  const slots = (0, import_react2.useMemo)(
+    () => {
+      var _a2, _b2, _c;
+      return (0, import_heroui_v2_theme.popover)({
+        ...variantProps,
+        disableAnimation,
+        radius: (_a2 = originalProps == null ? void 0 : originalProps.radius) != null ? _a2 : "md",
+        size: (_b2 = originalProps == null ? void 0 : originalProps.size) != null ? _b2 : "md",
+        shadow: (_c = originalProps == null ? void 0 : originalProps.shadow) != null ? _c : "sm"
+      });
+    },
+    [
+      (0, import_heroui_v2_shared_utils.objectToDeps)(variantProps),
+      disableAnimation,
+      originalProps == null ? void 0 : originalProps.radius,
+      originalProps == null ? void 0 : originalProps.size,
+      originalProps == null ? void 0 : originalProps.shadow
+    ]
+  );
+  const getTriggerProps = (0, import_react2.useCallback)(
+    (props2 = {}, _ref = null) => ({
+      ...(0, import_heroui_v2_shared_utils.mergeProps)(triggerProps, props2),
+      ref: (0, import_heroui_v2_react_utils.mergeRefs)(_ref, triggerRef),
+      "aria-describedby": isOpen ? tooltipId : void 0
+    }),
+    [triggerProps, isOpen, tooltipId, state]
+  );
+  const getTooltipProps = (0, import_react2.useCallback)(
+    () => ({
+      ref: overlayRef,
+      "data-slot": "base",
+      "data-open": (0, import_heroui_v2_shared_utils.dataAttr)(isOpen),
+      "data-arrow": (0, import_heroui_v2_shared_utils.dataAttr)(showArrow),
+      "data-disabled": (0, import_heroui_v2_shared_utils.dataAttr)(isDisabled),
+      "data-placement": (0, import_heroui_v2_aria_utils.getArrowPlacement)(placement || "top", placementProp),
+      ...(0, import_heroui_v2_shared_utils.mergeProps)(tooltipProps, overlayProps, otherProps),
+      style: (0, import_heroui_v2_shared_utils.mergeProps)(positionProps.style, otherProps.style, props.style),
+      className: slots.base({ class: classNames == null ? void 0 : classNames.base }),
+      id: tooltipId
+    }),
+    [
+      slots,
+      isOpen,
+      showArrow,
+      isDisabled,
+      placement,
+      placementProp,
+      tooltipProps,
+      overlayProps,
+      otherProps,
+      positionProps,
+      props,
+      tooltipId
+    ]
+  );
+  const getTooltipContentProps = (0, import_react2.useCallback)(
+    () => ({
+      "data-slot": "content",
+      "data-open": (0, import_heroui_v2_shared_utils.dataAttr)(isOpen),
+      "data-arrow": (0, import_heroui_v2_shared_utils.dataAttr)(showArrow),
+      "data-disabled": (0, import_heroui_v2_shared_utils.dataAttr)(isDisabled),
+      "data-placement": (0, import_heroui_v2_aria_utils.getArrowPlacement)(placement || "top", placementProp),
+      className: slots.content({ class: (0, import_heroui_v2_shared_utils.clsx)(classNames == null ? void 0 : classNames.content, className) })
+    }),
+    [slots, isOpen, showArrow, isDisabled, placement, placementProp, classNames]
+  );
+  return {
+    Component,
+    content,
+    children,
+    isOpen,
+    triggerRef,
+    showArrow,
+    portalContainer,
+    placement: placementProp,
+    disableAnimation,
+    isDisabled,
+    motionProps,
+    getTooltipContentProps,
+    getTriggerProps,
+    getTooltipProps
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useTooltip
+});

package/dist/use-tooltip.mjs

@@ -0,0 +1,7 @@
+"use client";
+import {
+  useTooltip
+} from "./chunk-ZQCIM4IR.mjs";
+export {
+  useTooltip
+};

package/package.json

@@ -0,0 +1,66 @@
+{
+  "name": "@vx-oss/heroui-v2-tooltip",
+  "version": "2.2.25-alpha.0",
+  "description": "A React Component for rendering dynamically positioned Tooltips",
+  "keywords": [
+    "tooltip"
+  ],
+  "author": "Vx OSS Devs <oss-developers@vezham.com>",
+  "homepage": "https://vezham.com",
+  "license": "MIT",
+  "main": "dist/index.js",
+  "sideEffects": false,
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/vezham/heroui-v2.git",
+    "directory": "packages/components/tooltip"
+  },
+  "bugs": {
+    "url": "https://github.com/vezham/heroui-v2/issues"
+  },
+  "peerDependencies": {
+    "react": ">=18 || >=19.0.0-rc.0",
+    "react-dom": ">=18 || >=19.0.0-rc.0",
+    "framer-motion": ">=11.5.6 || >=12.0.0-alpha.1",
+    "@vx-oss/heroui-v2-theme": ">=2.4.24-alpha.0",
+    "@vx-oss/heroui-v2-system": ">=2.4.24-alpha.0"
+  },
+  "dependencies": {
+    "@react-aria/overlays": "3.30.0",
+    "@react-aria/tooltip": "3.8.8",
+    "@react-stately/tooltip": "3.5.8",
+    "@react-types/overlays": "3.9.2",
+    "@react-types/tooltip": "3.4.21",
+    "@vx-oss/heroui-v2-react-utils": "2.1.15-alpha.0",
+    "@vx-oss/heroui-v2-shared-utils": "2.1.13-alpha.0",
+    "@vx-oss/heroui-v2-aria-utils": "2.2.25-alpha.0",
+    "@vx-oss/heroui-v2-use-safe-layout-effect": "2.1.9-alpha.0",
+    "@vx-oss/heroui-v2-use-aria-overlay": "2.0.5-alpha.0",
+    "@vx-oss/heroui-v2-dom-animation": "2.1.11-alpha.0",
+    "@vx-oss/heroui-v2-framer-utils": "2.1.24-alpha.0"
+  },
+  "clean-package": "../../../clean-package.config.json",
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "scripts": {
+    "build": "tsup src --dts",
+    "build:fast": "tsup src",
+    "dev": "pnpm build:fast --watch",
+    "clean": "rimraf dist .turbo",
+    "typecheck": "tsc --noEmit"
+  }
+}