@cuemath/leap 2.8.25-rj-5 → 2.8.26

package/dist/features/circle-games/sign-up/comp/splash-screen/splash-screen.js

@@ -1,55 +1,60 @@
-import { jsxs as d, jsx as t } from "react/jsx-runtime";
-import f from "lottie-web";
-import { useRef as a, useState as o, useEffect as L } from "react";
-import { ILLUSTRATIONS as l } from "../../../../../assets/illustrations/illustrations.js";
+import { jsxs as C, jsx as e } from "react/jsx-runtime";
+import { useState as t, useRef as u, useMemo as p } from "react";
+import { ILLUSTRATIONS as s } from "../../../../../assets/illustrations/illustrations.js";
+import { LOTTIE as L } from "../../../../../assets/lottie/lottie.js";
 import S from "../../../../ui/image/image.js";
-import { SplashScreenWrapper as g, CircleLogo as w, InnerCircle as I, CuemathLogoWrapper as E, OuterCircleImage as O } from "./splash-screen-styled.js";
-const A = () => import("../../../../../assets/lotties/circle/splash-screen.json.js"), V = ({ animationCompleted: c }) => {
-  const r = a(null), [i, m] = o(!1), [n, u] = o(!1), [s, h] = o(!1), C = a(!1);
-  return L(() => {
-    let e = null;
-    return (async () => {
-      const p = (await A()).default;
-      e = f.loadAnimation({
-        container: r.current,
-        renderer: "svg",
-        loop: !1,
-        autoplay: !0,
-        animationData: p,
-        initialSegment: [0, 45]
-      }), e.addEventListener("complete", () => {
-        C.current = !0, u(!0), m(!0), setTimeout(() => {
-          h(!0), setTimeout(() => {
-            c();
+import f from "../../../../ui/lottie-animation/lottie-animation.js";
+import { SplashScreenWrapper as g, CircleLogo as I, InnerCircle as d, CuemathLogoWrapper as w, OuterCircleImage as E } from "./splash-screen-styled.js";
+const O = {
+  renderer: "svg",
+  loop: !1,
+  autoplay: !0,
+  initialSegment: [0, 45]
+}, U = ({ animationCompleted: n }) => {
+  const [r, l] = t(!1), [i, m] = t(!1), [o, a] = t(!1), c = u(!1), h = p(
+    () => ({
+      name: "complete",
+      callback: () => {
+        c.current = !0, m(!0), l(!0), setTimeout(() => {
+          a(!0), setTimeout(() => {
+            n();
           }, 500);
         }, 500);
-      });
-    })(), () => {
-      e == null || e.destroy();
-    };
-  }, []), /* @__PURE__ */ d(g, { children: [
-    /* @__PURE__ */ t(w, { ref: r }),
-    n && /* @__PURE__ */ t(I, { isVisible: n, children: i && /* @__PURE__ */ t(E, { isVisible: i, children: /* @__PURE__ */ t(
+      }
+    }),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+  return /* @__PURE__ */ C(g, { children: [
+    /* @__PURE__ */ e(I, { children: /* @__PURE__ */ e(
+      f,
+      {
+        src: L.SPLASH_SCREEN,
+        settings: O,
+        eventListener: h
+      }
+    ) }),
+    i && /* @__PURE__ */ e(d, { isVisible: i, children: r && /* @__PURE__ */ e(w, { isVisible: r, children: /* @__PURE__ */ e(
       S,
       {
-        src: l.CIRCLE_CUEMATH_LOGO,
+        src: s.CIRCLE_CUEMATH_LOGO,
         height: 56,
         width: 158.7,
         withLoader: !1
       }
     ) }) }),
-    s && /* @__PURE__ */ t(
-      O,
+    o && /* @__PURE__ */ e(
+      E,
       {
-        src: l.CIRCLE_OUTERCIRCLE_BG,
+        src: s.CIRCLE_OUTERCIRCLE_BG,
         height: "100%",
         width: "100%",
-        isVisible: s
+        isVisible: o
       }
     )
   ] });
 };
 export {
-  V as SplashScreen
+  U as SplashScreen
 };
 //# sourceMappingURL=splash-screen.js.map

package/dist/features/circle-games/sign-up/comp/splash-screen/splash-screen.js.map

@@ -1 +1 @@
-{"version":3,"file":"splash-screen.js","sources":["../../../../../../src/features/circle-games/sign-up/comp/splash-screen/splash-screen.tsx"],"sourcesContent":["import type { AnimationItem } from 'lottie-web';\n\nimport Lottie from 'lottie-web';\nimport { useEffect, useRef, useState } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../../assets/illustrations/illustrations';\nimport Image from '../../../../ui/image/image';\nimport * as S from './splash-screen-styled';\n\nconst splashScreen = () => import('../../../../../assets/lotties/circle/splash-screen.json');\n\nexport const SplashScreen = ({ animationCompleted }: { animationCompleted: () => void }) => {\n  const lottieContainer = useRef<HTMLDivElement>(null);\n  const [showCuemathLogo, setShowCuemathLogo] = useState(false);\n  const [showInnerCircle, setShowInnerCircle] = useState(false);\n  const [showOuterCircle, setShowOuterCircle] = useState(false);\n  const isCircleAnimationCompleted = useRef(false);\n\n  useEffect(() => {\n    let animation: AnimationItem | null = null;\n    const loadAnimation = async () => {\n      const animationModule = await splashScreen();\n      const animationData = animationModule.default;\n\n      animation = Lottie.loadAnimation({\n        container: lottieContainer.current as Element,\n        renderer: 'svg',\n        loop: false,\n        autoplay: true,\n        animationData: animationData,\n        initialSegment: [0, 45],\n      });\n\n      animation.addEventListener('complete', () => {\n        isCircleAnimationCompleted.current = true;\n        setShowInnerCircle(true);\n        setShowCuemathLogo(true);\n        setTimeout(() => {\n          setShowOuterCircle(true);\n          setTimeout(() => {\n            animationCompleted();\n          }, 500);\n        }, 500);\n      });\n    };\n\n    loadAnimation();\n\n    return () => {\n      animation?.destroy();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <S.SplashScreenWrapper>\n      <S.CircleLogo ref={lottieContainer} />\n\n      {showInnerCircle && (\n        <S.InnerCircle isVisible={showInnerCircle}>\n          {showCuemathLogo && (\n            <S.CuemathLogoWrapper isVisible={showCuemathLogo}>\n              <Image\n                src={ILLUSTRATIONS.CIRCLE_CUEMATH_LOGO}\n                height={56}\n                width={158.7}\n                withLoader={false}\n              />\n            </S.CuemathLogoWrapper>\n          )}\n        </S.InnerCircle>\n      )}\n\n      {showOuterCircle && (\n        <S.OuterCircleImage\n          src={ILLUSTRATIONS.CIRCLE_OUTERCIRCLE_BG}\n          height={'100%'}\n          width={'100%'}\n          isVisible={showOuterCircle}\n        />\n      )}\n    </S.SplashScreenWrapper>\n  );\n};\n"],"names":["splashScreen","SplashScreen","animationCompleted","lottieContainer","useRef","showCuemathLogo","setShowCuemathLogo","useState","showInnerCircle","setShowInnerCircle","showOuterCircle","setShowOuterCircle","isCircleAnimationCompleted","useEffect","animation","animationData","Lottie","jsxs","S.SplashScreenWrapper","jsx","S.CircleLogo","S.InnerCircle","S.CuemathLogoWrapper","Image","ILLUSTRATIONS","S.OuterCircleImage"],"mappings":";;;;;;AASA,MAAMA,IAAe,MAAM,OAAO,4DAAyD,GAE9EC,IAAe,CAAC,EAAE,oBAAAC,QAA6D;AACpF,QAAAC,IAAkBC,EAAuB,IAAI,GAC7C,CAACC,GAAiBC,CAAkB,IAAIC,EAAS,EAAK,GACtD,CAACC,GAAiBC,CAAkB,IAAIF,EAAS,EAAK,GACtD,CAACG,GAAiBC,CAAkB,IAAIJ,EAAS,EAAK,GACtDK,IAA6BR,EAAO,EAAK;AAE/C,SAAAS,EAAU,MAAM;AACd,QAAIC,IAAkC;AA2BxB,YA1BQ,YAAY;AAEhC,YAAMC,KADkB,MAAMf,KACQ;AAEtC,MAAAc,IAAYE,EAAO,cAAc;AAAA,QAC/B,WAAWb,EAAgB;AAAA,QAC3B,UAAU;AAAA,QACV,MAAM;AAAA,QACN,UAAU;AAAA,QACV,eAAAY;AAAA,QACA,gBAAgB,CAAC,GAAG,EAAE;AAAA,MAAA,CACvB,GAESD,EAAA,iBAAiB,YAAY,MAAM;AAC3C,QAAAF,EAA2B,UAAU,IACrCH,EAAmB,EAAI,GACvBH,EAAmB,EAAI,GACvB,WAAW,MAAM;AACf,UAAAK,EAAmB,EAAI,GACvB,WAAW,MAAM;AACI,YAAAT;aAClB,GAAG;AAAA,WACL,GAAG;AAAA,MAAA,CACP;AAAA,IAAA,MAKI,MAAM;AACX,MAAAY,KAAA,QAAAA,EAAW;AAAA,IAAQ;AAAA,EAGvB,GAAG,CAAE,CAAA,GAGH,gBAAAG,EAACC,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAa,KAAKjB,EAAiB,CAAA;AAAA,IAEnCK,KACC,gBAAAW,EAACE,GAAA,EAAc,WAAWb,GACvB,UAAAH,KACE,gBAAAc,EAAAG,GAAA,EAAqB,WAAWjB,GAC/B,UAAA,gBAAAc;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,KAAKC,EAAc;AAAA,QACnB,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,YAAY;AAAA,MAAA;AAAA,OAEhB,EAEJ,CAAA;AAAA,IAGDd,KACC,gBAAAS;AAAA,MAACM;AAAAA,MAAA;AAAA,QACC,KAAKD,EAAc;AAAA,QACnB,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,WAAWd;AAAA,MAAA;AAAA,IACb;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"splash-screen.js","sources":["../../../../../../src/features/circle-games/sign-up/comp/splash-screen/splash-screen.tsx"],"sourcesContent":["import type { AnimationEventName } from 'lottie-web';\n\nimport { useMemo, useRef, useState } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../../assets/illustrations/illustrations';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport Image from '../../../../ui/image/image';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport * as S from './splash-screen-styled';\n\nconst animationSettings = {\n  renderer: 'svg',\n  loop: false,\n  autoplay: true,\n  initialSegment: [0, 45],\n};\n\nexport const SplashScreen = ({ animationCompleted }: { animationCompleted: () => void }) => {\n  const [showCuemathLogo, setShowCuemathLogo] = useState(false);\n  const [showInnerCircle, setShowInnerCircle] = useState(false);\n  const [showOuterCircle, setShowOuterCircle] = useState(false);\n  const isCircleAnimationCompleted = useRef(false);\n\n  const animationEventListener = useMemo(\n    () => ({\n      name: 'complete' as AnimationEventName,\n      callback: () => {\n        isCircleAnimationCompleted.current = true;\n        setShowInnerCircle(true);\n        setShowCuemathLogo(true);\n        setTimeout(() => {\n          setShowOuterCircle(true);\n          setTimeout(() => {\n            animationCompleted();\n          }, 500);\n        }, 500);\n      },\n    }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  return (\n    <S.SplashScreenWrapper>\n      <S.CircleLogo>\n        <LottieAnimation\n          src={LOTTIE.SPLASH_SCREEN}\n          settings={animationSettings}\n          eventListener={animationEventListener}\n        />\n      </S.CircleLogo>\n\n      {showInnerCircle && (\n        <S.InnerCircle isVisible={showInnerCircle}>\n          {showCuemathLogo && (\n            <S.CuemathLogoWrapper isVisible={showCuemathLogo}>\n              <Image\n                src={ILLUSTRATIONS.CIRCLE_CUEMATH_LOGO}\n                height={56}\n                width={158.7}\n                withLoader={false}\n              />\n            </S.CuemathLogoWrapper>\n          )}\n        </S.InnerCircle>\n      )}\n\n      {showOuterCircle && (\n        <S.OuterCircleImage\n          src={ILLUSTRATIONS.CIRCLE_OUTERCIRCLE_BG}\n          height={'100%'}\n          width={'100%'}\n          isVisible={showOuterCircle}\n        />\n      )}\n    </S.SplashScreenWrapper>\n  );\n};\n"],"names":["animationSettings","SplashScreen","animationCompleted","showCuemathLogo","setShowCuemathLogo","useState","showInnerCircle","setShowInnerCircle","showOuterCircle","setShowOuterCircle","isCircleAnimationCompleted","useRef","animationEventListener","useMemo","jsxs","S.SplashScreenWrapper","jsx","S.CircleLogo","LottieAnimation","LOTTIE","S.InnerCircle","S.CuemathLogoWrapper","Image","ILLUSTRATIONS","S.OuterCircleImage"],"mappings":";;;;;;;AAUA,MAAMA,IAAoB;AAAA,EACxB,UAAU;AAAA,EACV,MAAM;AAAA,EACN,UAAU;AAAA,EACV,gBAAgB,CAAC,GAAG,EAAE;AACxB,GAEaC,IAAe,CAAC,EAAE,oBAAAC,QAA6D;AAC1F,QAAM,CAACC,GAAiBC,CAAkB,IAAIC,EAAS,EAAK,GACtD,CAACC,GAAiBC,CAAkB,IAAIF,EAAS,EAAK,GACtD,CAACG,GAAiBC,CAAkB,IAAIJ,EAAS,EAAK,GACtDK,IAA6BC,EAAO,EAAK,GAEzCC,IAAyBC;AAAA,IAC7B,OAAO;AAAA,MACL,MAAM;AAAA,MACN,UAAU,MAAM;AACd,QAAAH,EAA2B,UAAU,IACrCH,EAAmB,EAAI,GACvBH,EAAmB,EAAI,GACvB,WAAW,MAAM;AACf,UAAAK,EAAmB,EAAI,GACvB,WAAW,MAAM;AACI,YAAAP;aAClB,GAAG;AAAA,WACL,GAAG;AAAA,MACR;AAAA,IAAA;AAAA;AAAA,IAGF,CAAC;AAAA,EAAA;AAID,SAAA,gBAAAY,EAACC,GAAA,EACC,UAAA;AAAA,IAAC,gBAAAC,EAAAC,GAAA,EACC,UAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,KAAKC,EAAO;AAAA,QACZ,UAAUnB;AAAA,QACV,eAAeY;AAAA,MAAA;AAAA,IAAA,GAEnB;AAAA,IAECN,KACC,gBAAAU,EAACI,GAAA,EAAc,WAAWd,GACvB,UAAAH,KACE,gBAAAa,EAAAK,GAAA,EAAqB,WAAWlB,GAC/B,UAAA,gBAAAa;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,KAAKC,EAAc;AAAA,QACnB,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,YAAY;AAAA,MAAA;AAAA,OAEhB,EAEJ,CAAA;AAAA,IAGDf,KACC,gBAAAQ;AAAA,MAACQ;AAAAA,MAAA;AAAA,QACC,KAAKD,EAAc;AAAA,QACnB,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,WAAWf;AAAA,MAAA;AAAA,IACb;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}

package/dist/features/journey/journey-id/journey-id-student.js

@@ -1,4 +1,4 @@
-var E = /* @__PURE__ */ ((R) => (R.CIRCLE_ACTIVITIES_INTRO_JOURNEY = "CIRCLE_ACTIVITIES_INTRO_JOURNEY", R.CIRCLE_LEADERBOARD_INTRO_JOURNEY = "CIRCLE_LEADERBOARD_INTRO_JOURNEY", R.CIRCLE_POINTS_REWARD_JOURNEY = "CIRCLE_POINTS_REWARD_JOURNEY", R.CIRCLE_STREAK_UPDATE_JOURNEY = "CIRCLE_STREAK_UPDATE_JOURNEY", R.CIRCLE_TUTORIAL_JOURNEY = "CIRCLE_TUTORIAL_JOURNEY", R.CIRCLE_STREAK_REDUCTION_JOURNEY = "CIRCLE_STREAK_REDUCTION_JOURNEY", R))(E || {});
+var E = /* @__PURE__ */ ((R) => (R.CIRCLE_ACTIVITIES_INTRO_JOURNEY = "CIRCLE_ACTIVITIES_INTRO_JOURNEY", R.CIRCLE_LEADERBOARD_INTRO_JOURNEY = "CIRCLE_LEADERBOARD_INTRO_JOURNEY", R.CIRCLE_POINTS_REWARD_JOURNEY = "CIRCLE_POINTS_REWARD_JOURNEY", R.CIRCLE_STREAK_UPDATE_JOURNEY = "CIRCLE_STREAK_UPDATE_JOURNEY", R.CIRCLE_TUTORIAL_JOURNEY = "CIRCLE_TUTORIAL_JOURNEY", R))(E || {});
 export {
   E as JOURNEY_ID_STUDENT
 };

package/dist/features/journey/journey-id/journey-id-student.js.map

@@ -1 +1 @@
-{"version":3,"file":"journey-id-student.js","sources":["../../../../src/features/journey/journey-id/journey-id-student.ts"],"sourcesContent":["export enum JOURNEY_ID_STUDENT {\n  CIRCLE_ACTIVITIES_INTRO_JOURNEY = 'CIRCLE_ACTIVITIES_INTRO_JOURNEY',\n  CIRCLE_LEADERBOARD_INTRO_JOURNEY = 'CIRCLE_LEADERBOARD_INTRO_JOURNEY',\n  CIRCLE_POINTS_REWARD_JOURNEY = 'CIRCLE_POINTS_REWARD_JOURNEY',\n  CIRCLE_STREAK_UPDATE_JOURNEY = 'CIRCLE_STREAK_UPDATE_JOURNEY',\n  CIRCLE_TUTORIAL_JOURNEY = 'CIRCLE_TUTORIAL_JOURNEY',\n\n  // TODO: Deprecate bottom journeys, they are not actually journeys\n  CIRCLE_STREAK_REDUCTION_JOURNEY = 'CIRCLE_STREAK_REDUCTION_JOURNEY',\n}\n"],"names":["JOURNEY_ID_STUDENT"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,kCAAkC,mCAClCA,EAAA,mCAAmC,oCACnCA,EAAA,+BAA+B,gCAC/BA,EAAA,+BAA+B,gCAC/BA,EAAA,0BAA0B,2BAG1BA,EAAA,kCAAkC,mCARxBA,IAAAA,KAAA,CAAA,CAAA;"}
+{"version":3,"file":"journey-id-student.js","sources":["../../../../src/features/journey/journey-id/journey-id-student.ts"],"sourcesContent":["export enum JOURNEY_ID_STUDENT {\n  CIRCLE_ACTIVITIES_INTRO_JOURNEY = 'CIRCLE_ACTIVITIES_INTRO_JOURNEY',\n  CIRCLE_LEADERBOARD_INTRO_JOURNEY = 'CIRCLE_LEADERBOARD_INTRO_JOURNEY',\n  CIRCLE_POINTS_REWARD_JOURNEY = 'CIRCLE_POINTS_REWARD_JOURNEY',\n  CIRCLE_STREAK_UPDATE_JOURNEY = 'CIRCLE_STREAK_UPDATE_JOURNEY',\n  CIRCLE_TUTORIAL_JOURNEY = 'CIRCLE_TUTORIAL_JOURNEY',\n}\n"],"names":["JOURNEY_ID_STUDENT"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,kCAAkC,mCAClCA,EAAA,mCAAmC,oCACnCA,EAAA,+BAA+B,gCAC/BA,EAAA,+BAA+B,gCAC/BA,EAAA,0BAA0B,2BALhBA,IAAAA,KAAA,CAAA,CAAA;"}

package/dist/features/milestone/milestone-tests/tests-creation/test-stages/difficulty-and-duration-selection/difficulty-and-duration-selection.js

@@ -7,7 +7,7 @@ import m from "../../../../../ui/text/text.js";
 import B from "../../../../create/comps/body-layout/body-layout.js";
 import { TESTS_CREATION_ANALYTICS_EVENTS as I } from "../../tests-creation-analytics-events.js";
 import { ButtonWrapper as G } from "../../tests-creation-styled.js";
-import { getRecommendedTestDuration as N, getDifficultyLevelCards as O, getTestDurationCards as P } from "../../utils/index.js";
+import { getDifficultyLevelCards as N, getTestDurationCards as O, getRecommendedTestDuration as P } from "../../utils/index.js";
 import E from "./test-radio-card/test-radio-card.js";
 const Y = S((x) => {
   var y;
@@ -37,7 +37,7 @@ const Y = S((x) => {
       typeof t == "number" ? h(t) : p(t);
     },
     [p, h]
-  ), C = ((y = r.selectedChapters) == null ? void 0 : y.length) || 0, $ = N(C), L = O(), b = P();
+  ), C = ((y = r.selectedChapters) == null ? void 0 : y.length) || 0, $ = P(C), L = N(), b = O();
   return /* @__PURE__ */ e(n, { children: /* @__PURE__ */ e(
     B,
     {

package/dist/features/milestone/milestone-tests/tests-creation/test-stages/difficulty-and-duration-selection/test-radio-card/test-card-lottie-animation.js

@@ -1,27 +1,12 @@
-import { jsx as o } from "react/jsx-runtime";
-import l from "lottie-web";
-import { memo as s, useRef as d, useEffect as u } from "react";
-import c from "../../../../../../ui/image/image.js";
-import h from "../../../../../../ui/layout/flex-view.js";
-const A = s((r) => {
-  const { lottieJSON: t, imageUrl: a, imageAlt: n, renderLottieJSON: e, lottieWidthX: m } = r, i = d(null);
-  return u(() => {
-    if (e && t) {
-      const f = l.loadAnimation({
-        name: "validated",
-        container: i.current,
-        renderer: "canvas",
-        loop: !1,
-        autoplay: !0,
-        animationData: t
-      });
-      return () => {
-        f.destroy();
-      };
-    }
-  }, [e, t]), e ? /* @__PURE__ */ o(h, { $widthX: m, $heightX: 3.9375, ref: i }) : /* @__PURE__ */ o(c, { src: a, alt: n, width: 61, height: 58, withLoader: !1 });
+import { jsx as t } from "react/jsx-runtime";
+import { memo as h } from "react";
+import n from "../../../../../../ui/image/image.js";
+import s from "../../../../../../ui/lottie-animation/lottie-animation.js";
+const p = h((i) => {
+  const { lottiePath: e, imageUrl: o, imageAlt: r, renderLottieJSON: m, lottieWidth: a } = i;
+  return m ? /* @__PURE__ */ t(s, { width: a, height: 63, src: e }) : /* @__PURE__ */ t(n, { src: o, alt: r, width: 61, height: 58, withLoader: !1 });
 });
 export {
-  A as default
+  p as default
 };
 //# sourceMappingURL=test-card-lottie-animation.js.map

package/dist/features/milestone/milestone-tests/tests-creation/test-stages/difficulty-and-duration-selection/test-radio-card/test-card-lottie-animation.js.map

@@ -1 +1 @@
-{"version":3,"file":"test-card-lottie-animation.js","sources":["../../../../../../../../src/features/milestone/milestone-tests/tests-creation/test-stages/difficulty-and-duration-selection/test-radio-card/test-card-lottie-animation.tsx"],"sourcesContent":["import type { ITestCardLottieAnimation } from './test-radio-card-types';\nimport type { FC } from 'react';\n\nimport Lottie from 'lottie-web';\nimport { memo, useEffect, useRef } from 'react';\n\nimport Image from '../../../../../../ui/image/image';\nimport FlexView from '../../../../../../ui/layout/flex-view';\n\nconst TestCardLottieAnimation: FC<ITestCardLottieAnimation> = memo(props => {\n  const { lottieJSON, imageUrl, imageAlt, renderLottieJSON, lottieWidthX } = props;\n\n  const animationContainerRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (renderLottieJSON && lottieJSON) {\n      const animation = Lottie.loadAnimation({\n        name: 'validated',\n        container: animationContainerRef.current as Element,\n        renderer: 'canvas',\n        loop: false,\n        autoplay: true,\n        animationData: lottieJSON,\n      });\n\n      return () => {\n        animation.destroy();\n      };\n    }\n  }, [renderLottieJSON, lottieJSON]);\n\n  if (!renderLottieJSON) {\n    return <Image src={imageUrl} alt={imageAlt} width={61} height={58} withLoader={false} />;\n  }\n\n  return <FlexView $widthX={lottieWidthX} $heightX={3.9375} ref={animationContainerRef} />;\n});\n\nexport default TestCardLottieAnimation;\n"],"names":["TestCardLottieAnimation","memo","props","lottieJSON","imageUrl","imageAlt","renderLottieJSON","lottieWidthX","animationContainerRef","useRef","useEffect","animation","Lottie","FlexView","jsx","Image"],"mappings":";;;;;AASM,MAAAA,IAAwDC,EAAK,CAASC,MAAA;AAC1E,QAAM,EAAE,YAAAC,GAAY,UAAAC,GAAU,UAAAC,GAAU,kBAAAC,GAAkB,cAAAC,EAAiB,IAAAL,GAErEM,IAAwBC,EAAuB,IAAI;AAmBzD,SAjBAC,EAAU,MAAM;AACd,QAAIJ,KAAoBH,GAAY;AAC5B,YAAAQ,IAAYC,EAAO,cAAc;AAAA,QACrC,MAAM;AAAA,QACN,WAAWJ,EAAsB;AAAA,QACjC,UAAU;AAAA,QACV,MAAM;AAAA,QACN,UAAU;AAAA,QACV,eAAeL;AAAA,MAAA,CAChB;AAED,aAAO,MAAM;AACX,QAAAQ,EAAU,QAAQ;AAAA,MAAA;AAAA,IAEtB;AAAA,EAAA,GACC,CAACL,GAAkBH,CAAU,CAAC,GAE5BG,sBAIGO,GAAS,EAAA,SAASN,GAAc,UAAU,QAAQ,KAAKC,EAAuB,CAAA,IAH7E,gBAAAM,EAACC,GAAM,EAAA,KAAKX,GAAU,KAAKC,GAAU,OAAO,IAAI,QAAQ,IAAI,YAAY,GAAO,CAAA;AAI1F,CAAC;"}
+{"version":3,"file":"test-card-lottie-animation.js","sources":["../../../../../../../../src/features/milestone/milestone-tests/tests-creation/test-stages/difficulty-and-duration-selection/test-radio-card/test-card-lottie-animation.tsx"],"sourcesContent":["import type { ITestCardLottieAnimation } from './test-radio-card-types';\nimport type { FC } from 'react';\n\nimport { memo } from 'react';\n\nimport Image from '../../../../../../ui/image/image';\nimport LottieAnimation from '../../../../../../ui/lottie-animation/lottie-animation';\n\nconst TestCardLottieAnimation: FC<ITestCardLottieAnimation> = memo(props => {\n  const { lottiePath, imageUrl, imageAlt, renderLottieJSON, lottieWidth } = props;\n\n  if (!renderLottieJSON) {\n    return <Image src={imageUrl} alt={imageAlt} width={61} height={58} withLoader={false} />;\n  }\n\n  return <LottieAnimation width={lottieWidth} height={63} src={lottiePath} />;\n});\n\nexport default TestCardLottieAnimation;\n"],"names":["TestCardLottieAnimation","memo","props","lottiePath","imageUrl","imageAlt","renderLottieJSON","lottieWidth","LottieAnimation","jsx","Image"],"mappings":";;;;AAQM,MAAAA,IAAwDC,EAAK,CAASC,MAAA;AAC1E,QAAM,EAAE,YAAAC,GAAY,UAAAC,GAAU,UAAAC,GAAU,kBAAAC,GAAkB,aAAAC,EAAgB,IAAAL;AAE1E,SAAKI,sBAIGE,GAAgB,EAAA,OAAOD,GAAa,QAAQ,IAAI,KAAKJ,EAAY,CAAA,IAHhE,gBAAAM,EAACC,GAAM,EAAA,KAAKN,GAAU,KAAKC,GAAU,OAAO,IAAI,QAAQ,IAAI,YAAY,GAAO,CAAA;AAI1F,CAAC;"}

package/dist/features/milestone/milestone-tests/tests-creation/test-stages/difficulty-and-duration-selection/test-radio-card/test-radio-card.js

@@ -1,9 +1,9 @@
 import { jsxs as b, jsx as o } from "react/jsx-runtime";
 import { memo as T, useState as L, useCallback as r } from "react";
-import O from "../../../../../../ui/text/text.js";
-import A from "./test-card-lottie-animation.js";
-import { TestCardWrapper as R, RecommendedTag as X } from "./test-radio-card-styled.js";
-const J = T((d) => {
+import A from "../../../../../../ui/text/text.js";
+import O from "./test-card-lottie-animation.js";
+import { TestCardWrapper as R, RecommendedTag as k } from "./test-radio-card-styled.js";
+const S = T((d) => {
   const {
     selected: s,
     title: n,
@@ -13,7 +13,7 @@ const J = T((d) => {
     isRecommended: u,
     onTestRadioCardChange: e,
     value: i,
-    lottieJSON: h,
+    lottiePath: h,
     isTestDifficultRendering: f
   } = d, [g, a] = L(!1), t = g || s, C = r(() => {
     e == null || e(i);
@@ -38,23 +38,23 @@ const J = T((d) => {
       onMouseEnter: $,
       onMouseLeave: p,
       children: [
-        /* @__PURE__ */ o(O, { $renderAs: t ? "ab2-bold" : "ab2", children: n }),
+        /* @__PURE__ */ o(A, { $renderAs: t ? "ab2-bold" : "ab2", children: n }),
         /* @__PURE__ */ o(
-          A,
+          O,
           {
             renderLottieJSON: t,
             imageUrl: c,
             imageAlt: n,
-            lottieJSON: h,
-            lottieWidthX: f ? 4.5 : 3.875
+            lottiePath: h,
+            lottieWidth: f ? 72 : 62
           }
         ),
-        u && /* @__PURE__ */ o(X, { $renderAs: "ac4-black", children: "Recommended" })
+        u && /* @__PURE__ */ o(k, { $renderAs: "ac4-black", children: "Recommended" })
       ]
     }
   );
 });
 export {
-  J as default
+  S as default
 };
 //# sourceMappingURL=test-radio-card.js.map

package/dist/features/milestone/milestone-tests/tests-creation/test-stages/difficulty-and-duration-selection/test-radio-card/test-radio-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"test-radio-card.js","sources":["../../../../../../../../src/features/milestone/milestone-tests/tests-creation/test-stages/difficulty-and-duration-selection/test-radio-card/test-radio-card.tsx"],"sourcesContent":["import type { ITestRadioCard } from './test-radio-card-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useState } from 'react';\n\nimport Text from '../../../../../../ui/text/text';\nimport TestCardLottieAnimation from './test-card-lottie-animation';\nimport * as Styled from './test-radio-card-styled';\n\nconst TestRadioCard: FC<ITestRadioCard> = memo(props => {\n  const {\n    selected,\n    title,\n    backgroundColor,\n    imageUrl,\n    widthX,\n    isRecommended,\n    onTestRadioCardChange,\n    value,\n    lottieJSON,\n    isTestDifficultRendering,\n  } = props;\n\n  const [renderLottieJSON, setRenderJSON] = useState(false);\n\n  const canHighlightCard = renderLottieJSON || selected;\n\n  const handleOnTestRadioCardChange = useCallback(() => {\n    onTestRadioCardChange?.(value);\n  }, [onTestRadioCardChange, value]);\n\n  const handleOnMouseEnter = useCallback(() => {\n    setRenderJSON(true);\n  }, []);\n\n  const handleOnMouseLeave = useCallback(() => {\n    setRenderJSON(false);\n  }, []);\n\n  return (\n    <Styled.TestCardWrapper\n      $flexDirection=\"row\"\n      $justifyContent=\"space-between\"\n      $alignItems=\"center\"\n      $gapX={1}\n      $gutterX={1}\n      $widthX={widthX}\n      $heightX={5.75}\n      $borderColor={canHighlightCard ? 'BLACK_T_87' : 'BLACK_T_38'}\n      $background={canHighlightCard ? backgroundColor : 'WHITE_1'}\n      onClick={handleOnTestRadioCardChange}\n      onMouseEnter={handleOnMouseEnter}\n      onMouseLeave={handleOnMouseLeave}\n    >\n      <Text $renderAs={canHighlightCard ? 'ab2-bold' : 'ab2'}>{title}</Text>\n\n      <TestCardLottieAnimation\n        renderLottieJSON={canHighlightCard}\n        imageUrl={imageUrl}\n        imageAlt={title}\n        lottieJSON={lottieJSON}\n        lottieWidthX={isTestDifficultRendering ? 4.5 : 3.875}\n      />\n\n      {isRecommended && (\n        <Styled.RecommendedTag $renderAs=\"ac4-black\">Recommended</Styled.RecommendedTag>\n      )}\n    </Styled.TestCardWrapper>\n  );\n});\n\nexport default TestRadioCard;\n"],"names":["TestRadioCard","memo","props","selected","title","backgroundColor","imageUrl","widthX","isRecommended","onTestRadioCardChange","value","lottieJSON","isTestDifficultRendering","renderLottieJSON","setRenderJSON","useState","canHighlightCard","handleOnTestRadioCardChange","useCallback","handleOnMouseEnter","handleOnMouseLeave","jsxs","Styled.TestCardWrapper","jsx","Text","TestCardLottieAnimation","Styled.RecommendedTag"],"mappings":";;;;;AASM,MAAAA,IAAoCC,EAAK,CAASC,MAAA;AAChD,QAAA;AAAA,IACJ,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,eAAAC;AAAA,IACA,uBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,0BAAAC;AAAA,EACE,IAAAV,GAEE,CAACW,GAAkBC,CAAa,IAAIC,EAAS,EAAK,GAElDC,IAAmBH,KAAoBV,GAEvCc,IAA8BC,EAAY,MAAM;AACpD,IAAAT,KAAA,QAAAA,EAAwBC;AAAA,EAAK,GAC5B,CAACD,GAAuBC,CAAK,CAAC,GAE3BS,IAAqBD,EAAY,MAAM;AAC3C,IAAAJ,EAAc,EAAI;AAAA,EACpB,GAAG,CAAE,CAAA,GAECM,IAAqBF,EAAY,MAAM;AAC3C,IAAAJ,EAAc,EAAK;AAAA,EACrB,GAAG,CAAE,CAAA;AAGH,SAAA,gBAAAO;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,gBAAe;AAAA,MACf,iBAAgB;AAAA,MAChB,aAAY;AAAA,MACZ,OAAO;AAAA,MACP,UAAU;AAAA,MACV,SAASf;AAAA,MACT,UAAU;AAAA,MACV,cAAcS,IAAmB,eAAe;AAAA,MAChD,aAAaA,IAAmBX,IAAkB;AAAA,MAClD,SAASY;AAAA,MACT,cAAcE;AAAA,MACd,cAAcC;AAAA,MAEd,UAAA;AAAA,QAAA,gBAAAG,EAACC,GAAK,EAAA,WAAWR,IAAmB,aAAa,OAAQ,UAAMZ,GAAA;AAAA,QAE/D,gBAAAmB;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,kBAAkBT;AAAA,YAClB,UAAAV;AAAA,YACA,UAAUF;AAAA,YACV,YAAAO;AAAA,YACA,cAAcC,IAA2B,MAAM;AAAA,UAAA;AAAA,QACjD;AAAA,QAECJ,KACE,gBAAAe,EAAAG,GAAA,EAAsB,WAAU,aAAY,UAAW,eAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIhE,CAAC;"}
+{"version":3,"file":"test-radio-card.js","sources":["../../../../../../../../src/features/milestone/milestone-tests/tests-creation/test-stages/difficulty-and-duration-selection/test-radio-card/test-radio-card.tsx"],"sourcesContent":["import type { ITestRadioCard } from './test-radio-card-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useState } from 'react';\n\nimport Text from '../../../../../../ui/text/text';\nimport TestCardLottieAnimation from './test-card-lottie-animation';\nimport * as Styled from './test-radio-card-styled';\n\nconst TestRadioCard: FC<ITestRadioCard> = memo(props => {\n  const {\n    selected,\n    title,\n    backgroundColor,\n    imageUrl,\n    widthX,\n    isRecommended,\n    onTestRadioCardChange,\n    value,\n    lottiePath,\n    isTestDifficultRendering,\n  } = props;\n\n  const [renderLottieJSON, setRenderJSON] = useState(false);\n\n  const canHighlightCard = renderLottieJSON || selected;\n\n  const handleOnTestRadioCardChange = useCallback(() => {\n    onTestRadioCardChange?.(value);\n  }, [onTestRadioCardChange, value]);\n\n  const handleOnMouseEnter = useCallback(() => {\n    setRenderJSON(true);\n  }, []);\n\n  const handleOnMouseLeave = useCallback(() => {\n    setRenderJSON(false);\n  }, []);\n\n  return (\n    <Styled.TestCardWrapper\n      $flexDirection=\"row\"\n      $justifyContent=\"space-between\"\n      $alignItems=\"center\"\n      $gapX={1}\n      $gutterX={1}\n      $widthX={widthX}\n      $heightX={5.75}\n      $borderColor={canHighlightCard ? 'BLACK_T_87' : 'BLACK_T_38'}\n      $background={canHighlightCard ? backgroundColor : 'WHITE_1'}\n      onClick={handleOnTestRadioCardChange}\n      onMouseEnter={handleOnMouseEnter}\n      onMouseLeave={handleOnMouseLeave}\n    >\n      <Text $renderAs={canHighlightCard ? 'ab2-bold' : 'ab2'}>{title}</Text>\n\n      <TestCardLottieAnimation\n        renderLottieJSON={canHighlightCard}\n        imageUrl={imageUrl}\n        imageAlt={title}\n        lottiePath={lottiePath}\n        lottieWidth={isTestDifficultRendering ? 72 : 62}\n      />\n\n      {isRecommended && (\n        <Styled.RecommendedTag $renderAs=\"ac4-black\">Recommended</Styled.RecommendedTag>\n      )}\n    </Styled.TestCardWrapper>\n  );\n});\n\nexport default TestRadioCard;\n"],"names":["TestRadioCard","memo","props","selected","title","backgroundColor","imageUrl","widthX","isRecommended","onTestRadioCardChange","value","lottiePath","isTestDifficultRendering","renderLottieJSON","setRenderJSON","useState","canHighlightCard","handleOnTestRadioCardChange","useCallback","handleOnMouseEnter","handleOnMouseLeave","jsxs","Styled.TestCardWrapper","jsx","Text","TestCardLottieAnimation","Styled.RecommendedTag"],"mappings":";;;;;AASM,MAAAA,IAAoCC,EAAK,CAASC,MAAA;AAChD,QAAA;AAAA,IACJ,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,eAAAC;AAAA,IACA,uBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,0BAAAC;AAAA,EACE,IAAAV,GAEE,CAACW,GAAkBC,CAAa,IAAIC,EAAS,EAAK,GAElDC,IAAmBH,KAAoBV,GAEvCc,IAA8BC,EAAY,MAAM;AACpD,IAAAT,KAAA,QAAAA,EAAwBC;AAAA,EAAK,GAC5B,CAACD,GAAuBC,CAAK,CAAC,GAE3BS,IAAqBD,EAAY,MAAM;AAC3C,IAAAJ,EAAc,EAAI;AAAA,EACpB,GAAG,CAAE,CAAA,GAECM,IAAqBF,EAAY,MAAM;AAC3C,IAAAJ,EAAc,EAAK;AAAA,EACrB,GAAG,CAAE,CAAA;AAGH,SAAA,gBAAAO;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,gBAAe;AAAA,MACf,iBAAgB;AAAA,MAChB,aAAY;AAAA,MACZ,OAAO;AAAA,MACP,UAAU;AAAA,MACV,SAASf;AAAA,MACT,UAAU;AAAA,MACV,cAAcS,IAAmB,eAAe;AAAA,MAChD,aAAaA,IAAmBX,IAAkB;AAAA,MAClD,SAASY;AAAA,MACT,cAAcE;AAAA,MACd,cAAcC;AAAA,MAEd,UAAA;AAAA,QAAA,gBAAAG,EAACC,GAAK,EAAA,WAAWR,IAAmB,aAAa,OAAQ,UAAMZ,GAAA;AAAA,QAE/D,gBAAAmB;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,kBAAkBT;AAAA,YAClB,UAAAV;AAAA,YACA,UAAUF;AAAA,YACV,YAAAO;AAAA,YACA,aAAaC,IAA2B,KAAK;AAAA,UAAA;AAAA,QAC/C;AAAA,QAECJ,KACE,gBAAAe,EAAAG,GAAA,EAAsB,WAAU,aAAY,UAAW,eAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIhE,CAAC;"}

package/dist/features/milestone/milestone-tests/tests-creation/utils/index.js

@@ -1,75 +1,69 @@
-import { ILLUSTRATIONS as i } from "../../../../../assets/illustrations/illustrations.js";
-import t from "../../../../../assets/lotties/tests-creation/clock_30_min.json.js";
-import l from "../../../../../assets/lotties/tests-creation/clock_45_min.json.js";
-import _ from "../../../../../assets/lotties/tests-creation/clock_60_min.json.js";
-import I from "../../../../../assets/lotties/tests-creation/clock_90_min.json.js";
-import N from "../../../../../assets/lotties/tests-creation/difficult.json.js";
-import e from "../../../../../assets/lotties/tests-creation/easy.json.js";
-import m from "../../../../../assets/lotties/tests-creation/medium.json.js";
-import { TEST_DURATION as o } from "../constants/index.js";
+import { ILLUSTRATIONS as o } from "../../../../../assets/illustrations/illustrations.js";
+import { LOTTIE as r } from "../../../../../assets/lottie/lottie.js";
+import { TEST_DURATION as t } from "../constants/index.js";
 const {
-  DURATION_30MIN_GRAY: M,
-  DURATION_45MIN_GRAY: a,
-  DURATION_60MIN_GRAY: n,
-  DURATION_90MIN_GRAY: T,
-  TEST_DIFFICULTY_EASY: u,
-  TEST_DIFFICULTY_MEDIUM: U,
-  TEST_DIFFICULTY_HARD: c
-} = i, k = (r) => r > 0 && r <= 2 ? o.MIN_30 : r > 2 && r <= 4 ? o.MIN_45 : r > 4 && r <= 6 ? o.MIN_60 : o.MIN_90, Y = () => [
+  DURATION_30MIN_GRAY: _,
+  DURATION_45MIN_GRAY: i,
+  DURATION_60MIN_GRAY: l,
+  DURATION_90MIN_GRAY: M,
+  TEST_DIFFICULTY_EASY: a,
+  TEST_DIFFICULTY_MEDIUM: N,
+  TEST_DIFFICULTY_HARD: e
+} = o, n = (I) => I > 0 && I <= 2 ? t.MIN_30 : I > 2 && I <= 4 ? t.MIN_45 : I > 4 && I <= 6 ? t.MIN_60 : t.MIN_90, u = () => [
   {
-    title: `${o.MIN_30} Min`,
-    value: o.MIN_30,
-    imageUrl: M,
-    lottieJSON: t,
+    title: `${t.MIN_30} Min`,
+    value: t.MIN_30,
+    imageUrl: _,
+    lottiePath: r.CLOCK_30MIN,
     backgroundColor: "GREEN_1"
   },
   {
-    title: `${o.MIN_45} Min`,
-    value: o.MIN_45,
-    imageUrl: a,
-    lottieJSON: l,
+    title: `${t.MIN_45} Min`,
+    value: t.MIN_45,
+    imageUrl: i,
+    lottiePath: r.CLOCK_45MIN,
     backgroundColor: "BLUE_1"
   },
   {
-    title: `${o.MIN_60} Min`,
-    value: o.MIN_60,
-    imageUrl: n,
-    lottieJSON: _,
+    title: `${t.MIN_60} Min`,
+    value: t.MIN_60,
+    imageUrl: l,
+    lottiePath: r.CLOCK_60MIN,
     backgroundColor: "YELLOW_1"
   },
   {
-    title: `${o.MIN_90} Min`,
-    value: o.MIN_90,
-    imageUrl: T,
-    lottieJSON: I,
+    title: `${t.MIN_90} Min`,
+    value: t.MIN_90,
+    imageUrl: M,
+    lottiePath: r.CLOCK_90MIN,
     backgroundColor: "ORANGE_1"
   }
-], d = () => [
+], L = () => [
   {
     title: "Easy",
-    imageUrl: u,
-    lottieJSON: e,
+    imageUrl: a,
+    lottiePath: r.EASY,
     backgroundColor: "BLUE_1",
     value: "EASY"
   },
   {
     title: "Moderate",
     value: "MODERATE",
-    lottieJSON: m,
-    imageUrl: U,
+    lottiePath: r.MEDIUM,
+    imageUrl: N,
     backgroundColor: "YELLOW_1"
   },
   {
     title: "Difficult",
     value: "DIFFICULT",
-    lottieJSON: N,
-    imageUrl: c,
+    lottiePath: r.DIFFICULT,
+    imageUrl: e,
     backgroundColor: "ORANGE_1"
   }
 ];
 export {
-  d as getDifficultyLevelCards,
-  k as getRecommendedTestDuration,
-  Y as getTestDurationCards
+  L as getDifficultyLevelCards,
+  n as getRecommendedTestDuration,
+  u as getTestDurationCards
 };
 //# sourceMappingURL=index.js.map

package/dist/features/milestone/milestone-tests/tests-creation/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../../../src/features/milestone/milestone-tests/tests-creation/utils/index.ts"],"sourcesContent":["import type { ITestDifficultyLevelCards } from '../test-stages/difficulty-and-duration-selection/difficulty-and-duration-selection-types';\nimport type { ITestRadioCard } from '../test-stages/difficulty-and-duration-selection/test-radio-card/test-radio-card-types';\n\nimport { ILLUSTRATIONS } from '../../../../../assets/illustrations/illustrations';\nimport clock30Min from '../../../../../assets/lotties/tests-creation/clock_30_min.json';\nimport clock45Min from '../../../../../assets/lotties/tests-creation/clock_45_min.json';\nimport clock60Min from '../../../../../assets/lotties/tests-creation/clock_60_min.json';\nimport clock90Min from '../../../../../assets/lotties/tests-creation/clock_90_min.json';\nimport difficult from '../../../../../assets/lotties/tests-creation/difficult.json';\nimport easy from '../../../../../assets/lotties/tests-creation/easy.json';\nimport medium from '../../../../../assets/lotties/tests-creation/medium.json';\nimport { TEST_DURATION } from '../constants';\n\nconst {\n  DURATION_30MIN_GRAY,\n  DURATION_45MIN_GRAY,\n  DURATION_60MIN_GRAY,\n  DURATION_90MIN_GRAY,\n  TEST_DIFFICULTY_EASY,\n  TEST_DIFFICULTY_MEDIUM,\n  TEST_DIFFICULTY_HARD,\n} = ILLUSTRATIONS;\n\nconst getRecommendedTestDuration = (selectedChaptersCount: number) => {\n  if (selectedChaptersCount > 0 && selectedChaptersCount <= 2) return TEST_DURATION.MIN_30;\n\n  if (selectedChaptersCount > 2 && selectedChaptersCount <= 4) return TEST_DURATION.MIN_45;\n\n  if (selectedChaptersCount > 4 && selectedChaptersCount <= 6) return TEST_DURATION.MIN_60;\n\n  return TEST_DURATION.MIN_90;\n};\n\nconst getTestDurationCards = (): ITestRadioCard[] => {\n  return [\n    {\n      title: `${TEST_DURATION.MIN_30} Min`,\n      value: TEST_DURATION.MIN_30,\n      imageUrl: DURATION_30MIN_GRAY,\n      lottieJSON: clock30Min,\n      backgroundColor: 'GREEN_1',\n    },\n    {\n      title: `${TEST_DURATION.MIN_45} Min`,\n      value: TEST_DURATION.MIN_45,\n      imageUrl: DURATION_45MIN_GRAY,\n      lottieJSON: clock45Min,\n      backgroundColor: 'BLUE_1',\n    },\n    {\n      title: `${TEST_DURATION.MIN_60} Min`,\n      value: TEST_DURATION.MIN_60,\n      imageUrl: DURATION_60MIN_GRAY,\n      lottieJSON: clock60Min,\n      backgroundColor: 'YELLOW_1',\n    },\n    {\n      title: `${TEST_DURATION.MIN_90} Min`,\n      value: TEST_DURATION.MIN_90,\n      imageUrl: DURATION_90MIN_GRAY,\n      lottieJSON: clock90Min,\n      backgroundColor: 'ORANGE_1',\n    },\n  ];\n};\n\nconst getDifficultyLevelCards = (): ITestDifficultyLevelCards[] => {\n  return [\n    {\n      title: 'Easy',\n      imageUrl: TEST_DIFFICULTY_EASY,\n      lottieJSON: easy,\n      backgroundColor: 'BLUE_1',\n      value: 'EASY',\n    },\n    {\n      title: 'Moderate',\n      value: 'MODERATE',\n      lottieJSON: medium,\n      imageUrl: TEST_DIFFICULTY_MEDIUM,\n      backgroundColor: 'YELLOW_1',\n    },\n    {\n      title: 'Difficult',\n      value: 'DIFFICULT',\n      lottieJSON: difficult,\n      imageUrl: TEST_DIFFICULTY_HARD,\n      backgroundColor: 'ORANGE_1',\n    },\n  ];\n};\n\nexport { getRecommendedTestDuration, getTestDurationCards, getDifficultyLevelCards };\n"],"names":["DURATION_30MIN_GRAY","DURATION_45MIN_GRAY","DURATION_60MIN_GRAY","DURATION_90MIN_GRAY","TEST_DIFFICULTY_EASY","TEST_DIFFICULTY_MEDIUM","TEST_DIFFICULTY_HARD","ILLUSTRATIONS","getRecommendedTestDuration","selectedChaptersCount","TEST_DURATION","getTestDurationCards","clock30Min","clock45Min","clock60Min","clock90Min","getDifficultyLevelCards","easy","medium","difficult"],"mappings":";;;;;;;;;AAaA,MAAM;AAAA,EACJ,qBAAAA;AAAA,EACA,qBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,wBAAAC;AAAA,EACA,sBAAAC;AACF,IAAIC,GAEEC,IAA6B,CAACC,MAC9BA,IAAwB,KAAKA,KAAyB,IAAUC,EAAc,SAE9ED,IAAwB,KAAKA,KAAyB,IAAUC,EAAc,SAE9ED,IAAwB,KAAKA,KAAyB,IAAUC,EAAc,SAE3EA,EAAc,QAGjBC,IAAuB,MACpB;AAAA,EACL;AAAA,IACE,OAAO,GAAGD,EAAc,MAAM;AAAA,IAC9B,OAAOA,EAAc;AAAA,IACrB,UAAUV;AAAA,IACV,YAAYY;AAAA,IACZ,iBAAiB;AAAA,EACnB;AAAA,EACA;AAAA,IACE,OAAO,GAAGF,EAAc,MAAM;AAAA,IAC9B,OAAOA,EAAc;AAAA,IACrB,UAAUT;AAAA,IACV,YAAYY;AAAA,IACZ,iBAAiB;AAAA,EACnB;AAAA,EACA;AAAA,IACE,OAAO,GAAGH,EAAc,MAAM;AAAA,IAC9B,OAAOA,EAAc;AAAA,IACrB,UAAUR;AAAA,IACV,YAAYY;AAAA,IACZ,iBAAiB;AAAA,EACnB;AAAA,EACA;AAAA,IACE,OAAO,GAAGJ,EAAc,MAAM;AAAA,IAC9B,OAAOA,EAAc;AAAA,IACrB,UAAUP;AAAA,IACV,YAAYY;AAAA,IACZ,iBAAiB;AAAA,EACnB;AAAA,GAIEC,IAA0B,MACvB;AAAA,EACL;AAAA,IACE,OAAO;AAAA,IACP,UAAUZ;AAAA,IACV,YAAYa;AAAA,IACZ,iBAAiB;AAAA,IACjB,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAYC;AAAA,IACZ,UAAUb;AAAA,IACV,iBAAiB;AAAA,EACnB;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAYc;AAAA,IACZ,UAAUb;AAAA,IACV,iBAAiB;AAAA,EACnB;AAAA;"}
+{"version":3,"file":"index.js","sources":["../../../../../../src/features/milestone/milestone-tests/tests-creation/utils/index.ts"],"sourcesContent":["import type { ITestDifficultyLevelCards } from '../test-stages/difficulty-and-duration-selection/difficulty-and-duration-selection-types';\nimport type { ITestRadioCard } from '../test-stages/difficulty-and-duration-selection/test-radio-card/test-radio-card-types';\n\nimport { ILLUSTRATIONS } from '../../../../../assets/illustrations/illustrations';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport { TEST_DURATION } from '../constants';\n\nconst {\n  DURATION_30MIN_GRAY,\n  DURATION_45MIN_GRAY,\n  DURATION_60MIN_GRAY,\n  DURATION_90MIN_GRAY,\n  TEST_DIFFICULTY_EASY,\n  TEST_DIFFICULTY_MEDIUM,\n  TEST_DIFFICULTY_HARD,\n} = ILLUSTRATIONS;\n\nconst getRecommendedTestDuration = (selectedChaptersCount: number) => {\n  if (selectedChaptersCount > 0 && selectedChaptersCount <= 2) return TEST_DURATION.MIN_30;\n\n  if (selectedChaptersCount > 2 && selectedChaptersCount <= 4) return TEST_DURATION.MIN_45;\n\n  if (selectedChaptersCount > 4 && selectedChaptersCount <= 6) return TEST_DURATION.MIN_60;\n\n  return TEST_DURATION.MIN_90;\n};\n\nconst getTestDurationCards = (): ITestRadioCard[] => {\n  return [\n    {\n      title: `${TEST_DURATION.MIN_30} Min`,\n      value: TEST_DURATION.MIN_30,\n      imageUrl: DURATION_30MIN_GRAY,\n      lottiePath: LOTTIE.CLOCK_30MIN,\n      backgroundColor: 'GREEN_1',\n    },\n    {\n      title: `${TEST_DURATION.MIN_45} Min`,\n      value: TEST_DURATION.MIN_45,\n      imageUrl: DURATION_45MIN_GRAY,\n      lottiePath: LOTTIE.CLOCK_45MIN,\n      backgroundColor: 'BLUE_1',\n    },\n    {\n      title: `${TEST_DURATION.MIN_60} Min`,\n      value: TEST_DURATION.MIN_60,\n      imageUrl: DURATION_60MIN_GRAY,\n      lottiePath: LOTTIE.CLOCK_60MIN,\n      backgroundColor: 'YELLOW_1',\n    },\n    {\n      title: `${TEST_DURATION.MIN_90} Min`,\n      value: TEST_DURATION.MIN_90,\n      imageUrl: DURATION_90MIN_GRAY,\n      lottiePath: LOTTIE.CLOCK_90MIN,\n      backgroundColor: 'ORANGE_1',\n    },\n  ];\n};\n\nconst getDifficultyLevelCards = (): ITestDifficultyLevelCards[] => {\n  return [\n    {\n      title: 'Easy',\n      imageUrl: TEST_DIFFICULTY_EASY,\n      lottiePath: LOTTIE.EASY,\n      backgroundColor: 'BLUE_1',\n      value: 'EASY',\n    },\n    {\n      title: 'Moderate',\n      value: 'MODERATE',\n      lottiePath: LOTTIE.MEDIUM,\n      imageUrl: TEST_DIFFICULTY_MEDIUM,\n      backgroundColor: 'YELLOW_1',\n    },\n    {\n      title: 'Difficult',\n      value: 'DIFFICULT',\n      lottiePath: LOTTIE.DIFFICULT,\n      imageUrl: TEST_DIFFICULTY_HARD,\n      backgroundColor: 'ORANGE_1',\n    },\n  ];\n};\n\nexport { getRecommendedTestDuration, getTestDurationCards, getDifficultyLevelCards };\n"],"names":["DURATION_30MIN_GRAY","DURATION_45MIN_GRAY","DURATION_60MIN_GRAY","DURATION_90MIN_GRAY","TEST_DIFFICULTY_EASY","TEST_DIFFICULTY_MEDIUM","TEST_DIFFICULTY_HARD","ILLUSTRATIONS","getRecommendedTestDuration","selectedChaptersCount","TEST_DURATION","getTestDurationCards","LOTTIE","getDifficultyLevelCards"],"mappings":";;;AAOA,MAAM;AAAA,EACJ,qBAAAA;AAAA,EACA,qBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,wBAAAC;AAAA,EACA,sBAAAC;AACF,IAAIC,GAEEC,IAA6B,CAACC,MAC9BA,IAAwB,KAAKA,KAAyB,IAAUC,EAAc,SAE9ED,IAAwB,KAAKA,KAAyB,IAAUC,EAAc,SAE9ED,IAAwB,KAAKA,KAAyB,IAAUC,EAAc,SAE3EA,EAAc,QAGjBC,IAAuB,MACpB;AAAA,EACL;AAAA,IACE,OAAO,GAAGD,EAAc,MAAM;AAAA,IAC9B,OAAOA,EAAc;AAAA,IACrB,UAAUV;AAAA,IACV,YAAYY,EAAO;AAAA,IACnB,iBAAiB;AAAA,EACnB;AAAA,EACA;AAAA,IACE,OAAO,GAAGF,EAAc,MAAM;AAAA,IAC9B,OAAOA,EAAc;AAAA,IACrB,UAAUT;AAAA,IACV,YAAYW,EAAO;AAAA,IACnB,iBAAiB;AAAA,EACnB;AAAA,EACA;AAAA,IACE,OAAO,GAAGF,EAAc,MAAM;AAAA,IAC9B,OAAOA,EAAc;AAAA,IACrB,UAAUR;AAAA,IACV,YAAYU,EAAO;AAAA,IACnB,iBAAiB;AAAA,EACnB;AAAA,EACA;AAAA,IACE,OAAO,GAAGF,EAAc,MAAM;AAAA,IAC9B,OAAOA,EAAc;AAAA,IACrB,UAAUP;AAAA,IACV,YAAYS,EAAO;AAAA,IACnB,iBAAiB;AAAA,EACnB;AAAA,GAIEC,IAA0B,MACvB;AAAA,EACL;AAAA,IACE,OAAO;AAAA,IACP,UAAUT;AAAA,IACV,YAAYQ,EAAO;AAAA,IACnB,iBAAiB;AAAA,IACjB,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAYA,EAAO;AAAA,IACnB,UAAUP;AAAA,IACV,iBAAiB;AAAA,EACnB;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,YAAYO,EAAO;AAAA,IACnB,UAAUN;AAAA,IACV,iBAAiB;AAAA,EACnB;AAAA;"}

package/dist/features/post-game-stats/accuracy/accuracy.js

@@ -1,76 +1,80 @@
-import { jsxs as C, jsx as t } from "react/jsx-runtime";
+import { jsxs as v, jsx as t } from "react/jsx-runtime";
 import I from "lottie-web";
-import { memo as v, useRef as a, useState as A, useCallback as X, useEffect as Y } from "react";
-import { useCircleSounds as j } from "../../circle-games/hooks/use-circle-sounds/use-circle-sounds.js";
-import { CircleSoundKey as M } from "../../circle-games/hooks/use-circle-sounds/use-circle-sounds-enums.js";
+import { memo as X, useRef as a, useState as d, useCallback as W, useEffect as b } from "react";
+import { LOTTIE as M } from "../../../assets/lottie/lottie.js";
+import { useCircleSounds as k } from "../../circle-games/hooks/use-circle-sounds/use-circle-sounds.js";
+import { CircleSoundKey as h } from "../../circle-games/hooks/use-circle-sounds/use-circle-sounds-enums.js";
 import { delay as s } from "../../utils/utils.js";
-import { AnimatedPercentTextInput as W } from "./accuracy-comps.js";
-import { Accuracy as b, AccuracyMeterLottie as k, AnimatedAccuracyNeedleContainer as H, AccuracyNeedleLottie as K, TextWrapper as q, PercentTextWrapper as z } from "./accuracy-styled.js";
-import { getAccuracyFramesToPlay as B } from "./accuracy-utils.js";
-import { NEEDLE_HOLD_TIME as h, METER as F, TEXT_DISAPPEAR_DELAY as G, TEXT_DISAPPEAR_DURATION as J, TEXT_APPEAR_DURATION as Q, NEEDLE as O, NEEDLE_LOTTIE_FPS as g } from "./constants.js";
-const V = () => import("../../../assets/lotties/circle/accuracy-meter-lottie.json.js"), Z = () => import("../../../assets/lotties/circle/accuracy-needle-lottie.json.js"), le = v(({ show: u, onComplete: n, accuracy: l, helperText: y }) => {
-  const { play: c } = j(), E = a(null), p = a(null), o = a(), r = a(), [x, U] = A(!0), [m, T] = A(!1), [R, $] = A(!1), w = a(0), S = (O.IN_FRAMES[1] - O.IN_FRAMES[0]) / g * 1e3, P = X(async () => {
-    var d;
+import { AnimatedPercentTextInput as H } from "./accuracy-comps.js";
+import { Accuracy as K, AccuracyMeterLottie as q, AnimatedAccuracyNeedleContainer as z, AccuracyNeedleLottie as B, TextWrapper as G, PercentTextWrapper as J } from "./accuracy-styled.js";
+import { getAccuracyFramesToPlay as Q } from "./accuracy-utils.js";
+import { NEEDLE_HOLD_TIME as C, METER as O, TEXT_DISAPPEAR_DELAY as V, TEXT_DISAPPEAR_DURATION as Z, TEXT_APPEAR_DURATION as ee, NEEDLE as F, NEEDLE_LOTTIE_FPS as U } from "./constants.js";
+const Ae = X(({ show: u, onComplete: n, accuracy: l, helperText: E }) => {
+  const { play: c } = k(), y = a(null), p = a(null), o = a(), r = a(), [g, w] = d(!0), [m, T] = d(!1), [R, x] = d(!1), $ = a(0), _ = (F.IN_FRAMES[1] - F.IN_FRAMES[0]) / U * 1e3, S = W(async () => {
+    var A;
     try {
-      await s(h), U(!1), T(!1), c(M.ACCURACY_OUT), (d = o.current) == null || d.playSegments(F.OUT_FRAMES, !0), await s(G), $(!0), n == null || n();
+      await s(C), w(!1), T(!1), c(h.ACCURACY_OUT), (A = o.current) == null || A.playSegments(O.OUT_FRAMES, !0), await s(V), x(!0), n == null || n();
     } catch (e) {
       console.log(e);
     }
   }, [n, c]);
-  return Y(() => {
+  return b(() => {
     if (u)
       return (async () => {
-        var _;
+        var L;
         const [e, i] = await Promise.all([
-          V(),
-          Z()
+          fetch(M.ACCURACY_METER),
+          fetch(M.ACCURACY_NEEDLE)
+        ]), [Y, j] = await Promise.all([
+          e.json(),
+          i.json()
         ]);
         o.current = I.loadAnimation({
-          container: E.current,
-          animationData: e.default,
+          container: y.current,
+          animationData: Y,
           autoplay: !1,
           loop: !1,
           renderer: "svg"
         }), r.current = I.loadAnimation({
           container: p.current,
-          animationData: i.default,
+          animationData: j,
           autoplay: !1,
           loop: !1,
           renderer: "svg"
-        }), c(M.ACCURACY_IN), (_ = o.current) == null || _.playSegments(F.IN_FRAMES, !0), s(S).then(() => {
-          var L, N, D;
-          const f = B(l);
-          w.current = f, (L = r.current) == null || L.setSpeed(f / g), (N = r.current) == null || N.playSegments([0, f], !0), T(!0), (D = r.current) == null || D.addEventListener("complete", () => {
-            s(h).then(() => P());
+        }), c(h.ACCURACY_IN), (L = o.current) == null || L.playSegments(O.IN_FRAMES, !0), s(_).then(() => {
+          var D, P, N;
+          const f = Q(l);
+          $.current = f, (D = r.current) == null || D.setSpeed(f / U), (P = r.current) == null || P.playSegments([0, f], !0), T(!0), (N = r.current) == null || N.addEventListener("complete", () => {
+            s(C).then(() => S());
           });
         });
       })(), () => {
         var e, i;
         (e = o.current) == null || e.destroy(), (i = r.current) == null || i.destroy();
       };
-  }, [u, l, S, P, c]), u ? /* @__PURE__ */ C(b, { children: [
-    /* @__PURE__ */ t(k, { ref: E }),
-    x && /* @__PURE__ */ t(H, { children: /* @__PURE__ */ t(K, { ref: p }) }),
-    y && /* @__PURE__ */ t(
-      q,
+  }, [u, l, _, S, c]), u ? /* @__PURE__ */ v(K, { children: [
+    /* @__PURE__ */ t(q, { ref: y }),
+    g && /* @__PURE__ */ t(z, { children: /* @__PURE__ */ t(B, { ref: p }) }),
+    E && /* @__PURE__ */ t(
+      G,
       {
         $delay: 1e3,
         $animationType: R ? "fadeout" : "fadein",
-        $duration: R ? J : Q,
-        children: y
+        $duration: R ? Z : ee,
+        children: E
       }
     ),
     m && /* @__PURE__ */ t(
-      z,
+      J,
       {
         $animationType: m ? "fadein" : "fadeout",
         $duration: 200,
-        children: /* @__PURE__ */ t(W, { accuracy: Math.round(l), time: 1e3 })
+        children: /* @__PURE__ */ t(H, { accuracy: Math.round(l), time: 1e3 })
       }
     )
   ] }) : null;
 });
 export {
-  le as Accuracy
+  Ae as Accuracy
 };
 //# sourceMappingURL=accuracy.js.map

package/dist/features/post-game-stats/accuracy/accuracy.js.map

@@ -1 +1 @@
-{"version":3,"file":"accuracy.js","sources":["../../../../src/features/post-game-stats/accuracy/accuracy.tsx"],"sourcesContent":["import type { IAccuracyProps } from './accuracy-types';\nimport type { AnimationItem } from 'lottie-web';\nimport type { FC } from 'react';\n\nimport Lottie from 'lottie-web';\nimport { memo, useEffect, useRef, useState, useCallback } from 'react';\n\nimport { useCircleSounds } from '../../circle-games/hooks/use-circle-sounds/use-circle-sounds';\nimport { CircleSoundKey } from '../../circle-games/hooks/use-circle-sounds/use-circle-sounds-enums';\nimport { delay } from '../../utils/utils';\nimport { AnimatedPercentTextInput } from './accuracy-comps';\nimport * as Styled from './accuracy-styled';\nimport { getAccuracyFramesToPlay } from './accuracy-utils';\nimport {\n  METER,\n  NEEDLE,\n  NEEDLE_HOLD_TIME,\n  TEXT_APPEAR_DURATION,\n  TEXT_DISAPPEAR_DELAY,\n  TEXT_DISAPPEAR_DURATION,\n  NEEDLE_LOTTIE_FPS,\n} from './constants';\n\nconst accuracyMeterLottie = () =>\n  import('../../../assets/lotties/circle/accuracy-meter-lottie.json');\nconst accuracyNeedleLottie = () =>\n  import('../../../assets/lotties/circle/accuracy-needle-lottie.json');\n\nexport const Accuracy: FC<IAccuracyProps> = memo(({ show, onComplete, accuracy, helperText }) => {\n  const { play } = useCircleSounds();\n  const accuracyMeterRef = useRef<HTMLDivElement>(null);\n  const accuracyNeedleRef = useRef<HTMLDivElement>(null);\n  const accuracyMeterAnimationRef = useRef<AnimationItem>();\n  const accuracyNeedleAnimationRef = useRef<AnimationItem>();\n\n  const [showAccuracy, setShowAccuracy] = useState(true);\n  const [showPercent, setShowPercent] = useState(false);\n  const [fadeOut, setFadeOut] = useState(false);\n  const needleFramesToPlay = useRef(0);\n\n  const percentStartAnimationDelayInMs =\n    ((NEEDLE.IN_FRAMES[1] - NEEDLE.IN_FRAMES[0]) / NEEDLE_LOTTIE_FPS) * 1000;\n\n  const playExitAnimation = useCallback(async () => {\n    try {\n      await delay(NEEDLE_HOLD_TIME);\n      setShowAccuracy(false);\n      setShowPercent(false);\n      play(CircleSoundKey.ACCURACY_OUT);\n      accuracyMeterAnimationRef.current?.playSegments(METER.OUT_FRAMES, true);\n      await delay(TEXT_DISAPPEAR_DELAY);\n      setFadeOut(true);\n      onComplete?.();\n    } catch (err) {\n      /* eslint-disable no-console */\n      console.log(err);\n    }\n  }, [onComplete, play]);\n\n  useEffect(() => {\n    if (show) {\n      const loadAnimations = async () => {\n        const [meterLottiePath, needleLottiePath] = await Promise.all([\n          accuracyMeterLottie(),\n          accuracyNeedleLottie(),\n        ]);\n\n        accuracyMeterAnimationRef.current = Lottie.loadAnimation({\n          container: accuracyMeterRef.current as Element,\n          animationData: meterLottiePath.default,\n          autoplay: false,\n          loop: false,\n          renderer: 'svg',\n        });\n\n        accuracyNeedleAnimationRef.current = Lottie.loadAnimation({\n          container: accuracyNeedleRef.current as Element,\n          animationData: needleLottiePath.default,\n          autoplay: false,\n          loop: false,\n          renderer: 'svg',\n        });\n\n        play(CircleSoundKey.ACCURACY_IN);\n        accuracyMeterAnimationRef.current?.playSegments(METER.IN_FRAMES, true);\n\n        delay(percentStartAnimationDelayInMs).then(() => {\n          const frames = getAccuracyFramesToPlay(accuracy);\n\n          needleFramesToPlay.current = frames;\n          accuracyNeedleAnimationRef.current?.setSpeed(frames / NEEDLE_LOTTIE_FPS);\n          accuracyNeedleAnimationRef.current?.playSegments([0, frames], true);\n          setShowPercent(true);\n\n          accuracyNeedleAnimationRef.current?.addEventListener('complete', () => {\n            delay(NEEDLE_HOLD_TIME).then(() => playExitAnimation());\n          });\n        });\n      };\n\n      loadAnimations();\n\n      return () => {\n        accuracyMeterAnimationRef.current?.destroy();\n        accuracyNeedleAnimationRef.current?.destroy();\n      };\n    }\n  }, [show, accuracy, percentStartAnimationDelayInMs, playExitAnimation, play]);\n\n  if (show) {\n    return (\n      <Styled.Accuracy>\n        <Styled.AccuracyMeterLottie ref={accuracyMeterRef} />\n        {showAccuracy && (\n          <Styled.AnimatedAccuracyNeedleContainer>\n            <Styled.AccuracyNeedleLottie ref={accuracyNeedleRef} />\n          </Styled.AnimatedAccuracyNeedleContainer>\n        )}\n        {helperText && (\n          <Styled.TextWrapper\n            $delay={1000}\n            $animationType={fadeOut ? 'fadeout' : 'fadein'}\n            $duration={fadeOut ? TEXT_DISAPPEAR_DURATION : TEXT_APPEAR_DURATION}\n          >\n            {helperText}\n          </Styled.TextWrapper>\n        )}\n        {showPercent && (\n          <Styled.PercentTextWrapper\n            $animationType={showPercent ? 'fadein' : 'fadeout'}\n            $duration={showPercent ? 200 : 200}\n          >\n            <AnimatedPercentTextInput accuracy={Math.round(accuracy)} time={1000} />\n          </Styled.PercentTextWrapper>\n        )}\n      </Styled.Accuracy>\n    );\n  }\n\n  return null;\n});\n"],"names":["accuracyMeterLottie","accuracyNeedleLottie","Accuracy","memo","show","onComplete","accuracy","helperText","play","useCircleSounds","accuracyMeterRef","useRef","accuracyNeedleRef","accuracyMeterAnimationRef","accuracyNeedleAnimationRef","showAccuracy","setShowAccuracy","useState","showPercent","setShowPercent","fadeOut","setFadeOut","needleFramesToPlay","percentStartAnimationDelayInMs","NEEDLE","NEEDLE_LOTTIE_FPS","playExitAnimation","useCallback","delay","NEEDLE_HOLD_TIME","CircleSoundKey","_a","METER","TEXT_DISAPPEAR_DELAY","err","useEffect","meterLottiePath","needleLottiePath","Lottie","frames","getAccuracyFramesToPlay","_b","_c","jsxs","Styled.Accuracy","jsx","Styled.AccuracyMeterLottie","Styled.AnimatedAccuracyNeedleContainer","Styled.AccuracyNeedleLottie","Styled.TextWrapper","TEXT_DISAPPEAR_DURATION","TEXT_APPEAR_DURATION","Styled.PercentTextWrapper","AnimatedPercentTextInput"],"mappings":"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"}
+{"version":3,"file":"accuracy.js","sources":["../../../../src/features/post-game-stats/accuracy/accuracy.tsx"],"sourcesContent":["import type { IAccuracyProps } from './accuracy-types';\nimport type { AnimationItem } from 'lottie-web';\nimport type { FC } from 'react';\n\nimport Lottie from 'lottie-web';\nimport { memo, useEffect, useRef, useState, useCallback } from 'react';\n\nimport { LOTTIE } from '../../../assets/lottie/lottie';\nimport { useCircleSounds } from '../../circle-games/hooks/use-circle-sounds/use-circle-sounds';\nimport { CircleSoundKey } from '../../circle-games/hooks/use-circle-sounds/use-circle-sounds-enums';\nimport { delay } from '../../utils/utils';\nimport { AnimatedPercentTextInput } from './accuracy-comps';\nimport * as Styled from './accuracy-styled';\nimport { getAccuracyFramesToPlay } from './accuracy-utils';\nimport {\n  METER,\n  NEEDLE,\n  NEEDLE_HOLD_TIME,\n  TEXT_APPEAR_DURATION,\n  TEXT_DISAPPEAR_DELAY,\n  TEXT_DISAPPEAR_DURATION,\n  NEEDLE_LOTTIE_FPS,\n} from './constants';\n\nexport const Accuracy: FC<IAccuracyProps> = memo(({ show, onComplete, accuracy, helperText }) => {\n  const { play } = useCircleSounds();\n  const accuracyMeterRef = useRef<HTMLDivElement>(null);\n  const accuracyNeedleRef = useRef<HTMLDivElement>(null);\n  const accuracyMeterAnimationRef = useRef<AnimationItem>();\n  const accuracyNeedleAnimationRef = useRef<AnimationItem>();\n\n  const [showAccuracy, setShowAccuracy] = useState(true);\n  const [showPercent, setShowPercent] = useState(false);\n  const [fadeOut, setFadeOut] = useState(false);\n  const needleFramesToPlay = useRef(0);\n\n  const percentStartAnimationDelayInMs =\n    ((NEEDLE.IN_FRAMES[1] - NEEDLE.IN_FRAMES[0]) / NEEDLE_LOTTIE_FPS) * 1000;\n\n  const playExitAnimation = useCallback(async () => {\n    try {\n      await delay(NEEDLE_HOLD_TIME);\n      setShowAccuracy(false);\n      setShowPercent(false);\n      play(CircleSoundKey.ACCURACY_OUT);\n      accuracyMeterAnimationRef.current?.playSegments(METER.OUT_FRAMES, true);\n      await delay(TEXT_DISAPPEAR_DELAY);\n      setFadeOut(true);\n      onComplete?.();\n    } catch (err) {\n      /* eslint-disable no-console */\n      console.log(err);\n    }\n  }, [onComplete, play]);\n\n  useEffect(() => {\n    if (show) {\n      const loadAnimations = async () => {\n        const [meterLottie, needleLottie] = await Promise.all([\n          fetch(LOTTIE.ACCURACY_METER),\n          fetch(LOTTIE.ACCURACY_NEEDLE),\n        ]);\n        const [meterLottieData, needleLottieData] = await Promise.all([\n          meterLottie.json(),\n          needleLottie.json(),\n        ]);\n\n        accuracyMeterAnimationRef.current = Lottie.loadAnimation({\n          container: accuracyMeterRef.current as Element,\n          animationData: meterLottieData,\n          autoplay: false,\n          loop: false,\n          renderer: 'svg',\n        });\n\n        accuracyNeedleAnimationRef.current = Lottie.loadAnimation({\n          container: accuracyNeedleRef.current as Element,\n          animationData: needleLottieData,\n          autoplay: false,\n          loop: false,\n          renderer: 'svg',\n        });\n\n        play(CircleSoundKey.ACCURACY_IN);\n        accuracyMeterAnimationRef.current?.playSegments(METER.IN_FRAMES, true);\n\n        delay(percentStartAnimationDelayInMs).then(() => {\n          const frames = getAccuracyFramesToPlay(accuracy);\n\n          needleFramesToPlay.current = frames;\n          accuracyNeedleAnimationRef.current?.setSpeed(frames / NEEDLE_LOTTIE_FPS);\n          accuracyNeedleAnimationRef.current?.playSegments([0, frames], true);\n          setShowPercent(true);\n\n          accuracyNeedleAnimationRef.current?.addEventListener('complete', () => {\n            delay(NEEDLE_HOLD_TIME).then(() => playExitAnimation());\n          });\n        });\n      };\n\n      loadAnimations();\n\n      return () => {\n        accuracyMeterAnimationRef.current?.destroy();\n        accuracyNeedleAnimationRef.current?.destroy();\n      };\n    }\n  }, [show, accuracy, percentStartAnimationDelayInMs, playExitAnimation, play]);\n\n  if (show) {\n    return (\n      <Styled.Accuracy>\n        <Styled.AccuracyMeterLottie ref={accuracyMeterRef} />\n        {showAccuracy && (\n          <Styled.AnimatedAccuracyNeedleContainer>\n            <Styled.AccuracyNeedleLottie ref={accuracyNeedleRef} />\n          </Styled.AnimatedAccuracyNeedleContainer>\n        )}\n        {helperText && (\n          <Styled.TextWrapper\n            $delay={1000}\n            $animationType={fadeOut ? 'fadeout' : 'fadein'}\n            $duration={fadeOut ? TEXT_DISAPPEAR_DURATION : TEXT_APPEAR_DURATION}\n          >\n            {helperText}\n          </Styled.TextWrapper>\n        )}\n        {showPercent && (\n          <Styled.PercentTextWrapper\n            $animationType={showPercent ? 'fadein' : 'fadeout'}\n            $duration={showPercent ? 200 : 200}\n          >\n            <AnimatedPercentTextInput accuracy={Math.round(accuracy)} time={1000} />\n          </Styled.PercentTextWrapper>\n        )}\n      </Styled.Accuracy>\n    );\n  }\n\n  return null;\n});\n"],"names":["Accuracy","memo","show","onComplete","accuracy","helperText","play","useCircleSounds","accuracyMeterRef","useRef","accuracyNeedleRef","accuracyMeterAnimationRef","accuracyNeedleAnimationRef","showAccuracy","setShowAccuracy","useState","showPercent","setShowPercent","fadeOut","setFadeOut","needleFramesToPlay","percentStartAnimationDelayInMs","NEEDLE","NEEDLE_LOTTIE_FPS","playExitAnimation","useCallback","delay","NEEDLE_HOLD_TIME","CircleSoundKey","_a","METER","TEXT_DISAPPEAR_DELAY","err","useEffect","meterLottie","needleLottie","LOTTIE","meterLottieData","needleLottieData","Lottie","frames","getAccuracyFramesToPlay","_b","_c","jsxs","Styled.Accuracy","jsx","Styled.AccuracyMeterLottie","Styled.AnimatedAccuracyNeedleContainer","Styled.AccuracyNeedleLottie","Styled.TextWrapper","TEXT_DISAPPEAR_DURATION","TEXT_APPEAR_DURATION","Styled.PercentTextWrapper","AnimatedPercentTextInput"],"mappings":"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"}