@versini/ui-tooltip 1.1.2 → 1.2.0

package/dist/index.d.ts

@@ -4,6 +4,6 @@ import { TooltipTypes } from '@versini/ui-types';
 declare const TOOLTIP_CLASSNAME = "av-tooltip";
 declare const TOOLTIP_ARROW_CLASSNAME = "av-tooltip-arrow";
 
-declare const Tooltip: ({ trigger, label, placement, mode, delay, className, arrowClassName, }: TooltipTypes.Props) => react_jsx_runtime.JSX.Element;
+declare const Tooltip: ({ trigger, label, placement, mode, delay, className, tooltipClassName, arrowClassName, }: TooltipTypes.Props) => react_jsx_runtime.JSX.Element;
 
 export { TOOLTIP_ARROW_CLASSNAME, TOOLTIP_CLASSNAME, Tooltip };

package/dist/index.js

@@ -1,14 +1,14 @@
 import { jsxs as yt, jsx as Vt } from "react/jsx-runtime";
 import { useRef as lt, useState as Wt, useCallback as Ft, useEffect as $t } from "react";
-import W from "clsx";
+import F from "clsx";
 /*!
-  @versini/ui-tooltip v1.1.2
+  @versini/ui-tooltip v1.2.0
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_TOOLTIP__ || (window.__VERSINI_UI_TOOLTIP__ = {
-    version: "1.1.2",
-    buildTime: "01/20/2025 01:05 PM EST",
+    version: "1.2.0",
+    buildTime: "01/20/2025 01:49 PM EST",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });
@@ -32,7 +32,7 @@ function ft(t, e, o) {
 function Q(t, e) {
   return typeof t == "function" ? t(e) : t;
 }
-function F(t) {
+function $(t) {
   return t.split("-")[0];
 }
 function Z(t) {
@@ -45,16 +45,16 @@ function gt(t) {
   return t === "y" ? "height" : "width";
 }
 function Y(t) {
-  return ["top", "bottom"].includes(F(t)) ? "y" : "x";
+  return ["top", "bottom"].includes($(t)) ? "y" : "x";
 }
 function pt(t) {
   return Ot(Y(t));
 }
 function zt(t, e, o) {
   o === void 0 && (o = !1);
-  const n = Z(t), i = pt(t), s = gt(i);
-  let r = i === "x" ? n === (o ? "end" : "start") ? "right" : "left" : n === "start" ? "bottom" : "top";
-  return e.reference[s] > e.floating[s] && (r = ot(r)), [r, ot(r)];
+  const n = Z(t), i = pt(t), r = gt(i);
+  let s = i === "x" ? n === (o ? "end" : "start") ? "right" : "left" : n === "start" ? "bottom" : "top";
+  return e.reference[r] > e.floating[r] && (s = ot(s)), [s, ot(s)];
 }
 function Xt(t) {
   const e = ot(t);
@@ -64,22 +64,22 @@ function ut(t) {
   return t.replace(/start|end/g, (e) => Yt[e]);
 }
 function Ut(t, e, o) {
-  const n = ["left", "right"], i = ["right", "left"], s = ["top", "bottom"], r = ["bottom", "top"];
+  const n = ["left", "right"], i = ["right", "left"], r = ["top", "bottom"], s = ["bottom", "top"];
   switch (t) {
     case "top":
     case "bottom":
       return o ? e ? i : n : e ? n : i;
     case "left":
     case "right":
-      return e ? s : r;
+      return e ? r : s;
     default:
       return [];
   }
 }
 function Kt(t, e, o, n) {
   const i = Z(t);
-  let s = Ut(F(t), o === "start", n);
-  return i && (s = s.map((r) => r + "-" + i), e && (s = s.concat(s.map(ut)))), s;
+  let r = Ut($(t), o === "start", n);
+  return i && (r = r.map((s) => s + "-" + i), e && (r = r.concat(r.map(ut)))), r;
 }
 function ot(t) {
   return t.replace(/left|right|bottom|top/g, (e) => jt[e]);
@@ -124,7 +124,7 @@ function bt(t, e, o) {
     reference: n,
     floating: i
   } = t;
-  const s = Y(e), r = pt(e), c = gt(r), l = F(e), a = s === "y", d = n.x + n.width / 2 - i.width / 2, f = n.y + n.height / 2 - i.height / 2, m = n[c] / 2 - i[c] / 2;
+  const r = Y(e), s = pt(e), c = gt(s), l = $(e), a = r === "y", d = n.x + n.width / 2 - i.width / 2, f = n.y + n.height / 2 - i.height / 2, m = n[c] / 2 - i[c] / 2;
   let u;
   switch (l) {
     case "top":
@@ -159,10 +159,10 @@ function bt(t, e, o) {
   }
   switch (Z(e)) {
     case "start":
-      u[r] -= m * (o && a ? -1 : 1);
+      u[s] -= m * (o && a ? -1 : 1);
       break;
     case "end":
-      u[r] += m * (o && a ? -1 : 1);
+      u[s] += m * (o && a ? -1 : 1);
       break;
   }
   return u;
@@ -171,10 +171,10 @@ const Gt = async (t, e, o) => {
   const {
     placement: n = "bottom",
     strategy: i = "absolute",
-    middleware: s = [],
-    platform: r
-  } = o, c = s.filter(Boolean), l = await (r.isRTL == null ? void 0 : r.isRTL(e));
-  let a = await r.getElementRects({
+    middleware: r = [],
+    platform: s
+  } = o, c = r.filter(Boolean), l = await (s.isRTL == null ? void 0 : s.isRTL(e));
+  let a = await s.getElementRects({
     reference: t,
     floating: e,
     strategy: i
@@ -199,7 +199,7 @@ const Gt = async (t, e, o) => {
       strategy: i,
       middlewareData: u,
       rects: a,
-      platform: r,
+      platform: s,
       elements: {
         reference: t,
         floating: e
@@ -211,7 +211,7 @@ const Gt = async (t, e, o) => {
         ...u[h],
         ...v
       }
-    }, b && g <= 50 && (g++, typeof b == "object" && (b.placement && (m = b.placement), b.rects && (a = b.rects === !0 ? await r.getElementRects({
+    }, b && g <= 50 && (g++, typeof b == "object" && (b.placement && (m = b.placement), b.rects && (a = b.rects === !0 ? await s.getElementRects({
       reference: t,
       floating: e,
       strategy: i
@@ -234,8 +234,8 @@ async function St(t, e) {
   const {
     x: n,
     y: i,
-    platform: s,
-    rects: r,
+    platform: r,
+    rects: s,
     elements: c,
     strategy: l
   } = t, {
@@ -244,23 +244,23 @@ async function St(t, e) {
     elementContext: f = "floating",
     altBoundary: m = !1,
     padding: u = 0
-  } = Q(e, t), g = Rt(u), h = c[m ? f === "floating" ? "reference" : "floating" : f], w = it(await s.getClippingRect({
-    element: (o = await (s.isElement == null ? void 0 : s.isElement(h))) == null || o ? h : h.contextElement || await (s.getDocumentElement == null ? void 0 : s.getDocumentElement(c.floating)),
+  } = Q(e, t), g = Rt(u), h = c[m ? f === "floating" ? "reference" : "floating" : f], w = it(await r.getClippingRect({
+    element: (o = await (r.isElement == null ? void 0 : r.isElement(h))) == null || o ? h : h.contextElement || await (r.getDocumentElement == null ? void 0 : r.getDocumentElement(c.floating)),
     boundary: a,
     rootBoundary: d,
     strategy: l
   })), x = f === "floating" ? {
     x: n,
     y: i,
-    width: r.floating.width,
-    height: r.floating.height
-  } : r.reference, y = await (s.getOffsetParent == null ? void 0 : s.getOffsetParent(c.floating)), v = await (s.isElement == null ? void 0 : s.isElement(y)) ? await (s.getScale == null ? void 0 : s.getScale(y)) || {
+    width: s.floating.width,
+    height: s.floating.height
+  } : s.reference, y = await (r.getOffsetParent == null ? void 0 : r.getOffsetParent(c.floating)), v = await (r.isElement == null ? void 0 : r.isElement(y)) ? await (r.getScale == null ? void 0 : r.getScale(y)) || {
     x: 1,
     y: 1
   } : {
     x: 1,
     y: 1
-  }, b = it(s.convertOffsetParentRelativeRectToViewportRelativeRect ? await s.convertOffsetParentRelativeRectToViewportRelativeRect({
+  }, b = it(r.convertOffsetParentRelativeRectToViewportRelativeRect ? await r.convertOffsetParentRelativeRectToViewportRelativeRect({
     elements: c,
     rect: x,
     offsetParent: y,
@@ -281,8 +281,8 @@ const Jt = (t) => ({
       x: o,
       y: n,
       placement: i,
-      rects: s,
-      platform: r,
+      rects: r,
+      platform: s,
       elements: c,
       middlewareData: l
     } = e, {
@@ -294,10 +294,10 @@ const Jt = (t) => ({
     const f = Rt(d), m = {
       x: o,
       y: n
-    }, u = pt(i), g = gt(u), p = await r.getDimensions(a), h = u === "y", w = h ? "top" : "left", x = h ? "bottom" : "right", y = h ? "clientHeight" : "clientWidth", v = s.reference[g] + s.reference[u] - m[u] - s.floating[g], b = m[u] - s.reference[u], $ = await (r.getOffsetParent == null ? void 0 : r.getOffsetParent(a));
-    let _ = $ ? $[y] : 0;
-    (!_ || !await (r.isElement == null ? void 0 : r.isElement($))) && (_ = c.floating[y] || s.floating[g]);
-    const U = v / 2 - b / 2, B = _ / 2 - p[g] / 2 - 1, P = G(f[w], B), K = G(f[x], B), V = P, q = _ - p[g] - K, A = _ / 2 - p[g] / 2 + U, I = ft(V, A, q), E = !l.arrow && Z(i) != null && A !== I && s.reference[g] / 2 - (A < V ? P : K) - p[g] / 2 < 0, R = E ? A < V ? A - V : A - q : 0;
+    }, u = pt(i), g = gt(u), p = await s.getDimensions(a), h = u === "y", w = h ? "top" : "left", x = h ? "bottom" : "right", y = h ? "clientHeight" : "clientWidth", v = r.reference[g] + r.reference[u] - m[u] - r.floating[g], b = m[u] - r.reference[u], P = await (s.getOffsetParent == null ? void 0 : s.getOffsetParent(a));
+    let B = P ? P[y] : 0;
+    (!B || !await (s.isElement == null ? void 0 : s.isElement(P))) && (B = c.floating[y] || r.floating[g]);
+    const U = v / 2 - b / 2, V = B / 2 - p[g] / 2 - 1, D = G(f[w], V), K = G(f[x], V), W = D, q = B - p[g] - K, A = B / 2 - p[g] / 2 + U, I = ft(W, A, q), E = !l.arrow && Z(i) != null && A !== I && r.reference[g] / 2 - (A < W ? D : K) - p[g] / 2 < 0, R = E ? A < W ? A - W : A - q : 0;
     return {
       [u]: m[u] + R,
       data: {
@@ -318,8 +318,8 @@ const Jt = (t) => ({
       var o, n;
       const {
         placement: i,
-        middlewareData: s,
-        rects: r,
+        middlewareData: r,
+        rects: s,
         initialPlacement: c,
         platform: l,
         elements: a
@@ -332,46 +332,46 @@ const Jt = (t) => ({
         flipAlignment: p = !0,
         ...h
       } = Q(t, e);
-      if ((o = s.arrow) != null && o.alignmentOffset)
+      if ((o = r.arrow) != null && o.alignmentOffset)
         return {};
-      const w = F(i), x = Y(c), y = F(c) === c, v = await (l.isRTL == null ? void 0 : l.isRTL(a.floating)), b = m || (y || !p ? [ot(c)] : Xt(c)), $ = g !== "none";
-      !m && $ && b.push(...Kt(c, p, g, v));
-      const _ = [c, ...b], U = await St(e, h), B = [];
-      let P = ((n = s.flip) == null ? void 0 : n.overflows) || [];
-      if (d && B.push(U[w]), f) {
-        const A = zt(i, r, v);
-        B.push(U[A[0]], U[A[1]]);
+      const w = $(i), x = Y(c), y = $(c) === c, v = await (l.isRTL == null ? void 0 : l.isRTL(a.floating)), b = m || (y || !p ? [ot(c)] : Xt(c)), P = g !== "none";
+      !m && P && b.push(...Kt(c, p, g, v));
+      const B = [c, ...b], U = await St(e, h), V = [];
+      let D = ((n = r.flip) == null ? void 0 : n.overflows) || [];
+      if (d && V.push(U[w]), f) {
+        const A = zt(i, s, v);
+        V.push(U[A[0]], U[A[1]]);
       }
-      if (P = [...P, {
+      if (D = [...D, {
         placement: i,
-        overflows: B
-      }], !B.every((A) => A <= 0)) {
-        var K, V;
-        const A = (((K = s.flip) == null ? void 0 : K.index) || 0) + 1, I = _[A];
+        overflows: V
+      }], !V.every((A) => A <= 0)) {
+        var K, W;
+        const A = (((K = r.flip) == null ? void 0 : K.index) || 0) + 1, I = B[A];
         if (I)
           return {
             data: {
               index: A,
-              overflows: P
+              overflows: D
             },
             reset: {
               placement: I
             }
           };
-        let E = (V = P.filter((R) => R.overflows[0] <= 0).sort((R, D) => R.overflows[1] - D.overflows[1])[0]) == null ? void 0 : V.placement;
+        let E = (W = D.filter((R) => R.overflows[0] <= 0).sort((R, N) => R.overflows[1] - N.overflows[1])[0]) == null ? void 0 : W.placement;
         if (!E)
           switch (u) {
             case "bestFit": {
               var q;
-              const R = (q = P.filter((D) => {
-                if ($) {
-                  const N = Y(D.placement);
-                  return N === x || // Create a bias to the `y` side axis due to horizontal
+              const R = (q = D.filter((N) => {
+                if (P) {
+                  const M = Y(N.placement);
+                  return M === x || // Create a bias to the `y` side axis due to horizontal
                   // reading directions favoring greater width.
-                  N === "y";
+                  M === "y";
                 }
                 return !0;
-              }).map((D) => [D.placement, D.overflows.filter((N) => N > 0).reduce((N, Bt) => N + Bt, 0)]).sort((D, N) => D[1] - N[1])[0]) == null ? void 0 : q[0];
+              }).map((N) => [N.placement, N.overflows.filter((M) => M > 0).reduce((M, Bt) => M + Bt, 0)]).sort((N, M) => N[1] - M[1])[0]) == null ? void 0 : q[0];
               R && (E = R);
               break;
             }
@@ -395,7 +395,7 @@ async function Zt(t, e) {
     placement: o,
     platform: n,
     elements: i
-  } = t, s = await (n.isRTL == null ? void 0 : n.isRTL(i.floating)), r = F(o), c = Z(o), l = Y(o) === "y", a = ["left", "top"].includes(r) ? -1 : 1, d = s && l ? -1 : 1, f = Q(e, t);
+  } = t, r = await (n.isRTL == null ? void 0 : n.isRTL(i.floating)), s = $(o), c = Z(o), l = Y(o) === "y", a = ["left", "top"].includes(s) ? -1 : 1, d = r && l ? -1 : 1, f = Q(e, t);
   let {
     mainAxis: m,
     crossAxis: u,
@@ -425,16 +425,16 @@ const te = function(t) {
       var o, n;
       const {
         x: i,
-        y: s,
-        placement: r,
+        y: r,
+        placement: s,
         middlewareData: c
       } = e, l = await Zt(e, t);
-      return r === ((o = c.offset) == null ? void 0 : o.placement) && (n = c.arrow) != null && n.alignmentOffset ? {} : {
+      return s === ((o = c.offset) == null ? void 0 : o.placement) && (n = c.arrow) != null && n.alignmentOffset ? {} : {
         x: i + l.x,
-        y: s + l.y,
+        y: r + l.y,
         data: {
           ...l,
-          placement: r
+          placement: s
         }
       };
     }
@@ -449,8 +449,8 @@ const te = function(t) {
         y: n,
         placement: i
       } = e, {
-        mainAxis: s = !0,
-        crossAxis: r = !1,
+        mainAxis: r = !0,
+        crossAxis: s = !1,
         limiter: c = {
           fn: (h) => {
             let {
@@ -467,13 +467,13 @@ const te = function(t) {
       } = Q(t, e), a = {
         x: o,
         y: n
-      }, d = await St(e, l), f = Y(F(i)), m = Ot(f);
+      }, d = await St(e, l), f = Y($(i)), m = Ot(f);
       let u = a[m], g = a[f];
-      if (s) {
+      if (r) {
         const h = m === "y" ? "top" : "left", w = m === "y" ? "bottom" : "right", x = u + d[h], y = u - d[w];
         u = ft(x, u, y);
       }
-      if (r) {
+      if (s) {
         const h = f === "y" ? "top" : "left", w = f === "y" ? "bottom" : "right", x = g + d[h], y = g - d[w];
         g = ft(x, g, y);
       }
@@ -488,8 +488,8 @@ const te = function(t) {
           x: p.x - o,
           y: p.y - n,
           enabled: {
-            [m]: s,
-            [f]: r
+            [m]: r,
+            [f]: s
           }
         }
       };
@@ -548,13 +548,13 @@ function ht(t) {
   return ["transform", "translate", "scale", "rotate", "perspective"].some((n) => o[n] ? o[n] !== "none" : !1) || (o.containerType ? o.containerType !== "normal" : !1) || !e && (o.backdropFilter ? o.backdropFilter !== "none" : !1) || !e && (o.filter ? o.filter !== "none" : !1) || ["transform", "translate", "scale", "rotate", "perspective", "filter"].some((n) => (o.willChange || "").includes(n)) || ["paint", "layout", "strict", "content"].some((n) => (o.contain || "").includes(n));
 }
 function oe(t) {
-  let e = M(t);
+  let e = _(t);
   for (; k(e) && !z(e); ) {
     if (ht(e))
       return e;
     if (rt(e))
       return null;
-    e = M(e);
+    e = _(e);
   }
   return null;
 }
@@ -576,7 +576,7 @@ function ct(t) {
     scrollTop: t.scrollY
   };
 }
-function M(t) {
+function _(t) {
   if (X(t) === "html")
     return t;
   const e = (
@@ -589,16 +589,16 @@ function M(t) {
   return vt(e) ? e.host : e;
 }
 function Et(t) {
-  const e = M(t);
+  const e = _(t);
   return z(e) ? t.ownerDocument ? t.ownerDocument.body : t.body : k(e) && tt(e) ? e : Et(e);
 }
 function dt(t, e, o) {
   var n;
   e === void 0 && (e = []), o === void 0 && (o = !0);
-  const i = Et(t), s = i === ((n = t.ownerDocument) == null ? void 0 : n.body), r = T(i);
-  if (s) {
-    const c = mt(r);
-    return e.concat(r, r.visualViewport || [], tt(i) ? i : [], c && o ? dt(c) : []);
+  const i = Et(t), r = i === ((n = t.ownerDocument) == null ? void 0 : n.body), s = T(i);
+  if (r) {
+    const c = mt(s);
+    return e.concat(s, s.visualViewport || [], tt(i) ? i : [], c && o ? dt(c) : []);
   }
   return e.concat(i, dt(i, [], o));
 }
@@ -608,8 +608,8 @@ function mt(t) {
 function Lt(t) {
   const e = O(t);
   let o = parseFloat(e.width) || 0, n = parseFloat(e.height) || 0;
-  const i = k(t), s = i ? t.offsetWidth : o, r = i ? t.offsetHeight : n, c = nt(o) !== s || nt(n) !== r;
-  return c && (o = s, n = r), {
+  const i = k(t), r = i ? t.offsetWidth : o, s = i ? t.offsetHeight : n, c = nt(o) !== r || nt(n) !== s;
+  return c && (o = r, n = s), {
     width: o,
     height: n,
     $: c
@@ -625,11 +625,11 @@ function j(t) {
   const o = e.getBoundingClientRect(), {
     width: n,
     height: i,
-    $: s
+    $: r
   } = Lt(e);
-  let r = (s ? nt(o.width) : o.width) / n, c = (s ? nt(o.height) : o.height) / i;
-  return (!r || !Number.isFinite(r)) && (r = 1), (!c || !Number.isFinite(c)) && (c = 1), {
-    x: r,
+  let s = (r ? nt(o.width) : o.width) / n, c = (r ? nt(o.height) : o.height) / i;
+  return (!s || !Number.isFinite(s)) && (s = 1), (!c || !Number.isFinite(c)) && (c = 1), {
+    x: s,
     y: c
   };
 }
@@ -646,13 +646,13 @@ function se(t, e, o) {
 }
 function J(t, e, o, n) {
   e === void 0 && (e = !1), o === void 0 && (o = !1);
-  const i = t.getBoundingClientRect(), s = Pt(t);
-  let r = S(1);
-  e && (n ? C(n) && (r = j(n)) : r = j(t));
-  const c = se(s, o, n) ? Dt(s) : S(0);
-  let l = (i.left + c.x) / r.x, a = (i.top + c.y) / r.y, d = i.width / r.x, f = i.height / r.y;
-  if (s) {
-    const m = T(s), u = n && C(n) ? T(n) : n;
+  const i = t.getBoundingClientRect(), r = Pt(t);
+  let s = S(1);
+  e && (n ? C(n) && (s = j(n)) : s = j(t));
+  const c = se(r, o, n) ? Dt(r) : S(0);
+  let l = (i.left + c.x) / s.x, a = (i.top + c.y) / s.y, d = i.width / s.x, f = i.height / s.y;
+  if (r) {
+    const m = T(r), u = n && C(n) ? T(n) : n;
     let g = m, p = mt(g);
     for (; p && n && u !== g; ) {
       const h = j(p), w = p.getBoundingClientRect(), x = O(p), y = w.left + (p.clientLeft + parseFloat(x.paddingLeft)) * h.x, v = w.top + (p.clientTop + parseFloat(x.paddingTop)) * h.y;
@@ -675,10 +675,10 @@ function Nt(t, e, o) {
   const n = t.getBoundingClientRect(), i = n.left + e.scrollLeft - (o ? 0 : (
     // RTL <body> scrollbar.
     xt(t, n)
-  )), s = n.top + e.scrollTop;
+  )), r = n.top + e.scrollTop;
   return {
     x: i,
-    y: s
+    y: r
   };
 }
 function re(t) {
@@ -688,19 +688,19 @@ function re(t) {
     offsetParent: n,
     strategy: i
   } = t;
-  const s = i === "fixed", r = L(n), c = e ? rt(e.floating) : !1;
-  if (n === r || c && s)
+  const r = i === "fixed", s = L(n), c = e ? rt(e.floating) : !1;
+  if (n === s || c && r)
     return o;
   let l = {
     scrollLeft: 0,
     scrollTop: 0
   }, a = S(1);
   const d = S(0), f = k(n);
-  if ((f || !f && !s) && ((X(n) !== "body" || tt(r)) && (l = ct(n)), k(n))) {
+  if ((f || !f && !r) && ((X(n) !== "body" || tt(s)) && (l = ct(n)), k(n))) {
     const u = J(n);
     a = j(n), d.x = u.x + n.clientLeft, d.y = u.y + n.clientTop;
   }
-  const m = r && !f && !s ? Nt(r, l, !0) : S(0);
+  const m = s && !f && !r ? Nt(s, l, !0) : S(0);
   return {
     width: o.width * a.x,
     height: o.height * a.y,
@@ -712,35 +712,35 @@ function ce(t) {
   return Array.from(t.getClientRects());
 }
 function le(t) {
-  const e = L(t), o = ct(t), n = t.ownerDocument.body, i = H(e.scrollWidth, e.clientWidth, n.scrollWidth, n.clientWidth), s = H(e.scrollHeight, e.clientHeight, n.scrollHeight, n.clientHeight);
-  let r = -o.scrollLeft + xt(t);
+  const e = L(t), o = ct(t), n = t.ownerDocument.body, i = H(e.scrollWidth, e.clientWidth, n.scrollWidth, n.clientWidth), r = H(e.scrollHeight, e.clientHeight, n.scrollHeight, n.clientHeight);
+  let s = -o.scrollLeft + xt(t);
   const c = -o.scrollTop;
-  return O(n).direction === "rtl" && (r += H(e.clientWidth, n.clientWidth) - i), {
+  return O(n).direction === "rtl" && (s += H(e.clientWidth, n.clientWidth) - i), {
     width: i,
-    height: s,
-    x: r,
+    height: r,
+    x: s,
     y: c
   };
 }
 function ae(t, e) {
   const o = T(t), n = L(t), i = o.visualViewport;
-  let s = n.clientWidth, r = n.clientHeight, c = 0, l = 0;
+  let r = n.clientWidth, s = n.clientHeight, c = 0, l = 0;
   if (i) {
-    s = i.width, r = i.height;
+    r = i.width, s = i.height;
     const a = wt();
     (!a || a && e === "fixed") && (c = i.offsetLeft, l = i.offsetTop);
   }
   return {
-    width: s,
-    height: r,
+    width: r,
+    height: s,
     x: c,
     y: l
   };
 }
 function fe(t, e) {
-  const o = J(t, !0, e === "fixed"), n = o.top + t.clientTop, i = o.left + t.clientLeft, s = k(t) ? j(t) : S(1), r = t.clientWidth * s.x, c = t.clientHeight * s.y, l = i * s.x, a = n * s.y;
+  const o = J(t, !0, e === "fixed"), n = o.top + t.clientTop, i = o.left + t.clientLeft, r = k(t) ? j(t) : S(1), s = t.clientWidth * r.x, c = t.clientHeight * r.y, l = i * r.x, a = n * r.y;
   return {
-    width: r,
+    width: s,
     height: c,
     x: l,
     y: a
@@ -766,7 +766,7 @@ function At(t, e, o) {
   return it(n);
 }
 function Mt(t, e) {
-  const o = M(t);
+  const o = _(t);
   return o === e || !C(o) || z(o) ? !1 : O(o).position === "fixed" || Mt(o, e);
 }
 function ue(t, e) {
@@ -774,11 +774,11 @@ function ue(t, e) {
   if (o)
     return o;
   let n = dt(t, [], !1).filter((c) => C(c) && X(c) !== "body"), i = null;
-  const s = O(t).position === "fixed";
-  let r = s ? M(t) : t;
-  for (; C(r) && !z(r); ) {
-    const c = O(r), l = ht(r);
-    !l && c.position === "fixed" && (i = null), (s ? !l && !i : !l && c.position === "static" && !!i && ["absolute", "fixed"].includes(i.position) || tt(r) && !l && Mt(t, r)) ? n = n.filter((d) => d !== r) : i = c, r = M(r);
+  const r = O(t).position === "fixed";
+  let s = r ? _(t) : t;
+  for (; C(s) && !z(s); ) {
+    const c = O(s), l = ht(s);
+    !l && c.position === "fixed" && (i = null), (r ? !l && !i : !l && c.position === "static" && !!i && ["absolute", "fixed"].includes(i.position) || tt(s) && !l && Mt(t, s)) ? n = n.filter((d) => d !== s) : i = c, s = _(s);
   }
   return e.set(t, n), n;
 }
@@ -789,7 +789,7 @@ function de(t) {
     rootBoundary: n,
     strategy: i
   } = t;
-  const r = [...o === "clippingAncestors" ? rt(e) ? [] : ue(e, this._c) : [].concat(o), n], c = r[0], l = r.reduce((a, d) => {
+  const s = [...o === "clippingAncestors" ? rt(e) ? [] : ue(e, this._c) : [].concat(o), n], c = s[0], l = s.reduce((a, d) => {
     const f = At(e, d, i);
     return a.top = H(f.top, a.top), a.right = G(f.right, a.right), a.bottom = G(f.bottom, a.bottom), a.left = H(f.left, a.left), a;
   }, At(e, c, i));
@@ -811,23 +811,23 @@ function me(t) {
   };
 }
 function ge(t, e, o) {
-  const n = k(e), i = L(e), s = o === "fixed", r = J(t, !0, s, e);
+  const n = k(e), i = L(e), r = o === "fixed", s = J(t, !0, r, e);
   let c = {
     scrollLeft: 0,
     scrollTop: 0
   };
   const l = S(0);
-  if (n || !n && !s)
+  if (n || !n && !r)
     if ((X(e) !== "body" || tt(i)) && (c = ct(e)), n) {
-      const m = J(e, !0, s, e);
+      const m = J(e, !0, r, e);
       l.x = m.x + e.clientLeft, l.y = m.y + e.clientTop;
     } else i && (l.x = xt(i));
-  const a = i && !n && !s ? Nt(i, c) : S(0), d = r.left + c.scrollLeft - l.x - a.x, f = r.top + c.scrollTop - l.y - a.y;
+  const a = i && !n && !r ? Nt(i, c) : S(0), d = s.left + c.scrollLeft - l.x - a.x, f = s.top + c.scrollTop - l.y - a.y;
   return {
     x: d,
     y: f,
-    width: r.width,
-    height: r.height
+    width: s.width,
+    height: s.height
   };
 }
 function at(t) {
@@ -846,11 +846,11 @@ function _t(t, e) {
   if (rt(t))
     return o;
   if (!k(t)) {
-    let i = M(t);
+    let i = _(t);
     for (; i && !z(i); ) {
       if (C(i) && !at(i))
         return i;
-      i = M(i);
+      i = _(i);
     }
     return o;
   }
@@ -889,46 +889,47 @@ const we = {
   const n = /* @__PURE__ */ new Map(), i = {
     platform: we,
     ...o
-  }, s = {
+  }, r = {
     ...i.platform,
     _c: n
   };
   return Gt(t, e, {
     ...i,
-    platform: s
+    platform: r
   });
