@cuemath/leap 2.8.36-tables-hg3 → 2.8.36-tables-hg5

package/dist/features/circle-games/games/web-view/web-view-types.js.map

@@ -1 +1 @@
-{"version":3,"file":"web-view-types.js","sources":["../../../../../src/features/circle-games/games/web-view/web-view-types.ts"],"sourcesContent":["import type { IAvatarLayer } from '../../../ui/avatar/avatar-types';\nimport type { TUserTypes } from '../../../ui/types';\nimport type { WebViewEvent, ProjectOutcome, ProjectType } from './enums';\nimport type { WEBVIEW_ANALYTICS_EVENTS } from './web-view-analytics-events';\nimport type { IframeHTMLAttributes } from 'react';\n\nexport interface IPlayer {\n  id: string;\n  username: string;\n  grade?: string;\n  avatar?: IAvatarLayer[] | null;\n  playerType: TUserTypes;\n}\n\ninterface ISyncableWebGameProps {\n  joinByRoomId?: string;\n  enableSync?: boolean; // applicable for all except multiplayer games and tables\n}\n\ninterface IBaseWebGameProps {\n  projectId: string;\n  variant: string;\n  projectType: ProjectType;\n  enableCloseButton?: boolean;\n}\n\nexport interface IMultiplayerWebGameProps extends IBaseWebGameProps, ISyncableWebGameProps {\n  enablePlayerTurnIndicators?: boolean;\n}\n\nexport interface IPuzzleWebGameProps extends IBaseWebGameProps, ISyncableWebGameProps {\n  question: string;\n  askHintPermission?: boolean;\n}\n\nexport interface ILessonWebGameProps extends IBaseWebGameProps, ISyncableWebGameProps {\n  miniGameIdentifier: string;\n  sessionId: string;\n  targetQuestions: number;\n}\n\nexport interface ITableWebGameProps extends IBaseWebGameProps {\n  tableNumber: number;\n  infiniteModeHighScore?: number;\n}\n\nexport interface IVibrationPattern {\n  pattern: number[] | number;\n}\n\nexport enum IStatsToAwardErrorCode {\n  DEFAULT = 'default',\n  SUCCESS = 'success',\n  FAIL = 'fail',\n}\n\nexport interface IPlayerStats {\n  points: number;\n  accuracy: number;\n  timeSpent: number;\n  streakDays: number;\n  streakStatusToday: 'pending' | 'completed';\n  errorCode: IStatsToAwardErrorCode;\n  outcome: ProjectOutcome;\n  value: string;\n}\n\nexport interface IInfoMessage {\n  message: string;\n  position: 'top' | 'bottom';\n}\n\nexport interface ITrackEvent {\n  eventName: typeof WEBVIEW_ANALYTICS_EVENTS;\n  properties: Record<string, unknown>;\n}\n\nexport interface IWebViewProps extends IframeHTMLAttributes<HTMLIFrameElement> {\n  baseUrl: string;\n  projectDetails:\n    | IMultiplayerWebGameProps\n    | IPuzzleWebGameProps\n    | ILessonWebGameProps\n    | ITableWebGameProps;\n  parentDomain: string;\n  playerDetails: IPlayer;\n  onBack?: () => void;\n  onGameLoad?: () => void;\n  onGamePlayFinish?: (playerStats: IPlayerStats) => void;\n  handleInfoMessage?: (infoMessage: IInfoMessage) => void;\n}\n\nexport interface IMessageProps {\n  event: `${WebViewEvent}`;\n  payload: IVibrationPattern | IPlayerStats | IInfoMessage | null;\n}\n"],"names":["IStatsToAwardErrorCode"],"mappings":"AAkDY,IAAAA,sBAAAA,OACVA,EAAA,UAAU,WACVA,EAAA,UAAU,WACVA,EAAA,OAAO,QAHGA,IAAAA,KAAA,CAAA,CAAA;"}
+{"version":3,"file":"web-view-types.js","sources":["../../../../../src/features/circle-games/games/web-view/web-view-types.ts"],"sourcesContent":["import type { IAvatarLayer } from '../../../ui/avatar/avatar-types';\nimport type { TUserTypes } from '../../../ui/types';\nimport type { WebViewEvent, ProjectOutcome, ProjectType } from './enums';\nimport type { WEBVIEW_ANALYTICS_EVENTS } from './web-view-analytics-events';\nimport type { IframeHTMLAttributes } from 'react';\n\nexport interface IPlayer {\n  id: string;\n  username: string;\n  grade?: string;\n  avatar?: IAvatarLayer[] | null;\n  playerType: TUserTypes;\n}\n\ninterface ISyncableWebGameProps {\n  joinByRoomId?: string;\n  enableSync?: boolean; // applicable for all except multiplayer games and tables\n}\n\ninterface IBaseWebGameProps {\n  projectId: string;\n  variant: string;\n  projectType: ProjectType;\n  enableCloseButton?: boolean;\n}\n\nexport interface IMultiplayerWebGameProps extends IBaseWebGameProps, ISyncableWebGameProps {\n  enablePlayerTurnIndicators?: boolean;\n}\n\nexport interface IPuzzleWebGameProps extends IBaseWebGameProps, ISyncableWebGameProps {\n  question: string;\n  askHintPermission?: boolean;\n}\n\nexport interface ILessonWebGameProps extends IBaseWebGameProps, ISyncableWebGameProps {\n  miniGameIdentifier: string;\n  sessionId: string;\n  targetQuestions: number;\n}\n\nexport interface ITableWebGameProps extends IBaseWebGameProps {\n  tableNumber: number;\n  infiniteModeHighScore?: number;\n}\n\nexport interface IVibrationPattern {\n  pattern: number[] | number;\n}\n\nexport enum IStatsToAwardErrorCode {\n  DEFAULT = 'default',\n  SUCCESS = 'success',\n  FAIL = 'fail',\n}\n\nexport interface IPlayerStats {\n  points: number;\n  accuracy: number;\n  timeSpent: number;\n  streakDays: number;\n  streakStatusToday: 'pending' | 'completed';\n  errorCode: IStatsToAwardErrorCode;\n  outcome: ProjectOutcome;\n  value: string;\n  starEligibleTime?: number;\n  starEligibleAccuracy?: number;\n  starRewarded?: boolean;\n}\n\nexport interface IInfoMessage {\n  message: string;\n  position: 'top' | 'bottom';\n}\n\nexport interface ITrackEvent {\n  eventName: typeof WEBVIEW_ANALYTICS_EVENTS;\n  properties: Record<string, unknown>;\n}\n\nexport interface IWebViewProps extends IframeHTMLAttributes<HTMLIFrameElement> {\n  baseUrl: string;\n  projectDetails:\n    | IMultiplayerWebGameProps\n    | IPuzzleWebGameProps\n    | ILessonWebGameProps\n    | ITableWebGameProps;\n  parentDomain: string;\n  playerDetails: IPlayer;\n  onBack?: () => void;\n  onGameLoad?: () => void;\n  onGamePlayFinish?: (playerStats: IPlayerStats) => void;\n  handleInfoMessage?: (infoMessage: IInfoMessage) => void;\n}\n\nexport interface IMessageProps {\n  event: `${WebViewEvent}`;\n  payload: IVibrationPattern | IPlayerStats | IInfoMessage | null;\n}\n"],"names":["IStatsToAwardErrorCode"],"mappings":"AAkDY,IAAAA,sBAAAA,OACVA,EAAA,UAAU,WACVA,EAAA,UAAU,WACVA,EAAA,OAAO,QAHGA,IAAAA,KAAA,CAAA,CAAA;"}

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

@@ -0,0 +1,11 @@
+import { jsx as o } from "react/jsx-runtime";
+import n from "../../ui/text/text.js";
+import { useAnimatedValue as m } from "./accuracy-utils.js";
+const u = ({ accuracy: e, time: r }) => {
+  const t = m(0, e, r);
+  return /* @__PURE__ */ o(n, { $renderAs: "ah3", $color: "WHITE", children: `${Math.round(t)}%` });
+};
+export {
+  u as AnimatedPercentTextInput
+};
+//# sourceMappingURL=accuracy-comps.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"accuracy-comps.js","sources":["../../../../src/features/post-game-stats/accuracy/accuracy-comps.tsx"],"sourcesContent":["import type { IAnimatedPercentTextProps } from './accuracy-types';\n\nimport Text from '../../ui/text/text';\nimport { useAnimatedValue } from './accuracy-utils';\n\nexport const AnimatedPercentTextInput = ({ accuracy, time }: IAnimatedPercentTextProps) => {\n  const animatedValue = useAnimatedValue(0, accuracy, time);\n\n  return <Text $renderAs=\"ah3\" $color=\"WHITE\">{`${Math.round(animatedValue)}%`}</Text>;\n};\n"],"names":["AnimatedPercentTextInput","accuracy","time","animatedValue","useAnimatedValue","jsx","Text"],"mappings":";;;AAKO,MAAMA,IAA2B,CAAC,EAAE,UAAAC,GAAU,MAAAC,QAAsC;AACzF,QAAMC,IAAgBC,EAAiB,GAAGH,GAAUC,CAAI;AAEjD,SAAA,gBAAAG,EAACC,GAAK,EAAA,WAAU,OAAM,QAAO,SAAS,UAAA,GAAG,KAAK,MAAMH,CAAa,CAAC,IAAI,CAAA;AAC/E;"}

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

@@ -0,0 +1,68 @@
+import o, { keyframes as r, css as s } from "styled-components";
+import { GAME_LAUNCHER_SIZE as t } from "../../circle-games/game-launcher/comps/card-container/constants.js";
+import { GAME_LAUNCHER_ASSET_PADDING as a } from "../../circle-games/game-launcher/comps/segmented-game-card/constants.js";
+const p = 50 * 84 / 100, c = r`
+  0%{
+    opacity: 0;
+  }
+  100%{
+    opacity: 1;
+  }
+`, d = r`
+  0%{
+    opacity: 1;
+  }
+  100%{
+    opacity: 0;
+  }
+`, m = o.div`
+  height: ${t}px;
+  width: ${t}px;
+  background: transparent;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+`, $ = o.div`
+  height: ${t + a}px;
+  width: ${t + a}px;
+  position: absolute;
+  flex: 1;
+  z-index: 1;
+`, y = o.div`
+  height: ${t + a}px;
+  width: ${t + a}px;
+  position: absolute;
+  z-index: 2;
+  transform: ${({ $translateX: e = 0, $translateY: i = 0, $rotate: n = 0 }) => `translateX(${e}px) translateY(${i}px) rotate(${n}deg)`};
+`, A = o.div`
+  height: 100%;
+  width: 100%;
+`, h = o.div`
+  z-index: 2;
+  opacity: 0;
+  position: absolute;
+  animation: ${({ $animationType: e, $duration: i, $delay: n }) => s`
+    ${e === "fadein" ? c : d} ${i}ms ${n}ms ease forwards
+  `};
+  transform: translateY(${(t + p) * 84 / 200 + 25}px);
+`, u = o.div`
+  position: absolute;
+  z-index: 20;
+  display: flex;
+  flex-direction: row;
+  align-items: flex-end;
+
+  ${({ $animationType: e, $duration: i }) => e && i && s`
+      animation: ${e === "fadein" ? c : d} ${i}ms linear forwards;
+    `}
+`;
+export {
+  m as Accuracy,
+  $ as AccuracyMeterLottie,
+  A as AccuracyNeedleLottie,
+  y as AnimatedAccuracyNeedleContainer,
+  u as PercentTextWrapper,
+  h as TextWrapper
+};
+//# sourceMappingURL=accuracy-styled.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"accuracy-styled.js","sources":["../../../../src/features/post-game-stats/accuracy/accuracy-styled.tsx"],"sourcesContent":["import styled, { keyframes, css } from 'styled-components';\n\nimport { GAME_LAUNCHER_SIZE } from '../../circle-games/game-launcher/comps/card-container/constants';\nimport { GAME_LAUNCHER_ASSET_PADDING } from '../../circle-games/game-launcher/comps/segmented-game-card/constants';\n\nconst MASK_PADDING = (50 * 84) / 100;\n\nconst fadeIn = keyframes`\n  0%{\n    opacity: 0;\n  }\n  100%{\n    opacity: 1;\n  }\n`;\n\nconst fadeOut = keyframes`\n  0%{\n    opacity: 1;\n  }\n  100%{\n    opacity: 0;\n  }\n`;\n\nexport const Accuracy = styled.div`\n  height: ${GAME_LAUNCHER_SIZE}px;\n  width: ${GAME_LAUNCHER_SIZE}px;\n  background: transparent;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n`;\n\nexport const AccuracyMeterLottie = styled.div`\n  height: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  width: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  position: absolute;\n  flex: 1;\n  z-index: 1;\n`;\n\nexport const AnimatedAccuracyNeedleContainer = styled.div<{\n  $translateX?: number;\n  $translateY?: number;\n  $rotate?: number;\n}>`\n  height: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  width: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  position: absolute;\n  z-index: 2;\n  transform: ${({ $translateX = 0, $translateY = 0, $rotate = 0 }) =>\n    `translateX(${$translateX}px) translateY(${$translateY}px) rotate(${$rotate}deg)`};\n`;\n\nexport const AccuracyNeedleLottie = styled.div`\n  height: 100%;\n  width: 100%;\n`;\n\nexport const TextWrapper = styled.div<{\n  $duration: number;\n  $delay: number;\n  $animationType: 'fadein' | 'fadeout';\n}>`\n  z-index: 2;\n  opacity: 0;\n  position: absolute;\n  animation: ${({ $animationType, $duration, $delay }) => css`\n    ${$animationType === 'fadein' ? fadeIn : fadeOut} ${$duration}ms ${$delay}ms ease forwards\n  `};\n  transform: translateY(${((GAME_LAUNCHER_SIZE + MASK_PADDING) * 84) / 200 + 25}px);\n`;\n\nexport const PercentTextWrapper = styled.div<{\n  $animationType?: 'fadein' | 'fadeout';\n  $duration?: number;\n}>`\n  position: absolute;\n  z-index: 20;\n  display: flex;\n  flex-direction: row;\n  align-items: flex-end;\n\n  ${({ $animationType, $duration }) =>\n    $animationType &&\n    $duration &&\n    css`\n      animation: ${$animationType === 'fadein' ? fadeIn : fadeOut} ${$duration}ms linear forwards;\n    `}\n`;\n"],"names":["MASK_PADDING","fadeIn","keyframes","fadeOut","Accuracy","styled","GAME_LAUNCHER_SIZE","AccuracyMeterLottie","GAME_LAUNCHER_ASSET_PADDING","AnimatedAccuracyNeedleContainer","$translateX","$translateY","$rotate","AccuracyNeedleLottie","TextWrapper","$animationType","$duration","$delay","css","PercentTextWrapper"],"mappings":";;;AAKA,MAAMA,IAAgB,KAAK,KAAM,KAE3BC,IAASC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GASTC,IAAUD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GASHE,IAAWC,EAAO;AAAA,YACnBC,CAAkB;AAAA,WACnBA,CAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQhBC,IAAsBF,EAAO;AAAA,YAC9BC,IAAqBE,CAA2B;AAAA,WACjDF,IAAqBE,CAA2B;AAAA;AAAA;AAAA;AAAA,GAM9CC,IAAkCJ,EAAO;AAAA,YAK1CC,IAAqBE,CAA2B;AAAA,WACjDF,IAAqBE,CAA2B;AAAA;AAAA;AAAA,eAG5C,CAAC,EAAE,aAAAE,IAAc,GAAG,aAAAC,IAAc,GAAG,SAAAC,IAAU,EAAE,MAC5D,cAAcF,CAAW,kBAAkBC,CAAW,cAAcC,CAAO,MAAM;AAAA,GAGxEC,IAAuBR,EAAO;AAAA;AAAA;AAAA,GAK9BS,IAAcT,EAAO;AAAA;AAAA;AAAA;AAAA,eAQnB,CAAC,EAAE,gBAAAU,GAAgB,WAAAC,GAAW,QAAAC,QAAaC;AAAA,MACpDH,MAAmB,WAAWd,IAASE,CAAO,IAAIa,CAAS,MAAMC,CAAM;AAAA,GAC1E;AAAA,2BACyBX,IAAqBN,KAAgB,KAAM,MAAM,EAAE;AAAA,GAGlEmB,IAAqBd,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUrC,CAAC,EAAE,gBAAAU,GAAgB,WAAAC,EAAU,MAC7BD,KACAC,KACAE;AAAA,mBACeH,MAAmB,WAAWd,IAASE,CAAO,IAAIa,CAAS;AAAA,KACzE;AAAA;"}

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

