prometeo-design-system 6.5.2 → 6.5.3

package/dist/Popover.es.js

@@ -1,22 +1,22 @@
-import { j as m } from "./jsx-runtime-GkKLlHH4.js";
-import { useRef as S, useState as y, useLayoutEffect as U, useCallback as I, useEffect as h, useMemo as de } from "react";
-import { createPortal as ze } from "react-dom";
-import { c as Be } from "./cn-B6yFEsav.js";
-const Y = 300, H = 24, Z = 12, E = 24, j = 24, De = {
+import { j as a } from "./jsx-runtime-GkKLlHH4.js";
+import { useRef as O, useState as x, useLayoutEffect as Q, useCallback as I, useEffect as b, useMemo as be } from "react";
+import { createPortal as Ge } from "react-dom";
+import { c as Me } from "./cn-B6yFEsav.js";
+const ee = 300, Ve = 24, ge = 8, te = 12, E = 24, N = 24, qe = {
   backgroundColor: "var(--neutral-800)",
   border: "1px solid var(--neutral-600)",
   transition: "all 0.3s ease-in-out"
-}, O = (t, n, r) => Math.min(Math.max(t, n), r), Me = (t) => {
+}, R = (t, n, r) => Math.min(Math.max(t, n), r), Xe = (t) => {
   if (!t.endsWith("%"))
     return null;
   const n = Number(t.replace("%", ""));
-  return Number.isNaN(n) ? null : O(n, 0, 100);
-}, _e = (t) => {
+  return Number.isNaN(n) ? null : R(n, 0, 100);
+}, Ue = (t) => {
   if (!t.endsWith("px"))
     return null;
   const n = Number(t.replace("px", ""));
   return Number.isNaN(n) ? null : n;
-}, fe = (t, n) => {
+}, we = (t, n) => {
   if (n <= 0 || t === "left")
     return 0;
   if (t === "center")
@@ -24,50 +24,51 @@ const Y = 300, H = 24, Z = 12, E = 24, j = 24, De = {
   if (t === "right")
     return n;
   if (typeof t == "number")
-    return O(t, 0, 100) / 100 * n;
-  const r = Me(t);
+    return R(t, 0, 100) / 100 * n;
+  const r = Xe(t);
   if (r !== null)
     return r / 100 * n;
-  const u = _e(t);
-  return u !== null ? O(u, 0, n) : n / 2;
-}, Ge = (t, n) => {
-  const r = fe(n, t.width);
+  const l = Ue(t);
+  return l !== null ? R(l, 0, n) : n / 2;
+}, Ye = (t, n) => {
+  const r = we(n, t.width);
   return t.left + r;
-}, Ve = (t) => t === "left" || t === "right", Xe = (t, n, r, u) => {
-  const x = t - n, v = u / 2;
-  return O(x, v, Math.max(r - v, 0));
-}, ge = (t) => typeof t == "function", qe = (t, n) => n === "left" ? t === "below" ? "0,24 24,24 0,0" : "0,0 24,0 0,24" : n === "right" ? t === "below" ? "24,24 0,24 24,0" : "24,0 0,0 24,24" : t === "below" ? "12,0 0,24 24,24" : "0,0 24,0 12,24", Ue = (t) => t.startsWith("--") ? t : t.replace(/[A-Z]/g, (n) => `-${n.toLowerCase()}`), et = ({
+}, Ze = (t) => t === "left" || t === "right", Je = (t, n, r, l) => {
+  const C = t - n, h = l / 2;
+  return R(C, h, Math.max(r - h, 0));
+}, Ke = (t) => typeof t == "function", Qe = (t, n) => n === "left" ? t === "below" ? "0,24 24,24 0,0" : "0,0 24,0 0,24" : n === "right" ? t === "below" ? "24,24 0,24 24,0" : "24,0 0,0 24,24" : t === "below" ? "12,0 0,24 24,24" : "0,0 24,0 12,24", et = (t) => t.startsWith("--") ? t : t.replace(/[A-Z]/g, (n) => `-${n.toLowerCase()}`), st = ({
   triggerRef: t,
   children: n,
   trigger: r = "click",
-  xPosition: u = "center",
-  hoverDelay: x = 200,
-  attachToParent: v = !1,
-  debugMode: a = !1,
-  highLightTrigger: A = !1,
-  highLightStyles: J = De,
-  highLightClassName: R,
-  className: K,
-  context: pe
+  xPosition: l = "center",
+  hoverDelay: C = 200,
+  attachToParent: h = !1,
+  debugMode: f = !1,
+  highLightTrigger: F = !1,
+  highLightStyles: ne = qe,
+  highLightClassName: T,
+  className: re,
+  hideIndicator: $ = !1,
+  context: he
 }) => {
-  const C = S(null), T = S(null), w = S(null), W = S(null), Q = S(""), N = S({}), [d, $] = y(!1), [f, ee] = y(!1), [me, z] = y(!1), [te, B] = y(!1), [c, be] = y({
+  const L = O(null), G = O(null), W = O(null), v = O(null), A = O(null), oe = O(""), H = O({}), [p, z] = x(!1), [u, se] = x(!1), [ve, M] = x(!1), [ie, V] = x(!1), [d, ye] = x({
     left: 0,
     top: 0,
     placement: "below",
     panelWidth: 0,
     indicatorOffset: 0
-  }), [D, ne] = y(null), [o, he] = y(t.current), P = d || a, [L, re] = y({
+  }), [g, ce] = x(null), [s, xe] = x(t.current), P = p || f, [k, le] = x({
     borderColor: "",
     borderStyle: "",
     borderWidth: "",
     backgroundColor: ""
   });
-  U(() => {
+  Q(() => {
     const e = t.current;
-    o !== e && he(e);
-  }, [o, t]), U(() => {
-    if (!f || !C.current) {
-      re({
+    s !== e && xe(e);
+  }, [s, t]), Q(() => {
+    if (!u || !L.current) {
+      le({
         borderColor: "",
         borderStyle: "",
         borderWidth: "",
@@ -75,153 +76,162 @@ const Y = 300, H = 24, Z = 12, E = 24, j = 24, De = {
       });
       return;
     }
-    const e = getComputedStyle(C.current);
-    re({
+    const e = getComputedStyle(L.current);
+    le({
       borderColor: e.borderColor,
       borderStyle: e.borderStyle,
       borderWidth: e.borderWidth,
       backgroundColor: e.backgroundColor
     });
-  }, [f, K, a]);
-  const M = () => {
-    T.current && clearTimeout(T.current), w.current && clearTimeout(w.current);
-  }, F = I(() => {
-    M(), $(!0);
-  }, []), oe = I(() => {
-    M(), $(!1);
-  }, []), _ = I(() => {
-    T.current && clearTimeout(T.current), T.current = setTimeout(() => {
-      $(!0);
-    }, x);
-  }, [x]), G = I(() => {
-    w.current && clearTimeout(w.current), w.current = setTimeout(() => {
-      $(!1);
-    }, x);
-  }, [x]), V = I(() => {
-    w.current && (clearTimeout(w.current), w.current = null);
-  }, []), k = I(() => {
+  }, [u, re, f]);
+  const q = () => {
+    W.current && clearTimeout(W.current), v.current && clearTimeout(v.current);
+  }, D = I(() => {
+    q(), z(!0);
+  }, []), ue = I(() => {
+    q(), z(!1);
+  }, []), X = I(() => {
+    W.current && clearTimeout(W.current), W.current = setTimeout(() => {
+      z(!0);
+    }, C);
+  }, [C]), U = I(() => {
+    v.current && clearTimeout(v.current), v.current = setTimeout(() => {
+      z(!1);
+    }, C);
+  }, [C]), Y = I(() => {
+    v.current && (clearTimeout(v.current), v.current = null);
+  }, []), y = I(() => {
     if (typeof window > "u")
       return;
-    const e = t.current, i = C.current;
+    const e = t.current, i = L.current;
     if (!e || !i)
       return;
-    const l = e.getBoundingClientRect(), s = i.getBoundingClientRect(), p = Ge(l, u), b = fe(u, s.width), X = p - b, Ae = window.innerWidth, Ne = Math.max(Z, Ae - s.width - Z), g = O(X, Z, Ne), $e = l.top, Fe = window.innerHeight - l.bottom;
-    let le = "below", q = l.bottom + H;
-    Fe < s.height + H && $e >= s.height + H && (le = "above", q = l.top - s.height - H);
-    let ue = g;
-    if (v) {
-      const ae = (e.offsetParent ?? document.body).getBoundingClientRect();
-      ue = g - ae.left, q -= ae.top;
+    const c = e.getBoundingClientRect(), o = i.getBoundingClientRect(), m = Ye(c, l), w = we(l, o.width), Z = m - w, ze = window.innerWidth, De = Math.max(te, ze - o.width - te), J = R(Z, te, De), Be = c.top, _e = window.innerHeight - c.bottom, B = $ ? ge : Ve;
+    let K = "below", j = c.bottom + B;
+    _e < o.height + B && Be >= o.height + B && (K = "above", j = c.top - o.height - B);
+    let _ = J;
+    if (h) {
+      const me = (e.offsetParent ?? document.body).getBoundingClientRect();
+      _ = J - me.left, j -= me.top;
     }
-    const He = Ve(u) ? 0 : Xe(p, g, s.width, E);
-    be({
-      left: ue,
-      top: q,
-      placement: le,
-      panelWidth: s.width,
-      indicatorOffset: He
+    const pe = Ze(l) ? 0 : Je(m, J, o.width, E);
+    G.current && (G.current.style.transform = `translate3d(${_}px, ${j}px, 0)`), ye((S) => S.left === _ && S.top === j && S.placement === K && S.panelWidth === o.width && S.indicatorOffset === pe ? S : {
+      left: _,
+      top: j,
+      placement: K,
+      panelWidth: o.width,
+      indicatorOffset: pe
     });
-  }, [v, u, t]);
-  U(() => {
-    f && k();
-  }, [f, k]), h(() => {
-    if (!f || typeof window > "u")
+  }, [h, l, t, $]);
+  Q(() => {
+    u && y();
+  }, [u, y]), b(() => {
+    if (!u || typeof window > "u")
       return;
     const e = () => {
-      k();
+      y();
     };
     return window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
       window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
     };
-  }, [f, k]), h(() => {
-    if (!f || !C.current || typeof ResizeObserver > "u")
+  }, [u, y]), b(() => {
+    if (!u || typeof window > "u")
+      return;
+    let e = window.requestAnimationFrame(function i() {
+      y(), e = window.requestAnimationFrame(i);
+    });
+    return () => {
+      window.cancelAnimationFrame(e);
+    };
+  }, [u, y]), b(() => {
+    if (!u || !L.current || typeof ResizeObserver > "u")
       return;
     const e = new ResizeObserver(() => {
-      k();
+      y();
     });
-    return e.observe(C.current), () => e.disconnect();
-  }, [f, k]), h(() => {
+    return e.observe(L.current), () => e.disconnect();
+  }, [u, y]), b(() => {
     if (P) {
-      ee(!0), z(!1);
+      se(!0), M(!1);
       return;
     }
-    if (f)
-      return z(!0), W.current = setTimeout(() => {
-        z(!1), ee(!1);
-      }, Y), () => {
-        W.current && clearTimeout(W.current);
+    if (u)
+      return M(!0), A.current = setTimeout(() => {
+        M(!1), se(!1);
+      }, ee), () => {
+        A.current && clearTimeout(A.current);
       };
-  }, [P, f]), h(() => {
-    if (!f || !P) {
-      B(!1);
+  }, [P, u]), b(() => {
+    if (!u || !P) {
+      V(!1);
       return;
     }
-    B(!1);
+    V(!1);
     const e = requestAnimationFrame(() => {
       requestAnimationFrame(() => {
-        B(!0);
+        V(!0);
       });
     });
     return () => cancelAnimationFrame(e);
-  }, [f, P]), h(() => () => {
-    M(), W.current && clearTimeout(W.current);
-  }, []), h(() => {
-    if (!(!o || !a))
-      return Q.current = o.style.outline ?? "", o.style.outline = "2px dashed var(--error-500)", () => {
-        o.style.outline = Q.current;
+  }, [u, P]), b(() => () => {
+    q(), A.current && clearTimeout(A.current);
+  }, []), b(() => {
+    if (!(!s || !f))
+      return oe.current = s.style.outline ?? "", s.style.outline = "2px dashed var(--error-500)", () => {
+        s.style.outline = oe.current;
       };
-  }, [a, o]), h(() => {
-    const e = o;
+  }, [f, s]), b(() => {
+    const e = s;
     if (!e)
       return;
-    const i = Object.entries(J).filter(
-      ([, s]) => s != null
+    const i = Object.entries(ne).filter(
+      ([, o]) => o != null
     );
-    if (!A || !d || i.length === 0) {
-      const s = N.current;
-      Object.entries(s).forEach(([p, b]) => {
-        if (b) {
-          e.style.setProperty(p, b);
+    if (!F || !p || i.length === 0) {
+      const o = H.current;
+      Object.entries(o).forEach(([m, w]) => {
+        if (w) {
+          e.style.setProperty(m, w);
           return;
         }
-        e.style.removeProperty(p);
-      }), N.current = {};
+        e.style.removeProperty(m);
+      }), H.current = {};
       return;
     }
-    const l = {};
-    return i.forEach(([s, p]) => {
-      const b = Ue(s);
-      l[b] = e.style.getPropertyValue(b), e.style.setProperty(b, String(p));
-    }), N.current = l, () => {
-      Object.entries(l).forEach(([s, p]) => {
-        if (p) {
-          e.style.setProperty(s, p);
+    const c = {};
+    return i.forEach(([o, m]) => {
+      const w = et(o);
+      c[w] = e.style.getPropertyValue(w), e.style.setProperty(w, String(m));
+    }), H.current = c, () => {
+      Object.entries(c).forEach(([o, m]) => {
+        if (m) {
+          e.style.setProperty(o, m);
           return;
         }
-        e.style.removeProperty(s);
-      }), N.current = {};
+        e.style.removeProperty(o);
+      }), H.current = {};
     };
-  }, [J, A, d, o]), h(() => {
-    const e = o;
-    if (!e || !R)
+  }, [ne, F, p, s]), b(() => {
+    const e = s;
+    if (!e || !T)
       return;
-    if (!(A && d)) {
-      e.classList.remove(R);
+    if (!(F && p)) {
+      e.classList.remove(T);
       return;
     }
-    return e.classList.add(R), () => {
-      e.classList.remove(R);
+    return e.classList.add(T), () => {
+      e.classList.remove(T);
     };
-  }, [R, A, d, o]), h(() => {
-    if (!a) {
-      ne(null);
+  }, [T, F, p, s]), b(() => {
+    if (!f) {
+      ce(null);
       return;
     }
     const e = () => {
-      if (!o)
+      if (!s)
         return;
-      const i = o.getBoundingClientRect();
-      ne({
+      const i = s.getBoundingClientRect();
+      ce({
         top: i.top,
         left: i.right + 8,
         bottom: i.bottom
@@ -231,146 +241,157 @@ const Y = 300, H = 24, Z = 12, E = 24, j = 24, De = {
       return window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
         window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
       };
-  }, [a, o]), h(() => {
-    const e = o;
+  }, [f, s]), b(() => {
+    const e = s;
     if (!e)
       return;
     const i = () => {
-      r === "hover" && (V(), _());
-    }, l = () => {
-      r === "hover" && G();
-    }, s = () => {
-      r === "click" && F();
-    }, p = () => {
-      r === "doubleClick" && F();
-    }, b = (X) => {
-      r === "contextMenu" && (X.preventDefault(), F());
+      r === "hover" && (Y(), X());
+    }, c = () => {
+      r === "hover" && U();
+    }, o = () => {
+      r === "click" && D();
+    }, m = () => {
+      r === "doubleClick" && D();
+    }, w = (Z) => {
+      r === "contextMenu" && (Z.preventDefault(), D());
     };
-    return r === "hover" && (e.addEventListener("mouseenter", i), e.addEventListener("mouseleave", l)), r === "click" && e.addEventListener("click", s), r === "doubleClick" && e.addEventListener("dblclick", p), r === "contextMenu" && e.addEventListener("contextmenu", b), () => {
-      r === "hover" && (e.removeEventListener("mouseenter", i), e.removeEventListener("mouseleave", l)), r === "click" && e.removeEventListener("click", s), r === "doubleClick" && e.removeEventListener("dblclick", p), r === "contextMenu" && e.removeEventListener("contextmenu", b);
+    return r === "hover" && (e.addEventListener("mouseenter", i), e.addEventListener("mouseleave", c)), r === "click" && e.addEventListener("click", o), r === "doubleClick" && e.addEventListener("dblclick", m), r === "contextMenu" && e.addEventListener("contextmenu", w), () => {
+      r === "hover" && (e.removeEventListener("mouseenter", i), e.removeEventListener("mouseleave", c)), r === "click" && e.removeEventListener("click", o), r === "doubleClick" && e.removeEventListener("dblclick", m), r === "contextMenu" && e.removeEventListener("contextmenu", w);
     };
-  }, [r, o, V, _, G, F]), h(() => {
-    if (r === "hover" || !d || typeof window > "u")
+  }, [r, s, Y, X, U, D]), b(() => {
+    if (r === "hover" || !p || typeof window > "u")
       return;
     const e = (i) => {
-      const l = i.target;
-      l && (C.current?.contains(l) || o?.contains(l) || oe());
+      const c = i.target;
+      c && (L.current?.contains(c) || s?.contains(c) || ue());
     };
     return window.addEventListener("mousedown", e, !0), window.addEventListener("touchstart", e, !0), () => {
       window.removeEventListener("mousedown", e, !0), window.removeEventListener("touchstart", e, !0);
     };
-  }, [r, o, oe, d]);
-  const ve = () => {
-    r === "hover" && (V(), _());
-  }, we = () => {
-    r === "hover" && G();
-  }, se = de(() => {
-    if (u === "left")
+  }, [r, s, ue, p]);
+  const Ee = () => {
+    r === "hover" && (Y(), X());
+  }, Ce = () => {
+    r === "hover" && U();
+  }, ae = be(() => {
+    if (l === "left")
       return -1;
-    if (u === "right")
-      return Math.max(c.panelWidth - E - 1, 0);
-    const e = c.indicatorOffset - E / 2, i = Math.max(c.panelWidth - E, 0);
-    return O(e, 0, i);
-  }, [c.indicatorOffset, c.panelWidth, u]), ie = de(() => typeof document > "u" ? null : v ? o?.offsetParent ?? document.body : document.body, [v, o]);
-  if (!ie || !f)
+    if (l === "right")
+      return Math.max(d.panelWidth - E - 1, 0);
+    const e = d.indicatorOffset - E / 2, i = Math.max(d.panelWidth - E, 0);
+    return R(e, 0, i);
+  }, [d.indicatorOffset, d.panelWidth, l]), de = be(() => typeof document > "u" ? null : h ? s?.offsetParent ?? document.body : document.body, [h, s]);
+  if (!de || !u)
     return null;
-  const ye = a && !d ? 0.35 : !d && !a || d && !te ? 0 : 1, Ee = a && !d || d && te && !me ? "0" : c.placement === "below" ? "-6px" : "6px", xe = d ? "auto" : "none", ce = parseFloat(L.borderWidth) || 0, Ce = {
-    position: v ? "absolute" : "fixed",
-    left: `${c.left}px`,
-    top: `${c.top}px`,
-    opacity: ye,
-    pointerEvents: xe,
-    transform: `translate3d(0,${Ee},0)`,
-    transition: `opacity ${Y}ms ease, transform ${Y}ms ease`,
-    zIndex: a ? 70 : 60
-  }, Le = ge(n) ? n(pe) : n, ke = {
+  const Le = f && !p ? 0.35 : !p && !f || p && !ie ? 0 : 1, ke = f && !p || p && ie && !ve ? "0" : d.placement === "below" ? "-6px" : "6px", Se = p ? "auto" : "none", fe = parseFloat(k.borderWidth) || 0, Oe = {
+    position: h ? "absolute" : "fixed",
+    top: 0,
+    left: 0,
+    pointerEvents: Se,
+    zIndex: f ? 70 : 60,
+    willChange: "transform"
+  }, Ie = {
+    opacity: Le,
+    transform: `translate3d(0,${ke},0)`,
+    transition: `opacity ${ee}ms ease, transform ${ee}ms ease`
+  }, Re = Ke(n) ? n(he) : n, Te = {
     width: E,
-    height: j,
-    left: `${se}px`,
-    top: c.placement === "below" ? `-${j}px` : void 0,
-    bottom: c.placement === "above" ? `-${j}px` : void 0,
+    height: N,
+    left: `${ae}px`,
+    top: d.placement === "below" ? `-${N}px` : void 0,
+    bottom: d.placement === "above" ? `-${N}px` : void 0,
     overflow: "visible"
-  }, Se = L.backgroundColor || (a ? "var(--error-500)" : "var(--neutral-800)"), Ie = L.borderColor || void 0, Oe = parseFloat(L.borderWidth) || 0, Re = L.borderStyle.includes("dash") ? "4 2" : L.borderStyle.includes("dot") ? "1 2" : void 0, Te = u === "left" ? c.placement === "below" ? "rounded-tl-none" : "rounded-bl-none" : u === "right" ? c.placement === "below" ? "rounded-tr-none" : "rounded-br-none" : "", We = Be(
+  }, We = k.backgroundColor || (f ? "var(--error-500)" : "var(--neutral-800)"), Ae = k.borderColor || void 0, Pe = parseFloat(k.borderWidth) || 0, je = k.borderStyle.includes("dash") ? "4 2" : k.borderStyle.includes("dot") ? "1 2" : void 0, Ne = $ ? "" : l === "left" ? d.placement === "below" ? "rounded-tl-none" : "rounded-bl-none" : l === "right" ? d.placement === "below" ? "rounded-tr-none" : "rounded-br-none" : "", Fe = Me(
     "relative pointer-events-auto rounded-lg border shadow-2xl",
-    Te,
-    a ? "bg-neutral-medium-default opacity-80! border-error-default-default border " : "bg-neutral-medium-default border-neutral-800/60",
-    K
-  ), Pe = /* @__PURE__ */ m.jsxs(
+    Ne,
+    f ? "bg-neutral-medium-default opacity-80! border-error-default-default border " : "bg-neutral-medium-default border-neutral-800/60",
+    re
+  ), $e = /* @__PURE__ */ a.jsx(
     "div",
     {
-      ref: C,
-      className: We,
-      style: Ce,
-      onMouseEnter: ve,
-      onMouseLeave: we,
-      "data-placement": c.placement,
+      ref: G,
+      style: Oe,
       "aria-hidden": !P,
-      children: [
-        /* @__PURE__ */ m.jsx("div", { className: "absolute", "aria-hidden": "true", style: ke, children: /* @__PURE__ */ m.jsx(
-          "svg",
-          {
-            width: E,
-            height: j,
-            viewBox: `0 0 ${E} ${j}`,
-            role: "presentation",
-            children: /* @__PURE__ */ m.jsx(
-              "polygon",
-              {
-                fill: Se,
-                points: qe(c.placement, u),
-                stroke: Ie,
-                strokeWidth: Oe,
-                vectorEffect: "non-scaling-stroke",
-                strokeDasharray: Re
-              }
-            )
-          }
-        ) }),
-        ce > 0 && /* @__PURE__ */ m.jsx(
-          "div",
-          {
-            "aria-hidden": "true",
-            style: {
-              position: "absolute",
-              left: `${se}px`,
-              width: `${E}px`,
-              height: `${ce}px`,
-              background: L.backgroundColor || "transparent",
-              top: c.placement === "below" ? "-1px" : void 0,
-              bottom: c.placement === "above" ? "-1px" : void 0,
-              pointerEvents: "none",
-              zIndex: 1
-            }
-          }
-        ),
-        Le
-      ]
+      children: /* @__PURE__ */ a.jsxs(
+        "div",
+        {
+          ref: L,
+          className: Fe,
+          style: Ie,
+          onMouseEnter: Ee,
+          onMouseLeave: Ce,
+          "data-placement": d.placement,
+          children: [
+            !$ && /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+              /* @__PURE__ */ a.jsx("div", { className: "absolute", "aria-hidden": "true", style: Te, children: /* @__PURE__ */ a.jsx(
+                "svg",
+                {
+                  width: E,
+                  height: N,
+                  viewBox: `0 0 ${E} ${N}`,
+                  role: "presentation",
+                  children: /* @__PURE__ */ a.jsx(
+                    "polygon",
+                    {
+                      fill: We,
+                      points: Qe(d.placement, l),
+                      stroke: Ae,
+                      strokeWidth: Pe,
+                      vectorEffect: "non-scaling-stroke",
+                      strokeDasharray: je
+                    }
+                  )
+                }
+              ) }),
+              fe > 0 && /* @__PURE__ */ a.jsx(
+                "div",
+                {
+                  "aria-hidden": "true",
+                  style: {
+                    position: "absolute",
+                    left: `${ae}px`,
+                    width: `${E}px`,
+                    height: `${fe}px`,
+                    background: k.backgroundColor || "transparent",
+                    top: d.placement === "below" ? "-1px" : void 0,
+                    bottom: d.placement === "above" ? "-1px" : void 0,
+                    pointerEvents: "none",
+                    zIndex: 1
+                  }
+                }
+              )
+            ] }),
+            Re
+          ]
+        }
+      )
     }
-  ), je = a && D ? /* @__PURE__ */ m.jsxs(
+  ), He = f && g ? /* @__PURE__ */ a.jsxs(
     "div",
     {
       className: "pointer-events-none text-center bg-red-500/90 text-red-200 rounded-lg px-2 py-1 text-[8px] font-semibold shadow-lg z-50",
       style: {
         position: "fixed",
-        top: D.top - 30,
-        left: D.left - 20
+        top: g.top - 30,
+        left: g.left - 20
       },
       children: [
         "Popover Trigger: ",
-        /* @__PURE__ */ m.jsx("br", {}),
+        /* @__PURE__ */ a.jsx("br", {}),
         " ",
-        /* @__PURE__ */ m.jsx("span", { className: "text-white text-[10px]", children: r })
+        /* @__PURE__ */ a.jsx("span", { className: "text-white text-[10px]", children: r })
       ]
     }
   ) : null;
-  return /* @__PURE__ */ m.jsx(m.Fragment, { children: ze(
-    /* @__PURE__ */ m.jsxs(m.Fragment, { children: [
-      Pe,
-      je
+  return /* @__PURE__ */ a.jsx(a.Fragment, { children: Ge(
+    /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+      $e,
+      He
     ] }),
-    ie
+    de
   ) });
 };
 export {
-  et as default
+  st as default
 };