import { jsxs as Z, Fragment as $ } from "react/jsx-runtime";
import A, { useRef as ee, useCallback as c, useState as h, useEffect as te } from "react";
import oe from "react-dom";
import { usePopper as re } from "react-popper";
import { PLACEMENT as o } from "../../values/Placement.js";
import { TRIGGER as E } from "../../values/Trigger.js";
import ne from "../../utils/mergeRefs.js";
import { useClickOutsideWithRef as se } from "../../hooks/useClickOutside.js";
import { useChainedTimeout as le } from "../../hooks/useTimeout.js";
import { useUncontrolledProp as ae } from "../../hooks/useUncontrollable.js";
const t = (v) => {
  const {
    show: H,
    defaultShow: b = !1,
    enablePortal: B = !0,
    trigger: R = E.HOVER,
    delay: r,
    overlay: L,
    placement: g = "top",
    popperConfig: T,
    onToggle: U = () => {
    },
    rootClose: C = !0,
    children: p
  } = v, [u, l] = ae(H, b, U), f = ee(""), m = le(), { onFocus: P, onBlur: S, onClick: y } = typeof p != "function" ? A.Children.only(p).props : {}, G = (e, n, F) => {
    const [I] = n, D = I.currentTarget, w = I.relatedTarget;
    (!w || w !== D) && !D.contains(w) && e(...n);
  }, O = () => {
    if (m.clear(), f.current = "show", r === 0 || typeof r != "number" && !r?.show) {
      l(!0);
      return;
    }
    m.set(
      () => {
        f.current === "show" && l(!0);
      },
      typeof r == "number" ? r : r?.show
    );
  }, a = () => {
    if (m.clear(), f.current = "hide", typeof r == "number" || !r?.hide) {
      l(!1);
      return;
    }
    m.set(() => {
      f.current === "hide" && l(!1);
    }, r?.hide);
  }, k = c(
    (...e) => {
      O(), P?.(...e);
    },
    [O, P]
  ), V = c(
    (...e) => {
      a(), S?.(...e);
    },
    [a, S]
  ), x = c(
    (...e) => {
      l(!u), y?.(...e);
    },
    [y, l, u]
  ), K = c(
    (...e) => {
      G(O, e);
    },
    [O]
  ), j = c(
    (...e) => {
      G(a, e);
    },
    [a]
  ), [d, W] = h(null), [_, q] = h(null), [M, z] = h(null), [J, Q] = h(g), X = c(
    (e) => {
      const n = d?.contains(e.target), F = _?.contains(e.target);
      u && C && !n && !F && a();
    },
    [d, _, C, a]
  );
  se(d, X);
  const i = {
    ref: ne([p.ref, W])
  };
  R === "click" ? i.onClick = x : R === "focus" ? (i.onFocus = k, i.onBlur = V) : R === "hover" && (i.onMouseOver = K, i.onMouseOut = j);
  const Y = {
    placement: g,
    modifiers: [
      {
        name: "arrow",
        options: {
          element: M
        }
      },
      {
        name: "flip",
        options: {
          fallbackPlacements: ["right", "left", "top"]
        }
      }
    ]
  };
  if (T) {
    T.placement = g;
    const e = [];
    T.modifiers?.map((n) => n.name !== "arrow" ? e.push(n) : e.push({
      ...n,
      options: {
        ...n.options,
        element: M
      }
    })), T.modifiers = e;
  }
  const s = re(d, _, T || Y);
  te(() => {
    s.state && Q(s.state.placement);
  }, [s.state?.placement]);
  const N = A.cloneElement(L, {
    ...s.attributes.popper,
    ref: q,
    placement: J,
    style: { ...s.styles.popper },
    arrowProps: {
      ...s.attributes.arrow,
      style: s.styles.arrow,
      ref: z
    }
  });
  return /* @__PURE__ */ Z($, { children: [
    u && (B ? oe.createPortal(N, document.body) : N),
    A.cloneElement(p, i)
  ] });
};
t.TRIGGER_CLICK = E.CLICK;
t.TRIGGER_HOVER = E.HOVER;
t.TRIGGER_FOCUS = E.FOCUS;
t.AUTO_START = o.AUTO_START;
t.AUTO = o.AUTO;
t.AUTO_END = o.AUTO_END;
t.TOP_START = o.TOP_START;
t.TOP = o.TOP;
t.TOP_END = o.TOP_END;
t.RIGHT_START = o.RIGHT_START;
t.RIGHT = o.RIGHT;
t.RIGHT_END = o.RIGHT_END;
t.BOTTOM_START = o.BOTTOM_START;
t.BOTTOM = o.BOTTOM;
t.BOTTOM_END = o.BOTTOM_END;
t.LEFT_START = o.LEFT_START;
t.LEFT = o.LEFT;
t.LEFT_END = o.LEFT_END;
export {
  t as default
};
//# sourceMappingURL=OverlayTrigger.js.map