@@ -0,0 +1,20 @@
+import { useState as F, useRef as l, useEffect as A } from "react";
+import { NEEDLE as n } from "./constants.js";
+const P = (e, t, a) => {
+  const [c, o] = F(e), r = l(null), s = l(null), u = (i) => {
+    s.current || (s.current = i);
+    const f = i - s.current, m = Math.min(f / a, 1), E = e + (t - e) * m;
+    o(E), m < 1 && (r.current = requestAnimationFrame(u));
+  };
+  return A(() => (r.current = requestAnimationFrame(u), () => {
+    r.current && cancelAnimationFrame(r.current);
+  })), c;
+}, T = (e) => {
+  const t = n.PERCENT_FRAME[1] - n.PERCENT_FRAME[0], a = t / 100, c = Math.min(Math.ceil(a * e), t);
+  return n.IN_FRAMES[1] - n.IN_FRAMES[0] + c;
+};
+export {
+  T as getAccuracyFramesToPlay,
+  P as useAnimatedValue
+};
+//# sourceMappingURL=accuracy-utils.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"accuracy-utils.js","sources":["../../../../src/features/post-game-stats/accuracy/accuracy-utils.tsx"],"sourcesContent":["import { useEffect, useState, useRef } from 'react';\n\nimport { NEEDLE } from './constants';\n\nexport const useAnimatedValue = (start: number, end: number, duration: number) => {\n  const [value, setValue] = useState(start);\n  const requestRef = useRef<number | null>(null);\n  const startTimeRef = useRef<number | null>(null);\n\n  const animate = (timestamp: number) => {\n    if (!startTimeRef.current) startTimeRef.current = timestamp;\n\n    const elapsedTime = timestamp - startTimeRef.current;\n    const progress = Math.min(elapsedTime / duration, 1); // Normalize to 0 - 1\n    const newValue = start + (end - start) * progress;\n\n    setValue(newValue);\n\n    if (progress < 1) {\n      requestRef.current = requestAnimationFrame(animate);\n    }\n  };\n\n  useEffect(() => {\n    requestRef.current = requestAnimationFrame(animate);\n\n    return () => {\n      if (requestRef.current) cancelAnimationFrame(requestRef.current);\n    };\n  });\n\n  return value;\n};\n\nexport const getAccuracyFramesToPlay = (accuracy: number) => {\n  // 100% = 100 frames\n  // 1% = 1 fame\n  const totalFrames = NEEDLE.PERCENT_FRAME[1] - NEEDLE.PERCENT_FRAME[0];\n  const framesPerPercent = totalFrames / 100;\n\n  const framesToPlay = Math.min(Math.ceil(framesPerPercent * accuracy), totalFrames);\n  const initialFrames = NEEDLE.IN_FRAMES[1] - NEEDLE.IN_FRAMES[0];\n\n  return initialFrames + framesToPlay;\n};\n"],"names":["useAnimatedValue","start","end","duration","value","setValue","useState","requestRef","useRef","startTimeRef","animate","timestamp","elapsedTime","progress","newValue","useEffect","getAccuracyFramesToPlay","accuracy","totalFrames","NEEDLE","framesPerPercent","framesToPlay"],"mappings":";;AAIO,MAAMA,IAAmB,CAACC,GAAeC,GAAaC,MAAqB;AAChF,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAASL,CAAK,GAClCM,IAAaC,EAAsB,IAAI,GACvCC,IAAeD,EAAsB,IAAI,GAEzCE,IAAU,CAACC,MAAsB;AACrC,IAAKF,EAAa,YAASA,EAAa,UAAUE;AAE5C,UAAAC,IAAcD,IAAYF,EAAa,SACvCI,IAAW,KAAK,IAAID,IAAcT,GAAU,CAAC,GAC7CW,IAAWb,KAASC,IAAMD,KAASY;AAEzC,IAAAR,EAASS,CAAQ,GAEbD,IAAW,MACFN,EAAA,UAAU,sBAAsBG,CAAO;AAAA,EACpD;AAGF,SAAAK,EAAU,OACGR,EAAA,UAAU,sBAAsBG,CAAO,GAE3C,MAAM;AACX,IAAIH,EAAW,WAA8B,qBAAAA,EAAW,OAAO;AAAA,EAAA,EAElE,GAEMH;AACT,GAEaY,IAA0B,CAACC,MAAqB;AAG3D,QAAMC,IAAcC,EAAO,cAAc,CAAC,IAAIA,EAAO,cAAc,CAAC,GAC9DC,IAAmBF,IAAc,KAEjCG,IAAe,KAAK,IAAI,KAAK,KAAKD,IAAmBH,CAAQ,GAAGC,CAAW;AAGjF,SAFsBC,EAAO,UAAU,CAAC,IAAIA,EAAO,UAAU,CAAC,IAEvCE;AACzB;"}

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

@@ -0,0 +1,80 @@
+import { jsxs as v, jsx as t } from "react/jsx-runtime";
+import I from "lottie-web";
+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 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(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 b(() => {
+    if (u)
+      return (async () => {
+        var L;
+        const [e, i] = await Promise.all([
+          fetch(M.ACCURACY_METER),
+          fetch(M.ACCURACY_NEEDLE)
+        ]), [Y, j] = await Promise.all([
+          e.json(),
+          i.json()
+        ]);
+        o.current = I.loadAnimation({
+          container: y.current,
+          animationData: Y,
+          autoplay: !1,
+          loop: !1,
+          renderer: "svg"
+        }), r.current = I.loadAnimation({
+          container: p.current,
+          animationData: j,
+          autoplay: !1,
+          loop: !1,
+          renderer: "svg"
+        }), 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, 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 ? Z : ee,
+        children: E
+      }
+    ),
+    m && /* @__PURE__ */ t(
+      J,
+      {
+        $animationType: m ? "fadein" : "fadeout",
+        $duration: 200,
+        children: /* @__PURE__ */ t(H, { accuracy: Math.round(l), time: 1e3 })
+      }
+    )
+  ] }) : null;
+});
+export {
+  Ae as Accuracy
+};
+//# sourceMappingURL=accuracy.js.map

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

