@cuemath/leap 3.2.33 → 3.2.34-m

package/dist/features/stickers/sticker-selector/sticker.js

@@ -0,0 +1,60 @@
+import { jsxs as v, jsx as a } from "react/jsx-runtime";
+import { memo as $, useState as f, useRef as R, useCallback as n } from "react";
+import E from "../../ui/lottie-animation/lottie-animation.js";
+import { StickerContainer as k, StaticEmoji as y, LottieContainer as j } from "./sticker-selector-styles.js";
+const w = {
+  loop: !0,
+  autoplay: !1,
+  renderer: "canvas"
+}, x = ({
+  emoji: h,
+  lottieUrl: c,
+  size: i = 48,
+  onClick: s,
+  disabled: o = !1
+}) => {
+  const [d, u] = f(!1), [t, l] = f("idle"), r = R(null), m = n(() => {
+    var e;
+    l("loaded"), (e = r.current) == null || e.play();
+  }, []), S = n(() => {
+    l("error");
+  }, []), p = n(() => {
+    var e;
+    o || (u(!0), t === "idle" ? l("loading") : t === "loaded" && ((e = r.current) == null || e.play()));
+  }, [o, t]), L = n(() => {
+    var e;
+    o || (u(!1), t === "loaded" && ((e = r.current) == null || e.goToAndStop(0, !0)));
+  }, [o, t]), g = n(() => {
+    var e;
+    !o && s && ((e = r.current) == null || e.goToAndStop(0, !0), s());
+  }, [o, s]);
+  return /* @__PURE__ */ v(
+    k,
+    {
+      $size: i,
+      $disabled: o,
+      onPointerEnter: p,
+      onPointerLeave: L,
+      onClick: g,
+      children: [
+        /* @__PURE__ */ a(y, { $size: i, $visible: !d || t === "error", children: h }),
+        /* @__PURE__ */ a(j, { $size: i, $visible: d && t !== "idle", children: (t === "loading" || t === "loaded") && c && /* @__PURE__ */ a(
+          E,
+          {
+            ref: r,
+            src: c,
+            width: "100%",
+            height: "100%",
+            settings: w,
+            onRender: m,
+            onError: S
+          }
+        ) })
+      ]
+    }
+  );
+}, z = $(x);
+export {
+  z as default
+};
+//# sourceMappingURL=sticker.js.map

package/dist/features/stickers/sticker-selector/sticker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sticker.js","sources":["../../../../src/features/stickers/sticker-selector/sticker.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../ui/lottie-animation/types';\nimport type { IStickerProps } from './sticker-selector-types';\n\nimport React, { memo, useCallback, useRef, useState } from 'react';\n\nimport LottieAnimation from '../../ui/lottie-animation/lottie-animation';\nimport * as S from './sticker-selector-styles';\n\nconst renderSettings = {\n  loop: true,\n  autoplay: false,\n  renderer: 'canvas' as const,\n};\n\nconst Sticker: React.FC<IStickerProps> = ({\n  emoji,\n  lottieUrl,\n  size = 48,\n  onClick,\n  disabled = false,\n}) => {\n  const [isHovered, setIsHovered] = useState(false);\n  const [lottieState, setLottieState] = useState<'idle' | 'loading' | 'loaded' | 'error'>('idle');\n  const lottieRef = useRef<ILottieAnimationRef>(null);\n\n  const handleLottieReady = useCallback(() => {\n    setLottieState('loaded');\n    lottieRef.current?.play();\n  }, []);\n\n  const handleLottieError = useCallback(() => {\n    setLottieState('error');\n  }, []);\n\n  const handleMouseEnter = useCallback(() => {\n    if (disabled) return;\n\n    setIsHovered(true);\n\n    if (lottieState === 'idle') {\n      setLottieState('loading');\n    } else if (lottieState === 'loaded') {\n      lottieRef.current?.play();\n    }\n  }, [disabled, lottieState]);\n\n  const handleMouseLeave = useCallback(() => {\n    if (disabled) return;\n\n    setIsHovered(false);\n\n    if (lottieState === 'loaded') {\n      lottieRef.current?.goToAndStop(0, true);\n    }\n  }, [disabled, lottieState]);\n\n  const handleClick = useCallback(() => {\n    if (!disabled && onClick) {\n      lottieRef.current?.goToAndStop(0, true);\n      onClick();\n    }\n  }, [disabled, onClick]);\n\n  const shouldShowLottie = isHovered && lottieState !== 'idle';\n  const shouldRenderLottie = lottieState === 'loading' || lottieState === 'loaded';\n\n  return (\n    <S.StickerContainer\n      $size={size}\n      $disabled={disabled}\n      onPointerEnter={handleMouseEnter}\n      onPointerLeave={handleMouseLeave}\n      onClick={handleClick}\n    >\n      <S.StaticEmoji $size={size} $visible={!isHovered || lottieState === 'error'}>\n        {emoji}\n      </S.StaticEmoji>\n\n      <S.LottieContainer $size={size} $visible={shouldShowLottie}>\n        {shouldRenderLottie && lottieUrl && (\n          <LottieAnimation\n            ref={lottieRef}\n            src={lottieUrl}\n            width=\"100%\"\n            height=\"100%\"\n            settings={renderSettings}\n            onRender={handleLottieReady}\n            onError={handleLottieError}\n          />\n        )}\n      </S.LottieContainer>\n    </S.StickerContainer>\n  );\n};\n\nexport default memo(Sticker);\n"],"names":["renderSettings","Sticker","emoji","lottieUrl","size","onClick","disabled","isHovered","setIsHovered","useState","lottieState","setLottieState","lottieRef","useRef","handleLottieReady","useCallback","_a","handleLottieError","handleMouseEnter","handleMouseLeave","handleClick","jsxs","S.StickerContainer","jsx","S.StaticEmoji","S.LottieContainer","LottieAnimation","Sticker$1","memo"],"mappings":";;;;AAQA,MAAMA,IAAiB;AAAA,EACrB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AACZ,GAEMC,IAAmC,CAAC;AAAA,EACxC,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,SAAAC;AAAA,EACA,UAAAC,IAAW;AACb,MAAM;AACJ,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAaC,CAAc,IAAIF,EAAkD,MAAM,GACxFG,IAAYC,EAA4B,IAAI,GAE5CC,IAAoBC,EAAY,MAAM;;AAC1C,IAAAJ,EAAe,QAAQ,IACvBK,IAAAJ,EAAU,YAAV,QAAAI,EAAmB;AAAA,EACrB,GAAG,CAAE,CAAA,GAECC,IAAoBF,EAAY,MAAM;AAC1C,IAAAJ,EAAe,OAAO;AAAA,EACxB,GAAG,CAAE,CAAA,GAECO,IAAmBH,EAAY,MAAM;;AACzC,IAAIT,MAEJE,EAAa,EAAI,GAEbE,MAAgB,SAClBC,EAAe,SAAS,IACfD,MAAgB,cACzBM,IAAAJ,EAAU,YAAV,QAAAI,EAAmB;AAAA,EACrB,GACC,CAACV,GAAUI,CAAW,CAAC,GAEpBS,IAAmBJ,EAAY,MAAM;;AACzC,IAAIT,MAEJE,EAAa,EAAK,GAEdE,MAAgB,cACRM,IAAAJ,EAAA,YAAA,QAAAI,EAAS,YAAY,GAAG;AAAA,EACpC,GACC,CAACV,GAAUI,CAAW,CAAC,GAEpBU,IAAcL,EAAY,MAAM;;AAChC,IAAA,CAACT,KAAYD,OACLW,IAAAJ,EAAA,YAAA,QAAAI,EAAS,YAAY,GAAG,KAC1BX;EACV,GACC,CAACC,GAAUD,CAAO,CAAC;AAMpB,SAAA,gBAAAgB;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,OAAOlB;AAAA,MACP,WAAWE;AAAA,MACX,gBAAgBY;AAAA,MAChB,gBAAgBC;AAAA,MAChB,SAASC;AAAA,MAET,UAAA;AAAA,QAAC,gBAAAG,EAAAC,GAAA,EAAc,OAAOpB,GAAM,UAAU,CAACG,KAAaG,MAAgB,SACjE,UACHR,EAAA,CAAA;AAAA,QAEA,gBAAAqB,EAACE,GAAA,EAAkB,OAAOrB,GAAM,UAfXG,KAAaG,MAAgB,QAgB/C,WAfoBA,MAAgB,aAAaA,MAAgB,aAe3CP,KACrB,gBAAAoB;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,KAAKd;AAAA,YACL,KAAKT;AAAA,YACL,OAAM;AAAA,YACN,QAAO;AAAA,YACP,UAAUH;AAAA,YACV,UAAUc;AAAA,YACV,SAASG;AAAA,UAAA;AAAA,QAAA,GAGf;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEeU,IAAAC,EAAK3B,CAAO;"}

