"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/components/Tooltip/Tooltip.tsx
var Tooltip_exports = {};
__export(Tooltip_exports, {
  Tooltip: () => Tooltip,
  default: () => Tooltip_default
});
module.exports = __toCommonJS(Tooltip_exports);
var import_react = require("react");
var import_react_dom = require("react-dom");

// src/utils/utils.ts
var import_clsx = require("clsx");
var import_tailwind_merge = require("tailwind-merge");
function cn(...inputs) {
  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
}

// src/components/Text/Text.tsx
var import_jsx_runtime = require("react/jsx-runtime");
var Text = ({
  children,
  size = "md",
  weight = "normal",
  color = "text-text-950",
  as,
  className = "",
  ...props
}) => {
  let sizeClasses;
  let weightClasses;
  const sizeClassMap = {
    "2xs": "text-2xs",
    xs: "text-xs",
    sm: "text-sm",
    md: "text-md",
    lg: "text-lg",
    xl: "text-xl",
    "2xl": "text-2xl",
    "3xl": "text-3xl",
    "4xl": "text-4xl",
    "5xl": "text-5xl",
    "6xl": "text-6xl"
  };
  sizeClasses = sizeClassMap[size] ?? sizeClassMap.md;
  const weightClassMap = {
    hairline: "font-hairline",
    light: "font-light",
    normal: "font-normal",
    medium: "font-medium",
    semibold: "font-semibold",
    bold: "font-bold",
    extrabold: "font-extrabold",
    black: "font-black"
  };
  weightClasses = weightClassMap[weight] ?? weightClassMap.normal;
  const baseClasses = "font-primary";
  const Component = as ?? "p";
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
    Component,
    {
      className: cn(baseClasses, sizeClasses, weightClasses, color, className),
      ...props,
      children
    }
  );
};
var Text_default = Text;

// src/components/Tooltip/Tooltip.tsx
var import_jsx_runtime2 = require("react/jsx-runtime");
var POSITION_CLASSES = {
  top: "bottom-full left-1/2 -translate-x-1/2 mb-2",
  bottom: "top-full left-1/2 -translate-x-1/2 mt-2",
  left: "right-full top-1/2 -translate-y-1/2 mr-2",
  right: "left-full top-1/2 -translate-y-1/2 ml-2"
};
var TOOLTIP_GAP_PX = 8;
var computePortalCoords = (triggerRect, position, tooltipRect) => {
  switch (position) {
    case "bottom":
      return {
        top: triggerRect.bottom + TOOLTIP_GAP_PX,
        left: triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2
      };
    case "left":
      return {
        top: triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2,
        left: triggerRect.left - tooltipRect.width - TOOLTIP_GAP_PX
      };
    case "right":
      return {
        top: triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2,
        left: triggerRect.right + TOOLTIP_GAP_PX
      };
    case "top":
    default:
      return {
        top: triggerRect.top - tooltipRect.height - TOOLTIP_GAP_PX,
        left: triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2
      };
  }
};
var TOOLTIP_CONTENT_CLASSES = cn(
  "whitespace-nowrap",
  "px-4 py-2 rounded-lg",
  "bg-background-dark text-white",
  "text-sm font-medium",
  "shadow-[0px_3px_10px_0px_rgba(38,38,38,0.2)]",
  "transition-opacity duration-150"
);
function Tooltip({
  content,
  children,
  position = "top",
  className,
  contentClassName,
  disabled = false,
  usePortal = false
}) {
  const triggerRef = (0, import_react.useRef)(null);
  const tooltipRef = (0, import_react.useRef)(null);
  const [open, setOpen] = (0, import_react.useState)(false);
  const [coords, setCoords] = (0, import_react.useState)({
    top: 0,
    left: 0
  });
  const updatePosition = (0, import_react.useCallback)(() => {
    if (!triggerRef.current || !tooltipRef.current) return;
    const triggerRect = triggerRef.current.getBoundingClientRect();
    const tooltipRect = {
      width: tooltipRef.current.offsetWidth,
      height: tooltipRef.current.offsetHeight
    };
    setCoords(computePortalCoords(triggerRect, position, tooltipRect));
  }, [position]);
  (0, import_react.useLayoutEffect)(() => {
    if (!usePortal || !open) return;
    updatePosition();
    const onViewportChange = () => updatePosition();
    window.addEventListener("resize", onViewportChange);
    window.addEventListener("scroll", onViewportChange, true);
    return () => {
      window.removeEventListener("resize", onViewportChange);
      window.removeEventListener("scroll", onViewportChange, true);
    };
  }, [usePortal, open, updatePosition, content]);
  (0, import_react.useEffect)(() => {
    if (!usePortal) return;
    const node = triggerRef.current;
    if (!node) return;
    const handleOpen = () => setOpen(true);
    const handleClose = () => setOpen(false);
    node.addEventListener("mouseenter", handleOpen);
    node.addEventListener("mouseleave", handleClose);
    node.addEventListener("focusin", handleOpen);
    node.addEventListener("focusout", handleClose);
    return () => {
      node.removeEventListener("mouseenter", handleOpen);
      node.removeEventListener("mouseleave", handleClose);
      node.removeEventListener("focusin", handleOpen);
      node.removeEventListener("focusout", handleClose);
    };
  }, [usePortal]);
  if (disabled) {
    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_jsx_runtime2.Fragment, { children });
  }
  if (usePortal) {
    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
      Text_default,
      {
        as: "span",
        ref: triggerRef,
        className: cn("relative inline-flex", className),
        "aria-describedby": open ? "tooltip-portal" : void 0,
        children: [
          children,
          open && typeof document !== "undefined" && (0, import_react_dom.createPortal)(
            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
              "div",
              {
                ref: tooltipRef,
                id: "tooltip-portal",
                role: "tooltip",
                style: {
                  position: "fixed",
                  top: coords.top,
                  left: coords.left,
                  zIndex: 9999
                },
                className: cn(TOOLTIP_CONTENT_CLASSES, contentClassName),
                children: content
              }
            ),
            document.body
          )
        ]
      }
    );
  }
  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: cn("relative inline-flex group", className), children: [
    children,
    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
      "div",
      {
        role: "tooltip",
        className: cn(
          "absolute z-50",
          TOOLTIP_CONTENT_CLASSES,
          "opacity-0 invisible",
          "group-hover:opacity-100 group-hover:visible",
          "group-focus-within:opacity-100 group-focus-within:visible",
          POSITION_CLASSES[position],
          contentClassName
        ),
        children: content
      }
    )
  ] });
}
var Tooltip_default = Tooltip;
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  Tooltip
});
//# sourceMappingURL=index.js.map