@@ -0,0 +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 { 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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"}

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

@@ -0,0 +1,17 @@
+const E = 1e3, T = 200, _ = 200, A = 133, R = 30, D = {
+  IN_FRAMES: [0, 27],
+  OUT_FRAMES: [27, 47]
+}, o = {
+  IN_FRAMES: [0, 15],
+  PERCENT_FRAME: [15, 115]
+};
+export {
+  D as METER,
+  o as NEEDLE,
+  E as NEEDLE_HOLD_TIME,
+  R as NEEDLE_LOTTIE_FPS,
+  T as TEXT_APPEAR_DURATION,
+  _ as TEXT_DISAPPEAR_DELAY,
+  A as TEXT_DISAPPEAR_DURATION
+};
+//# sourceMappingURL=constants.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../src/features/post-game-stats/accuracy/constants.ts"],"sourcesContent":["export const NEEDLE_HOLD_TIME = 1000;\nexport const TEXT_APPEAR_DURATION = 200;\nexport const TEXT_DISAPPEAR_DELAY = 200;\nexport const TEXT_DISAPPEAR_DURATION = 133;\nexport const NEEDLE_LOTTIE_FPS = 30;\n\nexport const METER: { IN_FRAMES: [number, number]; OUT_FRAMES: [number, number] } = {\n  IN_FRAMES: [0, 27],\n  OUT_FRAMES: [27, 47],\n};\n\nexport const NEEDLE: { IN_FRAMES: [number, number]; PERCENT_FRAME: [number, number] } = {\n  IN_FRAMES: [0, 15],\n  PERCENT_FRAME: [15, 115],\n};\n"],"names":["NEEDLE_HOLD_TIME","TEXT_APPEAR_DURATION","TEXT_DISAPPEAR_DELAY","TEXT_DISAPPEAR_DURATION","NEEDLE_LOTTIE_FPS","METER","NEEDLE"],"mappings":"AAAO,MAAMA,IAAmB,KACnBC,IAAuB,KACvBC,IAAuB,KACvBC,IAA0B,KAC1BC,IAAoB,IAEpBC,IAAuE;AAAA,EAClF,WAAW,CAAC,GAAG,EAAE;AAAA,EACjB,YAAY,CAAC,IAAI,EAAE;AACrB,GAEaC,IAA2E;AAAA,EACtF,WAAW,CAAC,GAAG,EAAE;AAAA,EACjB,eAAe,CAAC,IAAI,GAAG;AACzB;"}

package/dist/features/post-game-stats/clock/clock-styled.js

@@ -0,0 +1,51 @@
+import o, { keyframes as e, css as p } from "styled-components";
+import { GAME_LAUNCHER_SIZE as t } from "../../circle-games/game-launcher/comps/card-container/constants.js";
+import { GAME_LAUNCHER_ASSET_PADDING as i } from "../../circle-games/game-launcher/comps/segmented-game-card/constants.js";
+const r = 50 * 84 / 100, c = e`
+  0%{
+    opacity: 0;
+  }
+  100%{
+    opacity: 1;
+  }
+`, d = e`
+  0%{
+    opacity: 1;
+  }
+  100%{
+    opacity: 0;
+  }
+`, f = o.div`
+  height: ${t}px;
+  width: ${t}px;
+  background: transparent;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+`, $ = o.div`
+  height: ${t + i}px;
+  width: ${t + i}px;
+  position: absolute;
+  z-index: 1;
+`, h = o.div`
+  height: ${t + i}px;
+  width: ${t + i}px;
+  position: absolute;
+  z-index: 2;
+`, y = o.div`
+  z-index: 2;
+  opacity: 0;
+  position: absolute;
+  animation: ${({ $animationType: n, $duration: s, $delay: a }) => p`
+    ${n === "fadein" ? c : d} ${s}ms ${a}ms ease forwards
+  `};
+  transform: translateY(${(t + r) * 84 / 200 + 25}px);
+`;
+export {
+  f as Clock,
+  $ as ClockLottie,
+  h as ClockTimeSpentLottie,
+  y as TextWrapper
+};
+//# sourceMappingURL=clock-styled.js.map

package/dist/features/post-game-stats/clock/clock-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clock-styled.js","sources":["../../../../src/features/post-game-stats/clock/clock-styled.tsx"],"sourcesContent":["import styled, { keyframes, css } from 'styled-components';\n\nimport { GAME_LAUNCHER_SIZE } from '../../circle-games/game-launcher/comps/card-container/constants';\nimport { GAME_LAUNCHER_ASSET_PADDING } from '../../circle-games/game-launcher/comps/segmented-game-card/constants';\n\nconst MASK_PADDING = (50 * 84) / 100;\n\nconst fadeIn = keyframes`\n  0%{\n    opacity: 0;\n  }\n  100%{\n    opacity: 1;\n  }\n`;\n\nconst fadeOut = keyframes`\n  0%{\n    opacity: 1;\n  }\n  100%{\n    opacity: 0;\n  }\n`;\n\nexport const Clock = styled.div`\n  height: ${GAME_LAUNCHER_SIZE}px;\n  width: ${GAME_LAUNCHER_SIZE}px;\n  background: transparent;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n`;\n\nexport const ClockLottie = styled.div`\n  height: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  width: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  position: absolute;\n  z-index: 1;\n`;\n\nexport const ClockTimeSpentLottie = styled.div`\n  height: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  width: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  position: absolute;\n  z-index: 2;\n`;\n\nexport const TextWrapper = styled.div<{\n  $duration: number;\n  $delay: number;\n  $animationType: 'fadein' | 'fadeout';\n}>`\n  z-index: 2;\n  opacity: 0;\n  position: absolute;\n  animation: ${({ $animationType, $duration, $delay }) => css`\n    ${$animationType === 'fadein' ? fadeIn : fadeOut} ${$duration}ms ${$delay}ms ease forwards\n  `};\n  transform: translateY(${((GAME_LAUNCHER_SIZE + MASK_PADDING) * 84) / 200 + 25}px);\n`;\n"],"names":["MASK_PADDING","fadeIn","keyframes","fadeOut","Clock","styled","GAME_LAUNCHER_SIZE","ClockLottie","GAME_LAUNCHER_ASSET_PADDING","ClockTimeSpentLottie","TextWrapper","$animationType","$duration","$delay","css"],"mappings":";;;AAKA,MAAMA,IAAgB,KAAK,KAAM,KAE3BC,IAASC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GASTC,IAAUD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GASHE,IAAQC,EAAO;AAAA,YAChBC,CAAkB;AAAA,WACnBA,CAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQhBC,IAAcF,EAAO;AAAA,YACtBC,IAAqBE,CAA2B;AAAA,WACjDF,IAAqBE,CAA2B;AAAA;AAAA;AAAA,GAK9CC,IAAuBJ,EAAO;AAAA,YAC/BC,IAAqBE,CAA2B;AAAA,WACjDF,IAAqBE,CAA2B;AAAA;AAAA;AAAA,GAK9CE,IAAcL,EAAO;AAAA;AAAA;AAAA;AAAA,eAQnB,CAAC,EAAE,gBAAAM,GAAgB,WAAAC,GAAW,QAAAC,QAAaC;AAAA,MACpDH,MAAmB,WAAWV,IAASE,CAAO,IAAIS,CAAS,MAAMC,CAAM;AAAA,GAC1E;AAAA,2BACyBP,IAAqBN,KAAgB,KAAM,MAAM,EAAE;AAAA;"}

package/dist/features/post-game-stats/clock/clock-util.js

@@ -0,0 +1,9 @@
+import { CLOCK_TIME_SPENT_FPS as a, CLOCK_TIME_SPENT_DURATION as r } from "./constants.js";
+const T = (t) => {
+  const e = a * r, o = e / (60 * 60 * 1e3);
+  return Math.min(Math.ceil(o * t), e);
+};
+export {
+  T as getClockTimeSpentFramesToPlay
+};
+//# sourceMappingURL=clock-util.js.map

package/dist/features/post-game-stats/clock/clock-util.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clock-util.js","sources":["../../../../src/features/post-game-stats/clock/clock-util.ts"],"sourcesContent":["import { CLOCK_TIME_SPENT_FPS, CLOCK_TIME_SPENT_DURATION } from './constants';\n\nexport const getClockTimeSpentFramesToPlay = (timeInMs: number) => {\n  // 1 hr = (30 * duration of lottie) frames\n  // 60m * 60s * 1000ms = 30 * duration\n  // 1ms = (30 * duration) / (60 * 60 * 1000) frames\n  const totalFrames = CLOCK_TIME_SPENT_FPS * CLOCK_TIME_SPENT_DURATION; // lottie is of 8s\n\n  const framesPerMilliSec = totalFrames / (60 * 60 * 1000);\n\n  const framesToPlay = Math.min(Math.ceil(framesPerMilliSec * timeInMs), totalFrames);\n\n  return framesToPlay;\n};\n"],"names":["getClockTimeSpentFramesToPlay","timeInMs","totalFrames","CLOCK_TIME_SPENT_FPS","CLOCK_TIME_SPENT_DURATION","framesPerMilliSec"],"mappings":";AAEa,MAAAA,IAAgC,CAACC,MAAqB;AAIjE,QAAMC,IAAcC,IAAuBC,GAErCC,IAAoBH,KAAe,KAAK,KAAK;AAI5C,SAFc,KAAK,IAAI,KAAK,KAAKG,IAAoBJ,CAAQ,GAAGC,CAAW;AAGpF;"}

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

@@ -0,0 +1,75 @@
+import { jsxs as K, jsx as u } from "react/jsx-runtime";
+import I from "lottie-web";
+import { memo as g, useState as h, useRef as o, useCallback as T, useEffect as j } from "react";
+import { LOTTIE as k } from "../../../assets/lottie/lottie.js";
+import { useCircleSounds as x } from "../../circle-games/hooks/use-circle-sounds/use-circle-sounds.js";
+import { CircleSoundKey as R } from "../../circle-games/hooks/use-circle-sounds/use-circle-sounds-enums.js";
+import { delay as D } from "../../utils/utils.js";
+import { Clock as U, ClockLottie as $, ClockTimeSpentLottie as w, TextWrapper as X } from "./clock-styled.js";
+import { getClockTimeSpentFramesToPlay as Y } from "./clock-util.js";
+import { CLOCK_TIME_SPENT_FPS as H, CLOCK as N, CLOCK_INFRAME_LOTTIE_TO_PLAY as W, TIME_LOTTIE_TO_PLAY_IN as b, TEXT_DISAPPEAR_DURATION as q, TEXT_APPEAR_DURATION as z, TIME_SHOWN_HOLD_TIME as B, TEXT_DISAPPEAR_DELAY as G } from "./constants.js";
+const it = g(({ show: s, onComplete: i, timeInMs: f, helperText: p }) => {
+  const { play: c } = x(), [L, F] = h(!1), m = o(!1), l = o(0), d = o(null), E = o(null), a = o(), n = o(), _ = T(() => {
+    var t, e;
+    const r = Y(f);
+    r && (l.current = r, (t = n.current) == null || t.setSpeed(r / H), (e = n.current) == null || e.playSegments([0, r], !0), m.current = !0);
+  }, [f]), S = T(async () => {
+    var r, t;
+    await D(B), (r = n.current) == null || r.playSegments([l.current, 0], !0), await D(G), F(!0), m.current && ((t = n.current) == null || t.addEventListener("complete", () => {
+      var e;
+      c(R.CLOCK_OUT), (e = a.current) == null || e.playSegments(N.OUT_FRAMES, !0);
+    }));
+  }, [l, c]), A = T(() => {
+    i == null || i();
+  }, [i]);
+  return j(() => {
+    if (s)
+      return (async () => {
+        var O, C, y;
+        const [t, e] = await Promise.all([
+          fetch(k.TOTAL_TIME),
+          fetch(k.TOTAL_TIME_SPENT)
+        ]), [M, v] = await Promise.all([
+          t.json(),
+          e.json()
+        ]);
+        a.current = I.loadAnimation({
+          container: d.current,
+          animationData: M,
+          autoplay: !1,
+          loop: !1,
+          renderer: "canvas"
+        }), n.current = I.loadAnimation({
+          container: E.current,
+          animationData: v,
+          autoplay: !1,
+          loop: !1,
+          renderer: "canvas"
+        }), c(R.CLOCK_IN), (O = a.current) == null || O.playSegments(N.IN_FRAMES, !0), (C = a.current) == null || C.addEventListener("complete", () => {
+          m.current ? A() : _();
+        }), (y = n.current) == null || y.addEventListener("complete", () => {
+          var P;
+          (P = n.current) == null || P.removeEventListener("complete"), S();
+        });
+      })(), () => {
+        var t, e;
+        (t = a.current) == null || t.destroy(), (e = n.current) == null || e.destroy();
+      };
+  }, [s, _, A, S, c]), s ? /* @__PURE__ */ K(U, { children: [
+    /* @__PURE__ */ u($, { ref: d }),
+    /* @__PURE__ */ u(w, { ref: E }),
+    p && /* @__PURE__ */ u(
+      X,
+      {
+        $delay: W + b,
+        $animationType: L ? "fadeout" : "fadein",
+        $duration: L ? q : z,
+        children: p
+      }
+    )
+  ] }) : null;
+});
+export {
+  it as Clock
+};
+//# sourceMappingURL=clock.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"clock.js","sources":["../../../../src/features/post-game-stats/clock/clock.tsx"],"sourcesContent":["import type { IClockProps } from './clock-types';\nimport type { AnimationItem } from 'lottie-web';\nimport type { FC } from 'react';\n\nimport Lottie from 'lottie-web';\nimport { memo, useCallback, useEffect, useRef, useState } 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 * as Styled from './clock-styled';\nimport { getClockTimeSpentFramesToPlay } from './clock-util';\nimport {\n  CLOCK,\n  CLOCK_TIME_SPENT_FPS,\n  TIME_SHOWN_HOLD_TIME,\n  TEXT_APPEAR_DURATION,\n  TEXT_DISAPPEAR_DELAY,\n  TEXT_DISAPPEAR_DURATION,\n  CLOCK_INFRAME_LOTTIE_TO_PLAY,\n  TIME_LOTTIE_TO_PLAY_IN,\n} from './constants';\n\nexport const Clock: FC<IClockProps> = memo(({ show, onComplete, timeInMs, helperText }) => {\n  const { play } = useCircleSounds();\n  const [fadeOut, setFadeOut] = useState(false);\n  const isClockTimeSpentShown = useRef(false);\n  const framesToPlay = useRef(0);\n\n  const clockLottieContainerRef = useRef<HTMLDivElement>(null);\n  const clockTimeSpentLottieContainerRef = useRef<HTMLDivElement>(null);\n  const clockLottieAnimationRef = useRef<AnimationItem>();\n  const clockTimeSpentLottieAnimationRef = useRef<AnimationItem>();\n\n  const setClockTimeSpentFrames = useCallback(() => {\n    const frames = getClockTimeSpentFramesToPlay(timeInMs);\n\n    if (frames) {\n      framesToPlay.current = frames;\n      // Speed adjustment\n      clockTimeSpentLottieAnimationRef.current?.setSpeed(frames / CLOCK_TIME_SPENT_FPS);\n      clockTimeSpentLottieAnimationRef.current?.playSegments([0, frames], true);\n      isClockTimeSpentShown.current = true;\n    }\n  }, [timeInMs]);\n\n  const onClockTimeSpentExitAnimationFinished = useCallback(async () => {\n    await delay(TIME_SHOWN_HOLD_TIME);\n\n    // Reverse play time spent animation\n    clockTimeSpentLottieAnimationRef.current?.playSegments([framesToPlay.current, 0], true);\n\n    await delay(TEXT_DISAPPEAR_DELAY);\n    setFadeOut(true);\n\n    if (isClockTimeSpentShown.current) {\n      clockTimeSpentLottieAnimationRef.current?.addEventListener('complete', () => {\n        play(CircleSoundKey.CLOCK_OUT);\n        clockLottieAnimationRef.current?.playSegments(CLOCK.OUT_FRAMES, true);\n      });\n    }\n  }, [framesToPlay, play]);\n\n  const onAnimationEnd = useCallback(() => {\n    onComplete?.();\n  }, [onComplete]);\n\n  // Play entry animation\n  useEffect(() => {\n    if (show) {\n      const loadAnimations = async () => {\n        const [timeLottiePath, timeSpentLottiePath] = await Promise.all([\n          fetch(LOTTIE.TOTAL_TIME),\n          fetch(LOTTIE.TOTAL_TIME_SPENT),\n        ]);\n        const [timeLottieData, timeSpentLottieData] = await Promise.all([\n          timeLottiePath.json(),\n          timeSpentLottiePath.json(),\n        ]);\n\n        // Clock Lottie\n        clockLottieAnimationRef.current = Lottie.loadAnimation({\n          container: clockLottieContainerRef.current as Element,\n          animationData: timeLottieData,\n          autoplay: false,\n          loop: false,\n          renderer: 'canvas',\n        });\n\n        // Clock Time Spent Lottie\n        clockTimeSpentLottieAnimationRef.current = Lottie.loadAnimation({\n          container: clockTimeSpentLottieContainerRef.current as Element,\n          animationData: timeSpentLottieData,\n          autoplay: false,\n          loop: false,\n          renderer: 'canvas',\n        });\n\n        // Play clock in animation sounds and lottie\n        play(CircleSoundKey.CLOCK_IN);\n        clockLottieAnimationRef.current?.playSegments(CLOCK.IN_FRAMES, true);\n\n        clockLottieAnimationRef.current?.addEventListener('complete', () => {\n          if (!isClockTimeSpentShown.current) {\n            setClockTimeSpentFrames();\n          } else {\n            onAnimationEnd();\n          }\n        });\n\n        // Setup event listener for time spent animation\n        clockTimeSpentLottieAnimationRef.current?.addEventListener('complete', () => {\n          clockTimeSpentLottieAnimationRef.current?.removeEventListener('complete');\n          onClockTimeSpentExitAnimationFinished();\n        });\n      };\n\n      loadAnimations();\n\n      return () => {\n        clockLottieAnimationRef.current?.destroy();\n        clockTimeSpentLottieAnimationRef.current?.destroy();\n      };\n    }\n  }, [show, setClockTimeSpentFrames, onAnimationEnd, onClockTimeSpentExitAnimationFinished, play]);\n\n  if (show) {\n    return (\n      <Styled.Clock>\n        <Styled.ClockLottie ref={clockLottieContainerRef} />\n        <Styled.ClockTimeSpentLottie ref={clockTimeSpentLottieContainerRef} />\n        {helperText && (\n          <Styled.TextWrapper\n            $delay={CLOCK_INFRAME_LOTTIE_TO_PLAY + TIME_LOTTIE_TO_PLAY_IN}\n            $animationType={fadeOut ? 'fadeout' : 'fadein'}\n            $duration={fadeOut ? TEXT_DISAPPEAR_DURATION : TEXT_APPEAR_DURATION}\n          >\n            {helperText}\n          </Styled.TextWrapper>\n        )}\n      </Styled.Clock>\n    );\n  }\n\n  return null;\n});\n"],"names":["Clock","memo","show","onComplete","timeInMs","helperText","play","useCircleSounds","fadeOut","setFadeOut","useState","isClockTimeSpentShown","useRef","framesToPlay","clockLottieContainerRef","clockTimeSpentLottieContainerRef","clockLottieAnimationRef","clockTimeSpentLottieAnimationRef","setClockTimeSpentFrames","useCallback","frames","getClockTimeSpentFramesToPlay","_a","CLOCK_TIME_SPENT_FPS","_b","onClockTimeSpentExitAnimationFinished","delay","TIME_SHOWN_HOLD_TIME","TEXT_DISAPPEAR_DELAY","CircleSoundKey","CLOCK","onAnimationEnd","useEffect","timeLottiePath","timeSpentLottiePath","LOTTIE","timeLottieData","timeSpentLottieData","Lottie","_c","jsxs","Styled.Clock","jsx","Styled.ClockLottie","Styled.ClockTimeSpentLottie","Styled.TextWrapper","CLOCK_INFRAME_LOTTIE_TO_PLAY","TIME_LOTTIE_TO_PLAY_IN","TEXT_DISAPPEAR_DURATION","TEXT_APPEAR_DURATION"],"mappings":"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"}

package/dist/features/post-game-stats/clock/constants.js

@@ -0,0 +1,16 @@
+const _ = {
+  IN_FRAMES: [0, 27],
+  OUT_FRAMES: [27, 34]
+}, T = 30, E = 8, A = (_.IN_FRAMES[1] - _.IN_FRAMES[0]) / T * 1e3, I = 1e3, O = 1e3, N = 200, P = 200, R = 133;
+export {
+  _ as CLOCK,
+  A as CLOCK_INFRAME_LOTTIE_TO_PLAY,
+  E as CLOCK_TIME_SPENT_DURATION,
+  T as CLOCK_TIME_SPENT_FPS,
+  N as TEXT_APPEAR_DURATION,
+  P as TEXT_DISAPPEAR_DELAY,
+  R as TEXT_DISAPPEAR_DURATION,
+  O as TIME_LOTTIE_TO_PLAY_IN,
+  I as TIME_SHOWN_HOLD_TIME
+};
+//# sourceMappingURL=constants.js.map

package/dist/features/post-game-stats/clock/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../src/features/post-game-stats/clock/constants.ts"],"sourcesContent":["export const CLOCK: { IN_FRAMES: [number, number]; OUT_FRAMES: [number, number] } = {\n  IN_FRAMES: [0, 27],\n  OUT_FRAMES: [27, 34],\n};\n\nexport const CLOCK_TIME_SPENT_FPS = 30;\nexport const CLOCK_TIME_SPENT_DURATION = 8; // in sec\n\nexport const CLOCK_INFRAME_LOTTIE_TO_PLAY =\n  ((CLOCK.IN_FRAMES[1] - CLOCK.IN_FRAMES[0]) / CLOCK_TIME_SPENT_FPS) * 1000;\n\n// in ms\nexport const TIME_SHOWN_HOLD_TIME = 1000;\nexport const TIME_LOTTIE_TO_PLAY_IN = 1000;\nexport const TEXT_APPEAR_DURATION = 200;\nexport const TEXT_DISAPPEAR_DELAY = 200;\nexport const TEXT_DISAPPEAR_DURATION = 133;\n"],"names":["CLOCK","CLOCK_TIME_SPENT_FPS","CLOCK_TIME_SPENT_DURATION","CLOCK_INFRAME_LOTTIE_TO_PLAY","TIME_SHOWN_HOLD_TIME","TIME_LOTTIE_TO_PLAY_IN","TEXT_APPEAR_DURATION","TEXT_DISAPPEAR_DELAY","TEXT_DISAPPEAR_DURATION"],"mappings":"AAAO,MAAMA,IAAuE;AAAA,EAClF,WAAW,CAAC,GAAG,EAAE;AAAA,EACjB,YAAY,CAAC,IAAI,EAAE;AACrB,GAEaC,IAAuB,IACvBC,IAA4B,GAE5BC,KACTH,EAAM,UAAU,CAAC,IAAIA,EAAM,UAAU,CAAC,KAAKC,IAAwB,KAG1DG,IAAuB,KACvBC,IAAyB,KACzBC,IAAuB,KACvBC,IAAuB,KACvBC,IAA0B;"}

package/dist/features/post-game-stats/digital-meter/digital-meter.js

@@ -1,134 +1,134 @@
-import { jsxs as n, jsx as r, Fragment as h } from "react/jsx-runtime";
-import { memo as k, useState as b, useEffect as G } from "react";
-import { LOTTIE as O } from "../../../assets/lottie/lottie.js";
-import { GAME_LAUNCHER_SIZE as s } from "../../circle-games/game-launcher/comps/card-container/constants.js";
+import { jsxs as c, jsx as r, Fragment as h } from "react/jsx-runtime";
+import { memo as O, useState as p, useEffect as W } from "react";
+import { LOTTIE as M } from "../../../assets/lottie/lottie.js";
+import { GAME_LAUNCHER_SIZE as a } from "../../circle-games/game-launcher/comps/card-container/constants.js";
 import E from "../../ui/layout/flex-view.js";
-import W from "../../ui/separator/separator.js";
-import p from "../../ui/text/text.js";
-import { NumberCountAnimation as M } from "../number-count-animation/number-count-animation.js";
+import y from "../../ui/lottie-animation/lottie-animation.js";
+import w from "../../ui/separator/separator.js";
+import R from "../../ui/text/text.js";
+import { NumberCountAnimation as B } from "../number-count-animation/number-count-animation.js";
 import { AnimatedArc as _ } from "./comp/animated-arc/animated-arc.js";
-import { TARGET_ACHIEVED_DELAY as y, TOTAL_ANIMATION_DURATION as F, TOTAL_ARC_AVAILABLE as l, BORDER_OFFSET as $, PROGRESS_FILL_DURATION as T, PROGRESS_FILL_DELAY as f } from "./constants.js";
-import { DigitalMeter as u, ContentContainer as w, NumberCountContainer as B, RainboxColorText as g, LineMarking as R, MarkingContainer as L, MarkingText as C, HelperTextWrapper as P, HelperTextPrimary as U, HelperTextSecondary as j } from "./digital-meter-styled.js";
-import Y from "../../ui/lottie-animation/lottie-animation.js";
-const ir = k(
+import { TARGET_ACHIEVED_DELAY as L, TOTAL_ARC_AVAILABLE as A, BORDER_OFFSET as $, PROGRESS_FILL_DURATION as s, PROGRESS_FILL_DELAY as f, TOTAL_ANIMATION_DURATION as P } from "./constants.js";
+import { DigitalMeter as U, ContentContainer as j, NumberCountContainer as u, RainboxColorText as g, LineMarking as C, MarkingContainer as D, MarkingText as S, HelperTextWrapper as Y, HelperTextPrimary as K, HelperTextSecondary as X } from "./digital-meter-styled.js";
+const or = O(
   ({
-    show: a,
-    value: A,
+    show: H,
+    value: m,
     maxValue: t,
-    targetValue: o = 0,
-    displayText: D,
-    progressType: m,
-    helperTextPrimary: H,
-    helperTextSecondary: N,
+    targetValue: i = 0,
+    displayText: N,
+    progressType: d,
+    helperTextPrimary: k,
+    helperTextSecondary: b,
     onComplete: I
   }) => {
-    const [c, S] = b(!1);
-    return G(() => {
-      let i, e;
-      return a && (i = setTimeout(() => {
-        A >= o && S(!0);
-      }, y * 1e3), e = setTimeout(() => {
-        I();
-      }, F * 1e3)), () => {
-        i && clearTimeout(i), e && clearTimeout(e);
+    const [l, F] = p(!1), [T, G] = p(H);
+    return W(() => {
+      let n, e, o = !!(i && m >= i);
+      return T && (o && (n = setTimeout(() => {
+        F(!0);
+      }, L * 1e3)), e = setTimeout(() => {
+        I(), G(!1);
+      }, (o ? P : L) * 1e3)), () => {
+        n && clearTimeout(n), e && clearTimeout(e);
       };
-    }, [a, A, o, I]), a ? /* @__PURE__ */ n(u, { $isTargetAchieved: c, children: [
+    }, [T, m, i, I]), T ? /* @__PURE__ */ c(U, { $isTargetAchieved: l, children: [
       /* @__PURE__ */ r(
         _,
         {
-          targetAngle: l,
+          targetAngle: A,
           strokeWidth: 16,
           color: "BLACK_5",
-          radius: (s - $) / 2,
+          radius: (a - $) / 2,
           duration: 0
         }
       ),
-      /* @__PURE__ */ r(w, { children: /* @__PURE__ */ n(E, { $flexDirection: "column", $alignItems: "center", children: [
-        /* @__PURE__ */ n(E, { $flexDirection: "row", $alignItems: "flex-end", children: [
-          /* @__PURE__ */ r(B, { children: /* @__PURE__ */ r(
+      /* @__PURE__ */ r(j, { children: /* @__PURE__ */ c(E, { $flexDirection: "column", $alignItems: "center", children: [
+        /* @__PURE__ */ c(E, { $flexDirection: "row", $alignItems: "flex-end", children: [
+          /* @__PURE__ */ r(u, { children: /* @__PURE__ */ r(
             g,
             {
               $renderAs: "ah1",
               $color: "GREEN_4",
-              $isTargetAchieved: c,
+              $isTargetAchieved: l,
               children: /* @__PURE__ */ r(
-                M,
+                B,
                 {
                   initialValue: 0,
-                  targetValue: A,
-                  durationInSec: T,
+                  targetValue: m,
+                  durationInSec: s,
                   delayInSec: f
                 }
               )
             }
           ) }),
-          m === "stepper" && /* @__PURE__ */ n(p, { $renderAs: "ac2", $color: "WHITE", children: [
+          d === "stepper" && /* @__PURE__ */ c(R, { $renderAs: "ac2", $color: "WHITE", children: [
             "/",
             t
           ] })
         ] }),
-        /* @__PURE__ */ r(W, { height: 8 }),
-        /* @__PURE__ */ r(p, { $renderAs: "ac4-black", $color: "WHITE_T_60", children: D })
+        /* @__PURE__ */ r(w, { height: 8 }),
+        /* @__PURE__ */ r(R, { $renderAs: "ac4-black", $color: "WHITE_T_60", children: N })
       ] }) }),
-      m === "stepper" && Array.from({ length: A }, (i, e) => {
-        const d = l / t;
+      d === "stepper" && Array.from({ length: m }, (n, e) => {
+        const o = A / t;
         return /* @__PURE__ */ r(
           _,
           {
-            startAngle: d * e,
-            targetAngle: d,
+            startAngle: o * e,
+            targetAngle: o,
             strokeWidth: 12,
             color: "GREEN_4",
-            radius: (s - $) / 2,
+            radius: (a - $) / 2,
             mode: "fade",
-            duration: T / t,
-            delay: f + T / t * e,
-            playRainbowColors: c
+            duration: s / t,
+            delay: f + s / t * e,
+            playRainbowColors: l
           },
           e
         );
       }),
-      m === "stepper" && Array.from({ length: t + 1 }, (i, e) => {
-        const d = l / t;
-        return /* @__PURE__ */ n(h, { children: [
-          /* @__PURE__ */ r(R, { $angle: d * e }, e + "linemarking"),
-          /* @__PURE__ */ r(L, { $angle: d * e, children: /* @__PURE__ */ r(C, { $angle: d * e, children: /* @__PURE__ */ r(
+      d === "stepper" && Array.from({ length: t + 1 }, (n, e) => {
+        const o = A / t;
+        return /* @__PURE__ */ c(h, { children: [
+          /* @__PURE__ */ r(C, { $angle: o * e }, e + "linemarking"),
+          /* @__PURE__ */ r(D, { $angle: o * e, children: /* @__PURE__ */ r(S, { $angle: o * e, children: /* @__PURE__ */ r(
             g,
             {
               $renderAs: "ac4-black",
-              $isTargetAchieved: e === o && c,
-              $color: e === o ? "GREEN_4" : "WHITE_T_60",
+              $isTargetAchieved: e === i && l,
+              $color: i && e === i ? "GREEN_4" : "WHITE_T_60",
               children: e
             }
           ) }) }, e)
         ] });
       }),
-      m === "linear" && /* @__PURE__ */ n(h, { children: [
+      d === "linear" && /* @__PURE__ */ c(h, { children: [
         /* @__PURE__ */ r(
           _,
           {
-            targetAngle: A * l / t,
+            targetAngle: m * A / t,
             strokeWidth: 12,
             color: "GREEN_4",
-            radius: (s - $) / 2,
-            duration: T,
+            radius: (a - $) / 2,
+            duration: s,
             delay: f,
-            playRainbowColors: c
+            playRainbowColors: l
           }
         ),
-        /* @__PURE__ */ n(h, { children: [
-          /* @__PURE__ */ r(R, { $angle: o * l / t }),
-          Array.from(/* @__PURE__ */ new Set([0, o, t])).map((i, e) => /* @__PURE__ */ r(
-            L,
+        /* @__PURE__ */ c(h, { children: [
+          i && /* @__PURE__ */ r(C, { $angle: i * A / t }),
+          Array.from(/* @__PURE__ */ new Set([0, i, t])).map((n, e) => /* @__PURE__ */ r(
+            D,
             {
-              $angle: i * l / t,
-              children: /* @__PURE__ */ r(C, { $angle: i * l / t, children: /* @__PURE__ */ r(
+              $angle: n * A / t,
+              children: /* @__PURE__ */ r(S, { $angle: n * A / t, children: /* @__PURE__ */ r(
                 g,
                 {
                   $renderAs: "ac4-black",
-                  $color: i === o ? "GREEN_4" : "WHITE_T_60",
-                  $isTargetAchieved: A >= i && c && i === o,
-                  children: i
+                  $color: i && n === i ? "GREEN_4" : "WHITE_T_60",
+                  $isTargetAchieved: m >= n && l && n === i,
+                  children: n
                 }
               ) })
             },
@@ -136,17 +136,17 @@ const ir = k(
           ))
         ] })
       ] }),
-      /* @__PURE__ */ n(P, { children: [
-        c && /* @__PURE__ */ r(Y, { src: O.TARGET_ACHIEVED_TEXT }),
-        !c && /* @__PURE__ */ n(E, { $flexDirection: "column", $alignItems: "center", children: [
-          /* @__PURE__ */ r(U, { $renderAs: "ac4-black", $color: "WHITE_T_60", children: H }),
-          /* @__PURE__ */ r(j, { $renderAs: "ab1", $color: "WHITE", children: N })
+      /* @__PURE__ */ c(Y, { children: [
+        l && /* @__PURE__ */ r(y, { src: M.TARGET_ACHIEVED_TEXT }),
+        !l && /* @__PURE__ */ c(E, { $flexDirection: "column", $alignItems: "center", children: [
+          /* @__PURE__ */ r(K, { $renderAs: "ac4-black", $color: "WHITE_T_60", children: k }),
+          /* @__PURE__ */ r(X, { $renderAs: "ab1", $color: "WHITE", children: b })
         ] })
       ] })
     ] }) : null;
   }
 );
 export {
-  ir as DigitalMeter
+  or as DigitalMeter
 };
 //# sourceMappingURL=digital-meter.js.map

package/dist/features/post-game-stats/digital-meter/digital-meter.js.map

@@ -1 +1 @@
-{"version":3,"file":"digital-meter.js","sources":["../../../../src/features/post-game-stats/digital-meter/digital-meter.tsx"],"sourcesContent":["import type { IDigitalMeterProps } from './digital-meter-types';\nimport type { FC } from 'react';\n\nimport { memo, useEffect, useState } from 'react';\n\nimport { LOTTIE } from '../../../assets/lottie/lottie';\nimport { GAME_LAUNCHER_SIZE } from '../../circle-games/game-launcher/comps/card-container/constants';\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport Text from '../../ui/text/text';\nimport { NumberCountAnimation } from '../number-count-animation/number-count-animation';\nimport { AnimatedArc } from './comp/animated-arc/animated-arc';\nimport {\n  BORDER_OFFSET,\n  PROGRESS_FILL_DELAY,\n  PROGRESS_FILL_DURATION,\n  TARGET_ACHIEVED_DELAY,\n  TOTAL_ANIMATION_DURATION,\n  TOTAL_ARC_AVAILABLE,\n} from './constants';\nimport * as Styled from './digital-meter-styled';\nimport LottieAnimation from '../../ui/lottie-animation/lottie-animation';\n\nexport const DigitalMeter: FC<IDigitalMeterProps> = memo(\n  ({\n    show,\n    value,\n    maxValue,\n    targetValue = 0,\n    displayText,\n    progressType,\n    helperTextPrimary,\n    helperTextSecondary,\n    onComplete,\n  }) => {\n    const [isTargetAchieved, setIsTargetAchieved] = useState(false);\n\n    useEffect(() => {\n      let timer: ReturnType<typeof setTimeout>;\n      let timerForAnimationComplete: ReturnType<typeof setTimeout>;\n\n      if (show) {\n        timer = setTimeout(() => {\n          if (value >= targetValue) {\n            setIsTargetAchieved(true);\n          }\n        }, TARGET_ACHIEVED_DELAY * 1000);\n\n        timerForAnimationComplete = setTimeout(() => {\n          onComplete();\n        }, TOTAL_ANIMATION_DURATION * 1000);\n      }\n\n      return () => {\n        timer && clearTimeout(timer);\n        timerForAnimationComplete && clearTimeout(timerForAnimationComplete);\n      };\n    }, [show, value, targetValue, onComplete]);\n\n    if (show) {\n      return (\n        <Styled.DigitalMeter $isTargetAchieved={isTargetAchieved}>\n          {/* complete arc area to be filled */}\n          <AnimatedArc\n            targetAngle={TOTAL_ARC_AVAILABLE}\n            strokeWidth={16}\n            color=\"BLACK_5\"\n            radius={(GAME_LAUNCHER_SIZE - BORDER_OFFSET) / 2}\n            duration={0}\n          />\n\n          {/* center area for the content */}\n          <Styled.ContentContainer>\n            <FlexView $flexDirection=\"column\" $alignItems=\"center\">\n              <FlexView $flexDirection=\"row\" $alignItems=\"flex-end\">\n                <Styled.NumberCountContainer>\n                  <Styled.RainboxColorText\n                    $renderAs=\"ah1\"\n                    $color=\"GREEN_4\"\n                    $isTargetAchieved={isTargetAchieved}\n                  >\n                    <NumberCountAnimation\n                      initialValue={0}\n                      targetValue={value}\n                      durationInSec={PROGRESS_FILL_DURATION}\n                      delayInSec={PROGRESS_FILL_DELAY}\n                    />\n                  </Styled.RainboxColorText>\n                </Styled.NumberCountContainer>\n                {progressType === 'stepper' && (\n                  <Text $renderAs=\"ac2\" $color=\"WHITE\">\n                    /{maxValue}\n                  </Text>\n                )}\n              </FlexView>\n              <Separator height={8} />\n              <Text $renderAs=\"ac4-black\" $color=\"WHITE_T_60\">\n                {displayText}\n              </Text>\n            </FlexView>\n          </Styled.ContentContainer>\n\n          {/* stepper animation */}\n          {progressType === 'stepper' &&\n            Array.from({ length: value }, (_, index) => {\n              const arcLength = TOTAL_ARC_AVAILABLE / maxValue;\n\n              return (\n                <AnimatedArc\n                  key={index}\n                  startAngle={arcLength * index}\n                  targetAngle={arcLength}\n                  strokeWidth={12}\n                  color=\"GREEN_4\"\n                  radius={(GAME_LAUNCHER_SIZE - BORDER_OFFSET) / 2}\n                  mode=\"fade\"\n                  duration={PROGRESS_FILL_DURATION / maxValue}\n                  delay={PROGRESS_FILL_DELAY + (PROGRESS_FILL_DURATION / maxValue) * index}\n                  playRainbowColors={isTargetAchieved}\n                />\n              );\n            })}\n\n          {/* numbers with markings */}\n          {progressType === 'stepper' &&\n            Array.from({ length: maxValue + 1 }, (_, index) => {\n              const arcLength = TOTAL_ARC_AVAILABLE / maxValue;\n\n              return (\n                <>\n                  <Styled.LineMarking key={index + 'linemarking'} $angle={arcLength * index} />\n\n                  <Styled.MarkingContainer key={index} $angle={arcLength * index}>\n                    <Styled.MarkingText $angle={arcLength * index}>\n                      <Styled.RainboxColorText\n                        $renderAs=\"ac4-black\"\n                        $isTargetAchieved={index === targetValue && isTargetAchieved}\n                        $color={index === targetValue ? 'GREEN_4' : 'WHITE_T_60'}\n                      >\n                        {index}\n                      </Styled.RainboxColorText>\n                    </Styled.MarkingText>\n                  </Styled.MarkingContainer>\n                </>\n              );\n            })}\n\n          {/* progress of linear */}\n          {progressType === 'linear' && (\n            <>\n              <AnimatedArc\n                targetAngle={(value * TOTAL_ARC_AVAILABLE) / maxValue}\n                strokeWidth={12}\n                color=\"GREEN_4\"\n                radius={(GAME_LAUNCHER_SIZE - BORDER_OFFSET) / 2}\n                duration={PROGRESS_FILL_DURATION}\n                delay={PROGRESS_FILL_DELAY}\n                playRainbowColors={isTargetAchieved}\n              />\n              <>\n                {/* target line marking */}\n                <Styled.LineMarking $angle={(targetValue * TOTAL_ARC_AVAILABLE) / maxValue} />\n\n                {/* all markings */}\n                {Array.from(new Set([0, targetValue, maxValue])).map((val, index) => (\n                  <Styled.MarkingContainer\n                    key={index}\n                    $angle={(val * TOTAL_ARC_AVAILABLE) / maxValue}\n                  >\n                    <Styled.MarkingText $angle={(val * TOTAL_ARC_AVAILABLE) / maxValue}>\n                      <Styled.RainboxColorText\n                        $renderAs=\"ac4-black\"\n                        $color={val === targetValue ? 'GREEN_4' : 'WHITE_T_60'}\n                        $isTargetAchieved={value >= val && isTargetAchieved && val === targetValue}\n                      >\n                        {val}\n                      </Styled.RainboxColorText>\n                    </Styled.MarkingText>\n                  </Styled.MarkingContainer>\n                ))}\n              </>\n            </>\n          )}\n\n          {/* helper text below the animation */}\n          <Styled.HelperTextWrapper>\n            {isTargetAchieved && (\n              <LottieAnimation src={LOTTIE.TARGET_ACHIEVED_TEXT} />\n            )}\n            {!isTargetAchieved && (\n              <FlexView $flexDirection=\"column\" $alignItems=\"center\">\n                <Styled.HelperTextPrimary $renderAs=\"ac4-black\" $color=\"WHITE_T_60\">\n                  {helperTextPrimary}\n                </Styled.HelperTextPrimary>\n                <Styled.HelperTextSecondary $renderAs=\"ab1\" $color=\"WHITE\">\n                  {helperTextSecondary}\n                </Styled.HelperTextSecondary>\n              </FlexView>\n            )}\n          </Styled.HelperTextWrapper>\n        </Styled.DigitalMeter>\n      );\n    }\n\n    return null;\n  },\n);\n"],"names":["DigitalMeter","memo","show","value","maxValue","targetValue","displayText","progressType","helperTextPrimary","helperTextSecondary","onComplete","isTargetAchieved","setIsTargetAchieved","useState","useEffect","timer","timerForAnimationComplete","TARGET_ACHIEVED_DELAY","TOTAL_ANIMATION_DURATION","jsxs","Styled.DigitalMeter","jsx","AnimatedArc","TOTAL_ARC_AVAILABLE","GAME_LAUNCHER_SIZE","BORDER_OFFSET","Styled.ContentContainer","FlexView","Styled.NumberCountContainer","Styled.RainboxColorText","NumberCountAnimation","PROGRESS_FILL_DURATION","PROGRESS_FILL_DELAY","Text","Separator","_","index","arcLength","Fragment","Styled.LineMarking","Styled.MarkingContainer","Styled.MarkingText","val","Styled.HelperTextWrapper","LottieAnimation","LOTTIE","Styled.HelperTextPrimary","Styled.HelperTextSecondary"],"mappings":"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"}
+{"version":3,"file":"digital-meter.js","sources":["../../../../src/features/post-game-stats/digital-meter/digital-meter.tsx"],"sourcesContent":["import type { IDigitalMeterProps } from './digital-meter-types';\nimport type { FC } from 'react';\n\nimport { memo, useEffect, useState } from 'react';\n\nimport { LOTTIE } from '../../../assets/lottie/lottie';\nimport { GAME_LAUNCHER_SIZE } from '../../circle-games/game-launcher/comps/card-container/constants';\nimport FlexView from '../../ui/layout/flex-view';\nimport LottieAnimation from '../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../ui/separator/separator';\nimport Text from '../../ui/text/text';\nimport { NumberCountAnimation } from '../number-count-animation/number-count-animation';\nimport { AnimatedArc } from './comp/animated-arc/animated-arc';\nimport {\n  BORDER_OFFSET,\n  PROGRESS_FILL_DELAY,\n  PROGRESS_FILL_DURATION,\n  TARGET_ACHIEVED_DELAY,\n  TOTAL_ANIMATION_DURATION,\n  TOTAL_ARC_AVAILABLE,\n} from './constants';\nimport * as Styled from './digital-meter-styled';\n\nexport const DigitalMeter: FC<IDigitalMeterProps> = memo(\n  ({\n    show,\n    value,\n    maxValue,\n    targetValue = 0,\n    displayText,\n    progressType,\n    helperTextPrimary,\n    helperTextSecondary,\n    onComplete,\n  }) => {\n    const [isTargetAchieved, setIsTargetAchieved] = useState(false);\n    const [starAnimation, setStarAnimation] = useState(show);\n\n    useEffect(() => {\n      let timer: ReturnType<typeof setTimeout>;\n      let timerForAnimationComplete: ReturnType<typeof setTimeout>;\n      let isTargetAchievedFlag = !!(targetValue && value >= targetValue);\n      if (starAnimation) {\n        if (isTargetAchievedFlag) {\n          timer = setTimeout(() => {\n            setIsTargetAchieved(true);\n          }, TARGET_ACHIEVED_DELAY * 1000);\n        }\n\n        let timeToFinishAnimation = isTargetAchievedFlag\n          ? TOTAL_ANIMATION_DURATION\n          : TARGET_ACHIEVED_DELAY;\n        timerForAnimationComplete = setTimeout(() => {\n          onComplete();\n          setStarAnimation(false);\n        }, timeToFinishAnimation * 1000);\n      }\n\n      return () => {\n        timer && clearTimeout(timer);\n        timerForAnimationComplete && clearTimeout(timerForAnimationComplete);\n      };\n    }, [starAnimation, value, targetValue, onComplete]);\n\n    if (starAnimation) {\n      return (\n        <Styled.DigitalMeter $isTargetAchieved={isTargetAchieved}>\n          {/* complete arc area to be filled */}\n          <AnimatedArc\n            targetAngle={TOTAL_ARC_AVAILABLE}\n            strokeWidth={16}\n            color=\"BLACK_5\"\n            radius={(GAME_LAUNCHER_SIZE - BORDER_OFFSET) / 2}\n            duration={0}\n          />\n\n          {/* center area for the content */}\n          <Styled.ContentContainer>\n            <FlexView $flexDirection=\"column\" $alignItems=\"center\">\n              <FlexView $flexDirection=\"row\" $alignItems=\"flex-end\">\n                <Styled.NumberCountContainer>\n                  <Styled.RainboxColorText\n                    $renderAs=\"ah1\"\n                    $color=\"GREEN_4\"\n                    $isTargetAchieved={isTargetAchieved}\n                  >\n                    <NumberCountAnimation\n                      initialValue={0}\n                      targetValue={value}\n                      durationInSec={PROGRESS_FILL_DURATION}\n                      delayInSec={PROGRESS_FILL_DELAY}\n                    />\n                  </Styled.RainboxColorText>\n                </Styled.NumberCountContainer>\n                {progressType === 'stepper' && (\n                  <Text $renderAs=\"ac2\" $color=\"WHITE\">\n                    /{maxValue}\n                  </Text>\n                )}\n              </FlexView>\n              <Separator height={8} />\n              <Text $renderAs=\"ac4-black\" $color=\"WHITE_T_60\">\n                {displayText}\n              </Text>\n            </FlexView>\n          </Styled.ContentContainer>\n\n          {/* stepper animation */}\n          {progressType === 'stepper' &&\n            Array.from({ length: value }, (_, index) => {\n              const arcLength = TOTAL_ARC_AVAILABLE / maxValue;\n\n              return (\n                <AnimatedArc\n                  key={index}\n                  startAngle={arcLength * index}\n                  targetAngle={arcLength}\n                  strokeWidth={12}\n                  color=\"GREEN_4\"\n                  radius={(GAME_LAUNCHER_SIZE - BORDER_OFFSET) / 2}\n                  mode=\"fade\"\n                  duration={PROGRESS_FILL_DURATION / maxValue}\n                  delay={PROGRESS_FILL_DELAY + (PROGRESS_FILL_DURATION / maxValue) * index}\n                  playRainbowColors={isTargetAchieved}\n                />\n              );\n            })}\n\n          {/* numbers with markings */}\n          {progressType === 'stepper' &&\n            Array.from({ length: maxValue + 1 }, (_, index) => {\n              const arcLength = TOTAL_ARC_AVAILABLE / maxValue;\n\n              return (\n                <>\n                  <Styled.LineMarking key={index + 'linemarking'} $angle={arcLength * index} />\n\n                  <Styled.MarkingContainer key={index} $angle={arcLength * index}>\n                    <Styled.MarkingText $angle={arcLength * index}>\n                      <Styled.RainboxColorText\n                        $renderAs=\"ac4-black\"\n                        $isTargetAchieved={index === targetValue && isTargetAchieved}\n                        $color={targetValue && index === targetValue ? 'GREEN_4' : 'WHITE_T_60'}\n                      >\n                        {index}\n                      </Styled.RainboxColorText>\n                    </Styled.MarkingText>\n                  </Styled.MarkingContainer>\n                </>\n              );\n            })}\n\n          {/* progress of linear */}\n          {progressType === 'linear' && (\n            <>\n              <AnimatedArc\n                targetAngle={(value * TOTAL_ARC_AVAILABLE) / maxValue}\n                strokeWidth={12}\n                color=\"GREEN_4\"\n                radius={(GAME_LAUNCHER_SIZE - BORDER_OFFSET) / 2}\n                duration={PROGRESS_FILL_DURATION}\n                delay={PROGRESS_FILL_DELAY}\n                playRainbowColors={isTargetAchieved}\n              />\n              <>\n                {/* target line marking */}\n                {targetValue && (\n                  <Styled.LineMarking $angle={(targetValue * TOTAL_ARC_AVAILABLE) / maxValue} />\n                )}\n\n                {/* all markings */}\n                {Array.from(new Set([0, targetValue, maxValue])).map((val, index) => (\n                  <Styled.MarkingContainer\n                    key={index}\n                    $angle={(val * TOTAL_ARC_AVAILABLE) / maxValue}\n                  >\n                    <Styled.MarkingText $angle={(val * TOTAL_ARC_AVAILABLE) / maxValue}>\n                      <Styled.RainboxColorText\n                        $renderAs=\"ac4-black\"\n                        $color={targetValue && val === targetValue ? 'GREEN_4' : 'WHITE_T_60'}\n                        $isTargetAchieved={value >= val && isTargetAchieved && val === targetValue}\n                      >\n                        {val}\n                      </Styled.RainboxColorText>\n                    </Styled.MarkingText>\n                  </Styled.MarkingContainer>\n                ))}\n              </>\n            </>\n          )}\n\n          {/* helper text below the animation */}\n          <Styled.HelperTextWrapper>\n            {isTargetAchieved && <LottieAnimation src={LOTTIE.TARGET_ACHIEVED_TEXT} />}\n            {!isTargetAchieved && (\n              <FlexView $flexDirection=\"column\" $alignItems=\"center\">\n                <Styled.HelperTextPrimary $renderAs=\"ac4-black\" $color=\"WHITE_T_60\">\n                  {helperTextPrimary}\n                </Styled.HelperTextPrimary>\n                <Styled.HelperTextSecondary $renderAs=\"ab1\" $color=\"WHITE\">\n                  {helperTextSecondary}\n                </Styled.HelperTextSecondary>\n              </FlexView>\n            )}\n          </Styled.HelperTextWrapper>\n        </Styled.DigitalMeter>\n      );\n    }\n\n    return null;\n  },\n);\n"],"names":["DigitalMeter","memo","show","value","maxValue","targetValue","displayText","progressType","helperTextPrimary","helperTextSecondary","onComplete","isTargetAchieved","setIsTargetAchieved","useState","starAnimation","setStarAnimation","useEffect","timer","timerForAnimationComplete","isTargetAchievedFlag","TARGET_ACHIEVED_DELAY","TOTAL_ANIMATION_DURATION","jsxs","Styled.DigitalMeter","jsx","AnimatedArc","TOTAL_ARC_AVAILABLE","GAME_LAUNCHER_SIZE","BORDER_OFFSET","Styled.ContentContainer","FlexView","Styled.NumberCountContainer","Styled.RainboxColorText","NumberCountAnimation","PROGRESS_FILL_DURATION","PROGRESS_FILL_DELAY","Text","Separator","_","index","arcLength","Fragment","Styled.LineMarking","Styled.MarkingContainer","Styled.MarkingText","val","Styled.HelperTextWrapper","LottieAnimation","LOTTIE","Styled.HelperTextPrimary","Styled.HelperTextSecondary"],"mappings":"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"}

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

@@ -1,7 +1,7 @@
-import { jsx as N } from "react/jsx-runtime";
-import { memo as P, useEffect as T } from "react";
+import { jsx as I } from "react/jsx-runtime";
+import { memo as N, useEffect as P } from "react";
 import { LOTTIE as o } from "../../../assets/lottie/lottie.js";
-import { GAME_LAUNCHER_SIZE as a } from "../../circle-games/game-launcher/comps/card-container/constants.js";
+import { GAME_LAUNCHER_SIZE as T } from "../../circle-games/game-launcher/comps/card-container/constants.js";
 import { GAME_LAUNCHER_ASSET_PADDING as O, GAME_LAUNCHER_PROGRESS_RING_STROKE_WIDTH as c } from "../../circle-games/game-launcher/comps/segmented-game-card/constants.js";
 import { useCircleSounds as f } from "../../circle-games/hooks/use-circle-sounds/use-circle-sounds.js";
 import { CircleSoundKey as E } from "../../circle-games/hooks/use-circle-sounds/use-circle-sounds-enums.js";
@@ -20,30 +20,32 @@ const _ = {
   point50: o.POINT50,
   point60: o.POINT60,
   point100: o.POINT100
-}, r = a + O - c, l = {
+}, p = T + O - c, l = {
   loop: !1,
   autoplay: !0,
   renderer: "canvas"
-}, h = P((p) => {
-  const { point: m = 0, onReveal: n, onComplete: i, show: e } = p, { play: s } = f(), t = _[`point${m}`], I = {
+}, G = N((m) => {
+  const { point: e = 0, onReveal: n, onComplete: i, show: r } = m, { play: s } = f(), t = _[`point${e}`], a = {
     name: "complete",
     callback: i
   };
-  return T(() => {
-    t || i(), e && t && (n == null || n());
-  }, [t, i, n, e]), e && t ? /* @__PURE__ */ N(
+  return P(() => {
+    if (!t)
+      throw i(), new Error(`Animation path not found for point: ${e}`);
+    r && t && (n == null || n());
+  }, [t, i, n, r]), r && t ? /* @__PURE__ */ I(
     A,
     {
-      width: r,
-      height: r,
+      width: p,
+      height: p,
       src: t,
       settings: l,
-      eventListener: I,
+      eventListener: a,
       onRender: () => s(E.POINTS_AWARDED)
     }
   ) : null;
 });
 export {
-  h as Points
+  G as Points
 };
 //# sourceMappingURL=points.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"points.js","sources":["../../../../src/features/post-game-stats/points/points.tsx"],"sourcesContent":["import type { IPointsProps } from './points-types';\nimport type { AnimationEventName } from 'lottie-web';\nimport type { FC } from 'react';\n\nimport { memo, useEffect } from 'react';\n\nimport { LOTTIE } from '../../../assets/lottie/lottie';\nimport { GAME_LAUNCHER_SIZE } from '../../circle-games/game-launcher/comps/card-container/constants';\nimport {\n  GAME_LAUNCHER_ASSET_PADDING,\n  GAME_LAUNCHER_PROGRESS_RING_STROKE_WIDTH,\n} from '../../circle-games/game-launcher/comps/segmented-game-card/constants';\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 LottieAnimation from '../../ui/lottie-animation/lottie-animation';\n\nconst POINTS_MAP: Record<string, string> = {\n  point1: LOTTIE.POINT1,\n  point5: LOTTIE.POINT5,\n  point10: LOTTIE.POINT10,\n  point15: LOTTIE.POINT15,\n  point20: LOTTIE.POINT20,\n  point25: LOTTIE.POINT25,\n  point30: LOTTIE.POINT30,\n  point35: LOTTIE.POINT35,\n  point40: LOTTIE.POINT40,\n  point45: LOTTIE.POINT45,\n  point50: LOTTIE.POINT50,\n  point60: LOTTIE.POINT60,\n  point100: LOTTIE.POINT100,\n};\nconst animationDimension =\n  GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING - GAME_LAUNCHER_PROGRESS_RING_STROKE_WIDTH;\nconst animationSettings = {\n  loop: false,\n  autoplay: true,\n  renderer: 'canvas',\n};\n\nexport const Points: FC<IPointsProps> = memo(props => {\n  const { point = 0, onReveal, onComplete, show } = props;\n\n  const { play } = useCircleSounds();\n\n  const animationPath = POINTS_MAP[`point${point}`];\n  const animationEventListener = {\n    name: 'complete' as AnimationEventName,\n    callback: onComplete,\n  };\n\n  useEffect(() => {\n    if (!animationPath) onComplete();\n\n    if (show && animationPath) onReveal?.();\n  }, [animationPath, onComplete, onReveal, show]);\n\n  if (show && animationPath) {\n    return (\n      <LottieAnimation\n        width={animationDimension}\n        height={animationDimension}\n        src={animationPath}\n        settings={animationSettings}\n        eventListener={animationEventListener}\n        onRender={() => play(CircleSoundKey.POINTS_AWARDED)}\n      />\n    );\n  }\n\n  return null;\n});\n"],"names":["POINTS_MAP","LOTTIE","animationDimension","GAME_LAUNCHER_SIZE","GAME_LAUNCHER_ASSET_PADDING","GAME_LAUNCHER_PROGRESS_RING_STROKE_WIDTH","animationSettings","Points","memo","props","point","onReveal","onComplete","show","play","useCircleSounds","animationPath","animationEventListener","useEffect","jsx","LottieAnimation","CircleSoundKey"],"mappings":";;;;;;;;AAgBA,MAAMA,IAAqC;AAAA,EACzC,QAAQC,EAAO;AAAA,EACf,QAAQA,EAAO;AAAA,EACf,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,UAAUA,EAAO;AACnB,GACMC,IACJC,IAAqBC,IAA8BC,GAC/CC,IAAoB;AAAA,EACxB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AACZ,GAEaC,IAA2BC,EAAK,CAASC,MAAA;AACpD,QAAM,EAAE,OAAAC,IAAQ,GAAG,UAAAC,GAAU,YAAAC,GAAY,MAAAC,EAAS,IAAAJ,GAE5C,EAAE,MAAAK,MAASC,KAEXC,IAAgBhB,EAAW,QAAQU,CAAK,EAAE,GAC1CO,IAAyB;AAAA,IAC7B,MAAM;AAAA,IACN,UAAUL;AAAA,EAAA;AASZ,SANAM,EAAU,MAAM;AACV,IAACF,KAA0BJ,KAE3BC,KAAQG,MAA0BL,KAAA,QAAAA;AAAA,KACrC,CAACK,GAAeJ,GAAYD,GAAUE,CAAI,CAAC,GAE1CA,KAAQG,IAER,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAOlB;AAAA,MACP,QAAQA;AAAA,MACR,KAAKc;AAAA,MACL,UAAUV;AAAA,MACV,eAAeW;AAAA,MACf,UAAU,MAAMH,EAAKO,EAAe,cAAc;AAAA,IAAA;AAAA,EAAA,IAKjD;AACT,CAAC;"}
+{"version":3,"file":"points.js","sources":["../../../../src/features/post-game-stats/points/points.tsx"],"sourcesContent":["import type { IPointsProps } from './points-types';\nimport type { AnimationEventName } from 'lottie-web';\nimport type { FC } from 'react';\n\nimport { memo, useEffect } from 'react';\n\nimport { LOTTIE } from '../../../assets/lottie/lottie';\nimport { GAME_LAUNCHER_SIZE } from '../../circle-games/game-launcher/comps/card-container/constants';\nimport {\n  GAME_LAUNCHER_ASSET_PADDING,\n  GAME_LAUNCHER_PROGRESS_RING_STROKE_WIDTH,\n} from '../../circle-games/game-launcher/comps/segmented-game-card/constants';\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 LottieAnimation from '../../ui/lottie-animation/lottie-animation';\n\nconst POINTS_MAP: Record<string, string> = {\n  point1: LOTTIE.POINT1,\n  point5: LOTTIE.POINT5,\n  point10: LOTTIE.POINT10,\n  point15: LOTTIE.POINT15,\n  point20: LOTTIE.POINT20,\n  point25: LOTTIE.POINT25,\n  point30: LOTTIE.POINT30,\n  point35: LOTTIE.POINT35,\n  point40: LOTTIE.POINT40,\n  point45: LOTTIE.POINT45,\n  point50: LOTTIE.POINT50,\n  point60: LOTTIE.POINT60,\n  point100: LOTTIE.POINT100,\n};\nconst animationDimension =\n  GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING - GAME_LAUNCHER_PROGRESS_RING_STROKE_WIDTH;\nconst animationSettings = {\n  loop: false,\n  autoplay: true,\n  renderer: 'canvas',\n};\n\nexport const Points: FC<IPointsProps> = memo(props => {\n  const { point = 0, onReveal, onComplete, show } = props;\n\n  const { play } = useCircleSounds();\n\n  const animationPath = POINTS_MAP[`point${point}`];\n  const animationEventListener = {\n    name: 'complete' as AnimationEventName,\n    callback: onComplete,\n  };\n\n  useEffect(() => {\n    if (!animationPath) {\n      onComplete();\n      throw new Error(`Animation path not found for point: ${point}`);\n    }\n\n    if (show && animationPath) onReveal?.();\n  }, [animationPath, onComplete, onReveal, show]);\n\n  if (show && animationPath) {\n    return (\n      <LottieAnimation\n        width={animationDimension}\n        height={animationDimension}\n        src={animationPath}\n        settings={animationSettings}\n        eventListener={animationEventListener}\n        onRender={() => play(CircleSoundKey.POINTS_AWARDED)}\n      />\n    );\n  }\n\n  return null;\n});\n"],"names":["POINTS_MAP","LOTTIE","animationDimension","GAME_LAUNCHER_SIZE","GAME_LAUNCHER_ASSET_PADDING","GAME_LAUNCHER_PROGRESS_RING_STROKE_WIDTH","animationSettings","Points","memo","props","point","onReveal","onComplete","show","play","useCircleSounds","animationPath","animationEventListener","useEffect","jsx","LottieAnimation","CircleSoundKey"],"mappings":";;;;;;;;AAgBA,MAAMA,IAAqC;AAAA,EACzC,QAAQC,EAAO;AAAA,EACf,QAAQA,EAAO;AAAA,EACf,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,UAAUA,EAAO;AACnB,GACMC,IACJC,IAAqBC,IAA8BC,GAC/CC,IAAoB;AAAA,EACxB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AACZ,GAEaC,IAA2BC,EAAK,CAASC,MAAA;AACpD,QAAM,EAAE,OAAAC,IAAQ,GAAG,UAAAC,GAAU,YAAAC,GAAY,MAAAC,EAAS,IAAAJ,GAE5C,EAAE,MAAAK,MAASC,KAEXC,IAAgBhB,EAAW,QAAQU,CAAK,EAAE,GAC1CO,IAAyB;AAAA,IAC7B,MAAM;AAAA,IACN,UAAUL;AAAA,EAAA;AAYZ,SATAM,EAAU,MAAM;AACd,QAAI,CAACF;AACQ,YAAAJ,KACL,IAAI,MAAM,uCAAuCF,CAAK,EAAE;AAG5D,IAAAG,KAAQG,MAA0BL,KAAA,QAAAA;AAAA,KACrC,CAACK,GAAeJ,GAAYD,GAAUE,CAAI,CAAC,GAE1CA,KAAQG,IAER,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAOlB;AAAA,MACP,QAAQA;AAAA,MACR,KAAKc;AAAA,MACL,UAAUV;AAAA,MACV,eAAeW;AAAA,MACf,UAAU,MAAMH,EAAKO,EAAe,cAAc;AAAA,IAAA;AAAA,EAAA,IAKjD;AACT,CAAC;"}

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

@@ -1,65 +1,82 @@
-import { jsxs as G, jsx as n } from "react/jsx-runtime";
-import { memo as j, forwardRef as B, useState as C, useCallback as A, useImperativeHandle as D } from "react";
-import { DigitalMeter as M } from "./digital-meter/digital-meter.js";
-import { EPostGameStat as a } from "./enums/post-game-stats-enum.js";
-import { Points as N } from "./points/points.js";
-import { StatsWrapper as b, BlackBg as H } from "./post-game-stats-styled.js";
-import { Streak as K } from "./streak/streak.js";
-const J = j(
-  B(({ stats: e, show: E, onComplete: l }, k) => {
-    var i, t, u, x, T, h, f, y, S, c, d, v, g, P, R;
-    const [r, w] = C(0), p = A(() => {
-      var o, I;
-      if ((I = (o = e[r]) == null ? void 0 : o.onComplete) == null || I.call(o), r === e.length - 1) {
-        l == null || l();
+import { jsx as o, jsxs as y } from "react/jsx-runtime";
+import { memo as c, forwardRef as v, useState as d, useMemo as i, useCallback as u, useImperativeHandle as g } from "react";
+import { Accuracy as C } from "./accuracy/accuracy.js";
+import { Clock as A } from "./clock/clock.js";
+import { DigitalMeter as I } from "./digital-meter/digital-meter.js";
+import { EPostGameStat as l } from "./enums/post-game-stats-enum.js";
+import { Points as P } from "./points/points.js";
+import { StatsWrapper as R, BlackBg as S } from "./post-game-stats-styled.js";
+import { Streak as w } from "./streak/streak.js";
+const K = c(
+  v(({ stats: r, show: s, onComplete: p }, h) => {
+    const [n, x] = d(0), e = i(() => r[n], [n, r]), m = u(() => {
+      var a;
+      if ((a = e == null ? void 0 : e.onComplete) == null || a.call(e), n === r.length - 1) {
+        p == null || p();
         return;
       }
-      w((V) => V + 1);
-    }, [r, l, e]), m = A(() => {
-      var o;
-      (o = e[r]) != null && o.stopAtEnd || p();
-    }, [e, r, p]);
-    return D(k, () => ({
-      moveToNextAndPlay: p
-    })), !E || e.length === 0 || r >= e.length ? null : /* @__PURE__ */ G(b, { children: [
-      /* @__PURE__ */ n(H, {}),
-      /* @__PURE__ */ n(
-        N,
-        {
-          point: ((i = e[r]) == null ? void 0 : i.value) ?? 0,
-          show: ((t = e[r]) == null ? void 0 : t.type) === a.POINT,
-          onComplete: m,
-          onReveal: (u = e[r]) == null ? void 0 : u.onReveal
-        }
-      ),
-      /* @__PURE__ */ n(
-        K,
-        {
-          currStreak: ((x = e[r]) == null ? void 0 : x.value) ?? 0,
-          show: ((T = e[r]) == null ? void 0 : T.type) === a.STREAK,
-          onComplete: m,
-          helperText: (h = e[r]) == null ? void 0 : h.helperText,
-          onReveal: (f = e[r]) == null ? void 0 : f.onReveal
-        }
-      ),
-      /* @__PURE__ */ n(
-        M,
-        {
-          value: ((y = e[r]) == null ? void 0 : y.value) ?? 0,
-          maxValue: ((S = e[r]) == null ? void 0 : S.maxValue) ?? 1,
-          targetValue: ((c = e[r]) == null ? void 0 : c.targetValue) ?? 0,
-          displayText: ((d = e[r]) == null ? void 0 : d.displayText) ?? "",
-          progressType: ((v = e[r]) == null ? void 0 : v.progressType) ?? "linear",
-          helperTextPrimary: ((g = e[r]) == null ? void 0 : g.helperTextPrimary) ?? "",
-          helperTextSecondary: ((P = e[r]) == null ? void 0 : P.helperTextSecondary) ?? "",
-          show: ((R = e[r]) == null ? void 0 : R.type) === a.DIGITAL_METER,
-          onComplete: m
-        }
-      )
+      x((f) => f + 1);
+    }, [n, p, r.length, e]), t = u(() => {
+      e != null && e.stopAtEnd || m();
+    }, [e, m]);
+    g(h, () => ({
+      moveToNextAndPlay: m
+    }));
+    const T = i(() => e && e.type === l.POINT ? /* @__PURE__ */ o(
+      P,
+      {
+        point: e.value,
+        show: e.type === l.POINT,
+        onComplete: t,
+        onReveal: e.onReveal
+      }
+    ) : e && e.type === l.DIGITAL_METER ? /* @__PURE__ */ o(
+      I,
+      {
+        value: e.value,
+        maxValue: e.maxValue ?? 1,
+        targetValue: e.targetValue,
+        displayText: e.displayText ?? "",
+        progressType: e.progressType ?? "linear",
+        helperTextPrimary: e.helperTextPrimary ?? "",
+        helperTextSecondary: e.helperTextSecondary ?? "",
+        show: !0,
+        onComplete: t
+      },
+      Date.now()
+    ) : e && e.type === l.STREAK ? /* @__PURE__ */ o(
+      w,
+      {
+        currStreak: e.value,
+        show: !0,
+        onComplete: t,
+        helperText: e.helperText,
+        onReveal: e.onReveal
+      }
+    ) : e && e.type === l.ACCURACY ? /* @__PURE__ */ o(
+      C,
+      {
+        accuracy: e.value,
+        show: !0,
+        onComplete: t,
+        helperText: e.helperText
+      }
+    ) : e && e.type === l.CLOCK ? /* @__PURE__ */ o(
+      A,
+      {
+        timeInMs: e.value,
+        show: !0,
+        onComplete: t,
+        helperText: e.helperText
+      }
+    ) : null, [e, t]);
+    return !s || r.length === 0 || n >= r.length ? null : /* @__PURE__ */ y(R, { children: [
+      /* @__PURE__ */ o(S, {}),
+      T
     ] });
   })
 );
 export {
-  J as PostGameStats
+  K as PostGameStats
 };
 //# sourceMappingURL=post-game-stats.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"post-game-stats.js","sources":["../../../src/features/post-game-stats/post-game-stats.tsx"],"sourcesContent":["import type { IPostGameStatsProps, IPostGameStatsRef } from './post-game-stats-types';\n\nimport { useState, memo, useCallback, forwardRef, useImperativeHandle } from 'react';\n\nimport { DigitalMeter } from './digital-meter/digital-meter';\nimport { EPostGameStat } from './enums/post-game-stats-enum';\nimport { Points } from './points/points';\nimport * as Styled from './post-game-stats-styled';\nimport { Streak } from './streak/streak';\n\nexport const PostGameStats = memo(\n  forwardRef<IPostGameStatsRef, IPostGameStatsProps>(({ stats, show, onComplete }, ref) => {\n    const [currStatIndex, setCurrentStatIndex] = useState(0);\n\n    const moveToNextAndPlay = useCallback(() => {\n      stats[currStatIndex]?.onComplete?.();\n\n      if (currStatIndex === stats.length - 1) {\n        onComplete?.();\n\n        return;\n      }\n      setCurrentStatIndex(prev => prev + 1);\n    }, [currStatIndex, onComplete, stats]);\n\n    const onStatAnimationComplete = useCallback(() => {\n      if (stats[currStatIndex]?.stopAtEnd) {\n        return;\n      }\n      moveToNextAndPlay(); // Autoplay since stopAtEnd is false\n    }, [stats, currStatIndex, moveToNextAndPlay]);\n\n    useImperativeHandle(ref, () => ({\n      moveToNextAndPlay,\n    }));\n\n    if (!show || stats.length === 0 || currStatIndex >= stats.length) {\n      return null;\n    }\n\n    return (\n      <Styled.StatsWrapper>\n        <Styled.BlackBg />\n        <Points\n          point={stats[currStatIndex]?.value ?? 0}\n          show={stats[currStatIndex]?.type === EPostGameStat.POINT}\n          onComplete={onStatAnimationComplete}\n          onReveal={stats[currStatIndex]?.onReveal}\n        />\n        <Streak\n          currStreak={stats[currStatIndex]?.value ?? 0}\n          show={stats[currStatIndex]!?.type === EPostGameStat.STREAK}\n          onComplete={onStatAnimationComplete}\n          helperText={stats[currStatIndex]?.helperText}\n          onReveal={stats[currStatIndex]?.onReveal}\n        />\n        <DigitalMeter\n          value={stats[currStatIndex]?.value ?? 0}\n          maxValue={stats[currStatIndex]?.maxValue ?? 1}\n          targetValue={stats[currStatIndex]?.targetValue ?? 0}\n          displayText={stats[currStatIndex]?.displayText ?? ''}\n          progressType={stats[currStatIndex]?.progressType ?? 'linear'}\n          helperTextPrimary={stats[currStatIndex]?.helperTextPrimary ?? ''}\n          helperTextSecondary={stats[currStatIndex]?.helperTextSecondary ?? ''}\n          show={stats[currStatIndex]?.type === EPostGameStat.DIGITAL_METER}\n          onComplete={onStatAnimationComplete}\n        />\n      </Styled.StatsWrapper>\n    );\n  }),\n);\n"],"names":["PostGameStats","memo","forwardRef","stats","show","onComplete","ref","currStatIndex","setCurrentStatIndex","useState","moveToNextAndPlay","useCallback","_b","_a","prev","onStatAnimationComplete","useImperativeHandle","jsxs","Styled.StatsWrapper","jsx","Styled.BlackBg","Points","EPostGameStat","_c","Streak","_d","_e","_f","_g","DigitalMeter","_h","_i","_j","_k","_l","_m","_n","_o"],"mappings":";;;;;;;AAUO,MAAMA,IAAgBC;AAAA,EAC3BC,EAAmD,CAAC,EAAE,OAAAC,GAAO,MAAAC,GAAM,YAAAC,EAAA,GAAcC,MAAQ;;AACvF,UAAM,CAACC,GAAeC,CAAmB,IAAIC,EAAS,CAAC,GAEjDC,IAAoBC,EAAY,MAAM;;AAGtC,WAFEC,KAAAC,IAAAV,EAAAI,CAAa,MAAb,gBAAAM,EAAgB,eAAhB,QAAAD,EAAA,KAAAC,IAEFN,MAAkBJ,EAAM,SAAS,GAAG;AACzB,QAAAE,KAAA,QAAAA;AAEb;AAAA,MACF;AACoB,MAAAG,EAAA,CAAAM,MAAQA,IAAO,CAAC;AAAA,IACnC,GAAA,CAACP,GAAeF,GAAYF,CAAK,CAAC,GAE/BY,IAA0BJ,EAAY,MAAM;;AAC5C,OAAAE,IAAAV,EAAMI,CAAa,MAAnB,QAAAM,EAAsB,aAGRH;IACjB,GAAA,CAACP,GAAOI,GAAeG,CAAiB,CAAC;AAM5C,WAJAM,EAAoBV,GAAK,OAAO;AAAA,MAC9B,mBAAAI;AAAA,IACA,EAAA,GAEE,CAACN,KAAQD,EAAM,WAAW,KAAKI,KAAiBJ,EAAM,SACjD,OAIP,gBAAAc,EAACC,GAAA,EACC,UAAA;AAAA,MAAC,gBAAAC,EAAAC,GAAA,EAAe;AAAA,MAChB,gBAAAD;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,SAAOR,IAAAV,EAAMI,CAAa,MAAnB,gBAAAM,EAAsB,UAAS;AAAA,UACtC,QAAMD,IAAAT,EAAMI,CAAa,MAAnB,gBAAAK,EAAsB,UAASU,EAAc;AAAA,UACnD,YAAYP;AAAA,UACZ,WAAUQ,IAAApB,EAAMI,CAAa,MAAnB,gBAAAgB,EAAsB;AAAA,QAAA;AAAA,MAClC;AAAA,MACA,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACC,cAAYC,IAAAtB,EAAMI,CAAa,MAAnB,gBAAAkB,EAAsB,UAAS;AAAA,UAC3C,QAAMC,IAAAvB,EAAMI,CAAa,MAAnB,gBAAAmB,EAAuB,UAASJ,EAAc;AAAA,UACpD,YAAYP;AAAA,UACZ,aAAYY,IAAAxB,EAAMI,CAAa,MAAnB,gBAAAoB,EAAsB;AAAA,UAClC,WAAUC,IAAAzB,EAAMI,CAAa,MAAnB,gBAAAqB,EAAsB;AAAA,QAAA;AAAA,MAClC;AAAA,MACA,gBAAAT;AAAA,QAACU;AAAA,QAAA;AAAA,UACC,SAAOC,IAAA3B,EAAMI,CAAa,MAAnB,gBAAAuB,EAAsB,UAAS;AAAA,UACtC,YAAUC,IAAA5B,EAAMI,CAAa,MAAnB,gBAAAwB,EAAsB,aAAY;AAAA,UAC5C,eAAaC,IAAA7B,EAAMI,CAAa,MAAnB,gBAAAyB,EAAsB,gBAAe;AAAA,UAClD,eAAaC,IAAA9B,EAAMI,CAAa,MAAnB,gBAAA0B,EAAsB,gBAAe;AAAA,UAClD,gBAAcC,IAAA/B,EAAMI,CAAa,MAAnB,gBAAA2B,EAAsB,iBAAgB;AAAA,UACpD,qBAAmBC,IAAAhC,EAAMI,CAAa,MAAnB,gBAAA4B,EAAsB,sBAAqB;AAAA,UAC9D,uBAAqBC,IAAAjC,EAAMI,CAAa,MAAnB,gBAAA6B,EAAsB,wBAAuB;AAAA,UAClE,QAAMC,IAAAlC,EAAMI,CAAa,MAAnB,gBAAA8B,EAAsB,UAASf,EAAc;AAAA,UACnD,YAAYP;AAAA,QAAA;AAAA,MACd;AAAA,IACF,EAAA,CAAA;AAAA,EAAA,CAEH;AACH;"}
+{"version":3,"file":"post-game-stats.js","sources":["../../../src/features/post-game-stats/post-game-stats.tsx"],"sourcesContent":["import type { IPostGameStatsProps, IPostGameStatsRef } from './post-game-stats-types';\n\nimport { useState, memo, useCallback, forwardRef, useImperativeHandle, useMemo } from 'react';\n\nimport { Accuracy } from './accuracy/accuracy';\nimport { Clock } from './clock/clock';\nimport { DigitalMeter } from './digital-meter/digital-meter';\nimport { EPostGameStat } from './enums/post-game-stats-enum';\nimport { Points } from './points/points';\nimport * as Styled from './post-game-stats-styled';\nimport { Streak } from './streak/streak';\n\nexport const PostGameStats = memo(\n  forwardRef<IPostGameStatsRef, IPostGameStatsProps>(({ stats, show, onComplete }, ref) => {\n    const [currStatIndex, setCurrentStatIndex] = useState(0);\n    const currStatData = useMemo(() => stats[currStatIndex], [currStatIndex, stats]);\n\n    const moveToNextAndPlay = useCallback(() => {\n      currStatData?.onComplete?.();\n\n      if (currStatIndex === stats.length - 1) {\n        onComplete?.();\n\n        return;\n      }\n      setCurrentStatIndex(prev => prev + 1);\n    }, [currStatIndex, onComplete, stats.length, currStatData]);\n\n    const onStatAnimationComplete = useCallback(() => {\n      if (currStatData?.stopAtEnd) {\n        return;\n      }\n      moveToNextAndPlay(); // Autoplay since stopAtEnd is false\n    }, [currStatData, moveToNextAndPlay]);\n\n    useImperativeHandle(ref, () => ({\n      moveToNextAndPlay,\n    }));\n\n    const currentStat = useMemo(() => {\n      if (currStatData && currStatData.type === EPostGameStat.POINT) {\n        return (\n          <Points\n            point={currStatData.value}\n            show={currStatData.type === EPostGameStat.POINT}\n            onComplete={onStatAnimationComplete}\n            onReveal={currStatData.onReveal}\n          />\n        );\n      }\n\n      if (currStatData && currStatData.type === EPostGameStat.DIGITAL_METER) {\n        return (\n          <DigitalMeter\n            key={Date.now()}\n            value={currStatData.value}\n            maxValue={currStatData.maxValue ?? 1}\n            targetValue={currStatData.targetValue}\n            displayText={currStatData.displayText ?? ''}\n            progressType={currStatData.progressType ?? 'linear'}\n            helperTextPrimary={currStatData.helperTextPrimary ?? ''}\n            helperTextSecondary={currStatData.helperTextSecondary ?? ''}\n            show={true}\n            onComplete={onStatAnimationComplete}\n          />\n        );\n      }\n\n      if (currStatData && currStatData.type === EPostGameStat.STREAK) {\n        return (\n          <Streak\n            currStreak={currStatData.value}\n            show={true}\n            onComplete={onStatAnimationComplete}\n            helperText={currStatData.helperText}\n            onReveal={currStatData.onReveal}\n          />\n        );\n      }\n\n      if (currStatData && currStatData.type === EPostGameStat.ACCURACY) {\n        return (\n          <Accuracy\n            accuracy={currStatData.value}\n            show={true}\n            onComplete={onStatAnimationComplete}\n            helperText={currStatData.helperText}\n          />\n        );\n      }\n\n      if (currStatData && currStatData.type === EPostGameStat.CLOCK) {\n        return (\n          <Clock\n            timeInMs={currStatData.value}\n            show={true}\n            onComplete={onStatAnimationComplete}\n            helperText={currStatData.helperText}\n          />\n        );\n      }\n\n      return null;\n    }, [currStatData, onStatAnimationComplete]);\n\n    if (!show || stats.length === 0 || currStatIndex >= stats.length) {\n      return null;\n    }\n\n    return (\n      <Styled.StatsWrapper>\n        <Styled.BlackBg />\n\n        {currentStat}\n      </Styled.StatsWrapper>\n    );\n  }),\n);\n"],"names":["PostGameStats","memo","forwardRef","stats","show","onComplete","ref","currStatIndex","setCurrentStatIndex","useState","currStatData","useMemo","moveToNextAndPlay","useCallback","_a","prev","onStatAnimationComplete","useImperativeHandle","currentStat","EPostGameStat","jsx","Points","DigitalMeter","Streak","Accuracy","Clock","jsxs","Styled.StatsWrapper","Styled.BlackBg"],"mappings":";;;;;;;;;AAYO,MAAMA,IAAgBC;AAAA,EAC3BC,EAAmD,CAAC,EAAE,OAAAC,GAAO,MAAAC,GAAM,YAAAC,EAAA,GAAcC,MAAQ;AACvF,UAAM,CAACC,GAAeC,CAAmB,IAAIC,EAAS,CAAC,GACjDC,IAAeC,EAAQ,MAAMR,EAAMI,CAAa,GAAG,CAACA,GAAeJ,CAAK,CAAC,GAEzES,IAAoBC,EAAY,MAAM;;AAGtC,WAFJC,IAAAJ,KAAA,gBAAAA,EAAc,eAAd,QAAAI,EAAA,KAAAJ,IAEIH,MAAkBJ,EAAM,SAAS,GAAG;AACzB,QAAAE,KAAA,QAAAA;AAEb;AAAA,MACF;AACoB,MAAAG,EAAA,CAAAO,MAAQA,IAAO,CAAC;AAAA,IAAA,GACnC,CAACR,GAAeF,GAAYF,EAAM,QAAQO,CAAY,CAAC,GAEpDM,IAA0BH,EAAY,MAAM;AAChD,MAAIH,KAAA,QAAAA,EAAc,aAGAE;IAAA,GACjB,CAACF,GAAcE,CAAiB,CAAC;AAEpC,IAAAK,EAAoBX,GAAK,OAAO;AAAA,MAC9B,mBAAAM;AAAA,IACA,EAAA;AAEI,UAAAM,IAAcP,EAAQ,MACtBD,KAAgBA,EAAa,SAASS,EAAc,QAEpD,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAOX,EAAa;AAAA,QACpB,MAAMA,EAAa,SAASS,EAAc;AAAA,QAC1C,YAAYH;AAAA,QACZ,UAAUN,EAAa;AAAA,MAAA;AAAA,IAAA,IAKzBA,KAAgBA,EAAa,SAASS,EAAc,gBAEpD,gBAAAC;AAAA,MAACE;AAAA,MAAA;AAAA,QAEC,OAAOZ,EAAa;AAAA,QACpB,UAAUA,EAAa,YAAY;AAAA,QACnC,aAAaA,EAAa;AAAA,QAC1B,aAAaA,EAAa,eAAe;AAAA,QACzC,cAAcA,EAAa,gBAAgB;AAAA,QAC3C,mBAAmBA,EAAa,qBAAqB;AAAA,QACrD,qBAAqBA,EAAa,uBAAuB;AAAA,QACzD,MAAM;AAAA,QACN,YAAYM;AAAA,MAAA;AAAA,MATP,KAAK,IAAI;AAAA,IAAA,IAchBN,KAAgBA,EAAa,SAASS,EAAc,SAEpD,gBAAAC;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,YAAYb,EAAa;AAAA,QACzB,MAAM;AAAA,QACN,YAAYM;AAAA,QACZ,YAAYN,EAAa;AAAA,QACzB,UAAUA,EAAa;AAAA,MAAA;AAAA,IAAA,IAKzBA,KAAgBA,EAAa,SAASS,EAAc,WAEpD,gBAAAC;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,UAAUd,EAAa;AAAA,QACvB,MAAM;AAAA,QACN,YAAYM;AAAA,QACZ,YAAYN,EAAa;AAAA,MAAA;AAAA,IAAA,IAK3BA,KAAgBA,EAAa,SAASS,EAAc,QAEpD,gBAAAC;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,UAAUf,EAAa;AAAA,QACvB,MAAM;AAAA,QACN,YAAYM;AAAA,QACZ,YAAYN,EAAa;AAAA,MAAA;AAAA,IAAA,IAKxB,MACN,CAACA,GAAcM,CAAuB,CAAC;AAE1C,WAAI,CAACZ,KAAQD,EAAM,WAAW,KAAKI,KAAiBJ,EAAM,SACjD,OAIP,gBAAAuB,EAACC,GAAA,EACC,UAAA;AAAA,MAAC,gBAAAP,EAAAQ,GAAA,EAAe;AAAA,MAEfV;AAAA,IACH,EAAA,CAAA;AAAA,EAAA,CAEH;AACH;"}

package/dist/index.d.ts

@@ -2058,6 +2058,9 @@ export declare interface IPlayerStats {
     errorCode: IStatsToAwardErrorCode;
     outcome: ProjectOutcome;
     value: string;
+    starEligibleTime?: number;
+    starEligibleAccuracy?: number;
+    starRewarded?: boolean;
 }
 
 declare interface IPointerData extends Record<string, unknown> {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cuemath/leap",
-  "version": "2.8.36-tables-hg3",
+  "version": "2.8.36-tables-hg5",
   "type": "module",
   "files": [
     "dist"