zero-tooltip 1.0.9 → 1.1.0

package/README.md

@@ -61,6 +61,7 @@ Tooltip component is fully customizable by giving config object as options when
 import ZeroTooltipConfig from 'zero-tooltip'
 
 const tooltipConfig: ZeroTooltipConfig = {
+    appendTo: ... ,
     defaultPosition: ... ,
     positions: ... ,
     offsetFromSource: ... ,
@@ -92,6 +93,7 @@ import ZeroTooltipLocalConfig from 'zero-tooltip'
 
 const tooltipConfig: ZeroTooltipLocalConfig = reactive({
     content: 'This is tooltip',
+    appendTo: ... ,
     defaultPosition: ... ,
     positions: ... ,
     offsetFromSource: ... ,
@@ -113,7 +115,8 @@ const tooltipConfig: ZeroTooltipLocalConfig = reactive({
 ## ZeroTooltipConfig
 | Property | <div style="width:260px">Default value</div> | Type | Details |
 |---|---|---|---|
-| defaultPosition | *top* | TooltipPosition | Position of tooltip component relative to element that is being hovered |
+| appendTo | *body* | string | A valid CSS query selector to specify where Tooltip gets appended. |
+| defaultPosition | *top* | TooltipPosition | Position of tooltip component relative to element that is being hovered. |
 | positions | *{ <br> &emsp; left: ['left', 'right', 'top', 'bottom'], <br> &emsp; top: ['top', 'bottom', 'right', 'left'], <br> &emsp; right: ['right', 'left', 'top', 'bottom'], <br> &emsp; bottom: ['bottom', 'top', 'right', 'left'], <br> }* | TooltipPositions | Ordered list of fallback positions in case tooltip does not have enough space in default position. If none of given positions will have enough space for tooltip, then it will not be rendered. |
 | offsetFromSource | *10* | number | Tooltip offset in `px` from element that's being hovered *(arrow size is not added to this value)* |
 | offsetFromViewport | *20* | number | Minimal allowed tooltip offset in `px` from viewport sides |

package/dist/style.css

@@ -1 +1 @@
-/*! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.zt-fixed{position:fixed}.zt-absolute{position:absolute}.zt-box-border{box-sizing:border-box}.zt-inline-block{display:inline-block}.zt-h-\[2000px\]{height:2000px}.zt-w-fit{width:-moz-fit-content;width:fit-content}.zt-w-full{width:100%}.zt-whitespace-pre-wrap{white-space:pre-wrap}.zt-break-words{overflow-wrap:break-word}.zt-rounded-md{border-radius:.375rem}.zt-border-solid{border-style:solid}.zt-border-\[\#495057\]{--tw-border-opacity:1;border-color:rgb(73 80 87/var(--tw-border-opacity))}.\!zt-border-x-transparent{border-left-color:#0000!important;border-right-color:#0000!important}.\!zt-border-y-transparent{border-top-color:#0000!important}.\!zt-border-b-transparent,.\!zt-border-y-transparent{border-bottom-color:#0000!important}.\!zt-border-l-transparent{border-left-color:#0000!important}.\!zt-border-r-transparent{border-right-color:#0000!important}.\!zt-border-t-transparent{border-top-color:#0000!important}.zt-bg-\[\#495057\]{--tw-bg-opacity:1;background-color:rgb(73 80 87/var(--tw-bg-opacity))}.zt-bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.zt-px-2{padding-left:.5rem;padding-right:.5rem}.zt-px-2\.5{padding-left:.625rem;padding-right:.625rem}.zt-py-1{padding-top:.25rem;padding-bottom:.25rem}.zt-py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.zt-text-sm{font-size:.875rem;line-height:1.25rem}.zt-text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.zt-opacity-0{opacity:0}.zt-shadow-\[0_2px_12px_0_rgba\(0\,0\,0\,0\.1\)\]{--tw-shadow:0 2px 12px 0 #0000001a;--tw-shadow-colored:0 2px 12px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}
+/*! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.zt-fixed{position:fixed}.zt-absolute{position:absolute}.zt-right-0{right:0}.zt-top-0{top:0}.zt-z-\[2\]{z-index:2}.zt-box-border{box-sizing:border-box}.zt-inline-block{display:inline-block}.zt-h-\[2000px\]{height:2000px}.zt-h-\[500px\]{height:500px}.zt-w-\[400px\]{width:400px}.zt-w-fit{width:-moz-fit-content;width:fit-content}.zt-w-full{width:100%}.zt-whitespace-pre-wrap{white-space:pre-wrap}.zt-break-words{overflow-wrap:break-word}.zt-rounded-md{border-radius:.375rem}.zt-border-solid{border-style:solid}.zt-border-\[\#495057\]{--tw-border-opacity:1;border-color:rgb(73 80 87/var(--tw-border-opacity))}.\!zt-border-x-transparent{border-left-color:#0000!important;border-right-color:#0000!important}.\!zt-border-y-transparent{border-top-color:#0000!important}.\!zt-border-b-transparent,.\!zt-border-y-transparent{border-bottom-color:#0000!important}.\!zt-border-l-transparent{border-left-color:#0000!important}.\!zt-border-r-transparent{border-right-color:#0000!important}.\!zt-border-t-transparent{border-top-color:#0000!important}.zt-bg-\[\#495057\]{--tw-bg-opacity:1;background-color:rgb(73 80 87/var(--tw-bg-opacity))}.zt-bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.zt-bg-red-400{--tw-bg-opacity:1;background-color:rgb(248 113 113/var(--tw-bg-opacity))}.zt-px-2{padding-left:.5rem;padding-right:.5rem}.zt-px-2\.5{padding-left:.625rem;padding-right:.625rem}.zt-py-1{padding-top:.25rem;padding-bottom:.25rem}.zt-py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.zt-text-sm{font-size:.875rem;line-height:1.25rem}.zt-text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.zt-opacity-0{opacity:0}.zt-shadow-\[0_2px_12px_0_rgba\(0\,0\,0\,0\.1\)\]{--tw-shadow:0 2px 12px 0 #0000001a;--tw-shadow-colored:0 2px 12px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}

package/dist/types/tooltipConfig.d.ts

@@ -1,6 +1,7 @@
 import TooltipPosition from "./tooltipPosition";
 import TooltipPositions from "./tooltipPositions";
 type TooltipConfig = {
+    appendTo?: string;
     defaultPosition?: TooltipPosition;
     positions?: Partial<TooltipPositions>;
     offsetFromSource?: number;

package/dist/zero-tooltip.js

@@ -1,39 +1,39 @@
-import { isReactive as et, watch as rt } from "vue";
+import { isReactive as st, watch as dt } from "vue";
 let M;
-const st = new Uint8Array(16);
-function dt() {
+const it = new Uint8Array(16);
+function pt() {
   if (!M && (M = typeof crypto < "u" && crypto.getRandomValues && crypto.getRandomValues.bind(crypto), !M))
     throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");
-  return M(st);
+  return M(it);
 }
-const w = [];
+const u = [];
 for (let e = 0; e < 256; ++e)
-  w.push((e + 256).toString(16).slice(1));
-function it(e, t = 0) {
-  return w[e[t + 0]] + w[e[t + 1]] + w[e[t + 2]] + w[e[t + 3]] + "-" + w[e[t + 4]] + w[e[t + 5]] + "-" + w[e[t + 6]] + w[e[t + 7]] + "-" + w[e[t + 8]] + w[e[t + 9]] + "-" + w[e[t + 10]] + w[e[t + 11]] + w[e[t + 12]] + w[e[t + 13]] + w[e[t + 14]] + w[e[t + 15]];
+  u.push((e + 256).toString(16).slice(1));
+function ot(e, t = 0) {
+  return u[e[t + 0]] + u[e[t + 1]] + u[e[t + 2]] + u[e[t + 3]] + "-" + u[e[t + 4]] + u[e[t + 5]] + "-" + u[e[t + 6]] + u[e[t + 7]] + "-" + u[e[t + 8]] + u[e[t + 9]] + "-" + u[e[t + 10]] + u[e[t + 11]] + u[e[t + 12]] + u[e[t + 13]] + u[e[t + 14]] + u[e[t + 15]];
 }
-const ot = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), q = {
-  randomUUID: ot
+const ht = typeof crypto < "u" && crypto.randomUUID && crypto.randomUUID.bind(crypto), R = {
+  randomUUID: ht
 };
-function pt(e, t, r) {
-  if (q.randomUUID && !t && !e)
-    return q.randomUUID();
+function ut(e, t, r) {
+  if (R.randomUUID && !t && !e)
+    return R.randomUUID();
   e = e || {};
-  const s = e.random || (e.rng || dt)();
+  const s = e.random || (e.rng || pt)();
   if (s[6] = s[6] & 15 | 64, s[8] = s[8] & 63 | 128, t) {
     r = r || 0;
     for (let d = 0; d < 16; ++d)
       t[r + d] = s[d];
     return t;
   }
-  return it(s);
+  return ot(s);
 }
-function ht() {
+function wt() {
   let e = [];
   const t = (d, i) => {
     if (r(d), e.length > 0)
-      for (const o of e)
-        o.addEventListener("scroll", i);
+      for (const p of e)
+        p.addEventListener("scroll", i);
     window.addEventListener("scroll", () => {
       i(), s(i);
     });
@@ -41,8 +41,8 @@ function ht() {
     let i = d;
     for (; i !== null && i.tagName !== "HTML"; ) {
       if (i.scrollHeight !== i.clientHeight) {
-        const o = window.getComputedStyle(i);
-        (o.overflow === "auto" || o.overflow === "scroll") && e.push(i);
+        const p = window.getComputedStyle(i);
+        (p.overflow === "auto" || p.overflow === "scroll") && e.push(i);
       }
       i = i.parentElement;
     }
@@ -56,15 +56,15 @@ function ht() {
   };
   return { handleHideOnScroll: t };
 }
-function wt() {
+function mt() {
   let e = null, t = null;
   return { handleHideOnResize: (d, i) => {
-    e = new ResizeObserver((o) => {
-      const p = o[0].target;
+    e = new ResizeObserver((p) => {
+      const o = p[0].target;
       if (t === null)
         t = d.getBoundingClientRect();
       else {
-        const h = p.getBoundingClientRect();
+        const h = o.getBoundingClientRect();
         (h.left !== t.left || h.top !== t.top || h.width !== t.width || h.height !== t.height) && i();
       }
     }), e.observe(d);
@@ -72,167 +72,168 @@ function wt() {
     e !== null && e.disconnect(), e = null, t = null;
   } };
 }
-const { handleHideOnScroll: ut } = ht(), { handleHideOnResize: mt, resetResizeReferences: nt } = wt(), y = "zero-tooltip__container", j = "zero-tooltip__text", tt = "zero-tooltip__arrow", c = {
+const { handleHideOnScroll: nt } = wt(), { handleHideOnResize: ct, resetResizeReferences: Ot } = mt(), S = "zero-tooltip__container", N = "zero-tooltip__text", rt = "zero-tooltip__arrow", c = {
   left: ["left", "right", "top", "bottom"],
   top: ["top", "bottom", "right", "left"],
   right: ["right", "left", "top", "bottom"],
   bottom: ["bottom", "top", "right", "left"]
-}, R = "top", N = 10, Z = 20, G = 100, J = 250, K = 0, Q = "zt-fixed zt-opacity-0 zt-inline-block zt-w-fit zt-py-1.5 zt-px-2.5 zt-rounded-md zt-bg-[#495057] zt-shadow-[0_2px_12px_0_rgba(0,0,0,0.1)] zt-box-border", X = "zt-text-sm zt-text-white zt-whitespace-pre-wrap zt-break-words", Y = 5, ct = "zt-absolute zt-border-solid zt-border-[#495057]", E = 6, l = 1, b = !0, n = {}, Ot = (e) => ({
+}, Z = "body", f = "top", G = 10, J = 20, K = 100, Q = 250, X = 0, Y = "zt-fixed zt-opacity-0 zt-inline-block zt-w-fit zt-py-1.5 zt-px-2.5 zt-rounded-md zt-bg-[#495057] zt-shadow-[0_2px_12px_0_rgba(0,0,0,0.1)] zt-box-border", E = "zt-text-sm zt-text-white zt-whitespace-pre-wrap zt-break-words", l = 5, xt = "zt-absolute zt-border-solid zt-border-[#495057]", b = 6, C = 1, g = !0, n = {}, Ft = (e) => ({
   created: (t, r, s) => {
-    const d = pt();
-    s.el.$_tooltip = { uuid: d }, V(r.value, e, r.arg, t, d), typeof r.value != "string" && et(r.value) && rt(r.value, (i) => {
-      n[d] && B(n[d]), V(i, e, r.arg, t, d);
+    const d = ut();
+    s.el.$_tooltip = { uuid: d }, B(r.value, e, r.arg, t, d), typeof r.value != "string" && st(r.value) && dt(r.value, (i) => {
+      n[d] && L(n[d]), B(i, e, r.arg, t, d);
     });
   },
   updated: (t, r, s) => {
     const d = s.el.$_tooltip.uuid;
-    n[d] && B(n[d]), V(r.value, e, r.arg, t, d);
+    n[d] && L(n[d]), B(r.value, e, r.arg, t, d);
   },
   beforeUnmount: (t, r, s) => {
     const d = s.el.$_tooltip.uuid;
-    n[d] && B(n[d]);
+    n[d] && L(n[d]);
   }
 });
-function V(e, t, r, s, d) {
-  let i = xt(e, t, r);
-  const o = Tt(s, i, d);
-  n[d] = o, s.matches(":hover") && s.dispatchEvent(new Event("mouseenter"));
+function B(e, t, r, s, d) {
+  let i = Tt(e, t, r);
+  const p = vt(s, i, d);
+  n[d] = p, s.matches(":hover") && s.dispatchEvent(new Event("mouseenter"));
 }
-function xt(e, t, r) {
-  var a, L, H, $, A, _, I, U, f, k, D, P;
-  let s, d, i, o, p, h, u, m, x, O, F, T, W, v, z;
-  return s = Ft(e), typeof e != "string" && (d = r ?? e.defaultPosition ?? (t == null ? void 0 : t.defaultPosition) ?? R, i = {
-    left: ((a = e.positions) == null ? void 0 : a.left) ?? ((L = t == null ? void 0 : t.positions) == null ? void 0 : L.left) ?? c.left,
-    top: ((H = e.positions) == null ? void 0 : H.top) ?? (($ = t == null ? void 0 : t.positions) == null ? void 0 : $.top) ?? c.top,
-    right: ((A = e.positions) == null ? void 0 : A.right) ?? ((_ = t == null ? void 0 : t.positions) == null ? void 0 : _.right) ?? c.right,
-    bottom: ((I = e.positions) == null ? void 0 : I.bottom) ?? ((U = t == null ? void 0 : t.positions) == null ? void 0 : U.bottom) ?? c.bottom
-  }, o = e.offsetFromSource ?? (t == null ? void 0 : t.offsetFromSource) ?? N, p = e.offsetFromViewport ?? (t == null ? void 0 : t.offsetFromViewport) ?? Z, h = e.minWidth ?? (t == null ? void 0 : t.minWidth) ?? G, u = e.maxWidth ?? (t == null ? void 0 : t.maxWidth) ?? J, m = e.tooltipBorderWidth ?? (t == null ? void 0 : t.tooltipBorderWidth) ?? K, x = y + " " + Q + " " + (e.tooltipClasses ?? (t == null ? void 0 : t.tooltipClasses) ?? ""), O = j + " " + X + " " + (e.textClasses ?? (t == null ? void 0 : t.textClasses) ?? ""), F = e.arrowSize ?? (t == null ? void 0 : t.arrowSize) ?? Y, T = e.arrowClasses ?? (t == null ? void 0 : t.arrowClasses) ?? "", W = e.arrowMinOffsetFromTooltipCorner ?? (t == null ? void 0 : t.arrowMinOffsetFromTooltipCorner) ?? E, v = e.zIndex ?? (t == null ? void 0 : t.zIndex) ?? l, z = e.show ?? b), d === void 0 && (d = r ?? (t == null ? void 0 : t.defaultPosition) ?? R), i === void 0 && (i = {
-    left: ((f = t == null ? void 0 : t.positions) == null ? void 0 : f.left) ?? c.left,
-    top: ((k = t == null ? void 0 : t.positions) == null ? void 0 : k.top) ?? c.top,
-    right: ((D = t == null ? void 0 : t.positions) == null ? void 0 : D.right) ?? c.right,
-    bottom: ((P = t == null ? void 0 : t.positions) == null ? void 0 : P.bottom) ?? c.bottom
-  }), o === void 0 && (o = (t == null ? void 0 : t.offsetFromSource) ?? N), p === void 0 && (p = (t == null ? void 0 : t.offsetFromViewport) ?? Z), h === void 0 && (h = (t == null ? void 0 : t.minWidth) ?? G), u === void 0 && (u = (t == null ? void 0 : t.maxWidth) ?? J), m === void 0 && (m = (t == null ? void 0 : t.tooltipBorderWidth) ?? K), x === void 0 && (x = y + " " + Q + " " + ((t == null ? void 0 : t.tooltipClasses) ?? "")), O === void 0 && (O = j + " " + X + " " + ((t == null ? void 0 : t.textClasses) ?? "")), F === void 0 && (F = (t == null ? void 0 : t.arrowSize) ?? Y), T === void 0 && (T = (t == null ? void 0 : t.arrowClasses) ?? ""), W === void 0 && (W = (t == null ? void 0 : t.arrowMinOffsetFromTooltipCorner) ?? E), v === void 0 && (v = (t == null ? void 0 : t.zIndex) ?? l), z === void 0 && (z = b), {
-    tooltipText: s,
-    tooltipPosition: d,
-    tooltipPositions: i,
+function Tt(e, t, r) {
+  var a, H, $, A, _, I, U, k, D, P, q, j;
+  let s, d, i, p, o, h, w, m, x, O, F, T, W, v, z, y;
+  return d = Wt(e), typeof e != "string" && (s = e.appendTo ?? (t == null ? void 0 : t.appendTo) ?? Z, i = r ?? e.defaultPosition ?? (t == null ? void 0 : t.defaultPosition) ?? f, p = {
+    left: ((a = e.positions) == null ? void 0 : a.left) ?? ((H = t == null ? void 0 : t.positions) == null ? void 0 : H.left) ?? c.left,
+    top: (($ = e.positions) == null ? void 0 : $.top) ?? ((A = t == null ? void 0 : t.positions) == null ? void 0 : A.top) ?? c.top,
+    right: ((_ = e.positions) == null ? void 0 : _.right) ?? ((I = t == null ? void 0 : t.positions) == null ? void 0 : I.right) ?? c.right,
+    bottom: ((U = e.positions) == null ? void 0 : U.bottom) ?? ((k = t == null ? void 0 : t.positions) == null ? void 0 : k.bottom) ?? c.bottom
+  }, o = e.offsetFromSource ?? (t == null ? void 0 : t.offsetFromSource) ?? G, h = e.offsetFromViewport ?? (t == null ? void 0 : t.offsetFromViewport) ?? J, w = e.minWidth ?? (t == null ? void 0 : t.minWidth) ?? K, m = e.maxWidth ?? (t == null ? void 0 : t.maxWidth) ?? Q, x = e.tooltipBorderWidth ?? (t == null ? void 0 : t.tooltipBorderWidth) ?? X, O = S + " " + Y + " " + (e.tooltipClasses ?? (t == null ? void 0 : t.tooltipClasses) ?? ""), F = N + " " + E + " " + (e.textClasses ?? (t == null ? void 0 : t.textClasses) ?? ""), T = e.arrowSize ?? (t == null ? void 0 : t.arrowSize) ?? l, W = e.arrowClasses ?? (t == null ? void 0 : t.arrowClasses) ?? "", v = e.arrowMinOffsetFromTooltipCorner ?? (t == null ? void 0 : t.arrowMinOffsetFromTooltipCorner) ?? b, z = e.zIndex ?? (t == null ? void 0 : t.zIndex) ?? C, y = e.show ?? g), s === void 0 && (s = (t == null ? void 0 : t.appendTo) ?? Z), i === void 0 && (i = r ?? (t == null ? void 0 : t.defaultPosition) ?? f), p === void 0 && (p = {
+    left: ((D = t == null ? void 0 : t.positions) == null ? void 0 : D.left) ?? c.left,
+    top: ((P = t == null ? void 0 : t.positions) == null ? void 0 : P.top) ?? c.top,
+    right: ((q = t == null ? void 0 : t.positions) == null ? void 0 : q.right) ?? c.right,
+    bottom: ((j = t == null ? void 0 : t.positions) == null ? void 0 : j.bottom) ?? c.bottom
+  }), o === void 0 && (o = (t == null ? void 0 : t.offsetFromSource) ?? G), h === void 0 && (h = (t == null ? void 0 : t.offsetFromViewport) ?? J), w === void 0 && (w = (t == null ? void 0 : t.minWidth) ?? K), m === void 0 && (m = (t == null ? void 0 : t.maxWidth) ?? Q), x === void 0 && (x = (t == null ? void 0 : t.tooltipBorderWidth) ?? X), O === void 0 && (O = S + " " + Y + " " + ((t == null ? void 0 : t.tooltipClasses) ?? "")), F === void 0 && (F = N + " " + E + " " + ((t == null ? void 0 : t.textClasses) ?? "")), T === void 0 && (T = (t == null ? void 0 : t.arrowSize) ?? l), W === void 0 && (W = (t == null ? void 0 : t.arrowClasses) ?? ""), v === void 0 && (v = (t == null ? void 0 : t.arrowMinOffsetFromTooltipCorner) ?? b), z === void 0 && (z = (t == null ? void 0 : t.zIndex) ?? C), y === void 0 && (y = g), {
+    appendTo: s,
+    tooltipText: d,
+    tooltipPosition: i,
+    tooltipPositions: p,
     tooltipOffsetFromSource: o,
-    tooltipOffsetFromViewport: p,
-    tooltipMinWidth: h,
-    tooltipMaxWidth: u,
-    tooltipBorderWidth: m,
-    tooltipClasses: x,
-    textClasses: O,
-    arrowSize: F,
-    arrowClasses: T,
-    arrowMinOffsetFromTooltipCorner: W,
-    zIndex: v,
-    shouldShow: z
+    tooltipOffsetFromViewport: h,
+    tooltipMinWidth: w,
+    tooltipMaxWidth: m,
+    tooltipBorderWidth: x,
+    tooltipClasses: O,
+    textClasses: F,
+    arrowSize: T,
+    arrowClasses: W,
+    arrowMinOffsetFromTooltipCorner: v,
+    zIndex: z,
+    shouldShow: y
   };
 }
-function Ft(e) {
+function Wt(e) {
   const t = typeof e == "string" ? e : e.content;
   if (!t)
     throw new Error("Please enter valid tooltip value");
   return t;
 }
-function Tt(e, t, r) {
-  let s = e, d = Wt(t.textClasses, t.tooltipText), i = vt(t.tooltipClasses, t.tooltipBorderWidth);
+function vt(e, t, r) {
+  let s = e, d = zt(t.textClasses, t.tooltipText), i = yt(t.tooltipClasses, t.tooltipBorderWidth);
   i.append(d), i.dataset.uuid = r;
-  const o = new AbortController(), p = new AbortController();
-  return s.addEventListener("mouseenter", () => zt(s, t, i, r), { signal: o.signal }), s.addEventListener("mouseleave", () => Mt(r), { signal: p.signal }), {
+  const p = new AbortController(), o = new AbortController();
+  return s.addEventListener("mouseenter", () => Mt(s, t, i, r), { signal: p.signal }), s.addEventListener("mouseleave", () => St(r), { signal: o.signal }), {
     anchorElement: s,
     tooltipConfig: t,
     tooltipElement: i,
-    mouseEnterEventController: o,
-    mouseLeaveEventController: p
+    mouseEnterEventController: p,
+    mouseLeaveEventController: o
   };
 }
-function Wt(e, t) {
+function zt(e, t) {
   let r = document.createElement("p");
   return r.classList.add(...e.trim().split(" ")), r.innerHTML = t, r;
 }
-function vt(e, t) {
+function yt(e, t) {
   let r = document.createElement("div");
   return r.classList.add(...e.trim().split(" ")), r.style.borderWidth = `${t}px`, r;
 }
-function zt(e, t, r, s) {
+function Mt(e, t, r, s) {
   if (!t.shouldShow)
     return;
-  const d = e.getBoundingClientRect(), i = document.querySelector("body");
+  const d = e.getBoundingClientRect(), i = document.querySelector(t.appendTo);
   i == null || i.appendChild(r);
-  let o = !1, p = t.tooltipPosition;
-  for (let h = 0; h < 4 && (p = t.tooltipPositions[t.tooltipPosition][h], p === "left" ? o = yt(d, t, r) : p === "top" ? o = Vt(d, t, r) : p === "right" ? o = St(d, t, r) : p === "bottom" && (o = Bt(d, t, r)), !o); h++)
+  let p = !1, o = t.tooltipPosition;
+  for (let h = 0; h < 4 && (o = t.tooltipPositions[t.tooltipPosition][h], o === "left" ? p = Vt(d, t, r) : o === "top" ? p = Lt(d, t, r) : o === "right" ? p = Bt(d, t, r) : o === "bottom" && (p = at(d, t, r)), !p); h++)
     ;
-  o && (at(d, p, t, r), r.style.opacity = "1", r.style.zIndex = t.zIndex.toString(), ut(e, () => S(s)), mt(e, () => S(s)));
+  p && (Ht(d, o, t, r), r.style.opacity = "1", r.style.zIndex = t.zIndex.toString(), nt(e, () => V(s)), ct(e, () => V(s)));
 }
-function Mt(e) {
-  S(e);
+function St(e) {
+  V(e);
 }
-function yt(e, t, r) {
+function Vt(e, t, r) {
   const s = Math.min(e.left - t.tooltipOffsetFromSource - t.tooltipOffsetFromViewport, t.tooltipMaxWidth), d = e.top >= t.tooltipOffsetFromViewport, i = window.innerHeight - e.bottom >= t.tooltipOffsetFromViewport;
   if (s < t.tooltipMinWidth || !d || !i)
     return !1;
   r.style.maxWidth = `${s}px`;
-  const o = r.getBoundingClientRect();
-  let p = e.top + e.height / 2 - o.height / 2;
-  p < t.tooltipOffsetFromViewport ? p = t.tooltipOffsetFromViewport : p + o.height > window.innerHeight - t.tooltipOffsetFromViewport && (p = window.innerHeight - t.tooltipOffsetFromViewport - o.height);
-  const h = e.left - t.tooltipOffsetFromSource - o.width;
-  return e.bottom < p + t.arrowMinOffsetFromTooltipCorner * 2 || e.top > p + o.height - t.arrowMinOffsetFromTooltipCorner * 2 ? !1 : (r.style.top = `${p}px`, r.style.left = `${h}px`, !0);
+  const p = r.getBoundingClientRect();
+  let o = e.top + e.height / 2 - p.height / 2;
+  o < t.tooltipOffsetFromViewport ? o = t.tooltipOffsetFromViewport : o + p.height > window.innerHeight - t.tooltipOffsetFromViewport && (o = window.innerHeight - t.tooltipOffsetFromViewport - p.height);
+  const h = e.left - t.tooltipOffsetFromSource - p.width;
+  return e.bottom < o + t.arrowMinOffsetFromTooltipCorner * 2 || e.top > o + p.height - t.arrowMinOffsetFromTooltipCorner * 2 ? !1 : (r.style.top = `${o}px`, r.style.left = `${h}px`, !0);
 }
-function St(e, t, r) {
+function Bt(e, t, r) {
   const s = Math.min(window.innerWidth - (e.right + t.tooltipOffsetFromSource) - t.tooltipOffsetFromViewport, t.tooltipMaxWidth), d = e.top >= t.tooltipOffsetFromViewport, i = window.innerHeight - e.bottom >= t.tooltipOffsetFromViewport;
   if (s < t.tooltipMinWidth || !d || !i)
     return !1;
   r.style.maxWidth = `${s}px`;
-  const o = r.getBoundingClientRect();
-  let p = e.top + e.height / 2 - o.height / 2;
-  p < t.tooltipOffsetFromViewport ? p = t.tooltipOffsetFromViewport : p + o.height > window.innerHeight - t.tooltipOffsetFromViewport && (p = window.innerHeight - t.tooltipOffsetFromViewport - o.height);
+  const p = r.getBoundingClientRect();
+  let o = e.top + e.height / 2 - p.height / 2;
+  o < t.tooltipOffsetFromViewport ? o = t.tooltipOffsetFromViewport : o + p.height > window.innerHeight - t.tooltipOffsetFromViewport && (o = window.innerHeight - t.tooltipOffsetFromViewport - p.height);
   const h = e.right + t.tooltipOffsetFromSource;
-  return e.bottom < p + t.arrowMinOffsetFromTooltipCorner * 2 || e.top > p + o.height - t.arrowMinOffsetFromTooltipCorner * 2 ? !1 : (r.style.top = `${p}px`, r.style.left = `${h}px`, !0);
+  return e.bottom < o + t.arrowMinOffsetFromTooltipCorner * 2 || e.top > o + p.height - t.arrowMinOffsetFromTooltipCorner * 2 ? !1 : (r.style.top = `${o}px`, r.style.left = `${h}px`, !0);
 }
-function Vt(e, t, r) {
+function Lt(e, t, r) {
   const s = Math.min(window.innerWidth - t.tooltipOffsetFromViewport * 2, t.tooltipMaxWidth);
   r.style.maxWidth = `${s}px`;
   const d = r.getBoundingClientRect();
   let i = e.top - t.tooltipOffsetFromSource - d.height;
   if (i < t.tooltipOffsetFromViewport)
     return !1;
-  let o = e.left + e.width / 2 - d.width / 2;
-  return o < t.tooltipOffsetFromViewport ? o = t.tooltipOffsetFromViewport : o + d.width > window.innerWidth - t.tooltipOffsetFromViewport && (o = window.innerWidth - t.tooltipOffsetFromViewport - d.width), e.left > o + d.width - t.arrowMinOffsetFromTooltipCorner * 2 || e.right < o + t.arrowMinOffsetFromTooltipCorner * 2 ? !1 : (r.style.top = `${i}px`, r.style.left = `${o}px`, !0);
+  let p = e.left + e.width / 2 - d.width / 2;
+  return p < t.tooltipOffsetFromViewport ? p = t.tooltipOffsetFromViewport : p + d.width > window.innerWidth - t.tooltipOffsetFromViewport && (p = window.innerWidth - t.tooltipOffsetFromViewport - d.width), e.left > p + d.width - t.arrowMinOffsetFromTooltipCorner * 2 || e.right < p + t.arrowMinOffsetFromTooltipCorner * 2 ? !1 : (r.style.top = `${i}px`, r.style.left = `${p}px`, !0);
 }
-function Bt(e, t, r) {
+function at(e, t, r) {
   const s = Math.min(window.innerWidth - t.tooltipOffsetFromViewport * 2, t.tooltipMaxWidth);
   r.style.maxWidth = `${s}px`;
   const d = r.getBoundingClientRect();
   let i = e.bottom + t.tooltipOffsetFromSource;
   if (i + d.height > window.innerHeight - t.tooltipOffsetFromViewport)
     return !1;
-  let o = e.left + e.width / 2 - d.width / 2;
-  return o < t.tooltipOffsetFromViewport ? o = t.tooltipOffsetFromViewport : o + d.width > window.innerWidth - t.tooltipOffsetFromViewport && (o = window.innerWidth - t.tooltipOffsetFromViewport - d.width), e.left > o + d.width - t.arrowMinOffsetFromTooltipCorner * 2 || e.right < o + t.arrowMinOffsetFromTooltipCorner * 2 ? !1 : (r.style.top = `${i}px`, r.style.left = `${o}px`, !0);
+  let p = e.left + e.width / 2 - d.width / 2;
+  return p < t.tooltipOffsetFromViewport ? p = t.tooltipOffsetFromViewport : p + d.width > window.innerWidth - t.tooltipOffsetFromViewport && (p = window.innerWidth - t.tooltipOffsetFromViewport - d.width), e.left > p + d.width - t.arrowMinOffsetFromTooltipCorner * 2 || e.right < p + t.arrowMinOffsetFromTooltipCorner * 2 ? !1 : (r.style.top = `${i}px`, r.style.left = `${p}px`, !0);
 }
-function at(e, t, r, s) {
+function Ht(e, t, r, s) {
   var O;
-  const d = document.createElement("div"), i = s.getBoundingClientRect(), o = Math.sin(45 * (180 / Math.PI)) * r.arrowSize, p = 1;
-  let h = 0, u = 0, m = "";
+  const d = document.createElement("div"), i = s.getBoundingClientRect(), p = Math.sin(45 * (180 / Math.PI)) * r.arrowSize, o = 1;
+  let h = 0, w = 0, m = "";
   switch (t) {
     case "left":
-      m = "!zt-border-y-transparent !zt-border-r-transparent", h = e.top - i.top + e.height / 2 - o - r.tooltipBorderWidth, u = i.width - r.tooltipBorderWidth - p;
+      m = "!zt-border-y-transparent !zt-border-r-transparent", h = e.top - i.top + e.height / 2 - p - r.tooltipBorderWidth, w = i.width - r.tooltipBorderWidth - o;
       break;
     case "top":
-      m = "!zt-border-x-transparent !zt-border-b-transparent", h = i.height - r.tooltipBorderWidth - p, u = e.left - i.left + e.width / 2 - o - r.tooltipBorderWidth;
+      m = "!zt-border-x-transparent !zt-border-b-transparent", h = i.height - r.tooltipBorderWidth - o, w = e.left - i.left + e.width / 2 - p - r.tooltipBorderWidth;
       break;
     case "right":
-      m = "!zt-border-y-transparent !zt-border-l-transparent", h = e.top - i.top + e.height / 2 - o - r.tooltipBorderWidth, u = -r.arrowSize * 2 - r.tooltipBorderWidth + p;
+      m = "!zt-border-y-transparent !zt-border-l-transparent", h = e.top - i.top + e.height / 2 - p - r.tooltipBorderWidth, w = -r.arrowSize * 2 - r.tooltipBorderWidth + o;
       break;
     case "bottom":
-      m = "!zt-border-x-transparent !zt-border-t-transparent", h = -r.arrowSize * 2 - r.tooltipBorderWidth + p, u = e.left - i.left + e.width / 2 - o - r.tooltipBorderWidth;
+      m = "!zt-border-x-transparent !zt-border-t-transparent", h = -r.arrowSize * 2 - r.tooltipBorderWidth + o, w = e.left - i.left + e.width / 2 - p - r.tooltipBorderWidth;
       break;
   }
-  t === "left" || t === "right" ? C(t, i, h, r) || (h = g(t, i, h, r)) : C(t, i, u, r) || (u = g(t, i, u, r));
-  const x = tt + " " + ct + " " + m + " " + r.arrowClasses;
-  d.classList.add(...x.trim().split(" ")), d.style.top = `${h}px`, d.style.left = `${u}px`, d.style.borderWidth = `${r.arrowSize}px`, (O = document.querySelector(`.${y}`)) == null || O.appendChild(d);
+  t === "left" || t === "right" ? tt(t, i, h, r) || (h = et(t, i, h, r)) : tt(t, i, w, r) || (w = et(t, i, w, r));
+  const x = rt + " " + xt + " " + m + " " + r.arrowClasses;
+  d.classList.add(...x.trim().split(" ")), d.style.top = `${h}px`, d.style.left = `${w}px`, d.style.borderWidth = `${r.arrowSize}px`, (O = document.querySelector(`.${S}`)) == null || O.appendChild(d);
 }
-function C(e, t, r, s) {
+function tt(e, t, r, s) {
   switch (e) {
     case "left":
     case "right":
@@ -242,7 +243,7 @@ function C(e, t, r, s) {
       return r > s.arrowMinOffsetFromTooltipCorner - s.tooltipBorderWidth && r < t.width + s.tooltipBorderWidth - s.arrowMinOffsetFromTooltipCorner - s.arrowSize * 2;
   }
 }
-function g(e, t, r, s) {
+function et(e, t, r, s) {
   switch (e) {
     case "left":
     case "right":
@@ -252,20 +253,20 @@ function g(e, t, r, s) {
       return r < s.arrowMinOffsetFromTooltipCorner - s.tooltipBorderWidth ? s.arrowMinOffsetFromTooltipCorner - s.tooltipBorderWidth : t.width - s.tooltipBorderWidth - s.arrowMinOffsetFromTooltipCorner - s.arrowSize * 2;
   }
 }
-function S(e) {
+function V(e) {
   var s, d;
-  const t = document.querySelector(`.${y}`), r = (s = n[e]) == null ? void 0 : s.tooltipElement;
-  r && t && t instanceof HTMLElement && t === r && (nt(), (d = t.querySelector(`.${tt}`)) == null || d.remove(), t.style.left = "0", t.style.top = "0", t.remove());
+  const t = document.querySelector(`.${S}`), r = (s = n[e]) == null ? void 0 : s.tooltipElement;
+  r && t && t instanceof HTMLElement && t === r && (Ot(), (d = t.querySelector(`.${rt}`)) == null || d.remove(), t.style.left = "0", t.style.top = "0", t.remove());
 }
-function B(e) {
+function L(e) {
   const t = e.tooltipElement.dataset.uuid;
-  t && (S(t), delete n[t]), e.mouseEnterEventController.abort(), e.mouseLeaveEventController.abort();
+  t && (V(t), delete n[t]), e.mouseEnterEventController.abort(), e.mouseLeaveEventController.abort();
 }
-const Ht = {
+const At = {
   install: (e, t = {}) => {
-    e.directive("tooltip", Ot(t));
+    e.directive("tooltip", Ft(t));
   }
 };
 export {
-  Ht as default
+  At as default
 };

package/dist/zero-tooltip.umd.cjs

@@ -1 +1 @@
-(function(O,T){typeof exports=="object"&&typeof module<"u"?module.exports=T(require("vue")):typeof define=="function"&&define.amd?define(["vue"],T):(O=typeof globalThis<"u"?globalThis:O||self,O.ZeroTooltip=T(O.Vue))})(this,function(O){"use strict";const T="";let W;const st=new Uint8Array(16);function dt(){if(!W&&(W=typeof crypto<"u"&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto),!W))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return W(st)}const h=[];for(let e=0;e<256;++e)h.push((e+256).toString(16).slice(1));function it(e,t=0){return h[e[t+0]]+h[e[t+1]]+h[e[t+2]]+h[e[t+3]]+"-"+h[e[t+4]]+h[e[t+5]]+"-"+h[e[t+6]]+h[e[t+7]]+"-"+h[e[t+8]]+h[e[t+9]]+"-"+h[e[t+10]]+h[e[t+11]]+h[e[t+12]]+h[e[t+13]]+h[e[t+14]]+h[e[t+15]]}const H={randomUUID:typeof crypto<"u"&&crypto.randomUUID&&crypto.randomUUID.bind(crypto)};function ot(e,t,r){if(H.randomUUID&&!t&&!e)return H.randomUUID();e=e||{};const s=e.random||(e.rng||dt)();if(s[6]=s[6]&15|64,s[8]=s[8]&63|128,t){r=r||0;for(let d=0;d<16;++d)t[r+d]=s[d];return t}return it(s)}function pt(){let e=[];const t=(d,i)=>{if(r(d),e.length>0)for(const o of e)o.addEventListener("scroll",i);window.addEventListener("scroll",()=>{i(),s(i)})},r=d=>{let i=d;for(;i!==null&&i.tagName!=="HTML";){if(i.scrollHeight!==i.clientHeight){const o=window.getComputedStyle(i);(o.overflow==="auto"||o.overflow==="scroll")&&e.push(i)}i=i.parentElement}},s=d=>{if(e.length>0){for(const i of e)i.removeEventListener("scroll",d);e=[]}window.removeEventListener("scroll",d)};return{handleHideOnScroll:t}}function ut(){let e=null,t=null;return{handleHideOnResize:(d,i)=>{e=new ResizeObserver(o=>{const p=o[0].target;if(t===null)t=d.getBoundingClientRect();else{const u=p.getBoundingClientRect();(u.left!==t.left||u.top!==t.top||u.width!==t.width||u.height!==t.height)&&i()}}),e.observe(d)},resetResizeReferences:()=>{e!==null&&e.disconnect(),e=null,t=null}}}const{handleHideOnScroll:ht}=pt(),{handleHideOnResize:wt,resetResizeReferences:nt}=ut(),v="zero-tooltip__container",$="zero-tooltip__text",A="zero-tooltip__arrow",c={left:["left","right","top","bottom"],top:["top","bottom","right","left"],right:["right","left","top","bottom"],bottom:["bottom","top","right","left"]},f="top",_=10,I=20,U=100,k=250,D=0,P="zt-fixed zt-opacity-0 zt-inline-block zt-w-fit zt-py-1.5 zt-px-2.5 zt-rounded-md zt-bg-[#495057] zt-shadow-[0_2px_12px_0_rgba(0,0,0,0.1)] zt-box-border",q="zt-text-sm zt-text-white zt-whitespace-pre-wrap zt-break-words",j=5,mt="zt-absolute zt-border-solid zt-border-[#495057]",R=6,Z=1,N=!0,m={},ct=e=>({created:(t,r,s)=>{const d=ot();s.el.$_tooltip={uuid:d},a(r.value,e,r.arg,t,d),typeof r.value!="string"&&O.isReactive(r.value)&&O.watch(r.value,i=>{m[d]&&L(m[d]),a(i,e,r.arg,t,d)})},updated:(t,r,s)=>{const d=s.el.$_tooltip.uuid;m[d]&&L(m[d]),a(r.value,e,r.arg,t,d)},beforeUnmount:(t,r,s)=>{const d=s.el.$_tooltip.uuid;m[d]&&L(m[d])}});function a(e,t,r,s,d){let i=Ot(e,t,r);const o=Ft(s,i,d);m[d]=o,s.matches(":hover")&&s.dispatchEvent(new Event("mouseenter"))}function Ot(e,t,r){var K,Q,X,Y,E,l,b,C,g,tt,et,rt;let s,d,i,o,p,u,w,n,F,x,y,M,S,V,B;return s=xt(e),typeof e!="string"&&(d=r??e.defaultPosition??(t==null?void 0:t.defaultPosition)??f,i={left:((K=e.positions)==null?void 0:K.left)??((Q=t==null?void 0:t.positions)==null?void 0:Q.left)??c.left,top:((X=e.positions)==null?void 0:X.top)??((Y=t==null?void 0:t.positions)==null?void 0:Y.top)??c.top,right:((E=e.positions)==null?void 0:E.right)??((l=t==null?void 0:t.positions)==null?void 0:l.right)??c.right,bottom:((b=e.positions)==null?void 0:b.bottom)??((C=t==null?void 0:t.positions)==null?void 0:C.bottom)??c.bottom},o=e.offsetFromSource??(t==null?void 0:t.offsetFromSource)??_,p=e.offsetFromViewport??(t==null?void 0:t.offsetFromViewport)??I,u=e.minWidth??(t==null?void 0:t.minWidth)??U,w=e.maxWidth??(t==null?void 0:t.maxWidth)??k,n=e.tooltipBorderWidth??(t==null?void 0:t.tooltipBorderWidth)??D,F=v+" "+P+" "+(e.tooltipClasses??(t==null?void 0:t.tooltipClasses)??""),x=$+" "+q+" "+(e.textClasses??(t==null?void 0:t.textClasses)??""),y=e.arrowSize??(t==null?void 0:t.arrowSize)??j,M=e.arrowClasses??(t==null?void 0:t.arrowClasses)??"",S=e.arrowMinOffsetFromTooltipCorner??(t==null?void 0:t.arrowMinOffsetFromTooltipCorner)??R,V=e.zIndex??(t==null?void 0:t.zIndex)??Z,B=e.show??N),d===void 0&&(d=r??(t==null?void 0:t.defaultPosition)??f),i===void 0&&(i={left:((g=t==null?void 0:t.positions)==null?void 0:g.left)??c.left,top:((tt=t==null?void 0:t.positions)==null?void 0:tt.top)??c.top,right:((et=t==null?void 0:t.positions)==null?void 0:et.right)??c.right,bottom:((rt=t==null?void 0:t.positions)==null?void 0:rt.bottom)??c.bottom}),o===void 0&&(o=(t==null?void 0:t.offsetFromSource)??_),p===void 0&&(p=(t==null?void 0:t.offsetFromViewport)??I),u===void 0&&(u=(t==null?void 0:t.minWidth)??U),w===void 0&&(w=(t==null?void 0:t.maxWidth)??k),n===void 0&&(n=(t==null?void 0:t.tooltipBorderWidth)??D),F===void 0&&(F=v+" "+P+" "+((t==null?void 0:t.tooltipClasses)??"")),x===void 0&&(x=$+" "+q+" "+((t==null?void 0:t.textClasses)??"")),y===void 0&&(y=(t==null?void 0:t.arrowSize)??j),M===void 0&&(M=(t==null?void 0:t.arrowClasses)??""),S===void 0&&(S=(t==null?void 0:t.arrowMinOffsetFromTooltipCorner)??R),V===void 0&&(V=(t==null?void 0:t.zIndex)??Z),B===void 0&&(B=N),{tooltipText:s,tooltipPosition:d,tooltipPositions:i,tooltipOffsetFromSource:o,tooltipOffsetFromViewport:p,tooltipMinWidth:u,tooltipMaxWidth:w,tooltipBorderWidth:n,tooltipClasses:F,textClasses:x,arrowSize:y,arrowClasses:M,arrowMinOffsetFromTooltipCorner:S,zIndex:V,shouldShow:B}}function xt(e){const t=typeof e=="string"?e:e.content;if(!t)throw new Error("Please enter valid tooltip value");return t}function Ft(e,t,r){let s=e,d=Tt(t.textClasses,t.tooltipText),i=Wt(t.tooltipClasses,t.tooltipBorderWidth);i.append(d),i.dataset.uuid=r;const o=new AbortController,p=new AbortController;return s.addEventListener("mouseenter",()=>vt(s,t,i,r),{signal:o.signal}),s.addEventListener("mouseleave",()=>zt(r),{signal:p.signal}),{anchorElement:s,tooltipConfig:t,tooltipElement:i,mouseEnterEventController:o,mouseLeaveEventController:p}}function Tt(e,t){let r=document.createElement("p");return r.classList.add(...e.trim().split(" ")),r.innerHTML=t,r}function Wt(e,t){let r=document.createElement("div");return r.classList.add(...e.trim().split(" ")),r.style.borderWidth=`${t}px`,r}function vt(e,t,r,s){if(!t.shouldShow)return;const d=e.getBoundingClientRect(),i=document.querySelector("body");i==null||i.appendChild(r);let o=!1,p=t.tooltipPosition;for(let u=0;u<4&&(p=t.tooltipPositions[t.tooltipPosition][u],p==="left"?o=yt(d,t,r):p==="top"?o=St(d,t,r):p==="right"?o=Mt(d,t,r):p==="bottom"&&(o=Vt(d,t,r)),!o);u++);o&&(Bt(d,p,t,r),r.style.opacity="1",r.style.zIndex=t.zIndex.toString(),ht(e,()=>z(s)),wt(e,()=>z(s)))}function zt(e){z(e)}function yt(e,t,r){const s=Math.min(e.left-t.tooltipOffsetFromSource-t.tooltipOffsetFromViewport,t.tooltipMaxWidth),d=e.top>=t.tooltipOffsetFromViewport,i=window.innerHeight-e.bottom>=t.tooltipOffsetFromViewport;if(s<t.tooltipMinWidth||!d||!i)return!1;r.style.maxWidth=`${s}px`;const o=r.getBoundingClientRect();let p=e.top+e.height/2-o.height/2;p<t.tooltipOffsetFromViewport?p=t.tooltipOffsetFromViewport:p+o.height>window.innerHeight-t.tooltipOffsetFromViewport&&(p=window.innerHeight-t.tooltipOffsetFromViewport-o.height);const u=e.left-t.tooltipOffsetFromSource-o.width;return e.bottom<p+t.arrowMinOffsetFromTooltipCorner*2||e.top>p+o.height-t.arrowMinOffsetFromTooltipCorner*2?!1:(r.style.top=`${p}px`,r.style.left=`${u}px`,!0)}function Mt(e,t,r){const s=Math.min(window.innerWidth-(e.right+t.tooltipOffsetFromSource)-t.tooltipOffsetFromViewport,t.tooltipMaxWidth),d=e.top>=t.tooltipOffsetFromViewport,i=window.innerHeight-e.bottom>=t.tooltipOffsetFromViewport;if(s<t.tooltipMinWidth||!d||!i)return!1;r.style.maxWidth=`${s}px`;const o=r.getBoundingClientRect();let p=e.top+e.height/2-o.height/2;p<t.tooltipOffsetFromViewport?p=t.tooltipOffsetFromViewport:p+o.height>window.innerHeight-t.tooltipOffsetFromViewport&&(p=window.innerHeight-t.tooltipOffsetFromViewport-o.height);const u=e.right+t.tooltipOffsetFromSource;return e.bottom<p+t.arrowMinOffsetFromTooltipCorner*2||e.top>p+o.height-t.arrowMinOffsetFromTooltipCorner*2?!1:(r.style.top=`${p}px`,r.style.left=`${u}px`,!0)}function St(e,t,r){const s=Math.min(window.innerWidth-t.tooltipOffsetFromViewport*2,t.tooltipMaxWidth);r.style.maxWidth=`${s}px`;const d=r.getBoundingClientRect();let i=e.top-t.tooltipOffsetFromSource-d.height;if(i<t.tooltipOffsetFromViewport)return!1;let o=e.left+e.width/2-d.width/2;return o<t.tooltipOffsetFromViewport?o=t.tooltipOffsetFromViewport:o+d.width>window.innerWidth-t.tooltipOffsetFromViewport&&(o=window.innerWidth-t.tooltipOffsetFromViewport-d.width),e.left>o+d.width-t.arrowMinOffsetFromTooltipCorner*2||e.right<o+t.arrowMinOffsetFromTooltipCorner*2?!1:(r.style.top=`${i}px`,r.style.left=`${o}px`,!0)}function Vt(e,t,r){const s=Math.min(window.innerWidth-t.tooltipOffsetFromViewport*2,t.tooltipMaxWidth);r.style.maxWidth=`${s}px`;const d=r.getBoundingClientRect();let i=e.bottom+t.tooltipOffsetFromSource;if(i+d.height>window.innerHeight-t.tooltipOffsetFromViewport)return!1;let o=e.left+e.width/2-d.width/2;return o<t.tooltipOffsetFromViewport?o=t.tooltipOffsetFromViewport:o+d.width>window.innerWidth-t.tooltipOffsetFromViewport&&(o=window.innerWidth-t.tooltipOffsetFromViewport-d.width),e.left>o+d.width-t.arrowMinOffsetFromTooltipCorner*2||e.right<o+t.arrowMinOffsetFromTooltipCorner*2?!1:(r.style.top=`${i}px`,r.style.left=`${o}px`,!0)}function Bt(e,t,r,s){var x;const d=document.createElement("div"),i=s.getBoundingClientRect(),o=Math.sin(45*(180/Math.PI))*r.arrowSize,p=1;let u=0,w=0,n="";switch(t){case"left":n="!zt-border-y-transparent !zt-border-r-transparent",u=e.top-i.top+e.height/2-o-r.tooltipBorderWidth,w=i.width-r.tooltipBorderWidth-p;break;case"top":n="!zt-border-x-transparent !zt-border-b-transparent",u=i.height-r.tooltipBorderWidth-p,w=e.left-i.left+e.width/2-o-r.tooltipBorderWidth;break;case"right":n="!zt-border-y-transparent !zt-border-l-transparent",u=e.top-i.top+e.height/2-o-r.tooltipBorderWidth,w=-r.arrowSize*2-r.tooltipBorderWidth+p;break;case"bottom":n="!zt-border-x-transparent !zt-border-t-transparent",u=-r.arrowSize*2-r.tooltipBorderWidth+p,w=e.left-i.left+e.width/2-o-r.tooltipBorderWidth;break}t==="left"||t==="right"?G(t,i,u,r)||(u=J(t,i,u,r)):G(t,i,w,r)||(w=J(t,i,w,r));const F=A+" "+mt+" "+n+" "+r.arrowClasses;d.classList.add(...F.trim().split(" ")),d.style.top=`${u}px`,d.style.left=`${w}px`,d.style.borderWidth=`${r.arrowSize}px`,(x=document.querySelector(`.${v}`))==null||x.appendChild(d)}function G(e,t,r,s){switch(e){case"left":case"right":return r>s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth&&r<t.height+s.tooltipBorderWidth-s.arrowMinOffsetFromTooltipCorner-s.arrowSize*2;case"top":case"bottom":return r>s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth&&r<t.width+s.tooltipBorderWidth-s.arrowMinOffsetFromTooltipCorner-s.arrowSize*2}}function J(e,t,r,s){switch(e){case"left":case"right":return r<s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth?s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth:t.height-s.tooltipBorderWidth-s.arrowMinOffsetFromTooltipCorner-s.arrowSize*2;case"top":case"bottom":return r<s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth?s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth:t.width-s.tooltipBorderWidth-s.arrowMinOffsetFromTooltipCorner-s.arrowSize*2}}function z(e){var s,d;const t=document.querySelector(`.${v}`),r=(s=m[e])==null?void 0:s.tooltipElement;r&&t&&t instanceof HTMLElement&&t===r&&(nt(),(d=t.querySelector(`.${A}`))==null||d.remove(),t.style.left="0",t.style.top="0",t.remove())}function L(e){const t=e.tooltipElement.dataset.uuid;t&&(z(t),delete m[t]),e.mouseEnterEventController.abort(),e.mouseLeaveEventController.abort()}return{install:(e,t={})=>{e.directive("tooltip",ct(t))}}});
+(function(O,F){typeof exports=="object"&&typeof module<"u"?module.exports=F(require("vue")):typeof define=="function"&&define.amd?define(["vue"],F):(O=typeof globalThis<"u"?globalThis:O||self,O.ZeroTooltip=F(O.Vue))})(this,function(O){"use strict";const F="";let v;const it=new Uint8Array(16);function pt(){if(!v&&(v=typeof crypto<"u"&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto),!v))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return v(it)}const h=[];for(let e=0;e<256;++e)h.push((e+256).toString(16).slice(1));function ot(e,t=0){return h[e[t+0]]+h[e[t+1]]+h[e[t+2]]+h[e[t+3]]+"-"+h[e[t+4]]+h[e[t+5]]+"-"+h[e[t+6]]+h[e[t+7]]+"-"+h[e[t+8]]+h[e[t+9]]+"-"+h[e[t+10]]+h[e[t+11]]+h[e[t+12]]+h[e[t+13]]+h[e[t+14]]+h[e[t+15]]}const $={randomUUID:typeof crypto<"u"&&crypto.randomUUID&&crypto.randomUUID.bind(crypto)};function ut(e,t,r){if($.randomUUID&&!t&&!e)return $.randomUUID();e=e||{};const s=e.random||(e.rng||pt)();if(s[6]=s[6]&15|64,s[8]=s[8]&63|128,t){r=r||0;for(let d=0;d<16;++d)t[r+d]=s[d];return t}return ot(s)}function ht(){let e=[];const t=(d,i)=>{if(r(d),e.length>0)for(const p of e)p.addEventListener("scroll",i);window.addEventListener("scroll",()=>{i(),s(i)})},r=d=>{let i=d;for(;i!==null&&i.tagName!=="HTML";){if(i.scrollHeight!==i.clientHeight){const p=window.getComputedStyle(i);(p.overflow==="auto"||p.overflow==="scroll")&&e.push(i)}i=i.parentElement}},s=d=>{if(e.length>0){for(const i of e)i.removeEventListener("scroll",d);e=[]}window.removeEventListener("scroll",d)};return{handleHideOnScroll:t}}function wt(){let e=null,t=null;return{handleHideOnResize:(d,i)=>{e=new ResizeObserver(p=>{const o=p[0].target;if(t===null)t=d.getBoundingClientRect();else{const u=o.getBoundingClientRect();(u.left!==t.left||u.top!==t.top||u.width!==t.width||u.height!==t.height)&&i()}}),e.observe(d)},resetResizeReferences:()=>{e!==null&&e.disconnect(),e=null,t=null}}}const{handleHideOnScroll:nt}=ht(),{handleHideOnResize:mt,resetResizeReferences:ct}=wt(),W="zero-tooltip__container",A="zero-tooltip__text",_="zero-tooltip__arrow",c={left:["left","right","top","bottom"],top:["top","bottom","right","left"],right:["right","left","top","bottom"],bottom:["bottom","top","right","left"]},I="body",U="top",f=10,k=20,D=100,P=250,q=0,j="zt-fixed zt-opacity-0 zt-inline-block zt-w-fit zt-py-1.5 zt-px-2.5 zt-rounded-md zt-bg-[#495057] zt-shadow-[0_2px_12px_0_rgba(0,0,0,0.1)] zt-box-border",R="zt-text-sm zt-text-white zt-whitespace-pre-wrap zt-break-words",Z=5,Ot="zt-absolute zt-border-solid zt-border-[#495057]",N=6,G=1,J=!0,m={},xt=e=>({created:(t,r,s)=>{const d=ut();s.el.$_tooltip={uuid:d},H(r.value,e,r.arg,t,d),typeof r.value!="string"&&O.isReactive(r.value)&&O.watch(r.value,i=>{m[d]&&a(m[d]),H(i,e,r.arg,t,d)})},updated:(t,r,s)=>{const d=s.el.$_tooltip.uuid;m[d]&&a(m[d]),H(r.value,e,r.arg,t,d)},beforeUnmount:(t,r,s)=>{const d=s.el.$_tooltip.uuid;m[d]&&a(m[d])}});function H(e,t,r,s,d){let i=Tt(e,t,r);const p=vt(s,i,d);m[d]=p,s.matches(":hover")&&s.dispatchEvent(new Event("mouseenter"))}function Tt(e,t,r){var X,Y,E,l,b,C,g,tt,et,rt,st,dt;let s,d,i,p,o,u,w,n,T,x,y,M,S,V,B,L;return d=Ft(e),typeof e!="string"&&(s=e.appendTo??(t==null?void 0:t.appendTo)??I,i=r??e.defaultPosition??(t==null?void 0:t.defaultPosition)??U,p={left:((X=e.positions)==null?void 0:X.left)??((Y=t==null?void 0:t.positions)==null?void 0:Y.left)??c.left,top:((E=e.positions)==null?void 0:E.top)??((l=t==null?void 0:t.positions)==null?void 0:l.top)??c.top,right:((b=e.positions)==null?void 0:b.right)??((C=t==null?void 0:t.positions)==null?void 0:C.right)??c.right,bottom:((g=e.positions)==null?void 0:g.bottom)??((tt=t==null?void 0:t.positions)==null?void 0:tt.bottom)??c.bottom},o=e.offsetFromSource??(t==null?void 0:t.offsetFromSource)??f,u=e.offsetFromViewport??(t==null?void 0:t.offsetFromViewport)??k,w=e.minWidth??(t==null?void 0:t.minWidth)??D,n=e.maxWidth??(t==null?void 0:t.maxWidth)??P,T=e.tooltipBorderWidth??(t==null?void 0:t.tooltipBorderWidth)??q,x=W+" "+j+" "+(e.tooltipClasses??(t==null?void 0:t.tooltipClasses)??""),y=A+" "+R+" "+(e.textClasses??(t==null?void 0:t.textClasses)??""),M=e.arrowSize??(t==null?void 0:t.arrowSize)??Z,S=e.arrowClasses??(t==null?void 0:t.arrowClasses)??"",V=e.arrowMinOffsetFromTooltipCorner??(t==null?void 0:t.arrowMinOffsetFromTooltipCorner)??N,B=e.zIndex??(t==null?void 0:t.zIndex)??G,L=e.show??J),s===void 0&&(s=(t==null?void 0:t.appendTo)??I),i===void 0&&(i=r??(t==null?void 0:t.defaultPosition)??U),p===void 0&&(p={left:((et=t==null?void 0:t.positions)==null?void 0:et.left)??c.left,top:((rt=t==null?void 0:t.positions)==null?void 0:rt.top)??c.top,right:((st=t==null?void 0:t.positions)==null?void 0:st.right)??c.right,bottom:((dt=t==null?void 0:t.positions)==null?void 0:dt.bottom)??c.bottom}),o===void 0&&(o=(t==null?void 0:t.offsetFromSource)??f),u===void 0&&(u=(t==null?void 0:t.offsetFromViewport)??k),w===void 0&&(w=(t==null?void 0:t.minWidth)??D),n===void 0&&(n=(t==null?void 0:t.maxWidth)??P),T===void 0&&(T=(t==null?void 0:t.tooltipBorderWidth)??q),x===void 0&&(x=W+" "+j+" "+((t==null?void 0:t.tooltipClasses)??"")),y===void 0&&(y=A+" "+R+" "+((t==null?void 0:t.textClasses)??"")),M===void 0&&(M=(t==null?void 0:t.arrowSize)??Z),S===void 0&&(S=(t==null?void 0:t.arrowClasses)??""),V===void 0&&(V=(t==null?void 0:t.arrowMinOffsetFromTooltipCorner)??N),B===void 0&&(B=(t==null?void 0:t.zIndex)??G),L===void 0&&(L=J),{appendTo:s,tooltipText:d,tooltipPosition:i,tooltipPositions:p,tooltipOffsetFromSource:o,tooltipOffsetFromViewport:u,tooltipMinWidth:w,tooltipMaxWidth:n,tooltipBorderWidth:T,tooltipClasses:x,textClasses:y,arrowSize:M,arrowClasses:S,arrowMinOffsetFromTooltipCorner:V,zIndex:B,shouldShow:L}}function Ft(e){const t=typeof e=="string"?e:e.content;if(!t)throw new Error("Please enter valid tooltip value");return t}function vt(e,t,r){let s=e,d=Wt(t.textClasses,t.tooltipText),i=zt(t.tooltipClasses,t.tooltipBorderWidth);i.append(d),i.dataset.uuid=r;const p=new AbortController,o=new AbortController;return s.addEventListener("mouseenter",()=>yt(s,t,i,r),{signal:p.signal}),s.addEventListener("mouseleave",()=>Mt(r),{signal:o.signal}),{anchorElement:s,tooltipConfig:t,tooltipElement:i,mouseEnterEventController:p,mouseLeaveEventController:o}}function Wt(e,t){let r=document.createElement("p");return r.classList.add(...e.trim().split(" ")),r.innerHTML=t,r}function zt(e,t){let r=document.createElement("div");return r.classList.add(...e.trim().split(" ")),r.style.borderWidth=`${t}px`,r}function yt(e,t,r,s){if(!t.shouldShow)return;const d=e.getBoundingClientRect(),i=document.querySelector(t.appendTo);i==null||i.appendChild(r);let p=!1,o=t.tooltipPosition;for(let u=0;u<4&&(o=t.tooltipPositions[t.tooltipPosition][u],o==="left"?p=St(d,t,r):o==="top"?p=Bt(d,t,r):o==="right"?p=Vt(d,t,r):o==="bottom"&&(p=Lt(d,t,r)),!p);u++);p&&(Ht(d,o,t,r),r.style.opacity="1",r.style.zIndex=t.zIndex.toString(),nt(e,()=>z(s)),mt(e,()=>z(s)))}function Mt(e){z(e)}function St(e,t,r){const s=Math.min(e.left-t.tooltipOffsetFromSource-t.tooltipOffsetFromViewport,t.tooltipMaxWidth),d=e.top>=t.tooltipOffsetFromViewport,i=window.innerHeight-e.bottom>=t.tooltipOffsetFromViewport;if(s<t.tooltipMinWidth||!d||!i)return!1;r.style.maxWidth=`${s}px`;const p=r.getBoundingClientRect();let o=e.top+e.height/2-p.height/2;o<t.tooltipOffsetFromViewport?o=t.tooltipOffsetFromViewport:o+p.height>window.innerHeight-t.tooltipOffsetFromViewport&&(o=window.innerHeight-t.tooltipOffsetFromViewport-p.height);const u=e.left-t.tooltipOffsetFromSource-p.width;return e.bottom<o+t.arrowMinOffsetFromTooltipCorner*2||e.top>o+p.height-t.arrowMinOffsetFromTooltipCorner*2?!1:(r.style.top=`${o}px`,r.style.left=`${u}px`,!0)}function Vt(e,t,r){const s=Math.min(window.innerWidth-(e.right+t.tooltipOffsetFromSource)-t.tooltipOffsetFromViewport,t.tooltipMaxWidth),d=e.top>=t.tooltipOffsetFromViewport,i=window.innerHeight-e.bottom>=t.tooltipOffsetFromViewport;if(s<t.tooltipMinWidth||!d||!i)return!1;r.style.maxWidth=`${s}px`;const p=r.getBoundingClientRect();let o=e.top+e.height/2-p.height/2;o<t.tooltipOffsetFromViewport?o=t.tooltipOffsetFromViewport:o+p.height>window.innerHeight-t.tooltipOffsetFromViewport&&(o=window.innerHeight-t.tooltipOffsetFromViewport-p.height);const u=e.right+t.tooltipOffsetFromSource;return e.bottom<o+t.arrowMinOffsetFromTooltipCorner*2||e.top>o+p.height-t.arrowMinOffsetFromTooltipCorner*2?!1:(r.style.top=`${o}px`,r.style.left=`${u}px`,!0)}function Bt(e,t,r){const s=Math.min(window.innerWidth-t.tooltipOffsetFromViewport*2,t.tooltipMaxWidth);r.style.maxWidth=`${s}px`;const d=r.getBoundingClientRect();let i=e.top-t.tooltipOffsetFromSource-d.height;if(i<t.tooltipOffsetFromViewport)return!1;let p=e.left+e.width/2-d.width/2;return p<t.tooltipOffsetFromViewport?p=t.tooltipOffsetFromViewport:p+d.width>window.innerWidth-t.tooltipOffsetFromViewport&&(p=window.innerWidth-t.tooltipOffsetFromViewport-d.width),e.left>p+d.width-t.arrowMinOffsetFromTooltipCorner*2||e.right<p+t.arrowMinOffsetFromTooltipCorner*2?!1:(r.style.top=`${i}px`,r.style.left=`${p}px`,!0)}function Lt(e,t,r){const s=Math.min(window.innerWidth-t.tooltipOffsetFromViewport*2,t.tooltipMaxWidth);r.style.maxWidth=`${s}px`;const d=r.getBoundingClientRect();let i=e.bottom+t.tooltipOffsetFromSource;if(i+d.height>window.innerHeight-t.tooltipOffsetFromViewport)return!1;let p=e.left+e.width/2-d.width/2;return p<t.tooltipOffsetFromViewport?p=t.tooltipOffsetFromViewport:p+d.width>window.innerWidth-t.tooltipOffsetFromViewport&&(p=window.innerWidth-t.tooltipOffsetFromViewport-d.width),e.left>p+d.width-t.arrowMinOffsetFromTooltipCorner*2||e.right<p+t.arrowMinOffsetFromTooltipCorner*2?!1:(r.style.top=`${i}px`,r.style.left=`${p}px`,!0)}function Ht(e,t,r,s){var x;const d=document.createElement("div"),i=s.getBoundingClientRect(),p=Math.sin(45*(180/Math.PI))*r.arrowSize,o=1;let u=0,w=0,n="";switch(t){case"left":n="!zt-border-y-transparent !zt-border-r-transparent",u=e.top-i.top+e.height/2-p-r.tooltipBorderWidth,w=i.width-r.tooltipBorderWidth-o;break;case"top":n="!zt-border-x-transparent !zt-border-b-transparent",u=i.height-r.tooltipBorderWidth-o,w=e.left-i.left+e.width/2-p-r.tooltipBorderWidth;break;case"right":n="!zt-border-y-transparent !zt-border-l-transparent",u=e.top-i.top+e.height/2-p-r.tooltipBorderWidth,w=-r.arrowSize*2-r.tooltipBorderWidth+o;break;case"bottom":n="!zt-border-x-transparent !zt-border-t-transparent",u=-r.arrowSize*2-r.tooltipBorderWidth+o,w=e.left-i.left+e.width/2-p-r.tooltipBorderWidth;break}t==="left"||t==="right"?K(t,i,u,r)||(u=Q(t,i,u,r)):K(t,i,w,r)||(w=Q(t,i,w,r));const T=_+" "+Ot+" "+n+" "+r.arrowClasses;d.classList.add(...T.trim().split(" ")),d.style.top=`${u}px`,d.style.left=`${w}px`,d.style.borderWidth=`${r.arrowSize}px`,(x=document.querySelector(`.${W}`))==null||x.appendChild(d)}function K(e,t,r,s){switch(e){case"left":case"right":return r>s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth&&r<t.height+s.tooltipBorderWidth-s.arrowMinOffsetFromTooltipCorner-s.arrowSize*2;case"top":case"bottom":return r>s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth&&r<t.width+s.tooltipBorderWidth-s.arrowMinOffsetFromTooltipCorner-s.arrowSize*2}}function Q(e,t,r,s){switch(e){case"left":case"right":return r<s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth?s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth:t.height-s.tooltipBorderWidth-s.arrowMinOffsetFromTooltipCorner-s.arrowSize*2;case"top":case"bottom":return r<s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth?s.arrowMinOffsetFromTooltipCorner-s.tooltipBorderWidth:t.width-s.tooltipBorderWidth-s.arrowMinOffsetFromTooltipCorner-s.arrowSize*2}}function z(e){var s,d;const t=document.querySelector(`.${W}`),r=(s=m[e])==null?void 0:s.tooltipElement;r&&t&&t instanceof HTMLElement&&t===r&&(ct(),(d=t.querySelector(`.${_}`))==null||d.remove(),t.style.left="0",t.style.top="0",t.remove())}function a(e){const t=e.tooltipElement.dataset.uuid;t&&(z(t),delete m[t]),e.mouseEnterEventController.abort(),e.mouseLeaveEventController.abort()}return{install:(e,t={})=>{e.directive("tooltip",xt(t))}}});

package/package.json

@@ -18,7 +18,7 @@
     "dist",
     "src"
   ],
-  "version": "1.0.9",
+  "version": "1.1.0",
   "type": "module",
   "scripts": {
     "dev": "vite",

package/src/style.css

@@ -1 +1 @@
-/*! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.zt-fixed{position:fixed}.zt-absolute{position:absolute}.zt-box-border{box-sizing:border-box}.zt-inline-block{display:inline-block}.zt-h-\[2000px\]{height:2000px}.zt-w-fit{width:-moz-fit-content;width:fit-content}.zt-w-full{width:100%}.zt-whitespace-pre-wrap{white-space:pre-wrap}.zt-break-words{overflow-wrap:break-word}.zt-rounded-md{border-radius:.375rem}.zt-border-solid{border-style:solid}.zt-border-\[\#495057\]{--tw-border-opacity:1;border-color:rgb(73 80 87/var(--tw-border-opacity))}.\!zt-border-x-transparent{border-left-color:#0000!important;border-right-color:#0000!important}.\!zt-border-y-transparent{border-top-color:#0000!important}.\!zt-border-b-transparent,.\!zt-border-y-transparent{border-bottom-color:#0000!important}.\!zt-border-l-transparent{border-left-color:#0000!important}.\!zt-border-r-transparent{border-right-color:#0000!important}.\!zt-border-t-transparent{border-top-color:#0000!important}.zt-bg-\[\#495057\]{--tw-bg-opacity:1;background-color:rgb(73 80 87/var(--tw-bg-opacity))}.zt-bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.zt-px-2{padding-left:.5rem;padding-right:.5rem}.zt-px-2\.5{padding-left:.625rem;padding-right:.625rem}.zt-py-1{padding-top:.25rem;padding-bottom:.25rem}.zt-py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.zt-text-sm{font-size:.875rem;line-height:1.25rem}.zt-text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.zt-opacity-0{opacity:0}.zt-shadow-\[0_2px_12px_0_rgba\(0\,0\,0\,0\.1\)\]{--tw-shadow:0 2px 12px 0 #0000001a;--tw-shadow-colored:0 2px 12px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}
+/*! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.zt-fixed{position:fixed}.zt-absolute{position:absolute}.zt-right-0{right:0}.zt-top-0{top:0}.zt-z-\[2\]{z-index:2}.zt-box-border{box-sizing:border-box}.zt-inline-block{display:inline-block}.zt-h-\[2000px\]{height:2000px}.zt-h-\[500px\]{height:500px}.zt-w-\[400px\]{width:400px}.zt-w-fit{width:-moz-fit-content;width:fit-content}.zt-w-full{width:100%}.zt-whitespace-pre-wrap{white-space:pre-wrap}.zt-break-words{overflow-wrap:break-word}.zt-rounded-md{border-radius:.375rem}.zt-border-solid{border-style:solid}.zt-border-\[\#495057\]{--tw-border-opacity:1;border-color:rgb(73 80 87/var(--tw-border-opacity))}.\!zt-border-x-transparent{border-left-color:#0000!important;border-right-color:#0000!important}.\!zt-border-y-transparent{border-top-color:#0000!important}.\!zt-border-b-transparent,.\!zt-border-y-transparent{border-bottom-color:#0000!important}.\!zt-border-l-transparent{border-left-color:#0000!important}.\!zt-border-r-transparent{border-right-color:#0000!important}.\!zt-border-t-transparent{border-top-color:#0000!important}.zt-bg-\[\#495057\]{--tw-bg-opacity:1;background-color:rgb(73 80 87/var(--tw-bg-opacity))}.zt-bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.zt-bg-red-400{--tw-bg-opacity:1;background-color:rgb(248 113 113/var(--tw-bg-opacity))}.zt-px-2{padding-left:.5rem;padding-right:.5rem}.zt-px-2\.5{padding-left:.625rem;padding-right:.625rem}.zt-py-1{padding-top:.25rem;padding-bottom:.25rem}.zt-py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.zt-text-sm{font-size:.875rem;line-height:1.25rem}.zt-text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.zt-opacity-0{opacity:0}.zt-shadow-\[0_2px_12px_0_rgba\(0\,0\,0\,0\.1\)\]{--tw-shadow:0 2px 12px 0 #0000001a;--tw-shadow-colored:0 2px 12px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}

package/src/tooltip.ts

@@ -23,6 +23,7 @@ const defaultTooltipPositions: TooltipPositions = {
     bottom: ['bottom', 'top', 'right', 'left'],
 }
 
+const defaultAppendTo: string = 'body'
 const defaultTooltipPosition: TooltipPosition = 'top'
 const defaultTooltipOffsetFromSource = 10
 const defaultTooltipOffsetFromViewport = 20
@@ -91,6 +92,7 @@ function buildTooltip(bindingValue: any, globalConfig: TooltipConfig | undefined
 
 function getTooltipConfig(localConfig: string | TooltipLocalConfig, globalConfig?: TooltipConfig, position?: TooltipPosition) {
     // Tooltip config
+    let appendTo: string | undefined
     let tooltipText: string | undefined
     let tooltipPosition: TooltipPosition | undefined
     let tooltipPositions: TooltipPositions | undefined
@@ -109,7 +111,9 @@ function getTooltipConfig(localConfig: string | TooltipLocalConfig, globalConfig
 
     tooltipText = getTooltipText(localConfig)
 
+    // Check if local config is defined
     if (typeof(localConfig) !== 'string') {
+        appendTo = localConfig.appendTo ?? globalConfig?.appendTo ?? defaultAppendTo;
         tooltipPosition = position ?? localConfig.defaultPosition ?? globalConfig?.defaultPosition ?? defaultTooltipPosition;
         tooltipPositions =  {
             left: localConfig.positions?.left ?? globalConfig?.positions?.left ?? defaultTooltipPositions.left,
@@ -131,6 +135,8 @@ function getTooltipConfig(localConfig: string | TooltipLocalConfig, globalConfig
         shouldShow = localConfig.show ?? defaultShouldShow
     }
 
+    // If values were not not defined by localConfig, assign either globalConfig or default value
+    if (appendTo === undefined) appendTo = globalConfig?.appendTo ?? defaultAppendTo;
     if (tooltipPosition === undefined) tooltipPosition = position ?? globalConfig?.defaultPosition ?? defaultTooltipPosition;
     if (tooltipPositions === undefined) tooltipPositions =  {
         left: globalConfig?.positions?.left ?? defaultTooltipPositions.left,
@@ -152,6 +158,7 @@ function getTooltipConfig(localConfig: string | TooltipLocalConfig, globalConfig
     if (shouldShow === undefined) shouldShow = defaultShouldShow
 
     return {
+        appendTo,
         tooltipText,
         tooltipPosition,
         tooltipPositions,
@@ -229,9 +236,9 @@ function onMouseEnter(
 
     const anchorElementRect = anchorElement.getBoundingClientRect()
 
-    // Mount Tooltip element to body
-    const body = document.querySelector('body')
-    body?.appendChild(tooltipElement)
+    // Mount Tooltip element to target element (default is `body`)
+    const appendToTarget = document.querySelector(tooltipConfig.appendTo)
+    appendToTarget?.appendChild(tooltipElement)
 
     // Find suitable Tooltip position
     let hasNeededDisplaySpace = false

package/src/types/tooltipConfig.ts

@@ -2,6 +2,7 @@ import TooltipPosition from "./tooltipPosition"
 import TooltipPositions from "./tooltipPositions"
 
 type TooltipConfig = {
+    appendTo?: string,
     defaultPosition?: TooltipPosition,
     positions?: Partial<TooltipPositions>,
     offsetFromSource?: number,
@@ -17,4 +18,4 @@ type TooltipConfig = {
     zIndex?: number
 }
 
-export default TooltipConfig
+export default TooltipConfig