const k = [
  { queryParam: "utm_source", label: "Source" },
  { queryParam: "utm_medium", label: "Medium" },
  { queryParam: "utm_campaign", label: "Campaign" },
  { queryParam: "utm_content", label: "Content" },
  { queryParam: "utm_term", label: "Term" }
], b = new Intl.NumberFormat("en-US", {
  minimumFractionDigits: 0,
  maximumFractionDigits: 2
}), L = (n, r) => {
  const e = document.createElement("span");
  return e.classList.add("rioglyph", n, r), e;
}, u = (n) => {
  const { iconClass: r, text: e } = n, a = document.createElement("div");
  a.classList.add(
    "display-flex",
    "align-items-center",
    "gap-5",
    "text-medium",
    "text-size-16",
    "line-height-16",
    "margin-bottom--3"
  ), a.appendChild(L(r, "text-size-16"));
  const i = document.createElement("span");
  return i.textContent = e, a.appendChild(i), a;
}, C = () => {
  const n = document.createElement("div");
  return n.classList.add("rounded", "padding-10", "bg-decent", "display-flex", "flex-column", "gap-5", "shadow-accent"), n;
}, o = (n) => {
  const { iconClass: r, label: e, right: a } = n, i = document.createElement("div");
  i.classList.add("display-flex", "align-items-center", "gap-5");
  const l = document.createElement("div");
  l.classList.add("display-flex", "align-items-center", "gap-5", "min-width-80");
  const p = L(r, "text-size-14");
  l.appendChild(p);
  const s = document.createElement("div");
  s.classList.add("text-medium"), s.textContent = e, l.appendChild(s), i.appendChild(l);
  const t = document.createElement("div");
  if (t.classList.add("flex-1-1", "text-right"), typeof a == "string") {
    const c = document.createElement("div");
    c.classList.add("word-break-all", "text-bold"), c.textContent = a, t.appendChild(c);
  } else
    t.appendChild(a);
  return i.appendChild(t), i;
}, f = (n) => n === null ? "n/a" : `${b.format(n)}%`, N = () => typeof window < "u" && /^https?:/i.test(window.location.href) ? window.location.href : "https://rio.cloud", O = (n, r = N()) => {
  try {
    const e = new URL(n, r), a = {};
    return k.forEach(({ queryParam: i }) => {
      const l = e.searchParams.get(i)?.trim();
      l && (a[i] = l);
    }), Object.keys(a).length > 0 ? a : null;
  } catch {
    return null;
  }
}, V = (n) => {
  const r = n.closest("a[href]"), e = n.getAttribute("href")?.trim() ?? r?.href?.trim();
  return e ? O(e) : null;
}, G = (n) => {
  const { eventTrigger: r, totalEventCount: e, analyticsTotalUsers: a } = n;
  return a === null || a <= 0 ? null : r === "click" || r === "visibility" ? e / a * 100 : null;
}, S = (n) => {
  const {
    overlayRoot: r,
    trackingData: e,
    totalEventCount: a,
    totalUserCount: i,
    analyticsTotalUsers: l,
    clickEvent: p,
    trackedElement: s
  } = n, t = document.createElement("div");
  t.setAttribute("data-analytics-overlay-tooltip", "true"), t.classList.add(
    "position-fixed",
    "pointer-events-all",
    "z-index-max",
    "rounded",
    "padding-15",
    "shadow-focused",
    "bg-secondary",
    "text-color-white",
    "max-width-350",
    "width-100pct",
    "word-break-all",
    "display-flex",
    "flex-column",
    "gap-10",
    "line-height-125rel"
  );
  const c = e.eventTrigger === "click" ? "Clicks" : "Views", A = e.eventTrigger === "click" ? "rioglyph-click" : "rioglyph-eye-open", R = e.eventTrigger === "click" ? "Click rate" : "View rate", U = i > 0 ? a / i * 100 : null, v = G({
    eventTrigger: e.eventTrigger,
    totalEventCount: a,
    analyticsTotalUsers: l
  }), _ = l !== null && l > 0 ? i / l * 100 : null, D = u({
    iconClass: "rioglyph-user",
    text: "Event users"
  });
  t.appendChild(D);
  const g = C();
  g.appendChild(
    o({
      iconClass: "rioglyph-user",
      label: "Event users",
      right: `${b.format(i)}`
    })
  ), l !== null && (g.appendChild(
    o({
      iconClass: "rioglyph-user-group",
      label: "Total users",
      right: `${b.format(l)}`
    })
  ), g.appendChild(
    o({
      iconClass: "rioglyph-bar-chart-box",
      label: "Event rate (all users)",
      right: f(_)
    })
  )), t.appendChild(g);
  const F = u({
    iconClass: "rioglyph-stats",
    text: "Element performance"
  });
  t.appendChild(F);
  const d = C();
  d.appendChild(
    o({
      iconClass: A,
      label: c,
      right: `${b.format(a)}`
    })
  ), d.appendChild(
    o({
      iconClass: "rioglyph-bar-chart-box",
      label: R,
      right: f(U)
    })
  ), e.eventTrigger === "click" && l !== null && d.appendChild(
    o({
      iconClass: "rioglyph-bar-chart-box",
      label: "Click rate (all users)",
      right: f(v)
    })
  ), e.eventTrigger === "visibility" && l !== null && d.appendChild(
    o({
      iconClass: "rioglyph-bar-chart-box",
      label: "View rate (all users)",
      right: f(v)
    })
  ), t.appendChild(d);
  const M = u({
    iconClass: "rioglyph-info-sign",
    text: "Tracking Attributes"
  });
  t.appendChild(M);
  const h = C();
  h.appendChild(
    o({
      iconClass: "rioglyph-cog",
      label: "Action",
      right: e.eventAction
    })
  ), h.appendChild(
    o({
      iconClass: "rioglyph-emergency-stop",
      label: "Trigger",
      right: e.eventTrigger
    })
  ), h.appendChild(
    o({
      iconClass: "rioglyph-tag",
      label: "Label",
      right: e.eventLabel
    })
  ), t.appendChild(h);
  const w = V(s);
  if (w) {
    const $ = u({
      iconClass: "rioglyph-megaphone",
      text: "Campaign"
    });
    t.appendChild($);
    const E = C();
    k.forEach(({ queryParam: q, label: z }) => {
      const P = w[q];
      P && E.appendChild(
        o({
          iconClass: "rioglyph-tag",
          label: z,
          right: P
        })
      );
    }), t.appendChild(E);
  }
  const T = 12, m = 8;
  r.appendChild(t);
  let x = p.clientX + T, y = p.clientY + T;
  const H = window.innerWidth - t.offsetWidth - m, I = window.innerHeight - t.offsetHeight - m;
  return x = Math.max(m, Math.min(x, H)), y = Math.max(m, Math.min(y, I)), t.style.left = `${x}px`, t.style.top = `${y}px`, t;
};
export {
  S as createAnalyticsOverlayTooltip,
  V as extractCampaignTrackingDataFromElement,
  O as extractCampaignTrackingDataFromHref
};
//# sourceMappingURL=createAnalyticsOverlayTooltip.js.map
