import { jsx as t, jsxs as M } from "react/jsx-runtime";
import { forwardRef as I, useState as w, useEffect as G } from "react";
import { omit as g } from "es-toolkit/compat";
import l from "../../utils/classNames.js";
import { isDesktop as h } from "../../utils/deviceUtils.js";
import { PLACEMENT as x } from "../../values/Placement.js";
import { TEXT_ALIGNMENT as o } from "../../values/TextAlignment.js";
const C = {
  STYLE_DEFAULT: "default",
  STYLE_ONBOARDING: "onboarding"
}, O = {
  TEXT_ALIGNMENT_LEFT: o.LEFT,
  TEXT_ALIGNMENT_CENTER: o.CENTER,
  TEXT_ALIGNMENT_RIGHT: o.RIGHT
}, s = I((p, T) => {
  const {
    allowOnTouch: m = !1,
    arrowProps: c,
    children: E,
    className: N = "",
    innerClassName: e = "",
    placement: a = "bottom",
    style: f,
    textAlignment: i = "center",
    tooltipStyle: r = "default",
    width: n = "auto",
    ...d
  } = g(p, ["popper", "positionLeft", "positionTop"]), [L, u] = w(!1);
  if (G(() => u(!0), []), !h() && !m)
    return /* @__PURE__ */ t("span", { className: "display-none" });
  const _ = l(
    "tooltip",
    r && `tooltip-${r}`,
    a,
    "fade",
    L && "show",
    N
  ), A = l(
    "tooltip-inner",
    i && `text-${i}`,
    n && `width-${n}`,
    e && e
  );
  return /* @__PURE__ */ M(
    "div",
    {
      ...d,
      role: "tooltip",
      "x-placement": a,
      ref: T,
      className: _,
      style: { ...f },
      "data-offset": 20,
      children: [
        /* @__PURE__ */ t("div", { className: "tooltip-arrow", ...c }),
        /* @__PURE__ */ t("div", { className: A, children: E })
      ]
    }
  );
});
Object.assign(s, C);
Object.assign(s, x);
Object.assign(s, O);
export {
  s as default
};
//# sourceMappingURL=Tooltip.js.map