package/dist/features/stickers/stickers-effects/effects.js

@@ -0,0 +1,82 @@
+import { keyframes as i, css as t } from "styled-components";
+import { randomizeDuration as a } from "./stickers-effects-helper.js";
+const r = i`
+  0% {
+    opacity: 1;
+    visibility: visible;
+  }
+  80% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 0;
+    visibility: visible;
+  }
+`, e = i`
+  0% {
+    transform: translateY(0vh);
+    visibility: visible;
+  }
+  100% {
+    transform: translateY(-100vh);
+    visibility: visible;
+  }
+`, n = i`
+  0% {
+    transform: translateY(0vh);
+    visibility: visible;
+  }
+  100% {
+    transform: translateY(100vh);
+    visibility: visible;
+  }
+`, o = i`
+  0% {
+    transform: translateX(var(--from-x)) translateY(var(--from-y)) scale(1);
+    visibility: visible;
+  }
+  100% {
+    transform: translateX(0vw) translateY(0vh) scale(1.25);
+    visibility: visible;
+  }
+`, l = i`
+  0% {
+    transform: translateX(0) translateY(0vh);
+    visibility: visible;
+  }
+  35% {
+    transform: translateX(0) translateY(-50vh) scale(1.25);
+  }
+  60% {
+    transform: translateX(var(--from-x)) translateY(var(--from-y)) scale(1.25);
+  }
+  100% {
+    transform: translateX(var(--from-x)) translateY(-110vh) scale(1.25);
+    visibility: visible;
+  }
+`, v = {
+  "float-up": (s) => t`
+    animation:
+      ${e} ${a(s)}ms ease-out forwards,
+      ${r} ${a(s)}ms ease-in forwards;
+  `,
+  "fall-down": (s) => t`
+    animation:
+      ${n} ${a(s)}ms ease-out forwards,
+      ${r} ${a(s)}ms ease-in forwards;
+  `,
+  "burst-from-edges": (s) => t`
+    animation:
+      ${o} ${a(s)}ms linear forwards,
+      ${r} ${a(s)}ms ease-in forwards;
+  `,
+  "pop-expand": (s) => t`
+    animation:
+      ${l} ${s}ms cubic-bezier(0.5, 0.1, 0.7, 1) forwards,
+      ${r} ${s}ms ease-in forwards;
+  `
+};
+export {
+  v as effectAnimations
+};
+//# sourceMappingURL=effects.js.map

