@cuemath/leap 3.2.31 → 3.2.32-m

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

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

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

@@ -0,0 +1,36 @@
+import n, { css as e } from "styled-components";
+import { effectAnimations as a } from "./effects.js";
+const p = n.div`
+  position: relative;
+  width: 100vw;
+  height: 100vh;
+  background: transparent;
+  pointer-events: none;
+`, h = n.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`};
+
+  visibility: hidden;
+  animation-fill-mode: both;
+
+  ${({ effect: i, duration: $, delay: s = 0, fromX: t, fromY: o }) => e`
+    ${a[i]($)}
+    animation-delay: ${s}ms;
+
+    ${t && o && e`
+      --from-x: ${t};
+      --from-y: ${o};
+    `}
+  `}
+`;
+export {
+  p 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  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,IAKpC,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,55 @@
+import { jsx as s, Fragment as E } from "react/jsx-runtime";
+import { memo as u, useState as f, useEffect as d } from "react";
+import F from "../../ui/dot-lottie-animations/dot-lottie-animation.js";
+import { preloadLottieFile as g } 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 = u(({ url: t, sticker: o, size: a }) => {
+  const [i, m] = f(), [n, e] = f(!1);
+  return d(() => {
+    let r = !0;
+    if (t)
+      return g(t).then((c) => {
+        r && (c ? m(c) : e(!0));
+      }).catch(() => {
+        r && e(!0);
+      }), () => {
+        r = !1;
+      };
+  }, [t]), !t || n || !i ? /* @__PURE__ */ s(E, { children: o }) : /* @__PURE__ */ s(F, { data: i, width: a, height: a, onError: () => e(!0) });
+}), $ = ({ stickers: t, effect: o, count: a, duration: i }) => {
+  const [m, n] = f([]);
+  return d(() => {
+    const e = y({
+      count: a,
+      effect: o,
+      stickers: t,
+      minSize: 32,
+      maxSize: 48
+    });
+    n(e);
+    const r = setTimeout(() => n([]), i);
+    return () => clearTimeout(r);
+  }, [t, o, a, i]), /* @__PURE__ */ s(z, { children: m.map((e, r) => {
+    const { id: c, sticker: h, lottie: k, x: p, y: S, size: l, fromX: D, fromY: x } = e;
+    return /* @__PURE__ */ s(
+      L,
+      {
+        effect: o,
+        duration: i,
+        delay: 500,
+        fromX: D,
+        fromY: x,
+        x: p,
+        y: S,
+        size: l,
+        children: /* @__PURE__ */ s(T, { url: k, sticker: h, size: l })
+      },
+      `${c}-${r}`
+    );
+  }) });
+}, W = u($);
+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\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 data={data} width={size} height={size} onError={() => setFailed(true)} />\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: 32,\n      maxSize: 48,\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","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;AA0B1C,SAxBAG,EAAU,MAAM;AACd,QAAIC,IAAY;AAEhB,QAAKT;AAEa,aAAAU,EAAAV,CAAG,EAClB,KAAK,CAAUW,MAAA;AACd,QAAIF,MACEE,IACFP,EAAQO,CAAM,IAEdJ,EAAU,EAAI;AAAA,MAElB,CACD,EACA,MAAM,MAAM;AACP,QAAAE,OAAqB,EAAI;AAAA,MAAA,CAC9B,GAEI,MAAM;AACC,QAAAA,IAAA;AAAA,MAAA;AAAA,EACd,GACC,CAACT,CAAG,CAAC,GAEJ,CAACA,KAAOM,KAAU,CAACH,2BACX,UAAQF,EAAA,CAAA,IAIlB,gBAAAW,EAACC,GAAmB,EAAA,MAAAV,GAAY,OAAOD,GAAM,QAAQA,GAAM,SAAS,MAAMK,EAAU,EAAI,EAAG,CAAA;AAE/F,CAAC,GAEKO,IAA4C,CAAC,EAAE,UAAAC,GAAU,QAAAC,GAAQ,OAAAC,GAAO,UAAAC,QAAe;AAC3F,QAAM,CAACC,GAAcC,CAAe,IAAIf,EAAiD,CAAE,CAAA;AAE3F,SAAAG,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,CAACrB,GAAoBsB,MAAM;AACrC,UAAA,EAAE,IAAAC,GAAI,SAAAzB,GAAS,QAAA0B,GAAQ,GAAAC,GAAG,GAAAC,GAAG,MAAA3B,GAAM,OAAA4B,GAAO,OAAAC,EAAU,IAAA5B;AAGxD,WAAA,gBAAAS;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,MAAA3B;AAAA,QAEA,UAAC,gBAAAU,EAAAd,GAAA,EAAoB,KAAK6B,GAAQ,SAAA1B,GAAkB,MAAAC,GAAY;AAAA,MAAA;AAAA,MAV3D,GAAGwB,CAAE,IAAID,CAAC;AAAA,IAAA;AAAA,EAapB,CAAA,EACH,CAAA;AAEJ,GAEeQ,IAAAlC,EAAKe,CAAe;"}

package/dist/features/trial-session/comps/learning-plan/index.js

@@ -1,6 +1,6 @@
 import { jsx as t, jsxs as N, Fragment as O } from "react/jsx-runtime";
 import w from "../../../../node_modules/lodash.throttle/index.js";
-import { useRef as g, useCallback as i, useMemo as F, useEffect as u } from "react";
+import { useRef as g, useCallback as l, useMemo as F, useEffect as h } from "react";
 import j from "../../../chapters-v2/chapter-details/chapter-details.js";
 import { useGetChapterData as G } from "../../../chapters/api/chapter.js";
 import H from "../../../milestone/milestone-list-container/milestone-list-container.js";
@@ -12,9 +12,9 @@ import { useTrialSessionContext as W } from "../../context/use-trial-session-con
 import { Container as q, Wrapper as z, ChapterWrapper as V } from "./learning-plan-styled.js";
 import { useLearningPlanScrollSync as J } from "./use-learning-plan-scroll-sync.js";
 const ae = () => {
-  const { trialHomeData: L, studentId: n, formData: y, isTeacher: r, updateSlideConfig: l } = W(), {
+  const { trialHomeData: L, studentId: n, formData: y, isTeacher: r, updateSlideConfig: i } = W(), {
     demo_info: { student_classroom_id: T, stream: I }
-  } = L || {}, { name: D = "", chapterId: c } = y || {}, o = g(null), a = g([]), h = g(!1), {
+  } = L || {}, { name: D = "", chapterId: c } = y || {}, o = g(null), a = g([]), u = g(!1), {
     publishScrollEvents: d,
     closeChannel: E,
     scrollPoints: s
@@ -24,7 +24,7 @@ const ae = () => {
     isProcessing: R,
     isProcessingFailed: $,
     error: f
-  } = G(), C = i(() => {
+  } = G(), C = l(() => {
     c && n && P(c, void 0, {
       studentId: n
     }).then(() => {
@@ -34,39 +34,39 @@ const ae = () => {
         behavior: "smooth"
       });
     });
-  }, [P, n, c]), b = i(
+  }, [P, n, c]), b = l(
     (e) => {
-      l({
+      i({
         chapterId: e.id
       });
     },
-    [l]
-  ), x = i(() => {
-    l({
+    [i]
+  ), x = l(() => {
+    i({
       chapterId: void 0
     });
-  }, [l]), v = i(() => {
-    a.current.length === 0 || h.current || (h.current = !0, d && d({
+  }, [i]), v = l(() => {
+    a.current.length === 0 || u.current || (u.current = !0, d && d({
       eventName: "TRIAL_SESSION_GOAL_PLAN_SCROLL",
       eventPayload: {
         scrollPoints: a.current
       }
-    }), a.current = [], h.current = !1);
-  }, [d]), A = F(() => w(v, 500), [v]), S = i(() => {
+    }), a.current = [], u.current = !1);
+  }, [d]), A = F(() => w(v, 500), [v]), S = l(() => {
     var p;
     const e = ((p = o.current) == null ? void 0 : p.scrollTop) || 0;
     a.current.push(e), A();
   }, [A]);
-  return u(() => {
+  return h(() => {
     C();
-  }, [C]), u(() => {
+  }, [C]), h(() => {
     if (o.current && (m && r || r)) {
       const e = o.current;
       return e.addEventListener("scroll", S), () => {
         e && e.removeEventListener("scroll", S);
       };
     }
-  }, [r, m, S]), u(() => {
+  }, [r, m, S]), h(() => {
     const e = o.current;
     if (s && Array.isArray(s) && !r && e) {
       const p = Math.floor(
@@ -77,7 +77,7 @@ const ae = () => {
         behavior: "smooth"
       });
     }
-  }, [s, r]), u(() => () => {
+  }, [s, r]), h(() => () => {
     E();
   }, [E]), R ? /* @__PURE__ */ t(B, { height: "100%" }) : $ ? /* @__PURE__ */ N(X, { $height: "100%", $flexGapX: 1.5, $alignItems: "center", $justifyContent: "center", children: [
     /* @__PURE__ */ t(U, { $renderAs: "h6", children: (f == null ? void 0 : f.message) || "Oops! Something went wrong." }),
@@ -116,8 +116,7 @@ const ae = () => {
           studentClassroomId: T,
           milestoneType: "DRAFT",
           onChapterClick: b,
-          courseStream: I,
-          isTrialSession: !0
+          courseStream: I
         }
       )
     }

package/dist/features/trial-session/comps/learning-plan/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../src/features/trial-session/comps/learning-plan/index.tsx"],"sourcesContent":["import type { IChapterDataProps } from '../../../chapters/chapter/chapter-types';\n\nimport throttle from 'lodash.throttle';\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport ChapterDetails from '../../../chapters-v2/chapter-details/chapter-details';\nimport { useGetChapterData } from '../../../chapters/api/chapter';\nimport MilestoneList from '../../../milestone/milestone-list-container/milestone-list-container';\nimport Button from '../../../ui/buttons/button/button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport AppLoader from '../../../ui/loader/app-loader/app-loader';\nimport Text from '../../../ui/text/text';\nimport { useTrialSessionContext } from '../../context/use-trial-session-context';\nimport * as Styled from './learning-plan-styled';\nimport { useLearningPlanScrollSync } from './use-learning-plan-scroll-sync';\n\nconst LearningPlan: React.FC = () => {\n  const { trialHomeData, studentId, formData, isTeacher, updateSlideConfig } =\n    useTrialSessionContext();\n  const {\n    demo_info: { student_classroom_id: studentClassroomId, stream },\n  } = trialHomeData || {};\n  const { name = '', chapterId } = formData || {};\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const scrollPointsRef = useRef<number[]>([]);\n  const isSendingScrollPointsRef = useRef(false);\n\n  const {\n    publishScrollEvents,\n    closeChannel,\n    scrollPoints: receivedScrollPoints,\n  } = useLearningPlanScrollSync(studentClassroomId);\n\n  const {\n    get: getChapterData,\n    data: chapterData,\n    isProcessing,\n    isProcessingFailed,\n    error,\n  } = useGetChapterData();\n\n  const fetchChapter = useCallback(() => {\n    if (chapterId && studentId) {\n      getChapterData(chapterId, undefined, {\n        studentId,\n      }).then(() => {\n        const scrollElement = containerRef.current;\n\n        scrollElement?.scrollTo({\n          top: 0,\n          behavior: 'smooth',\n        });\n      });\n    }\n  }, [getChapterData, studentId, chapterId]);\n\n  const handleOnChapterClick = useCallback(\n    (chapter: IChapterDataProps) => {\n      updateSlideConfig({\n        chapterId: chapter.id,\n      });\n    },\n    [updateSlideConfig],\n  );\n\n  const handleOnBackIconClick = useCallback(() => {\n    updateSlideConfig({\n      chapterId: undefined,\n    });\n  }, [updateSlideConfig]);\n\n  const sendScrollPoints = useCallback(() => {\n    if (scrollPointsRef.current.length === 0 || isSendingScrollPointsRef.current) return;\n\n    isSendingScrollPointsRef.current = true;\n\n    if (publishScrollEvents) {\n      publishScrollEvents({\n        eventName: 'TRIAL_SESSION_GOAL_PLAN_SCROLL',\n        eventPayload: {\n          scrollPoints: scrollPointsRef.current,\n        },\n      });\n    }\n\n    scrollPointsRef.current = [];\n    isSendingScrollPointsRef.current = false;\n  }, [publishScrollEvents]);\n\n  const throttleSend = useMemo(() => throttle(sendScrollPoints, 500), [sendScrollPoints]);\n\n  const handleScroll = useCallback(() => {\n    const scrollPoint = containerRef.current?.scrollTop || 0;\n\n    scrollPointsRef.current.push(scrollPoint);\n\n    throttleSend();\n  }, [throttleSend]);\n\n  useEffect(() => {\n    fetchChapter();\n  }, [fetchChapter]);\n\n  useEffect(() => {\n    if (containerRef.current) {\n      if ((chapterData && isTeacher) || isTeacher) {\n        const scrollElement = containerRef.current;\n\n        scrollElement.addEventListener('scroll', handleScroll);\n\n        return () => {\n          if (scrollElement) {\n            scrollElement.removeEventListener('scroll', handleScroll);\n          }\n        };\n      }\n    }\n  }, [isTeacher, chapterData, handleScroll]);\n\n  useEffect(() => {\n    const scrollElement = containerRef.current;\n\n    if (\n      receivedScrollPoints &&\n      Array.isArray(receivedScrollPoints) &&\n      !isTeacher &&\n      scrollElement\n    ) {\n      const averageScroll = Math.floor(\n        receivedScrollPoints.reduce((a, b) => a + b, 0) / receivedScrollPoints.length,\n      );\n\n      scrollElement.scrollTo({\n        top: averageScroll,\n        behavior: 'smooth',\n      });\n    }\n  }, [receivedScrollPoints, isTeacher]);\n\n  useEffect(() => {\n    return () => {\n      closeChannel();\n    };\n  }, [closeChannel]);\n\n  if (isProcessing) {\n    return <AppLoader height=\"100%\" />;\n  }\n\n  if (isProcessingFailed) {\n    return (\n      <FlexView $height=\"100%\" $flexGapX={1.5} $alignItems=\"center\" $justifyContent=\"center\">\n        <Text $renderAs=\"h6\">{error?.message || 'Oops! Something went wrong.'}</Text>\n        <Button\n          widthX={14}\n          size=\"small\"\n          shape=\"square\"\n          renderAs=\"primary\"\n          label=\"Try again\"\n          onClick={fetchChapter}\n        />\n      </FlexView>\n    );\n  }\n\n  return (\n    <Styled.Container ref={containerRef} $isScrollable={isTeacher}>\n      <Styled.Wrapper\n        $clickable={isTeacher}\n        $gutterX={2}\n        $isScrollable={isTeacher}\n        id=\"milestone-list-element-container\"\n      >\n        {chapterId && chapterData ? (\n          <>\n            <Styled.ChapterWrapper>\n              <ChapterDetails\n                userChapterId={chapterData.id}\n                studentId={studentId}\n                userType={isTeacher ? 'TEACHER' : 'STUDENT'}\n                onExit={handleOnBackIconClick}\n              />\n            </Styled.ChapterWrapper>\n          </>\n        ) : (\n          <MilestoneList\n            userType={isTeacher ? 'TEACHER' : 'STUDENT'}\n            studentName={name}\n            studentId={studentId}\n            studentClassroomId={studentClassroomId}\n            milestoneType=\"DRAFT\"\n            onChapterClick={handleOnChapterClick}\n            courseStream={stream}\n            isTrialSession\n          />\n        )}\n      </Styled.Wrapper>\n    </Styled.Container>\n  );\n};\n\nexport default LearningPlan;\n"],"names":["LearningPlan","trialHomeData","studentId","formData","isTeacher","updateSlideConfig","useTrialSessionContext","studentClassroomId","stream","name","chapterId","containerRef","useRef","scrollPointsRef","isSendingScrollPointsRef","publishScrollEvents","closeChannel","receivedScrollPoints","useLearningPlanScrollSync","getChapterData","chapterData","isProcessing","isProcessingFailed","error","useGetChapterData","fetchChapter","useCallback","scrollElement","handleOnChapterClick","chapter","handleOnBackIconClick","sendScrollPoints","throttleSend","useMemo","throttle","handleScroll","scrollPoint","_a","useEffect","averageScroll","a","b","jsx","AppLoader","jsxs","FlexView","Text","Button","Styled.Container","Styled.Wrapper","Fragment","Styled.ChapterWrapper","ChapterDetails","MilestoneList"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../../src/features/trial-session/comps/learning-plan/index.tsx"],"sourcesContent":["import type { IChapterDataProps } from '../../../chapters/chapter/chapter-types';\n\nimport throttle from 'lodash.throttle';\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport ChapterDetails from '../../../chapters-v2/chapter-details/chapter-details';\nimport { useGetChapterData } from '../../../chapters/api/chapter';\nimport MilestoneList from '../../../milestone/milestone-list-container/milestone-list-container';\nimport Button from '../../../ui/buttons/button/button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport AppLoader from '../../../ui/loader/app-loader/app-loader';\nimport Text from '../../../ui/text/text';\nimport { useTrialSessionContext } from '../../context/use-trial-session-context';\nimport * as Styled from './learning-plan-styled';\nimport { useLearningPlanScrollSync } from './use-learning-plan-scroll-sync';\n\nconst LearningPlan: React.FC = () => {\n  const { trialHomeData, studentId, formData, isTeacher, updateSlideConfig } =\n    useTrialSessionContext();\n  const {\n    demo_info: { student_classroom_id: studentClassroomId, stream },\n  } = trialHomeData || {};\n  const { name = '', chapterId } = formData || {};\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const scrollPointsRef = useRef<number[]>([]);\n  const isSendingScrollPointsRef = useRef(false);\n\n  const {\n    publishScrollEvents,\n    closeChannel,\n    scrollPoints: receivedScrollPoints,\n  } = useLearningPlanScrollSync(studentClassroomId);\n\n  const {\n    get: getChapterData,\n    data: chapterData,\n    isProcessing,\n    isProcessingFailed,\n    error,\n  } = useGetChapterData();\n\n  const fetchChapter = useCallback(() => {\n    if (chapterId && studentId) {\n      getChapterData(chapterId, undefined, {\n        studentId,\n      }).then(() => {\n        const scrollElement = containerRef.current;\n\n        scrollElement?.scrollTo({\n          top: 0,\n          behavior: 'smooth',\n        });\n      });\n    }\n  }, [getChapterData, studentId, chapterId]);\n\n  const handleOnChapterClick = useCallback(\n    (chapter: IChapterDataProps) => {\n      updateSlideConfig({\n        chapterId: chapter.id,\n      });\n    },\n    [updateSlideConfig],\n  );\n\n  const handleOnBackIconClick = useCallback(() => {\n    updateSlideConfig({\n      chapterId: undefined,\n    });\n  }, [updateSlideConfig]);\n\n  const sendScrollPoints = useCallback(() => {\n    if (scrollPointsRef.current.length === 0 || isSendingScrollPointsRef.current) return;\n\n    isSendingScrollPointsRef.current = true;\n\n    if (publishScrollEvents) {\n      publishScrollEvents({\n        eventName: 'TRIAL_SESSION_GOAL_PLAN_SCROLL',\n        eventPayload: {\n          scrollPoints: scrollPointsRef.current,\n        },\n      });\n    }\n\n    scrollPointsRef.current = [];\n    isSendingScrollPointsRef.current = false;\n  }, [publishScrollEvents]);\n\n  const throttleSend = useMemo(() => throttle(sendScrollPoints, 500), [sendScrollPoints]);\n\n  const handleScroll = useCallback(() => {\n    const scrollPoint = containerRef.current?.scrollTop || 0;\n\n    scrollPointsRef.current.push(scrollPoint);\n\n    throttleSend();\n  }, [throttleSend]);\n\n  useEffect(() => {\n    fetchChapter();\n  }, [fetchChapter]);\n\n  useEffect(() => {\n    if (containerRef.current) {\n      if ((chapterData && isTeacher) || isTeacher) {\n        const scrollElement = containerRef.current;\n\n        scrollElement.addEventListener('scroll', handleScroll);\n\n        return () => {\n          if (scrollElement) {\n            scrollElement.removeEventListener('scroll', handleScroll);\n          }\n        };\n      }\n    }\n  }, [isTeacher, chapterData, handleScroll]);\n\n  useEffect(() => {\n    const scrollElement = containerRef.current;\n\n    if (\n      receivedScrollPoints &&\n      Array.isArray(receivedScrollPoints) &&\n      !isTeacher &&\n      scrollElement\n    ) {\n      const averageScroll = Math.floor(\n        receivedScrollPoints.reduce((a, b) => a + b, 0) / receivedScrollPoints.length,\n      );\n\n      scrollElement.scrollTo({\n        top: averageScroll,\n        behavior: 'smooth',\n      });\n    }\n  }, [receivedScrollPoints, isTeacher]);\n\n  useEffect(() => {\n    return () => {\n      closeChannel();\n    };\n  }, [closeChannel]);\n\n  if (isProcessing) {\n    return <AppLoader height=\"100%\" />;\n  }\n\n  if (isProcessingFailed) {\n    return (\n      <FlexView $height=\"100%\" $flexGapX={1.5} $alignItems=\"center\" $justifyContent=\"center\">\n        <Text $renderAs=\"h6\">{error?.message || 'Oops! Something went wrong.'}</Text>\n        <Button\n          widthX={14}\n          size=\"small\"\n          shape=\"square\"\n          renderAs=\"primary\"\n          label=\"Try again\"\n          onClick={fetchChapter}\n        />\n      </FlexView>\n    );\n  }\n\n  return (\n    <Styled.Container ref={containerRef} $isScrollable={isTeacher}>\n      <Styled.Wrapper\n        $clickable={isTeacher}\n        $gutterX={2}\n        $isScrollable={isTeacher}\n        id=\"milestone-list-element-container\"\n      >\n        {chapterId && chapterData ? (\n          <>\n            <Styled.ChapterWrapper>\n              <ChapterDetails\n                userChapterId={chapterData.id}\n                studentId={studentId}\n                userType={isTeacher ? 'TEACHER' : 'STUDENT'}\n                onExit={handleOnBackIconClick}\n              />\n            </Styled.ChapterWrapper>\n          </>\n        ) : (\n          <MilestoneList\n            userType={isTeacher ? 'TEACHER' : 'STUDENT'}\n            studentName={name}\n            studentId={studentId}\n            studentClassroomId={studentClassroomId}\n            milestoneType=\"DRAFT\"\n            onChapterClick={handleOnChapterClick}\n            courseStream={stream}\n          />\n        )}\n      </Styled.Wrapper>\n    </Styled.Container>\n  );\n};\n\nexport default LearningPlan;\n"],"names":["LearningPlan","trialHomeData","studentId","formData","isTeacher","updateSlideConfig","useTrialSessionContext","studentClassroomId","stream","name","chapterId","containerRef","useRef","scrollPointsRef","isSendingScrollPointsRef","publishScrollEvents","closeChannel","receivedScrollPoints","useLearningPlanScrollSync","getChapterData","chapterData","isProcessing","isProcessingFailed","error","useGetChapterData","fetchChapter","useCallback","scrollElement","handleOnChapterClick","chapter","handleOnBackIconClick","sendScrollPoints","throttleSend","useMemo","throttle","handleScroll","scrollPoint","_a","useEffect","averageScroll","a","b","jsx","AppLoader","jsxs","FlexView","Text","Button","Styled.Container","Styled.Wrapper","Fragment","Styled.ChapterWrapper","ChapterDetails","MilestoneList"],"mappings":"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"}

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

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

@@ -1 +1 @@
-{"version":3,"file":"arrow-tooltip.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip.tsx"],"sourcesContent":["import type {\n  IArrowTooltipProps,\n  THandleVisibleNCoOrdinatesProps,\n  TTooltipCoOrdinatesProps,\n} from './arrow-tooltip-types';\n\nimport throttle from 'lodash.throttle';\nimport { useState, type FC, useCallback, useRef, useEffect, memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport Portal from '../portal/portal';\nimport { DEFAULT_ARROW_SIZE, THROTTLE_DURATION } from './arrow-tooltip-constants';\nimport * as Styled from './arrow-tooltip-styled';\nimport { computeTooltipNewCoOrdinates } from './arrow-tooltip-util';\nimport TooltipBody from './comps/tooltip-body';\n\nconst ArrowTooltip: FC<IArrowTooltipProps> = ({\n  isAnimated,\n  alwaysVisible = false,\n  arrowColor,\n  arrowSize = DEFAULT_ARROW_SIZE,\n  arrowXCoOrdinates,\n  arrowYCoOrdinates,\n  backgroundColor,\n  borderColor,\n  children,\n  hidden,\n  position,\n  renderAs,\n  textVariant,\n  tooltipItem,\n  tooltipOffset,\n  tooltipXCoOrdinates,\n  tooltipYCoOrdinates,\n  width,\n  widthX,\n  zIndex,\n  parentWidth,\n  isBlocking = false,\n}) => {\n  const tooltipWrapperRef = useRef<HTMLDivElement>(null);\n  const [visible, setVisible] = useState(alwaysVisible);\n  const [tooltipCoOrdinates, setTooltipCoOrdinates] = useState<TTooltipCoOrdinatesProps | null>(\n    null,\n  );\n\n  const handleVisibleNCoOrdinates: THandleVisibleNCoOrdinatesProps = useCallback(\n    (newCoOrdinates, visibility) => {\n      setTooltipCoOrdinates(newCoOrdinates);\n      setVisible(visibility);\n    },\n    [],\n  );\n\n  const handleVisibility = useCallback(() => {\n    if (hidden || alwaysVisible) {\n      return null;\n    }\n\n    handleVisibleNCoOrdinates(null, false);\n\n    return;\n  }, [alwaysVisible, handleVisibleNCoOrdinates, hidden]);\n\n  const handleOnMouseEnter = throttle(() => {\n    const { current } = tooltipWrapperRef;\n\n    if (hidden || !current) return null;\n\n    const boundingClientRect = current.children[0]?.getBoundingClientRect();\n    const newCoOrdinates = boundingClientRect\n      ? computeTooltipNewCoOrdinates(position, boundingClientRect)\n      : null;\n\n    handleVisibleNCoOrdinates(newCoOrdinates, true);\n\n    return null;\n  }, THROTTLE_DURATION);\n\n  useEffect(() => {\n    if (!alwaysVisible || hidden) return;\n\n    window.addEventListener('scroll', handleOnMouseEnter, true);\n    window.addEventListener('resize', handleOnMouseEnter);\n\n    return () => {\n      window.removeEventListener('scroll', handleOnMouseEnter, true);\n      window.removeEventListener('resize', handleOnMouseEnter);\n    };\n  }, [alwaysVisible, hidden, position, handleOnMouseEnter]);\n\n  useEffect(() => {\n    if (hidden) {\n      setVisible(false);\n    }\n\n    if (alwaysVisible) {\n      handleOnMouseEnter();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [alwaysVisible, hidden]);\n\n  const tooltipContent = (\n    <TooltipBody\n      $arrowSize={arrowSize}\n      $arrowXCoOrdinates={arrowXCoOrdinates}\n      $arrowYCoOrdinates={arrowYCoOrdinates}\n      $position={position}\n      $renderAs={renderAs}\n      $tooltipCoOrdinates={tooltipCoOrdinates}\n      $tooltipOffset={tooltipOffset}\n      $tooltipXCoOrdinates={tooltipXCoOrdinates}\n      $tooltipYCoOrdinates={tooltipYCoOrdinates}\n      $zIndex={zIndex}\n      $backgroundColor={backgroundColor}\n      $arrowColor={arrowColor}\n      $borderColor={borderColor}\n      $isAnimated={isAnimated}\n      $width={width}\n      $widthX={widthX}\n      textVariant={textVariant || 'body3'}\n    >\n      {tooltipItem}\n    </TooltipBody>\n  );\n\n  return (\n    <>\n      <FlexView\n        $width={parentWidth || 'fit-content'}\n        ref={tooltipWrapperRef}\n        onMouseEnter={handleOnMouseEnter}\n        onMouseLeave={handleVisibility}\n      >\n        <FlexView>{children}</FlexView>\n      </FlexView>\n\n      {visible && (\n        <Portal portalId=\"tooltip-root\">\n          {isBlocking ? (\n            <Styled.BackgroundOverlay>{tooltipContent}</Styled.BackgroundOverlay>\n          ) : (\n            tooltipContent\n          )}\n        </Portal>\n      )}\n    </>\n  );\n};\n\nexport default memo(ArrowTooltip);\n"],"names":["ArrowTooltip","isAnimated","alwaysVisible","arrowColor","arrowSize","DEFAULT_ARROW_SIZE","arrowXCoOrdinates","arrowYCoOrdinates","backgroundColor","borderColor","children","hidden","position","renderAs","textVariant","tooltipItem","tooltipOffset","tooltipXCoOrdinates","tooltipYCoOrdinates","width","widthX","zIndex","parentWidth","isBlocking","tooltipWrapperRef","useRef","visible","setVisible","useState","tooltipCoOrdinates","setTooltipCoOrdinates","handleVisibleNCoOrdinates","useCallback","newCoOrdinates","visibility","handleVisibility","handleOnMouseEnter","throttle","current","boundingClientRect","_a","computeTooltipNewCoOrdinates","THROTTLE_DURATION","useEffect","tooltipContent","jsx","TooltipBody","jsxs","Fragment","FlexView","Portal","Styled.BackgroundOverlay","ArrowTooltip$1","memo"],"mappings":"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"}
+{"version":3,"file":"arrow-tooltip.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip.tsx"],"sourcesContent":["import type {\n  IArrowTooltipProps,\n  THandleVisibleNCoOrdinatesProps,\n  TTooltipCoOrdinatesProps,\n} from './arrow-tooltip-types';\n\nimport throttle from 'lodash.throttle';\nimport { useState, type FC, useCallback, useRef, useEffect, memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport Portal from '../portal/portal';\nimport { DEFAULT_ARROW_SIZE, THROTTLE_DURATION } from './arrow-tooltip-constants';\nimport * as Styled from './arrow-tooltip-styled';\nimport { computeTooltipNewCoOrdinates } from './arrow-tooltip-util';\nimport TooltipBody from './comps/tooltip-body';\n\nconst ArrowTooltip: FC<IArrowTooltipProps> = ({\n  isAnimated,\n  alwaysVisible = false,\n  arrowColor,\n  arrowSize = DEFAULT_ARROW_SIZE,\n  arrowXCoOrdinates,\n  arrowYCoOrdinates,\n  backgroundColor,\n  borderColor,\n  children,\n  hidden,\n  position,\n  renderAs,\n  textVariant,\n  tooltipItem,\n  tooltipOffset,\n  tooltipXCoOrdinates,\n  tooltipYCoOrdinates,\n  width,\n  widthX,\n  zIndex,\n  parentWidth,\n  isBlocking = false,\n}) => {\n  const tooltipWrapperRef = useRef<HTMLDivElement>(null);\n  const [visible, setVisible] = useState(alwaysVisible);\n  const [tooltipCoOrdinates, setTooltipCoOrdinates] = useState<TTooltipCoOrdinatesProps | null>(\n    null,\n  );\n\n  const handleVisibleNCoOrdinates: THandleVisibleNCoOrdinatesProps = useCallback(\n    (newCoOrdinates, visibility) => {\n      setTooltipCoOrdinates(newCoOrdinates);\n      setVisible(visibility);\n    },\n    [],\n  );\n\n  const handleVisibility = useCallback(() => {\n    if (hidden || alwaysVisible) {\n      return null;\n    }\n\n    handleVisibleNCoOrdinates(null, false);\n\n    return;\n  }, [alwaysVisible, handleVisibleNCoOrdinates, hidden]);\n\n  const handleOnMouseEnter = throttle(() => {\n    const { current } = tooltipWrapperRef;\n\n    if (hidden || !current) return null;\n\n    const boundingClientRect = current.children[0]?.getBoundingClientRect();\n    const newCoOrdinates = boundingClientRect\n      ? computeTooltipNewCoOrdinates(position, boundingClientRect)\n      : null;\n\n    handleVisibleNCoOrdinates(newCoOrdinates, true);\n\n    return null;\n  }, THROTTLE_DURATION);\n\n  useEffect(() => {\n    if (!alwaysVisible || hidden) return;\n\n    window.addEventListener('scroll', handleOnMouseEnter, true);\n    window.addEventListener('resize', handleOnMouseEnter);\n\n    return () => {\n      window.removeEventListener('scroll', handleOnMouseEnter, true);\n      window.removeEventListener('resize', handleOnMouseEnter);\n    };\n  }, [alwaysVisible, hidden, position, handleOnMouseEnter]);\n\n  useEffect(() => {\n    if (hidden) {\n      setVisible(false);\n    }\n\n    if (alwaysVisible) {\n      handleOnMouseEnter();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [alwaysVisible, hidden]);\n\n  const tooltipContent = (\n    <TooltipBody\n      $arrowSize={arrowSize}\n      $arrowXCoOrdinates={arrowXCoOrdinates}\n      $arrowYCoOrdinates={arrowYCoOrdinates}\n      $position={position}\n      $renderAs={renderAs}\n      $tooltipCoOrdinates={tooltipCoOrdinates}\n      $tooltipOffset={tooltipOffset}\n      $tooltipXCoOrdinates={tooltipXCoOrdinates}\n      $tooltipYCoOrdinates={tooltipYCoOrdinates}\n      $zIndex={zIndex}\n      $backgroundColor={backgroundColor}\n      $arrowColor={arrowColor}\n      $borderColor={borderColor}\n      $isAnimated={isAnimated}\n      $width={width}\n      $widthX={widthX}\n      textVariant={textVariant || 'body3'}\n    >\n      {tooltipItem}\n    </TooltipBody>\n  );\n\n  return (\n    <>\n      <FlexView\n        $width={parentWidth || 'fit-content'}\n        ref={tooltipWrapperRef}\n        onMouseEnter={handleOnMouseEnter}\n        onMouseLeave={handleVisibility}\n      >\n        <FlexView>{children}</FlexView>\n      </FlexView>\n\n      <Portal portalId=\"tooltip-root\">\n        <Styled.TooltipWrapper $visible={visible}>\n          {isBlocking ? (\n            <Styled.BackgroundOverlay>{tooltipContent}</Styled.BackgroundOverlay>\n          ) : (\n            tooltipContent\n          )}\n        </Styled.TooltipWrapper>\n      </Portal>\n    </>\n  );\n};\n\nexport default memo(ArrowTooltip);\n"],"names":["ArrowTooltip","isAnimated","alwaysVisible","arrowColor","arrowSize","DEFAULT_ARROW_SIZE","arrowXCoOrdinates","arrowYCoOrdinates","backgroundColor","borderColor","children","hidden","position","renderAs","textVariant","tooltipItem","tooltipOffset","tooltipXCoOrdinates","tooltipYCoOrdinates","width","widthX","zIndex","parentWidth","isBlocking","tooltipWrapperRef","useRef","visible","setVisible","useState","tooltipCoOrdinates","setTooltipCoOrdinates","handleVisibleNCoOrdinates","useCallback","newCoOrdinates","visibility","handleVisibility","handleOnMouseEnter","throttle","current","boundingClientRect","_a","computeTooltipNewCoOrdinates","THROTTLE_DURATION","useEffect","tooltipContent","jsx","TooltipBody","jsxs","Fragment","FlexView","Portal","Styled.TooltipWrapper","Styled.BackgroundOverlay","ArrowTooltip$1","memo"],"mappings":"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"}