-}, et = (t, e = "px") => typeof t > "u" ? "" : `${Math.round(t)}${e}`, Te = () => W("absolute top-0 left-0 w-max py-1 px-2 rounded text-sm z-50"), Ct = ({
+}, et = (t, e = "px") => typeof t > "u" ? "" : `${Math.round(t)}${e}`, Te = () => F("absolute top-0 left-0 w-max py-1 px-2 rounded text-sm z-50"), Ct = ({
   mode: t
-}) => W({
+}) => F({
   "bg-surface-darker": t === "dark" || t === "system",
   "bg-surface-light": t === "light" || t === "alt-system",
   "dark:bg-surface-light": t === "system",
   "dark:bg-surface-darker": t === "alt-system"
 }), Ce = ({
   mode: t
-}) => W({
+}) => F({
   "text-copy-light": t === "dark" || t === "system",
   "text-copy-dark": t === "light" || t === "alt-system",
   "dark:text-copy-dark": t === "system",
   "dark:text-copy-light": t === "alt-system"
-}), Oe = () => W("absolute", "size-2", "transform rotate-45"), Re = ({
+}), Oe = () => F("absolute", "size-2", "transform rotate-45"), Re = ({
   mode: t,
   className: e,
-  arrowClassName: o
+  tooltipClassName: o,
+  arrowClassName: n
 }) => {
-  const n = W("relative inline-block"), i = W(
+  const i = F("relative inline-block", e), r = F(
     It,
     Te(),
     Ct({ mode: t }),
     Ce({ mode: t }),
-    e
-  ), s = W(
+    o
+  ), s = F(
     Ht,
     Oe(),
     Ct({ mode: t }),
-    o
+    n
   );
-  return { tooltip: i, arrow: s, wrapper: n };
+  return { tooltip: r, arrow: s, wrapper: i };
 }, Se = ({ delay: t = 300 }) => ({
   animation: `av-tooltip-fade-in ${t}ms ease-in-out`
 }), Pe = ({
@@ -937,18 +938,24 @@ const we = {
   placement: o = "top",
   mode: n = "system",
   delay: i = 300,
-  className: s,
-  arrowClassName: r
+  className: r,
+  tooltipClassName: s,
+  arrowClassName: c
 }) => {
-  const c = lt(null), l = lt(null), a = lt(null), [d, f] = Wt(!1), m = Re({ mode: n, className: s, arrowClassName: r }), u = Se({ delay: i }), g = Ft(async () => {
-    var p, h;
-    if (c.current && l.current && a.current) {
+  const l = lt(null), a = lt(null), d = lt(null), [f, m] = Wt(!1), u = Re({
+    mode: n,
+    className: r,
+    tooltipClassName: s,
+    arrowClassName: c
+  }), g = Se({ delay: i }), p = Ft(async () => {
+    var h, w;
+    if (l.current && a.current && d.current) {
       const {
-        x: w,
-        y: x,
-        middlewareData: y,
-        placement: v
-      } = await Ae(c.current, l.current, {
+        x,
+        y,
+        middlewareData: v,
+        placement: b
+      } = await Ae(l.current, a.current, {
         placement: o,
         middleware: [
           xe(10),
@@ -957,50 +964,50 @@ const we = {
             fallbackAxisSideDirection: "start"
           }),
           ye({ padding: 5 }),
-          ve({ element: a.current })
+          ve({ element: d.current })
         ]
       });
-      Object.assign(l.current.style, {
-        left: et(w),
-        top: et(x),
-        ...u
+      Object.assign(a.current.style, {
+        left: et(x),
+        top: et(y),
+        ...g
       });
-      const b = {
+      const P = {
         top: "bottom",
         right: "left",
         bottom: "top",
         left: "right"
-      }[v.split("-")[0]];
-      Object.assign(a.current.style, {
-        left: et((p = y.arrow) == null ? void 0 : p.x),
-        top: et((h = y.arrow) == null ? void 0 : h.y),
+      }[b.split("-")[0]];
+      Object.assign(d.current.style, {
+        left: et((h = v.arrow) == null ? void 0 : h.x),
+        top: et((w = v.arrow) == null ? void 0 : w.y),
         right: "",
         bottom: "",
-        [b]: "-4px"
+        [P]: "-4px"
       });
     }
-  }, [o, u]);
+  }, [o, g]);
   return $t(() => {
-    (async () => d && await g())();
-  }, [g, d]), /* @__PURE__ */ yt(
+    (async () => f && await p())();
+  }, [p, f]), /* @__PURE__ */ yt(
     "div",
     {
-      className: m.wrapper,
-      ref: c,
-      onMouseEnter: () => f(!0),
-      onMouseLeave: () => f(!1),
-      onClick: () => f(!1),
+      className: u.wrapper,
+      ref: l,
+      onMouseEnter: () => m(!0),
+      onMouseLeave: () => m(!1),
+      onClick: () => m(!1),
       children: [
         t,
-        d && /* @__PURE__ */ yt(
+        f && /* @__PURE__ */ yt(
           "div",
           {
             role: "tooltip",
-            ref: l,
-            className: m.tooltip,
+            ref: a,
+            className: u.tooltip,
             children: [
               e,
-              /* @__PURE__ */ Vt("div", { ref: a, className: m.arrow })
+              /* @__PURE__ */ Vt("div", { ref: d, className: u.arrow })
             ]
           }
         )

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@versini/ui-tooltip",
-	"version": "1.1.2",
+	"version": "1.2.0",
 	"license": "MIT",
 	"author": "Arno Versini",
 	"publishConfig": {
@@ -38,7 +38,7 @@
 		"react-dom": "^18.3.1 || ^19.0.0"
 	},
 	"devDependencies": {
-		"@versini/ui-types": "4.3.1"
+		"@versini/ui-types": "4.4.0"
 	},
 	"dependencies": {
 		"@floating-ui/dom": "1.6.13",
@@ -49,5 +49,5 @@
 	"sideEffects": [
 		"**/*.css"
 	],
-	"gitHead": "1542a19c98ab5af85458a93e788576f97549e589"
+	"gitHead": "5018e3c37dea17fe8d0635e6d16fd6a3d6f14282"
 }