package/dist/features/stickers/stickers-effects/effects.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"effects.js","sources":["../../../../src/features/stickers/stickers-effects/effects.ts"],"sourcesContent":["import type { IStickersProps } from './stickers-effects-types';\n\nimport { keyframes, css } from 'styled-components';\n\nimport { randomizeDuration } from './stickers-effects-helper';\n\nconst fadeOutEaseIn = keyframes`\n  0% {\n    opacity: 1;\n    visibility: visible;\n  }\n  80% {\n    opacity: 0.5;\n  }\n  100% {\n    opacity: 0;\n    visibility: visible;\n  }\n`;\n\nconst floatUp = keyframes`\n  0% {\n    transform: translateY(0vh);\n    visibility: visible;\n  }\n  100% {\n    transform: translateY(-100vh);\n    visibility: visible;\n  }\n`;\n\nconst fallDown = keyframes`\n  0% {\n    transform: translateY(0vh);\n    visibility: visible;\n  }\n  100% {\n    transform: translateY(100vh);\n    visibility: visible;\n  }\n`;\n\nconst burstFromEdges = keyframes`\n  0% {\n    transform: translateX(var(--from-x)) translateY(var(--from-y)) scale(1);\n    visibility: visible;\n  }\n  100% {\n    transform: translateX(0vw) translateY(0vh) scale(1.25);\n    visibility: visible;\n  }\n`;\n\nconst popExpand = keyframes`\n  0% {\n    transform: translateX(0) translateY(0vh);\n    visibility: visible;\n  }\n  35% {\n    transform: translateX(0) translateY(-50vh) scale(1.25);\n  }\n  60% {\n    transform: translateX(var(--from-x)) translateY(var(--from-y)) scale(1.25);\n  }\n  100% {\n    transform: translateX(var(--from-x)) translateY(-110vh) scale(1.25);\n    visibility: visible;\n  }\n`;\n\nexport const effectAnimations: Record<\n  IStickersProps['effect'],\n  (duration: number) => ReturnType<typeof css>\n> = {\n  'float-up': (duration: number) => css`\n    animation:\n      ${floatUp} ${randomizeDuration(duration)}ms ease-out forwards,\n      ${fadeOutEaseIn} ${randomizeDuration(duration)}ms ease-in forwards;\n  `,\n  'fall-down': (duration: number) => css`\n    animation:\n      ${fallDown} ${randomizeDuration(duration)}ms ease-out forwards,\n      ${fadeOutEaseIn} ${randomizeDuration(duration)}ms ease-in forwards;\n  `,\n  'burst-from-edges': (duration: number) => css`\n    animation:\n      ${burstFromEdges} ${randomizeDuration(duration)}ms linear forwards,\n      ${fadeOutEaseIn} ${randomizeDuration(duration)}ms ease-in forwards;\n  `,\n  'pop-expand': (duration: number) => css`\n    animation:\n      ${popExpand} ${duration}ms cubic-bezier(0.5, 0.1, 0.7, 1) forwards,\n      ${fadeOutEaseIn} ${duration}ms ease-in forwards;\n  `,\n};\n"],"names":["fadeOutEaseIn","keyframes","floatUp","fallDown","burstFromEdges","popExpand","effectAnimations","duration","css","randomizeDuration"],"mappings":";;AAMA,MAAMA,IAAgBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAchBC,IAAUD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWVE,IAAWF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWXG,IAAiBH;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWjBI,IAAYJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAiBLK,IAGT;AAAA,EACF,YAAY,CAACC,MAAqBC;AAAA;AAAA,QAE5BN,CAAO,IAAIO,EAAkBF,CAAQ,CAAC;AAAA,QACtCP,CAAa,IAAIS,EAAkBF,CAAQ,CAAC;AAAA;AAAA,EAElD,aAAa,CAACA,MAAqBC;AAAA;AAAA,QAE7BL,CAAQ,IAAIM,EAAkBF,CAAQ,CAAC;AAAA,QACvCP,CAAa,IAAIS,EAAkBF,CAAQ,CAAC;AAAA;AAAA,EAElD,oBAAoB,CAACA,MAAqBC;AAAA;AAAA,QAEpCJ,CAAc,IAAIK,EAAkBF,CAAQ,CAAC;AAAA,QAC7CP,CAAa,IAAIS,EAAkBF,CAAQ,CAAC;AAAA;AAAA,EAElD,cAAc,CAACA,MAAqBC;AAAA;AAAA,QAE9BH,CAAS,IAAIE,CAAQ;AAAA,QACrBP,CAAa,IAAIO,CAAQ;AAAA;AAEjC;"}

package/dist/features/stickers/stickers-effects/stickers-cache.js

@@ -0,0 +1,19 @@
+const o = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new Map();
+async function r(t) {
+  if (o.has(t))
+    return o.get(t);
+  if (n.has(t))
+    return n.get(t);
+  const i = fetch(t).then(async (e) => {
+    if (!e.ok) return null;
+    const a = t.endsWith(".lottie") ? await e.arrayBuffer() : await e.json();
+    return o.set(t, a), a;
+  }).catch((e) => (console.error("Lottie preload error:", e), null)).finally(() => {
+    n.delete(t);
+  });
+  return n.set(t, i), i;
+}
+export {
+  r as preloadLottieFile
+};
+//# sourceMappingURL=stickers-cache.js.map

package/dist/features/stickers/stickers-effects/stickers-cache.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stickers-cache.js","sources":["../../../../src/features/stickers/stickers-effects/stickers-cache.ts"],"sourcesContent":["import type { Data } from '@lottiefiles/dotlottie-web';\n\nconst lottieCache = new Map<string, Data>();\nconst lottiePromises = new Map<string, Promise<Data | null>>();\n\nexport async function preloadLottieFile(url: string): Promise<Data | null> {\n  if (lottieCache.has(url)) {\n    return lottieCache.get(url)!;\n  }\n\n  if (lottiePromises.has(url)) {\n    return lottiePromises.get(url)!;\n  }\n\n  const fetchPromise = fetch(url)\n    .then(async res => {\n      if (!res.ok) return null;\n\n      const isLottieFile = url.endsWith('.lottie');\n      const data = isLottieFile ? await res.arrayBuffer() : await res.json();\n\n      lottieCache.set(url, data);\n\n      return data;\n    })\n    .catch(err => {\n      // eslint-disable-next-line no-console\n      console.error('Lottie preload error:', err);\n\n      return null;\n    })\n    .finally(() => {\n      lottiePromises.delete(url);\n    });\n\n  lottiePromises.set(url, fetchPromise);\n\n  return fetchPromise;\n}\n"],"names":["lottieCache","lottiePromises","preloadLottieFile","url","fetchPromise","res","data","err"],"mappings":"AAEA,MAAMA,wBAAkB,OAClBC,wBAAqB;AAE3B,eAAsBC,EAAkBC,GAAmC;AACrE,MAAAH,EAAY,IAAIG,CAAG;AACd,WAAAH,EAAY,IAAIG,CAAG;AAGxB,MAAAF,EAAe,IAAIE,CAAG;AACjB,WAAAF,EAAe,IAAIE,CAAG;AAG/B,QAAMC,IAAe,MAAMD,CAAG,EAC3B,KAAK,OAAME,MAAO;AACb,QAAA,CAACA,EAAI,GAAW,QAAA;AAGd,UAAAC,IADeH,EAAI,SAAS,SAAS,IACf,MAAME,EAAI,gBAAgB,MAAMA,EAAI;AAEpD,WAAAL,EAAA,IAAIG,GAAKG,CAAI,GAElBA;AAAA,EAAA,CACR,EACA,MAAM,CAAOC,OAEJ,QAAA,MAAM,yBAAyBA,CAAG,GAEnC,KACR,EACA,QAAQ,MAAM;AACb,IAAAN,EAAe,OAAOE,CAAG;AAAA,EAAA,CAC1B;AAEY,SAAAF,EAAA,IAAIE,GAAKC,CAAY,GAE7BA;AACT;"}

package/dist/features/stickers/stickers-effects/stickers-effects-helper.js

@@ -0,0 +1,105 @@
+import { stickerData as b } from "../sticker-data.js";
+const w = (o, e) => {
+  const t = Math.ceil(e / 4), a = Math.floor(o / t), m = o % t, p = ["top", "right", "bottom", "left"][a] ?? "left", c = (m + 0.5) / t * 100, i = (Math.random() - 0.5) * 25, s = Math.min(Math.max(c + i, 0), 100), h = 45 + Math.random() * 10, d = 45 + Math.random() * 10;
+  let n = 0, r = 0;
+  switch (p) {
+    case "top":
+      n = s - h, r = -d + i;
+      break;
+    case "right":
+      n = 100 - h + i, r = s - d;
+      break;
+    case "bottom":
+      n = s - h, r = 100 - d + i;
+      break;
+    case "left":
+      n = -h + i, r = s - d;
+      break;
+  }
+  return {
+    fromX: `${n}vw`,
+    fromY: `${r}vh`,
+    x: h,
+    y: d
+  };
+}, v = (o, e = 10) => {
+  const t = [];
+  let a = 0;
+  const m = o;
+  for (; t.length < o && a < m; ) {
+    const l = Math.floor(Math.random() * (100 - 2 * e) + e);
+    t.every((p) => Math.abs(p - l) >= e) && t.push(l), a++;
+  }
+  for (; t.length < o; )
+    t.push(Math.floor(Math.random() * (100 - 2 * e) + e));
+  return t;
+};
+function P({
+  count: o,
+  effect: e,
+  stickers: t,
+  minSize: a,
+  maxSize: m
+}) {
+  const l = 100 / o * 2, p = () => Math.random() * (m - a) + a, c = [], i = ["float-up", "fall-down"].includes(e) ? v(o, l) : [];
+  for (let s = 0; s < o; s++) {
+    const h = t[s % t.length] ?? "", { emoji: d = "", lottieUrl: n } = b.find(({ id: f }) => f === h) || {}, r = p(), u = i[s], M = { id: h, sticker: d, size: r };
+    switch (e) {
+      case "float-up":
+        c.push({
+          ...M,
+          x: u,
+          y: 110 + (Math.random() - 0.5) * r,
+          lottie: n
+        });
+        break;
+      case "fall-down":
+        c.push({
+          ...M,
+          x: u,
+          y: -10 + (Math.random() - 0.5) * r,
+          lottie: n
+        });
+        break;
+      case "burst-from-edges": {
+        const { x: f, y: x, fromX: g, fromY: k } = w(s, o);
+        c.push({
+          ...M,
+          x: f,
+          y: x,
+          fromX: g,
+          fromY: k,
+          size: r,
+          lottie: n
+        });
+        break;
+      }
+      case "pop-expand":
+        c.push({
+          ...M,
+          x: 50,
+          y: 100,
+          fromX: `${(Math.random() - 0.5) * 27.5}vw`,
+          fromY: `${-50 - Math.random() * 27.5}vh`,
+          lottie: n
+        });
+        break;
+      default:
+        c.push({
+          ...M,
+          x: Math.random() * 100,
+          y: Math.random() * 100
+        });
+    }
+  }
+  return c;
+}
+const X = (o, e = 0.2) => {
+  const t = o * e, a = o - t, m = o + t;
+  return Math.floor(Math.random() * (m - a + 1)) + a;
+};
+export {
+  P as generateStickerData,
+  X as randomizeDuration
+};
+//# sourceMappingURL=stickers-effects-helper.js.map

package/dist/features/stickers/stickers-effects/stickers-effects-helper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stickers-effects-helper.js","sources":["../../../../src/features/stickers/stickers-effects/stickers-effects-helper.ts"],"sourcesContent":["import type { TStickerData, IStickersProps } from './stickers-effects-types';\n\nimport { stickerData } from '../sticker-data';\n\nconst getBurstPosition = (\n  index: number,\n  total: number,\n): {\n  fromX: string;\n  fromY: string;\n  x: number;\n  y: number;\n} => {\n  const countPerSide = Math.ceil(total / 4);\n  const sideIndex = Math.floor(index / countPerSide);\n  const pos = index % countPerSide;\n\n  const sides = ['top', 'right', 'bottom', 'left'] as const;\n  const side = sides[sideIndex] ?? 'left';\n\n  const basePercent = ((pos + 0.5) / countPerSide) * 100;\n  const jitter = (Math.random() - 0.5) * 25;\n  const edgePercent = Math.min(Math.max(basePercent + jitter, 0), 100);\n\n  const centerX = 45 + Math.random() * 10;\n  const centerY = 45 + Math.random() * 10;\n\n  let fromX = 0;\n  let fromY = 0;\n\n  switch (side) {\n    case 'top':\n      fromX = edgePercent - centerX;\n      fromY = -centerY + jitter;\n      break;\n    case 'right':\n      fromX = 100 - centerX + jitter;\n      fromY = edgePercent - centerY;\n      break;\n    case 'bottom':\n      fromX = edgePercent - centerX;\n      fromY = 100 - centerY + jitter;\n      break;\n    case 'left':\n      fromX = -centerX + jitter;\n      fromY = edgePercent - centerY;\n      break;\n  }\n\n  return {\n    fromX: `${fromX}vw`,\n    fromY: `${fromY}vh`,\n    x: centerX,\n    y: centerY,\n  };\n};\n\nconst getRandomNonOverlappingPositions = (count: number, buffer = 10): number[] => {\n  const used: number[] = [];\n  let attempts = 0;\n  const maxAttempts = count;\n\n  while (used.length < count && attempts < maxAttempts) {\n    const value = Math.floor(Math.random() * (100 - 2 * buffer) + buffer);\n\n    if (used.every(v => Math.abs(v - value) >= buffer)) {\n      used.push(value);\n    }\n    attempts++;\n  }\n\n  while (used.length < count) {\n    used.push(Math.floor(Math.random() * (100 - 2 * buffer) + buffer));\n  }\n\n  return used;\n};\n\nexport function generateStickerData({\n  count,\n  effect,\n  stickers,\n  minSize,\n  maxSize,\n}: {\n  count: number;\n  effect: IStickersProps['effect'];\n  stickers: string[];\n  minSize: number;\n  maxSize: number;\n}): TStickerData[] {\n  const buffer = (100 / count) * 2;\n  const getSize = () => Math.random() * (maxSize - minSize) + minSize;\n  const result: TStickerData[] = [];\n  const xPositions = ['float-up', 'fall-down'].includes(effect)\n    ? getRandomNonOverlappingPositions(count, buffer)\n    : [];\n\n  for (let i = 0; i < count; i++) {\n    const stickerId = stickers[i % stickers.length] ?? '';\n    const { emoji: sticker = '', lottieUrl: lottie } =\n      stickerData.find(({ id }) => id === stickerId) || {};\n\n    const size = getSize();\n    const x = xPositions[i]!;\n    const common = { id: stickerId, sticker, size };\n\n    switch (effect) {\n      case 'float-up':\n        result.push({\n          ...common,\n          x,\n          y: 110 + (Math.random() - 0.5) * size,\n          lottie: lottie,\n        });\n        break;\n\n      case 'fall-down':\n        result.push({\n          ...common,\n          x,\n          y: -10 + (Math.random() - 0.5) * size,\n          lottie: lottie,\n        });\n        break;\n\n      case 'burst-from-edges': {\n        // eslint-disable-next-line @typescript-eslint/no-shadow\n        const { x, y, fromX, fromY } = getBurstPosition(i, count);\n\n        result.push({\n          ...common,\n          x,\n          y,\n          fromX,\n          fromY,\n          size,\n          lottie: lottie,\n        });\n        break;\n      }\n\n      case 'pop-expand':\n        result.push({\n          ...common,\n          x: 50,\n          y: 100,\n          fromX: `${(Math.random() - 0.5) * 27.5}vw`,\n          fromY: `${-50 - Math.random() * 27.5}vh`,\n          lottie: lottie,\n        });\n        break;\n\n      default:\n        result.push({\n          ...common,\n          x: Math.random() * 100,\n          y: Math.random() * 100,\n        });\n    }\n  }\n\n  return result;\n}\n\nexport const randomizeDuration = (base: number, variancePercent = 0.2): number => {\n  const delta = base * variancePercent;\n  const min = base - delta;\n  const max = base + delta;\n\n  return Math.floor(Math.random() * (max - min + 1)) + min;\n};\n"],"names":["getBurstPosition","index","total","countPerSide","sideIndex","pos","side","basePercent","jitter","edgePercent","centerX","centerY","fromX","fromY","getRandomNonOverlappingPositions","count","buffer","used","attempts","maxAttempts","value","v","generateStickerData","effect","stickers","minSize","maxSize","getSize","result","xPositions","i","stickerId","sticker","lottie","stickerData","id","size","x","common","y","randomizeDuration","base","variancePercent","delta","min","max"],"mappings":"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"}

package/dist/features/stickers/stickers-effects/stickers-effects-styled.js

@@ -0,0 +1,37 @@
+import o, { css as n } from "styled-components";
+import { effectAnimations as r } from "./effects.js";
+const d = o.div`
+  position: relative;
+  width: 100vw;
+  height: 100vh;
+  background: transparent;
+  pointer-events: none;
+`, h = o.div`
+  position: absolute;
+  z-index: 10;
+
+  left: ${({ x: i }) => `${i}%`};
+  top: ${({ y: i }) => `${i}%`};
+  width: ${({ size: i }) => `${i}px`};
+  height: ${({ size: i }) => `${i}px`};
+  font-size: ${({ size: i }) => `${i}px`};
+
+  pointer-events: none;
+  visibility: hidden;
+  animation-fill-mode: both;
+
+  ${({ effect: i, duration: $, delay: s = 0, fromX: t, fromY: e }) => n`
+    ${r[i]($)}
+    animation-delay: ${s}ms;
+
+    ${t && e && n`
+      --from-x: ${t};
+      --from-y: ${e};
+    `}
+  `}
+`;
+export {
+  d as Container,
+  h as Sticker
+};
+//# sourceMappingURL=stickers-effects-styled.js.map

package/dist/features/stickers/stickers-effects/stickers-effects-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stickers-effects-styled.js","sources":["../../../../src/features/stickers/stickers-effects/stickers-effects-styled.ts"],"sourcesContent":["import type { IStickersProps } from './stickers-effects-types';\n\nimport styled, { css } from 'styled-components';\n\nimport { effectAnimations } from './effects';\n\nexport const Container = styled.div`\n  position: relative;\n  width: 100vw;\n  height: 100vh;\n  background: transparent;\n  pointer-events: none;\n`;\n\nexport const Sticker = styled.div<{\n  effect: IStickersProps['effect'];\n  duration: number;\n  delay?: number;\n  fromX?: string;\n  fromY?: string;\n  x: number;\n  y: number;\n  size: number;\n}>`\n  position: absolute;\n  z-index: 10;\n\n  left: ${({ x }) => `${x}%`};\n  top: ${({ y }) => `${y}%`};\n  width: ${({ size }) => `${size}px`};\n  height: ${({ size }) => `${size}px`};\n  font-size: ${({ size }) => `${size}px`};\n\n  pointer-events: none;\n  visibility: hidden;\n  animation-fill-mode: both;\n\n  ${({ effect, duration, delay = 0, fromX, fromY }) => css`\n    ${effectAnimations[effect](duration)}\n    animation-delay: ${delay}ms;\n\n    ${fromX &&\n    fromY &&\n    css`\n      --from-x: ${fromX};\n      --from-y: ${fromY};\n    `}\n  `}\n`;\n"],"names":["Container","styled","Sticker","x","y","size","effect","duration","delay","fromX","fromY","css","effectAnimations"],"mappings":";;AAMO,MAAMA,IAAYC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQnBC,IAAUD,EAAO;AAAA;AAAA;AAAA;AAAA,UAapB,CAAC,EAAE,GAAAE,EAAQ,MAAA,GAAGA,CAAC,GAAG;AAAA,SACnB,CAAC,EAAE,GAAAC,EAAQ,MAAA,GAAGA,CAAC,GAAG;AAAA,WAChB,CAAC,EAAE,MAAAC,EAAW,MAAA,GAAGA,CAAI,IAAI;AAAA,YACxB,CAAC,EAAE,MAAAA,EAAW,MAAA,GAAGA,CAAI,IAAI;AAAA,eACtB,CAAC,EAAE,MAAAA,EAAW,MAAA,GAAGA,CAAI,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMpC,CAAC,EAAE,QAAAC,GAAQ,UAAAC,GAAU,OAAAC,IAAQ,GAAG,OAAAC,GAAO,OAAAC,EAAY,MAAAC;AAAA,MACjDC,EAAiBN,CAAM,EAAEC,CAAQ,CAAC;AAAA,uBACjBC,CAAK;AAAA;AAAA,MAEtBC,KACFC,KACAC;AAAA,kBACcF,CAAK;AAAA,kBACLC,CAAK;AAAA,KAClB;AAAA,GACF;AAAA;"}

package/dist/features/stickers/stickers-effects/stickers-effects.js

@@ -0,0 +1,67 @@
+import { jsx as n, Fragment as x } from "react/jsx-runtime";
+import { memo as d, useState as l, useEffect as p } from "react";
+import E from "../../ui/dot-lottie-animations/dot-lottie-animation.js";
+import { preloadLottieFile as F } from "./stickers-cache.js";
+import { generateStickerData as y } from "./stickers-effects-helper.js";
+import { Container as z, Sticker as L } from "./stickers-effects-styled.js";
+const T = d(({ url: t, sticker: i, size: o }) => {
+  const [r, f] = l(), [c, e] = l(!1), s = {
+    loop: !0,
+    autoplay: !0
+  };
+  return p(() => {
+    let a = !0;
+    if (t)
+      return F(t).then((m) => {
+        a && (m ? f(m) : e(!0));
+      }).catch(() => {
+        a && e(!0);
+      }), () => {
+        a = !1;
+      };
+  }, [t]), !t || c || !r ? /* @__PURE__ */ n(x, { children: i }) : /* @__PURE__ */ n(
+    E,
+    {
+      data: r,
+      width: o,
+      height: o,
+      settings: s,
+      onError: () => e(!0)
+    }
+  );
+}), $ = ({ stickers: t, effect: i, count: o, duration: r }) => {
+  const [f, c] = l([]);
+  return p(() => {
+    const e = y({
+      count: o,
+      effect: i,
+      stickers: t,
+      minSize: 48,
+      maxSize: 72
+    });
+    c(e);
+    const s = setTimeout(() => c([]), r);
+    return () => clearTimeout(s);
+  }, [t, i, o, r]), /* @__PURE__ */ n(z, { children: f.map((e, s) => {
+    const { id: a, sticker: m, lottie: h, x: k, y: S, size: u, fromX: D, fromY: g } = e;
+    return /* @__PURE__ */ n(
+      L,
+      {
+        effect: i,
+        duration: r,
+        delay: 500,
+        fromX: D,
+        fromY: g,
+        x: k,
+        y: S,
+        size: u,
+        children: /* @__PURE__ */ n(T, { url: h, sticker: m, size: u })
+      },
+      `${a}-${s}`
+    );
+  }) });
+}, W = d($);
+export {
+  W as default
+};
+//# sourceMappingURL=stickers-effects.js.map

package/dist/features/stickers/stickers-effects/stickers-effects.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stickers-effects.js","sources":["../../../../src/features/stickers/stickers-effects/stickers-effects.tsx"],"sourcesContent":["import type { TStickerData, IStickersProps } from './stickers-effects-types';\nimport type { Data } from '@lottiefiles/dotlottie-web';\n\nimport React, { memo, useEffect, useState } from 'react';\n\nimport DotLottieAnimation from '../../ui/dot-lottie-animations/dot-lottie-animation';\nimport { preloadLottieFile } from './stickers-cache';\nimport { generateStickerData } from './stickers-effects-helper';\nimport * as S from './stickers-effects-styled';\n\nconst StickerWithFallback: React.FC<{\n  url?: string;\n  sticker: string;\n  size: number;\n}> = memo(({ url, sticker, size }) => {\n  const [data, setData] = useState<Data>();\n  const [failed, setFailed] = useState(false);\n  const renderSettings = {\n    loop: true,\n    autoplay: true,\n  };\n\n  useEffect(() => {\n    let isMounted = true;\n\n    if (!url) return;\n\n    preloadLottieFile(url)\n      .then(result => {\n        if (isMounted) {\n          if (result) {\n            setData(result);\n          } else {\n            setFailed(true);\n          }\n        }\n      })\n      .catch(() => {\n        if (isMounted) setFailed(true);\n      });\n\n    return () => {\n      isMounted = false;\n    };\n  }, [url]);\n\n  if (!url || failed || !data) {\n    return <>{sticker}</>;\n  }\n\n  return (\n    <DotLottieAnimation\n      data={data}\n      width={size}\n      height={size}\n      settings={renderSettings}\n      onError={() => setFailed(true)}\n    />\n  );\n});\n\nconst StickersEffects: React.FC<IStickersProps> = ({ stickers, effect, count, duration }) => {\n  const [stickersData, setStickersData] = useState<ReturnType<typeof generateStickerData>>([]);\n\n  useEffect(() => {\n    const stickerData = generateStickerData({\n      count,\n      effect,\n      stickers,\n      minSize: 48,\n      maxSize: 72,\n    });\n\n    setStickersData(stickerData);\n\n    const timeout = setTimeout(() => setStickersData([]), duration);\n\n    return () => clearTimeout(timeout);\n  }, [stickers, effect, count, duration]);\n\n  return (\n    <S.Container>\n      {stickersData.map((data: TStickerData, i) => {\n        const { id, sticker, lottie, x, y, size, fromX, fromY } = data;\n\n        return (\n          <S.Sticker\n            key={`${id}-${i}`}\n            effect={effect}\n            duration={duration}\n            delay={500}\n            fromX={fromX}\n            fromY={fromY}\n            x={x}\n            y={y}\n            size={size}\n          >\n            <StickerWithFallback url={lottie} sticker={sticker} size={size} />\n          </S.Sticker>\n        );\n      })}\n    </S.Container>\n  );\n};\n\nexport default memo(StickersEffects);\n"],"names":["StickerWithFallback","memo","url","sticker","size","data","setData","useState","failed","setFailed","renderSettings","useEffect","isMounted","preloadLottieFile","result","jsx","DotLottieAnimation","StickersEffects","stickers","effect","count","duration","stickersData","setStickersData","stickerData","generateStickerData","timeout","S.Container","i","id","lottie","x","y","fromX","fromY","S.Sticker","stickersEffects"],"mappings":";;;;;;AAUA,MAAMA,IAIDC,EAAK,CAAC,EAAE,KAAAC,GAAK,SAAAC,GAAS,MAAAC,QAAW;AACpC,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAe,GACjC,CAACC,GAAQC,CAAS,IAAIF,EAAS,EAAK,GACpCG,IAAiB;AAAA,IACrB,MAAM;AAAA,IACN,UAAU;AAAA,EAAA;AA2BZ,SAxBAC,EAAU,MAAM;AACd,QAAIC,IAAY;AAEhB,QAAKV;AAEa,aAAAW,EAAAX,CAAG,EAClB,KAAK,CAAUY,MAAA;AACd,QAAIF,MACEE,IACFR,EAAQQ,CAAM,IAEdL,EAAU,EAAI;AAAA,MAElB,CACD,EACA,MAAM,MAAM;AACP,QAAAG,OAAqB,EAAI;AAAA,MAAA,CAC9B,GAEI,MAAM;AACC,QAAAA,IAAA;AAAA,MAAA;AAAA,EACd,GACC,CAACV,CAAG,CAAC,GAEJ,CAACA,KAAOM,KAAU,CAACH,2BACX,UAAQF,EAAA,CAAA,IAIlB,gBAAAY;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAX;AAAA,MACA,OAAOD;AAAA,MACP,QAAQA;AAAA,MACR,UAAUM;AAAA,MACV,SAAS,MAAMD,EAAU,EAAI;AAAA,IAAA;AAAA,EAAA;AAGnC,CAAC,GAEKQ,IAA4C,CAAC,EAAE,UAAAC,GAAU,QAAAC,GAAQ,OAAAC,GAAO,UAAAC,QAAe;AAC3F,QAAM,CAACC,GAAcC,CAAe,IAAIhB,EAAiD,CAAE,CAAA;AAE3F,SAAAI,EAAU,MAAM;AACd,UAAMa,IAAcC,EAAoB;AAAA,MACtC,OAAAL;AAAA,MACA,QAAAD;AAAA,MACA,UAAAD;AAAA,MACA,SAAS;AAAA,MACT,SAAS;AAAA,IAAA,CACV;AAED,IAAAK,EAAgBC,CAAW;AAE3B,UAAME,IAAU,WAAW,MAAMH,EAAgB,CAAE,CAAA,GAAGF,CAAQ;AAEvD,WAAA,MAAM,aAAaK,CAAO;AAAA,KAChC,CAACR,GAAUC,GAAQC,GAAOC,CAAQ,CAAC,GAGpC,gBAAAN,EAACY,GAAA,EACE,YAAa,IAAI,CAACtB,GAAoBuB,MAAM;AACrC,UAAA,EAAE,IAAAC,GAAI,SAAA1B,GAAS,QAAA2B,GAAQ,GAAAC,GAAG,GAAAC,GAAG,MAAA5B,GAAM,OAAA6B,GAAO,OAAAC,EAAU,IAAA7B;AAGxD,WAAA,gBAAAU;AAAA,MAACoB;AAAAA,MAAA;AAAA,QAEC,QAAAhB;AAAA,QACA,UAAAE;AAAA,QACA,OAAO;AAAA,QACP,OAAAY;AAAA,QACA,OAAAC;AAAA,QACA,GAAAH;AAAA,QACA,GAAAC;AAAA,QACA,MAAA5B;AAAA,QAEA,UAAC,gBAAAW,EAAAf,GAAA,EAAoB,KAAK8B,GAAQ,SAAA3B,GAAkB,MAAAC,GAAY;AAAA,MAAA;AAAA,MAV3D,GAAGyB,CAAE,IAAID,CAAC;AAAA,IAAA;AAAA,EAapB,CAAA,EACH,CAAA;AAEJ,GAEeQ,IAAAnC,EAAKgB,CAAe;"}

package/dist/features/ui/arrow-tooltip/arrow-tooltip-styled.js

@@ -1,5 +1,5 @@
-import o from "styled-components";
-const i = o.div`
+import i from "styled-components";
+const e = i.div`
   position: absolute;
   top: 0;
   left: 0;
@@ -8,8 +8,13 @@ const i = o.div`
   width: 100%;
   height: 100%;
   z-index: ${({ theme: t }) => t.zIndex.JOURNEY_OVERLAY};
+`, n = i.div`
+  visibility: ${({ $visible: t }) => t ? "visible" : "hidden"};
+  opacity: ${({ $visible: t }) => t ? 1 : 0};
+  pointer-events: ${({ $visible: t }) => t ? "auto" : "none"};
 `;
 export {
-  i as BackgroundOverlay
+  e as BackgroundOverlay,
+  n as TooltipWrapper
 };
 //# sourceMappingURL=arrow-tooltip-styled.js.map

package/dist/features/ui/arrow-tooltip/arrow-tooltip-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"arrow-tooltip-styled.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const BackgroundOverlay = styled.div`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  width: 100%;\n  height: 100%;\n  z-index: ${({ theme }) => theme.zIndex.JOURNEY_OVERLAY};\n`;\n"],"names":["BackgroundOverlay","styled","theme"],"mappings":";AAEO,MAAMA,IAAoBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAQ3B,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,eAAe;AAAA;"}
+{"version":3,"file":"arrow-tooltip-styled.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const BackgroundOverlay = styled.div`\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  width: 100%;\n  height: 100%;\n  z-index: ${({ theme }) => theme.zIndex.JOURNEY_OVERLAY};\n`;\n\nexport const TooltipWrapper = styled.div<{ $visible: boolean }>`\n  visibility: ${({ $visible }) => ($visible ? 'visible' : 'hidden')};\n  opacity: ${({ $visible }) => ($visible ? 1 : 0)};\n  pointer-events: ${({ $visible }) => ($visible ? 'auto' : 'none')};\n`;\n"],"names":["BackgroundOverlay","styled","theme","TooltipWrapper","$visible"],"mappings":";AAEO,MAAMA,IAAoBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAQ3B,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,eAAe;AAAA,GAG3CC,IAAiBF,EAAO;AAAA,gBACrB,CAAC,EAAE,UAAAG,EAAA,MAAgBA,IAAW,YAAY,QAAS;AAAA,aACtD,CAAC,EAAE,UAAAA,EAAA,MAAgBA,IAAW,IAAI,CAAE;AAAA,oBAC7B,CAAC,EAAE,UAAAA,EAAA,MAAgBA,IAAW,SAAS,MAAO;AAAA;"}

package/dist/features/ui/arrow-tooltip/arrow-tooltip.js

@@ -1,53 +1,53 @@
-import { jsxs as D, Fragment as U, jsx as e } from "react/jsx-runtime";
-import W from "../../../node_modules/lodash.throttle/index.js";
-import { memo as Y, useRef as H, useState as f, useCallback as p, useEffect as m } from "react";
+import { jsxs as j, Fragment as D, jsx as e } from "react/jsx-runtime";
+import U from "../../../node_modules/lodash.throttle/index.js";
+import { memo as Y, useRef as H, useState as a, useCallback as f, useEffect as m } from "react";
 import $ from "../layout/flex-view.js";
 import P from "../portal/portal.js";
 import { THROTTLE_DURATION as Z, DEFAULT_ARROW_SIZE as q } from "./arrow-tooltip-constants.js";
-import { BackgroundOverlay as G } from "./arrow-tooltip-styled.js";
-import { computeTooltipNewCoOrdinates as J } from "./arrow-tooltip-util.js";
-import K from "./comps/tooltip-body.js";
-const Q = ({
+import { TooltipWrapper as G, BackgroundOverlay as J } from "./arrow-tooltip-styled.js";
+import { computeTooltipNewCoOrdinates as K } from "./arrow-tooltip-util.js";
+import Q from "./comps/tooltip-body.js";
+const V = ({
   isAnimated: C,
   alwaysVisible: o = !1,
   arrowColor: O,
   arrowSize: w = q,
-  arrowXCoOrdinates: E,
-  arrowYCoOrdinates: T,
-  backgroundColor: v,
-  borderColor: R,
-  children: h,
+  arrowXCoOrdinates: T,
+  arrowYCoOrdinates: v,
+  backgroundColor: E,
+  borderColor: h,
+  children: R,
   hidden: t,
   position: l,
   renderAs: A,
   textVariant: L,
   tooltipItem: g,
   tooltipOffset: x,
-  tooltipXCoOrdinates: z,
-  tooltipYCoOrdinates: I,
-  width: b,
+  tooltipXCoOrdinates: b,
+  tooltipYCoOrdinates: z,
+  width: I,
   widthX: k,
   zIndex: B,
   parentWidth: F,
   isBlocking: M = !1
 }) => {
-  const u = H(null), [N, d] = f(o), [S, X] = f(
+  const d = H(null), [N, u] = a(o), [S, W] = a(
     null
-  ), s = p(
+  ), s = f(
     (n, i) => {
-      X(n), d(i);
+      W(n), u(i);
     },
     []
-  ), _ = p(() => {
+  ), X = f(() => {
     if (t || o)
       return null;
     s(null, !1);
-  }, [o, s, t]), r = W(() => {
-    var a;
-    const { current: n } = u;
+  }, [o, s, t]), r = U(() => {
+    var p;
+    const { current: n } = d;
     if (t || !n) return null;
-    const i = (a = n.children[0]) == null ? void 0 : a.getBoundingClientRect(), j = i ? J(l, i) : null;
-    return s(j, !0), null;
+    const i = (p = n.children[0]) == null ? void 0 : p.getBoundingClientRect(), _ = i ? K(l, i) : null;
+    return s(_, !0), null;
   }, Z);
   m(() => {
     if (!(!o || t))
@@ -55,46 +55,46 @@ const Q = ({
         window.removeEventListener("scroll", r, !0), window.removeEventListener("resize", r);
       };
   }, [o, t, l, r]), m(() => {
-    t && d(!1), o && r();
+    t && u(!1), o && r();
   }, [o, t]);
   const c = /* @__PURE__ */ e(
-    K,
+    Q,
     {
       $arrowSize: w,
-      $arrowXCoOrdinates: E,
-      $arrowYCoOrdinates: T,
+      $arrowXCoOrdinates: T,
+      $arrowYCoOrdinates: v,
       $position: l,
       $renderAs: A,
       $tooltipCoOrdinates: S,
       $tooltipOffset: x,
-      $tooltipXCoOrdinates: z,
-      $tooltipYCoOrdinates: I,
+      $tooltipXCoOrdinates: b,
+      $tooltipYCoOrdinates: z,
       $zIndex: B,
-      $backgroundColor: v,
+      $backgroundColor: E,
       $arrowColor: O,
-      $borderColor: R,
+      $borderColor: h,
       $isAnimated: C,
-      $width: b,
+      $width: I,
       $widthX: k,
       textVariant: L || "body3",
       children: g
     }
   );
-  return /* @__PURE__ */ D(U, { children: [
+  return /* @__PURE__ */ j(D, { children: [
     /* @__PURE__ */ e(
       $,
       {
         $width: F || "fit-content",
-        ref: u,
+        ref: d,
         onMouseEnter: r,
-        onMouseLeave: _,
-        children: /* @__PURE__ */ e($, { children: h })
+        onMouseLeave: X,
+        children: /* @__PURE__ */ e($, { children: R })
       }
     ),
-    N && /* @__PURE__ */ e(P, { portalId: "tooltip-root", children: M ? /* @__PURE__ */ e(G, { children: c }) : c })
+    /* @__PURE__ */ e(P, { portalId: "tooltip-root", children: /* @__PURE__ */ e(G, { $visible: N, children: M ? /* @__PURE__ */ e(J, { children: c }) : c }) })
   ] });
-}, so = Y(Q);
+}, uo = Y(V);
 export {
-  so as default
+  uo as default
 };
 //# sourceMappingURL=arrow-tooltip.js.map