@cuemath/leap 2.9.9-as4 → 2.9.9

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

@@ -1,28 +1,30 @@
-import { jsx as P } from "react/jsx-runtime";
-import { forwardRef as V, useRef as G, useMemo as R, useCallback as v, useImperativeHandle as $, useEffect as B } from "react";
+import { jsxs as h, jsx as v } from "react/jsx-runtime";
+import { forwardRef as P, useRef as G, useMemo as _, useCallback as T, useImperativeHandle as x, useEffect as B } from "react";
 import { useUIContext as J } from "../../../ui/context/context.js";
-import { ALLOWED_ORIGIN as C } from "./constants.js";
+import U from "../../../ui/layout/flex-view.js";
+import C from "../../../ui/separator/separator.js";
+import { ALLOWED_ORIGIN as b } from "./constants.js";
 import { ProjectType as s } from "./enums/project-type-enum.js";
 import { WebViewEvent as o } from "./enums/web-view-events-enum.js";
-const Z = V((I, b) => {
+const X = P((L, M) => {
   const {
-    baseUrl: y,
-    projectDetails: T,
-    playerDetails: w,
+    baseUrl: g,
+    projectDetails: y,
+    playerDetails: E,
     onGameLoad: a,
     onGamePlayFinish: c,
     handleInfoMessage: p,
     onBack: f,
-    parentDomain: g,
-    ...L
-  } = I, l = G(null), N = R(() => w, [w]), t = R(() => T, [T]);
+    parentDomain: N,
+    ...V
+  } = L, m = G(null), O = _(() => E, [E]), t = _(() => y, [y]);
   let A = "";
-  const { onEvent: O } = J();
+  const { onEvent: S } = J();
   t.projectType === s.LESSON && (A = t.miniGameIdentifier);
-  const m = v(() => {
-    const { enableCloseButton: i = !0 } = t;
+  const l = T(() => {
+    const { enableCloseButton: r = !0 } = t;
     let e = {
-      enableCloseButton: i
+      enableCloseButton: r
     };
     return t.projectType === s.GAME && (e = {
       ...e,
@@ -37,60 +39,65 @@ const Z = V((I, b) => {
       ...e,
       ...t
     }), e;
-  }, [t]), d = v(() => {
-    var e, r;
-    const i = m();
-    (r = (e = l.current) == null ? void 0 : e.contentWindow) == null || r.postMessage(
+  }, [t]), d = T(() => {
+    var e, i;
+    const r = l();
+    (i = (e = m.current) == null ? void 0 : e.contentWindow) == null || i.postMessage(
       JSON.stringify({
         event: o.GAME_DATA,
-        payload: i
+        payload: r
       }),
-      C
+      b
     );
-  }, [m]), D = v(() => {
-    var e, r;
-    const i = m();
-    (r = (e = l.current) == null ? void 0 : e.contentWindow) == null || r.postMessage(
+  }, [l]), j = T(() => {
+    var e, i;
+    const r = l();
+    (i = (e = m.current) == null ? void 0 : e.contentWindow) == null || i.postMessage(
       JSON.stringify({
         event: o.SET_CONFIG,
         payload: {
-          user: N,
-          projectConfig: i,
-          parentDomain: g
+          user: O,
+          projectConfig: r,
+          parentDomain: N
         }
       }),
-      C
+      b
     );
-  }, [N, m, g]);
-  $(b, () => l.current, []), B(() => {
-    const i = (e) => {
-      var j, _;
-      const r = e.data, S = typeof r == "string" ? JSON.parse(r) : r, { event: n, payload: E = null } = S;
+  }, [O, l, N]);
+  x(M, () => m.current, []), B(() => {
+    const r = (e) => {
+      var R, I;
+      const i = e.data, D = typeof i == "string" ? JSON.parse(i) : i, { event: n, payload: w = null } = D;
       if (n === o.VIBRATE) {
-        const { pattern: u } = E;
-        window.ReactNativeWebView ? window.ReactNativeWebView.postMessage(JSON.stringify(S)) : (_ = (j = window.navigator).vibrate) == null || _.call(j, u);
+        const { pattern: u } = w;
+        window.ReactNativeWebView ? window.ReactNativeWebView.postMessage(JSON.stringify(D)) : (I = (R = window.navigator).vibrate) == null || I.call(R, u);
       }
-      if (n === o.GAME_BACK && (f == null || f()), n === o.HIDE_LOADER && (a == null || a()), n === o.LOAD_DATA_FROM_APP && (d == null || d()), n === o.GET_CONFIG && D(), n === o.UPDATE_STATS && (c == null || c(E)), n === o.SHOW_SNACKBAR && (p == null || p(E)), n === o.TRACK_EVENT) {
-        const { eventName: u, properties: W } = E;
-        O(u, W);
+      if (n === o.GAME_BACK && (f == null || f()), n === o.HIDE_LOADER && (a == null || a()), n === o.LOAD_DATA_FROM_APP && (d == null || d()), n === o.GET_CONFIG && j(), n === o.UPDATE_STATS && (c == null || c(w)), n === o.SHOW_SNACKBAR && (p == null || p(w)), n === o.TRACK_EVENT) {
+        const { eventName: u, properties: $ } = w;
+        S(u, $);
       }
     };
-    return window.addEventListener("message", i), () => {
-      window.removeEventListener("message", i);
+    return window.addEventListener("message", r), () => {
+      window.removeEventListener("message", r);
     };
   }, [
     p,
     f,
     c,
     a,
-    D,
+    j,
     d,
-    O
+    S
   ]);
-  const M = w.isAdmin ? y : `${y}/play-game/${t.projectId}/${t.variant}${A ? `/${A}` : ""}`;
-  return /* @__PURE__ */ P("iframe", { ...L, ref: l, src: `${M}?version=2`, allow: "autoplay" });
+  const W = E.isAdmin ? g : `${g}/play-game/${t.projectId}/${t.variant}${A ? `/${A}` : ""}`;
+  return /* @__PURE__ */ h(U, { $height: "100%", $width: "100%", children: [
+    /* @__PURE__ */ v(C, { height: window.ReactNativeTopInset || 0 }),
+    /* @__PURE__ */ v("iframe", { ...V, ref: m, src: `${W}?version=2`, allow: "autoplay" }),
+    ";",
+    /* @__PURE__ */ v(C, { height: window.ReactNativeBottomInset || 0 })
+  ] });
 });
 export {
-  Z as WebView
+  X as WebView
 };
 //# sourceMappingURL=web-view.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"web-view.js","sources":["../../../../../src/features/circle-games/games/web-view/web-view.tsx"],"sourcesContent":["declare global {\n  interface IReactNativeWebview {\n    postMessage: (data: string) => void;\n  }\n\n  interface Window {\n    ReactNativeWebView?: IReactNativeWebview;\n  }\n}\n\nimport type {\n  IInfoMessage,\n  ILessonWebGameProps,\n  IMessageProps,\n  IMultiplayerWebGameProps,\n  IPlayerStats,\n  IPuzzleWebGameProps,\n  ITableWebGameProps,\n  IVibrationPattern,\n  IWebViewProps,\n} from './web-view-types';\nimport type { ForwardedRef } from 'react';\n\nimport { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\n\nimport { useUIContext } from '../../../ui/context/context';\nimport { ALLOWED_ORIGIN } from './constants';\nimport { ProjectType, WebViewEvent } from './enums';\n\nexport const WebView = forwardRef((props: IWebViewProps, ref: ForwardedRef<HTMLIFrameElement>) => {\n  const {\n    baseUrl,\n    projectDetails,\n    playerDetails,\n    onGameLoad,\n    onGamePlayFinish,\n    handleInfoMessage,\n    onBack,\n    parentDomain,\n    ...rest\n  } = props;\n  const webViewRef = useRef<HTMLIFrameElement>(null);\n  const memoizedPlayerDetails = useMemo(() => playerDetails, [playerDetails]);\n  const memoizedProjectDetails = useMemo(() => projectDetails, [projectDetails]);\n\n  let miniGameIdentifier = '';\n  const { onEvent: trackEvent } = useUIContext();\n\n  if (memoizedProjectDetails.projectType === ProjectType.LESSON) {\n    miniGameIdentifier = (memoizedProjectDetails as ILessonWebGameProps).miniGameIdentifier;\n  }\n\n  const getProjectDetails = useCallback(() => {\n    const { enableCloseButton = true } = memoizedProjectDetails;\n\n    let payload = {\n      enableCloseButton,\n    } as IMultiplayerWebGameProps | IPuzzleWebGameProps | ILessonWebGameProps;\n\n    if (memoizedProjectDetails.projectType === ProjectType.GAME) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as IMultiplayerWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.PUZZLE) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as IPuzzleWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.LESSON) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as ILessonWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.TABLE) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as ITableWebGameProps;\n    }\n\n    return payload;\n  }, [memoizedProjectDetails]);\n\n  const sendGamesData = useCallback(() => {\n    const payload = getProjectDetails();\n\n    webViewRef.current?.contentWindow?.postMessage(\n      JSON.stringify({\n        event: WebViewEvent.GAME_DATA,\n        payload,\n      }),\n      ALLOWED_ORIGIN,\n    );\n  }, [getProjectDetails]);\n\n  const setConfig = useCallback(() => {\n    const projectConfig = getProjectDetails();\n\n    webViewRef.current?.contentWindow?.postMessage(\n      JSON.stringify({\n        event: WebViewEvent.SET_CONFIG,\n        payload: {\n          user: memoizedPlayerDetails,\n          projectConfig,\n          parentDomain,\n        },\n      }),\n      ALLOWED_ORIGIN,\n    );\n  }, [memoizedPlayerDetails, getProjectDetails, parentDomain]);\n\n  useImperativeHandle(ref, () => webViewRef.current as HTMLIFrameElement, []);\n\n  useEffect(() => {\n    const handleMessage = (e: MessageEvent) => {\n      const data: string = e.data;\n      const parsedData = typeof data === 'string' ? JSON.parse(data) : (data as IMessageProps);\n\n      const { event, payload = null } = parsedData;\n\n      if (event === WebViewEvent.VIBRATE) {\n        const { pattern } = payload as IVibrationPattern;\n\n        if (window.ReactNativeWebView) {\n          window.ReactNativeWebView.postMessage(JSON.stringify(parsedData));\n        } else {\n          window.navigator.vibrate?.(pattern);\n        }\n      }\n\n      if (event === WebViewEvent.GAME_BACK) {\n        onBack?.();\n      }\n\n      if (event === WebViewEvent.HIDE_LOADER) {\n        onGameLoad?.();\n      }\n\n      if (event === WebViewEvent.LOAD_DATA_FROM_APP) {\n        sendGamesData?.();\n      }\n\n      if (event === WebViewEvent.GET_CONFIG) {\n        setConfig();\n      }\n\n      if (event === WebViewEvent.UPDATE_STATS) {\n        onGamePlayFinish?.(payload as IPlayerStats);\n      }\n\n      if (event === WebViewEvent.SHOW_SNACKBAR) {\n        handleInfoMessage?.(payload as IInfoMessage);\n      }\n\n      if (event === WebViewEvent.TRACK_EVENT) {\n        const { eventName, properties } = payload;\n\n        trackEvent(eventName, properties);\n      }\n    };\n\n    window.addEventListener('message', handleMessage);\n\n    return () => {\n      window.removeEventListener('message', handleMessage);\n    };\n  }, [\n    handleInfoMessage,\n    onBack,\n    onGamePlayFinish,\n    onGameLoad,\n    setConfig,\n    sendGamesData,\n    trackEvent,\n  ]);\n\n  const url = playerDetails.isAdmin\n    ? baseUrl\n    : `${baseUrl}/play-game/${memoizedProjectDetails.projectId}/${memoizedProjectDetails.variant}${\n        miniGameIdentifier ? `/${miniGameIdentifier}` : ''\n      }`;\n\n  return <iframe {...rest} ref={webViewRef} src={`${url}?version=2`} allow=\"autoplay\" />;\n});\n"],"names":["WebView","forwardRef","props","ref","baseUrl","projectDetails","playerDetails","onGameLoad","onGamePlayFinish","handleInfoMessage","onBack","parentDomain","rest","webViewRef","useRef","memoizedPlayerDetails","useMemo","memoizedProjectDetails","miniGameIdentifier","trackEvent","useUIContext","ProjectType","getProjectDetails","useCallback","enableCloseButton","payload","sendGamesData","_b","_a","WebViewEvent","ALLOWED_ORIGIN","setConfig","projectConfig","useImperativeHandle","useEffect","handleMessage","data","parsedData","event","pattern","eventName","properties","url","jsx"],"mappings":"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"}
+{"version":3,"file":"web-view.js","sources":["../../../../../src/features/circle-games/games/web-view/web-view.tsx"],"sourcesContent":["import type {\n  IInfoMessage,\n  ILessonWebGameProps,\n  IMessageProps,\n  IMultiplayerWebGameProps,\n  IPlayerStats,\n  IPuzzleWebGameProps,\n  ITableWebGameProps,\n  IVibrationPattern,\n  IWebViewProps,\n} from './web-view-types';\nimport type { ForwardedRef } from 'react';\n\nimport { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\n\nimport { useUIContext } from '../../../ui/context/context';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport { ALLOWED_ORIGIN } from './constants';\nimport { ProjectType, WebViewEvent } from './enums';\n\nexport const WebView = forwardRef((props: IWebViewProps, ref: ForwardedRef<HTMLIFrameElement>) => {\n  const {\n    baseUrl,\n    projectDetails,\n    playerDetails,\n    onGameLoad,\n    onGamePlayFinish,\n    handleInfoMessage,\n    onBack,\n    parentDomain,\n    ...rest\n  } = props;\n  const webViewRef = useRef<HTMLIFrameElement>(null);\n  const memoizedPlayerDetails = useMemo(() => playerDetails, [playerDetails]);\n  const memoizedProjectDetails = useMemo(() => projectDetails, [projectDetails]);\n\n  let miniGameIdentifier = '';\n  const { onEvent: trackEvent } = useUIContext();\n\n  if (memoizedProjectDetails.projectType === ProjectType.LESSON) {\n    miniGameIdentifier = (memoizedProjectDetails as ILessonWebGameProps).miniGameIdentifier;\n  }\n\n  const getProjectDetails = useCallback(() => {\n    const { enableCloseButton = true } = memoizedProjectDetails;\n\n    let payload = {\n      enableCloseButton,\n    } as IMultiplayerWebGameProps | IPuzzleWebGameProps | ILessonWebGameProps;\n\n    if (memoizedProjectDetails.projectType === ProjectType.GAME) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as IMultiplayerWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.PUZZLE) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as IPuzzleWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.LESSON) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as ILessonWebGameProps;\n    }\n\n    if (memoizedProjectDetails.projectType === ProjectType.TABLE) {\n      payload = {\n        ...payload,\n        ...memoizedProjectDetails,\n      } as ITableWebGameProps;\n    }\n\n    return payload;\n  }, [memoizedProjectDetails]);\n\n  const sendGamesData = useCallback(() => {\n    const payload = getProjectDetails();\n\n    webViewRef.current?.contentWindow?.postMessage(\n      JSON.stringify({\n        event: WebViewEvent.GAME_DATA,\n        payload,\n      }),\n      ALLOWED_ORIGIN,\n    );\n  }, [getProjectDetails]);\n\n  const setConfig = useCallback(() => {\n    const projectConfig = getProjectDetails();\n\n    webViewRef.current?.contentWindow?.postMessage(\n      JSON.stringify({\n        event: WebViewEvent.SET_CONFIG,\n        payload: {\n          user: memoizedPlayerDetails,\n          projectConfig,\n          parentDomain,\n        },\n      }),\n      ALLOWED_ORIGIN,\n    );\n  }, [memoizedPlayerDetails, getProjectDetails, parentDomain]);\n\n  useImperativeHandle(ref, () => webViewRef.current as HTMLIFrameElement, []);\n\n  useEffect(() => {\n    const handleMessage = (e: MessageEvent) => {\n      const data: string = e.data;\n      const parsedData = typeof data === 'string' ? JSON.parse(data) : (data as IMessageProps);\n\n      const { event, payload = null } = parsedData;\n\n      if (event === WebViewEvent.VIBRATE) {\n        const { pattern } = payload as IVibrationPattern;\n\n        if (window.ReactNativeWebView) {\n          window.ReactNativeWebView.postMessage(JSON.stringify(parsedData));\n        } else {\n          window.navigator.vibrate?.(pattern);\n        }\n      }\n\n      if (event === WebViewEvent.GAME_BACK) {\n        onBack?.();\n      }\n\n      if (event === WebViewEvent.HIDE_LOADER) {\n        onGameLoad?.();\n      }\n\n      if (event === WebViewEvent.LOAD_DATA_FROM_APP) {\n        sendGamesData?.();\n      }\n\n      if (event === WebViewEvent.GET_CONFIG) {\n        setConfig();\n      }\n\n      if (event === WebViewEvent.UPDATE_STATS) {\n        onGamePlayFinish?.(payload as IPlayerStats);\n      }\n\n      if (event === WebViewEvent.SHOW_SNACKBAR) {\n        handleInfoMessage?.(payload as IInfoMessage);\n      }\n\n      if (event === WebViewEvent.TRACK_EVENT) {\n        const { eventName, properties } = payload;\n\n        trackEvent(eventName, properties);\n      }\n    };\n\n    window.addEventListener('message', handleMessage);\n\n    return () => {\n      window.removeEventListener('message', handleMessage);\n    };\n  }, [\n    handleInfoMessage,\n    onBack,\n    onGamePlayFinish,\n    onGameLoad,\n    setConfig,\n    sendGamesData,\n    trackEvent,\n  ]);\n\n  const url = playerDetails.isAdmin\n    ? baseUrl\n    : `${baseUrl}/play-game/${memoizedProjectDetails.projectId}/${memoizedProjectDetails.variant}${\n        miniGameIdentifier ? `/${miniGameIdentifier}` : ''\n      }`;\n\n  return (\n    <FlexView $height=\"100%\" $width=\"100%\">\n      <Separator height={window.ReactNativeTopInset || 0} />\n      <iframe {...rest} ref={webViewRef} src={`${url}?version=2`} allow=\"autoplay\" />;\n      <Separator height={window.ReactNativeBottomInset || 0} />\n    </FlexView>\n  );\n});\n"],"names":["WebView","forwardRef","props","ref","baseUrl","projectDetails","playerDetails","onGameLoad","onGamePlayFinish","handleInfoMessage","onBack","parentDomain","rest","webViewRef","useRef","memoizedPlayerDetails","useMemo","memoizedProjectDetails","miniGameIdentifier","trackEvent","useUIContext","ProjectType","getProjectDetails","useCallback","enableCloseButton","payload","sendGamesData","_b","_a","WebViewEvent","ALLOWED_ORIGIN","setConfig","projectConfig","useImperativeHandle","useEffect","handleMessage","data","parsedData","event","pattern","eventName","properties","url","jsxs","FlexView","jsx","Separator"],"mappings":"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"}

package/dist/features/circle-games/hooks/use-circle-sounds/use-circle-sounds.js

@@ -1,88 +1,118 @@
-import { useCallback as a } from "react";
-import { CircleSoundKeyMapper as A, SWIPE_SOUND_ORDER as i } from "./constants.js";
-import { CircleSoundKey as l } from "./use-circle-sounds-enums.js";
-let C = 0;
-const r = {
-  [l.BACKGROUND]: null,
-  [l.BACKGROUND_RUSHHOUR]: null,
-  [l.TUTORIAL]: null,
-  [l.SWIPE_01]: null,
-  [l.SWIPE_02]: null,
-  [l.SWIPE_03]: null,
-  [l.SWIPE_04]: null,
-  [l.SWIPE_DOWN]: null,
-  [l.TOGGLE]: null,
-  [l.POINTS_AWARDED]: null,
-  [l.POINTS_ADDED]: null,
-  [l.GAME_CARD_CLICK]: null,
-  [l.CLOCK_IN]: null,
-  [l.CLOCK_OUT]: null,
-  [l.ACCURACY_IN]: null,
-  [l.ACCURACY_OUT]: null,
-  [l.STREAK_IN]: null,
-  [l.STREAK_OUT]: null,
-  [l.ACCURACY_INTRO]: null,
-  [l.ACCURACY_TARGET]: null,
-  [l.TIME_INTRO]: null,
-  [l.TIME_TARGET]: null,
-  [l.METER_FILL]: null
-}, I = {}, O = () => {
-  const e = a((n) => {
-    if (!r[n]) {
-      const t = new Audio(A[n]);
-      r[n] = t;
+import { useCallback as c, useRef as C, useEffect as T } from "react";
+import { CircleSoundKeyMapper as A, SWIPE_SOUND_ORDER as E } from "./constants.js";
+import { CircleSoundKey as n } from "./use-circle-sounds-enums.js";
+let d = 0;
+const o = {
+  [n.BACKGROUND]: null,
+  [n.BACKGROUND_RUSHHOUR]: null,
+  [n.TUTORIAL]: null,
+  [n.SWIPE_01]: null,
+  [n.SWIPE_02]: null,
+  [n.SWIPE_03]: null,
+  [n.SWIPE_04]: null,
+  [n.SWIPE_DOWN]: null,
+  [n.TOGGLE]: null,
+  [n.POINTS_AWARDED]: null,
+  [n.POINTS_ADDED]: null,
+  [n.GAME_CARD_CLICK]: null,
+  [n.CLOCK_IN]: null,
+  [n.CLOCK_OUT]: null,
+  [n.ACCURACY_IN]: null,
+  [n.ACCURACY_OUT]: null,
+  [n.STREAK_IN]: null,
+  [n.STREAK_OUT]: null,
+  [n.ACCURACY_INTRO]: null,
+  [n.ACCURACY_TARGET]: null,
+  [n.TIME_INTRO]: null,
+  [n.TIME_TARGET]: null,
+  [n.METER_FILL]: null
+}, I = {}, D = () => {
+  const s = c((e) => {
+    if (!o[e]) {
+      const l = new Audio(A[e]);
+      o[e] = l;
     }
-  }, []), p = a(() => {
-    var t;
-    i.forEach((o) => {
-      e(o);
+  }, []), f = C(/* @__PURE__ */ new Set()), p = C({}), v = c(() => {
+    document.visibilityState === "hidden" ? Object.keys(o).forEach((e) => {
+      const l = o[e];
+      l && !l.paused && (l.pause(), f.current.add(e));
+    }) : document.visibilityState === "visible" && (f.current.forEach((e) => {
+      const l = o[e];
+      l == null || l.play();
+    }), f.current.clear());
+  }, []);
+  T(() => {
+    document.addEventListener("visibilitychange", v);
+    const e = p.current;
+    return () => {
+      document.removeEventListener("visibilitychange", v);
+      for (const l of Object.values(e))
+        l != null && clearInterval(l);
+    };
+  }, [v]);
+  const S = c(() => {
+    var l;
+    E.forEach((u) => {
+      s(u);
     });
-    const n = i[C] || l.SWIPE_01;
-    C < i.length - 1 ? C++ : C = 0, (t = r[n]) == null || t.play();
-  }, [e]), _ = a(() => {
-    var t;
-    return e(l.TOGGLE), (t = r[l.TOGGLE]) == null ? void 0 : t.play();
-  }, [e]), E = a(
-    (n, t = !0, o = !1) => {
-      e(n);
-      const u = r[n];
-      if (!u) return;
-      if (u.loop = o, t) {
-        u.volume = 1;
-        const s = u.play();
-        I[n] = s;
+    const e = E[d] || n.SWIPE_01;
+    d < E.length - 1 ? d++ : d = 0, (l = o[e]) == null || l.play();
+  }, [s]), m = c(() => {
+    var l;
+    return s(n.TOGGLE), (l = o[n.TOGGLE]) == null ? void 0 : l.play();
+  }, [s]), _ = c(
+    (e, l = !0, u = !1) => {
+      s(e);
+      const t = o[e];
+      if (!t) return;
+      if (!t.paused && t.currentTime > 0 && !t.ended)
+        return t;
+      if (t.loop = u, l) {
+        t.volume = 1;
+        const a = t.play();
+        I[e] = a;
         return;
       }
-      u.volume = 0;
-      const c = u.play();
-      return I[n] = c, setInterval(() => {
-        if (!u) return;
-        const s = 0;
-        u.volume = s + 0.1;
-      }, 100), u;
+      t.volume = 0;
+      const r = t.play();
+      I[e] = r;
+      const i = setInterval(() => {
+        if (!t) {
+          clearInterval(i);
+          return;
+        }
+        const a = t.volume || 0;
+        a < 1 ? t.volume = Math.min(a + 0.1, 1) : clearInterval(i);
+      }, 100);
+      return p.current[e] = i, t;
     },
-    [e]
-  ), S = a((n, t = !0) => {
-    var u;
-    const o = r[n];
-    I[n] !== void 0 && ((u = I[n]) == null || u.then(() => {
-      if (t) {
-        o == null || o.pause();
+    [s]
+  ), R = c((e, l = !0) => {
+    var t;
+    const u = o[e];
+    I[e] !== void 0 && ((t = I[e]) == null || t.then(() => {
+      if (!u) return;
+      if (l) {
+        u.pause();
         return;
       }
-      const c = setInterval(() => {
-        if (!o) return;
-        const s = o.volume || 0;
-        s - 0.1 <= 0 ? (o.volume = 0, o.pause(), clearInterval(c)) : o.volume = s - 0.1;
+      const r = setInterval(() => {
+        if (!u) {
+          clearInterval(r);
+          return;
+        }
+        const i = u.volume || 0;
+        i - 0.1 <= 0 ? (u.volume = 0, u.pause(), clearInterval(r)) : u.volume = i - 0.1;
       }, 100);
-    }).catch((c) => {
-      console.log("sound not playing", c);
+      p.current[e] = r;
+    }).catch((r) => {
+      console.log("sound not playing", r);
     }));
   }, []);
-  return { playSwipSound: p, play: E, stop: S, playButtonSound: _ };
+  return { playSwipSound: S, play: _, stop: R, playButtonSound: m };
 };
 export {
-  r as soundMapper,
-  O as useCircleSounds
+  o as soundMapper,
+  D as useCircleSounds
 };
 //# sourceMappingURL=use-circle-sounds.js.map

package/dist/features/circle-games/hooks/use-circle-sounds/use-circle-sounds.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-circle-sounds.js","sources":["../../../../../src/features/circle-games/hooks/use-circle-sounds/use-circle-sounds.ts"],"sourcesContent":["import { useCallback } from 'react';\n\nimport { CircleSoundKeyMapper, SWIPE_SOUND_ORDER } from './constants';\nimport { CircleSoundKey } from './use-circle-sounds-enums';\n\nlet swipeSoundIndex = 0;\n\nexport const soundMapper: Record<keyof typeof CircleSoundKeyMapper, null | HTMLAudioElement> = {\n  [CircleSoundKey.BACKGROUND]: null,\n  [CircleSoundKey.BACKGROUND_RUSHHOUR]: null,\n  [CircleSoundKey.TUTORIAL]: null,\n  [CircleSoundKey.SWIPE_01]: null,\n  [CircleSoundKey.SWIPE_02]: null,\n  [CircleSoundKey.SWIPE_03]: null,\n  [CircleSoundKey.SWIPE_04]: null,\n  [CircleSoundKey.SWIPE_DOWN]: null,\n  [CircleSoundKey.TOGGLE]: null,\n  [CircleSoundKey.POINTS_AWARDED]: null,\n  [CircleSoundKey.POINTS_ADDED]: null,\n  [CircleSoundKey.GAME_CARD_CLICK]: null,\n  [CircleSoundKey.CLOCK_IN]: null,\n  [CircleSoundKey.CLOCK_OUT]: null,\n  [CircleSoundKey.ACCURACY_IN]: null,\n  [CircleSoundKey.ACCURACY_OUT]: null,\n  [CircleSoundKey.STREAK_IN]: null,\n  [CircleSoundKey.STREAK_OUT]: null,\n  [CircleSoundKey.ACCURACY_INTRO]: null,\n  [CircleSoundKey.ACCURACY_TARGET]: null,\n  [CircleSoundKey.TIME_INTRO]: null,\n  [CircleSoundKey.TIME_TARGET]: null,\n  [CircleSoundKey.METER_FILL]: null,\n};\n\nconst soundInstancePromise: Partial<Record<keyof typeof CircleSoundKeyMapper, Promise<void>>> = {};\n\nexport const useCircleSounds = () => {\n  const loadSound = useCallback((key: CircleSoundKey) => {\n    if (!soundMapper[key]) {\n      const loadedSound = new Audio(CircleSoundKeyMapper[key]);\n\n      soundMapper[key] = loadedSound;\n    }\n  }, []);\n\n  const playSwipSound = useCallback(() => {\n    SWIPE_SOUND_ORDER.forEach(key => {\n      loadSound(key);\n    });\n\n    const key = SWIPE_SOUND_ORDER[swipeSoundIndex] || CircleSoundKey.SWIPE_01;\n\n    if (swipeSoundIndex < SWIPE_SOUND_ORDER.length - 1) {\n      swipeSoundIndex++;\n    } else {\n      swipeSoundIndex = 0;\n    }\n    soundMapper[key]?.play();\n  }, [loadSound]);\n\n  const playButtonSound = useCallback(() => {\n    loadSound(CircleSoundKey.TOGGLE);\n    const sound = soundMapper[CircleSoundKey.TOGGLE]?.play();\n\n    return sound;\n  }, [loadSound]);\n\n  const play = useCallback(\n    (key: CircleSoundKey, immediately: boolean = true, loop = false) => {\n      loadSound(key);\n      const soundInstance = soundMapper[key];\n\n      if (!soundInstance) return;\n\n      soundInstance.loop = loop;\n      if (immediately) {\n        soundInstance.volume = 1;\n        const promise = soundInstance.play();\n\n        soundInstancePromise[key] = promise;\n\n        return;\n      }\n\n      soundInstance.volume = 0;\n      const promise = soundInstance.play();\n\n      soundInstancePromise[key] = promise;\n\n      const intervalId = setInterval(() => {\n        if (!soundInstance) return;\n\n        const vol = 0;\n\n        if (vol < 1) {\n          soundInstance.volume = vol + 0.1;\n        } else {\n          clearInterval(intervalId);\n        }\n      }, 100);\n\n      return soundInstance;\n    },\n    [loadSound],\n  );\n\n  const stop = useCallback((key: CircleSoundKey, immediately: boolean = true) => {\n    const soundInstance = soundMapper[key];\n\n    // check if the sound is playing as the play() return a promise\n    if (soundInstancePromise[key] !== undefined) {\n      soundInstancePromise[key]\n        ?.then(() => {\n          if (immediately) {\n            soundInstance?.pause();\n\n            return;\n          }\n\n          const intervalId = setInterval(() => {\n            if (!soundInstance) return;\n\n            const vol = soundInstance.volume || 0;\n\n            if (vol - 0.1 <= 0) {\n              soundInstance.volume = 0;\n              soundInstance.pause();\n              clearInterval(intervalId);\n            } else {\n              soundInstance.volume = vol - 0.1;\n            }\n          }, 100);\n        })\n        .catch(err => {\n          // eslint-disable-next-line no-console\n          console.log('sound not playing', err);\n        });\n    }\n  }, []);\n\n  return { playSwipSound, play, stop, playButtonSound };\n};\n"],"names":["swipeSoundIndex","soundMapper","CircleSoundKey","soundInstancePromise","useCircleSounds","loadSound","useCallback","key","loadedSound","CircleSoundKeyMapper","playSwipSound","SWIPE_SOUND_ORDER","_a","playButtonSound","play","immediately","loop","soundInstance","promise","vol","stop","intervalId","err"],"mappings":"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"}
+{"version":3,"file":"use-circle-sounds.js","sources":["../../../../../src/features/circle-games/hooks/use-circle-sounds/use-circle-sounds.ts"],"sourcesContent":["import type { TimeoutMap } from './use-circle-sound-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport { CircleSoundKeyMapper, SWIPE_SOUND_ORDER } from './constants';\nimport { CircleSoundKey } from './use-circle-sounds-enums';\n\nlet swipeSoundIndex = 0;\n\nexport const soundMapper: Record<keyof typeof CircleSoundKeyMapper, null | HTMLAudioElement> = {\n  [CircleSoundKey.BACKGROUND]: null,\n  [CircleSoundKey.BACKGROUND_RUSHHOUR]: null,\n  [CircleSoundKey.TUTORIAL]: null,\n  [CircleSoundKey.SWIPE_01]: null,\n  [CircleSoundKey.SWIPE_02]: null,\n  [CircleSoundKey.SWIPE_03]: null,\n  [CircleSoundKey.SWIPE_04]: null,\n  [CircleSoundKey.SWIPE_DOWN]: null,\n  [CircleSoundKey.TOGGLE]: null,\n  [CircleSoundKey.POINTS_AWARDED]: null,\n  [CircleSoundKey.POINTS_ADDED]: null,\n  [CircleSoundKey.GAME_CARD_CLICK]: null,\n  [CircleSoundKey.CLOCK_IN]: null,\n  [CircleSoundKey.CLOCK_OUT]: null,\n  [CircleSoundKey.ACCURACY_IN]: null,\n  [CircleSoundKey.ACCURACY_OUT]: null,\n  [CircleSoundKey.STREAK_IN]: null,\n  [CircleSoundKey.STREAK_OUT]: null,\n  [CircleSoundKey.ACCURACY_INTRO]: null,\n  [CircleSoundKey.ACCURACY_TARGET]: null,\n  [CircleSoundKey.TIME_INTRO]: null,\n  [CircleSoundKey.TIME_TARGET]: null,\n  [CircleSoundKey.METER_FILL]: null,\n};\n\nconst soundInstancePromise: Partial<Record<keyof typeof CircleSoundKeyMapper, Promise<void>>> = {};\n\nexport const useCircleSounds = () => {\n  const loadSound = useCallback((key: CircleSoundKey) => {\n    if (!soundMapper[key]) {\n      const loadedSound = new Audio(CircleSoundKeyMapper[key]);\n\n      soundMapper[key] = loadedSound;\n    }\n  }, []);\n\n  const pausedSoundsRef = useRef<Set<CircleSoundKey>>(new Set());\n  const timeoutRefs = useRef<TimeoutMap>({});\n\n  const handleVisibilityChange = useCallback(() => {\n    if (document.visibilityState === 'hidden') {\n      (Object.keys(soundMapper) as CircleSoundKey[]).forEach(key => {\n        const sound = soundMapper[key];\n\n        if (sound && !sound.paused) {\n          sound.pause();\n          pausedSoundsRef.current.add(key);\n        }\n      });\n    } else if (document.visibilityState === 'visible') {\n      pausedSoundsRef.current.forEach(key => {\n        const sound = soundMapper[key];\n\n        sound?.play();\n      });\n      pausedSoundsRef.current.clear();\n    }\n  }, []);\n\n  useEffect(() => {\n    document.addEventListener('visibilitychange', handleVisibilityChange);\n    const timeouts = timeoutRefs.current;\n\n    return () => {\n      document.removeEventListener('visibilitychange', handleVisibilityChange);\n      for (const id of Object.values(timeouts)) {\n        if (id != null) clearInterval(id);\n      }\n    };\n  }, [handleVisibilityChange]);\n\n  const playSwipSound = useCallback(() => {\n    SWIPE_SOUND_ORDER.forEach(key => {\n      loadSound(key);\n    });\n\n    const key = SWIPE_SOUND_ORDER[swipeSoundIndex] || CircleSoundKey.SWIPE_01;\n\n    if (swipeSoundIndex < SWIPE_SOUND_ORDER.length - 1) {\n      swipeSoundIndex++;\n    } else {\n      swipeSoundIndex = 0;\n    }\n    soundMapper[key]?.play();\n  }, [loadSound]);\n\n  const playButtonSound = useCallback(() => {\n    loadSound(CircleSoundKey.TOGGLE);\n    const sound = soundMapper[CircleSoundKey.TOGGLE]?.play();\n\n    return sound;\n  }, [loadSound]);\n\n  const play = useCallback(\n    (key: CircleSoundKey, immediately: boolean = true, loop = false) => {\n      loadSound(key);\n      const soundInstance = soundMapper[key];\n\n      if (!soundInstance) return;\n\n      if (!soundInstance.paused && soundInstance.currentTime > 0 && !soundInstance.ended) {\n        return soundInstance;\n      }\n\n      soundInstance.loop = loop;\n      if (immediately) {\n        soundInstance.volume = 1;\n        const promise = soundInstance.play();\n\n        soundInstancePromise[key] = promise;\n\n        return;\n      }\n\n      soundInstance.volume = 0;\n      const promise = soundInstance.play();\n\n      soundInstancePromise[key] = promise;\n\n      const intervalId = setInterval(() => {\n        if (!soundInstance) {\n          clearInterval(intervalId);\n\n          return;\n        }\n\n        const vol = soundInstance.volume || 0;\n\n        if (vol < 1) {\n          soundInstance.volume = Math.min(vol + 0.1, 1);\n        } else {\n          clearInterval(intervalId);\n        }\n      }, 100);\n\n      timeoutRefs.current[key] = intervalId;\n\n      return soundInstance;\n    },\n    [loadSound],\n  );\n\n  const stop = useCallback((key: CircleSoundKey, immediately: boolean = true) => {\n    const soundInstance = soundMapper[key];\n\n    if (soundInstancePromise[key] !== undefined) {\n      soundInstancePromise[key]\n        ?.then(() => {\n          if (!soundInstance) return;\n\n          if (immediately) {\n            soundInstance.pause();\n\n            return;\n          }\n\n          const intervalId = setInterval(() => {\n            if (!soundInstance) {\n              clearInterval(intervalId);\n\n              return;\n            }\n\n            const vol = soundInstance.volume || 0;\n\n            if (vol - 0.1 <= 0) {\n              soundInstance.volume = 0;\n              soundInstance.pause();\n              clearInterval(intervalId);\n            } else {\n              soundInstance.volume = vol - 0.1;\n            }\n          }, 100);\n\n          timeoutRefs.current[key] = intervalId;\n        })\n        .catch(err => {\n          // eslint-disable-next-line no-console\n          console.log('sound not playing', err);\n        });\n    }\n  }, []);\n\n  return { playSwipSound, play, stop, playButtonSound };\n};\n"],"names":["swipeSoundIndex","soundMapper","CircleSoundKey","soundInstancePromise","useCircleSounds","loadSound","useCallback","key","loadedSound","CircleSoundKeyMapper","pausedSoundsRef","useRef","timeoutRefs","handleVisibilityChange","sound","useEffect","timeouts","id","playSwipSound","SWIPE_SOUND_ORDER","_a","playButtonSound","play","immediately","loop","soundInstance","promise","intervalId","vol","stop","err"],"mappings":"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"}

package/dist/features/circle-games/leaderboard/comps/banner/banner.js

@@ -1,19 +1,19 @@
 import { jsxs as n, jsx as r } from "react/jsx-runtime";
-import { memo as d } from "react";
+import { memo as l } from "react";
 import h from "../../../../ui/lottie-animation/lottie-animation.js";
 import p from "../../../../ui/separator/separator.js";
 import o from "../../../../ui/text/text.js";
 import { BannerContainer as f, CircleLottieView as x, BannerTextContainer as T, CountTextWrapper as C } from "./banner-styled.js";
-const $ = { renderer: "canvas" }, H = d(
+const $ = { renderer: "canvas" }, v = l(
   ({
     primaryText: i,
     secondaryText: t,
-    topInset: e = 0,
+    topInset: e = window.ReactNativeTopInset || 0,
     isLoading: a = !1,
     lottiePath: m,
     bgFromTopPosition: c = 0,
     bgFromRightPosition: s = 0,
-    custEle: l
+    custEle: d
   }) => /* @__PURE__ */ n(f, { topInset: e, children: [
     /* @__PURE__ */ r(
       x,
@@ -30,11 +30,11 @@ const $ = { renderer: "canvas" }, H = d(
         /* @__PURE__ */ r(p, { height: 4 }),
         /* @__PURE__ */ r(o, { $renderAs: "ah4", $color: "WHITE", children: a ? "__" : t })
       ] }),
-      l
+      d
     ] })
   ] })
 );
 export {
-  H as Banner
+  v as Banner
 };
 //# sourceMappingURL=banner.js.map

package/dist/features/circle-games/leaderboard/comps/banner/banner.js.map

@@ -1 +1 @@
-{"version":3,"file":"banner.js","sources":["../../../../../../src/features/circle-games/leaderboard/comps/banner/banner.tsx"],"sourcesContent":["import type { IBannerProps } from './banner-types';\nimport type { FC } from 'react';\n\nimport { memo } from 'react';\n\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../../ui/separator/separator';\nimport Text from '../../../../ui/text/text';\nimport * as Styled from './banner-styled';\n\nconst animationSettings = { renderer: 'canvas' };\n\nexport const Banner: FC<IBannerProps> = memo(\n  ({\n    primaryText,\n    secondaryText,\n    topInset = 0,\n    isLoading = false,\n    lottiePath,\n    bgFromTopPosition = 0,\n    bgFromRightPosition = 0,\n    custEle,\n  }) => (\n    <Styled.BannerContainer topInset={topInset}>\n      <Styled.CircleLottieView\n        topInset={topInset}\n        bgFromTopPosition={bgFromTopPosition}\n        bgFromRightPosition={bgFromRightPosition}\n      >\n        <LottieAnimation src={lottiePath} settings={animationSettings} />\n      </Styled.CircleLottieView>\n\n      <Styled.BannerTextContainer>\n        <Styled.CountTextWrapper topInset={topInset}>\n          <Text $renderAs=\"ac4\" $color=\"WHITE\">\n            {primaryText}\n          </Text>\n          <Separator height={4} />\n          <Text $renderAs=\"ah4\" $color=\"WHITE\">\n            {isLoading ? '__' : secondaryText}\n          </Text>\n        </Styled.CountTextWrapper>\n\n        {custEle}\n      </Styled.BannerTextContainer>\n    </Styled.BannerContainer>\n  ),\n);\n"],"names":["animationSettings","Banner","memo","primaryText","secondaryText","topInset","isLoading","lottiePath","bgFromTopPosition","bgFromRightPosition","custEle","jsxs","Styled.BannerContainer","jsx","Styled.CircleLottieView","LottieAnimation","Styled.BannerTextContainer","Styled.CountTextWrapper","Text","Separator"],"mappings":";;;;;;AAUA,MAAMA,IAAoB,EAAE,UAAU,YAEzBC,IAA2BC;AAAA,EACtC,CAAC;AAAA,IACC,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,WAAAC,IAAY;AAAA,IACZ,YAAAC;AAAA,IACA,mBAAAC,IAAoB;AAAA,IACpB,qBAAAC,IAAsB;AAAA,IACtB,SAAAC;AAAA,EAEA,MAAA,gBAAAC,EAACC,GAAA,EAAuB,UAAAP,GACtB,UAAA;AAAA,IAAA,gBAAAQ;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,UAAAT;AAAA,QACA,mBAAAG;AAAA,QACA,qBAAAC;AAAA,QAEA,UAAC,gBAAAI,EAAAE,GAAA,EAAgB,KAAKR,GAAY,UAAUP,GAAmB;AAAA,MAAA;AAAA,IACjE;AAAA,IAEA,gBAAAW,EAACK,GAAA,EACC,UAAA;AAAA,MAAC,gBAAAL,EAAAM,GAAA,EAAwB,UAAAZ,GACvB,UAAA;AAAA,QAAA,gBAAAQ,EAACK,GAAK,EAAA,WAAU,OAAM,QAAO,SAC1B,UACHf,GAAA;AAAA,QACA,gBAAAU,EAACM,GAAU,EAAA,QAAQ,EAAG,CAAA;AAAA,QACtB,gBAAAN,EAACK,KAAK,WAAU,OAAM,QAAO,SAC1B,UAAAZ,IAAY,OAAOF,EACtB,CAAA;AAAA,MAAA,GACF;AAAA,MAECM;AAAA,IAAA,GACH;AAAA,EAAA,GACF;AAEJ;"}
+{"version":3,"file":"banner.js","sources":["../../../../../../src/features/circle-games/leaderboard/comps/banner/banner.tsx"],"sourcesContent":["import type { IBannerProps } from './banner-types';\nimport type { FC } from 'react';\n\nimport { memo } from 'react';\n\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../../ui/separator/separator';\nimport Text from '../../../../ui/text/text';\nimport * as Styled from './banner-styled';\n\nconst animationSettings = { renderer: 'canvas' };\n\nexport const Banner: FC<IBannerProps> = memo(\n  ({\n    primaryText,\n    secondaryText,\n    topInset = window.ReactNativeTopInset || 0,\n    isLoading = false,\n    lottiePath,\n    bgFromTopPosition = 0,\n    bgFromRightPosition = 0,\n    custEle,\n  }) => (\n    <Styled.BannerContainer topInset={topInset}>\n      <Styled.CircleLottieView\n        topInset={topInset}\n        bgFromTopPosition={bgFromTopPosition}\n        bgFromRightPosition={bgFromRightPosition}\n      >\n        <LottieAnimation src={lottiePath} settings={animationSettings} />\n      </Styled.CircleLottieView>\n\n      <Styled.BannerTextContainer>\n        <Styled.CountTextWrapper topInset={topInset}>\n          <Text $renderAs=\"ac4\" $color=\"WHITE\">\n            {primaryText}\n          </Text>\n          <Separator height={4} />\n          <Text $renderAs=\"ah4\" $color=\"WHITE\">\n            {isLoading ? '__' : secondaryText}\n          </Text>\n        </Styled.CountTextWrapper>\n\n        {custEle}\n      </Styled.BannerTextContainer>\n    </Styled.BannerContainer>\n  ),\n);\n"],"names":["animationSettings","Banner","memo","primaryText","secondaryText","topInset","isLoading","lottiePath","bgFromTopPosition","bgFromRightPosition","custEle","jsxs","Styled.BannerContainer","jsx","Styled.CircleLottieView","LottieAnimation","Styled.BannerTextContainer","Styled.CountTextWrapper","Text","Separator"],"mappings":";;;;;;AAUA,MAAMA,IAAoB,EAAE,UAAU,YAEzBC,IAA2BC;AAAA,EACtC,CAAC;AAAA,IACC,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC,IAAW,OAAO,uBAAuB;AAAA,IACzC,WAAAC,IAAY;AAAA,IACZ,YAAAC;AAAA,IACA,mBAAAC,IAAoB;AAAA,IACpB,qBAAAC,IAAsB;AAAA,IACtB,SAAAC;AAAA,EAEA,MAAA,gBAAAC,EAACC,GAAA,EAAuB,UAAAP,GACtB,UAAA;AAAA,IAAA,gBAAAQ;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,UAAAT;AAAA,QACA,mBAAAG;AAAA,QACA,qBAAAC;AAAA,QAEA,UAAC,gBAAAI,EAAAE,GAAA,EAAgB,KAAKR,GAAY,UAAUP,GAAmB;AAAA,MAAA;AAAA,IACjE;AAAA,IAEA,gBAAAW,EAACK,GAAA,EACC,UAAA;AAAA,MAAC,gBAAAL,EAAAM,GAAA,EAAwB,UAAAZ,GACvB,UAAA;AAAA,QAAA,gBAAAQ,EAACK,GAAK,EAAA,WAAU,OAAM,QAAO,SAC1B,UACHf,GAAA;AAAA,QACA,gBAAAU,EAACM,GAAU,EAAA,QAAQ,EAAG,CAAA;AAAA,QACtB,gBAAAN,EAACK,KAAK,WAAU,OAAM,QAAO,SAC1B,UAAAZ,IAAY,OAAOF,EACtB,CAAA;AAAA,MAAA,GACF;AAAA,MAECM;AAAA,IAAA,GACH;AAAA,EAAA,GACF;AAEJ;"}

package/dist/features/circle-games/leaderboard/comps/navigation-button/navigation-button-styled.js

@@ -7,7 +7,7 @@ const i = o.div`
   left: ${({ align: t = "left" }) => t === "left" ? "20px" : "unset"};
   right: ${({ align: t = "left" }) => t === "right" ? "20px" : "unset"};
   z-index: 10;
-  bottom: 50px;
+  bottom: ${(window.ReactNativeBottomInset || 0) + 50}px;
 `;
 export {
   n as ExtendedIconButton,

package/dist/features/circle-games/leaderboard/comps/navigation-button/navigation-button-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"navigation-button-styled.js","sources":["../../../../../../src/features/circle-games/leaderboard/comps/navigation-button/navigation-button-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const NavigationActionWrapper = styled.div`\n  position: relative;\n  width: 100%;\n`;\n\nexport const ExtendedIconButton = styled.div<{ align?: 'left' | 'right' }>`\n  position: absolute;\n  left: ${({ align = 'left' }) => (align === 'left' ? '20px' : 'unset')};\n  right: ${({ align = 'left' }) => (align === 'right' ? '20px' : 'unset')};\n  z-index: 10;\n  bottom: 50px;\n`;\n"],"names":["NavigationActionWrapper","styled","ExtendedIconButton","align"],"mappings":";AAEO,MAAMA,IAA0BC,EAAO;AAAA;AAAA;AAAA,GAKjCC,IAAqBD,EAAO;AAAA;AAAA,UAE/B,CAAC,EAAE,OAAAE,IAAQ,OAAA,MAAcA,MAAU,SAAS,SAAS,OAAQ;AAAA,WAC5D,CAAC,EAAE,OAAAA,IAAQ,OAAA,MAAcA,MAAU,UAAU,SAAS,OAAQ;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"navigation-button-styled.js","sources":["../../../../../../src/features/circle-games/leaderboard/comps/navigation-button/navigation-button-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const NavigationActionWrapper = styled.div`\n  position: relative;\n  width: 100%;\n`;\n\nexport const ExtendedIconButton = styled.div<{ align?: 'left' | 'right' }>`\n  position: absolute;\n  left: ${({ align = 'left' }) => (align === 'left' ? '20px' : 'unset')};\n  right: ${({ align = 'left' }) => (align === 'right' ? '20px' : 'unset')};\n  z-index: 10;\n  bottom: ${(window.ReactNativeBottomInset || 0) + 50}px;\n`;\n"],"names":["NavigationActionWrapper","styled","ExtendedIconButton","align"],"mappings":";AAEO,MAAMA,IAA0BC,EAAO;AAAA;AAAA;AAAA,GAKjCC,IAAqBD,EAAO;AAAA;AAAA,UAE/B,CAAC,EAAE,OAAAE,IAAQ,OAAA,MAAcA,MAAU,SAAS,SAAS,OAAQ;AAAA,WAC5D,CAAC,EAAE,OAAAA,IAAQ,OAAA,MAAcA,MAAU,UAAU,SAAS,OAAQ;AAAA;AAAA,aAE5D,OAAO,0BAA0B,KAAK,EAAE;AAAA;"}

package/dist/features/circle-games/leaderboard/leaderboard-styled.js

@@ -25,7 +25,7 @@ const s = t.div`
   width: 100%;
   flex: 1;
   height: 100%;
-  padding-top: ${n}px;
+  padding-top: ${(window.ReactNativeTopInset || 0) + n}px;
   padding-bottom: ${i}px;
 `, m = t.div`
   position: absolute;

package/dist/features/circle-games/leaderboard/leaderboard-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"leaderboard-styled.js","sources":["../../../../src/features/circle-games/leaderboard/leaderboard-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport { ARC_BUTTON_BOTTOM_OFFSET } from '../../ui/arc-button/constants';\nimport FlexView from '../../ui/layout/flex-view';\nimport { BANNER_HEIGHT } from './comps/banner/constants';\n\nexport const Leaderboard = styled.div`\n  flex-direction: column;\n  overflow: hidden;\n  height: 100vh;\n  max-height: 100%;\n  position: relative;\n`;\n\nexport const LeaderboardContainer = styled.div`\n  background: ${({ theme }) => theme.colors.BLACK_1};\n  height: 100%;\n  position: relative;\n  width: 100%;\n`;\n\nexport const BannerWrapper = styled.div`\n  position: absolute;\n  top: 0;\n  width: 100%;\n  z-index: 10;\n`;\n\nexport const ItemsWrapper = styled.div<{ topInset: number }>`\n  background: transparent;\n  position: absolute;\n  overflow: auto;\n  width: 100%;\n  flex: 1;\n  height: 100%;\n  padding-top: ${BANNER_HEIGHT}px;\n  padding-bottom: ${ARC_BUTTON_BOTTOM_OFFSET}px;\n`;\n\nexport const TournamentBannerCustContainer = styled.div`\n  position: absolute;\n  display: flex;\n  top: 5px;\n  right: -2px;\n  width: 200px;\n  height: 100%;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const ActionButtonWrapper = styled.div`\n  position: absolute;\n  bottom: 0;\n  width: 100%;\n`;\n\nexport const TrophyWrapper = styled.div`\n  display: flex;\n  justify-content: center;\n  width: 150%;\n  height: 150%;\n`;\n\nexport const Banner = styled.div`\n  background: ${({ theme }) => theme.colors.YELLOW_6};\n  min-height: 32px;\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const InfoContainer = styled(FlexView)`\n  padding: 16px;\n`;\n"],"names":["Leaderboard","styled","LeaderboardContainer","theme","BannerWrapper","ItemsWrapper","BANNER_HEIGHT","ARC_BUTTON_BOTTOM_OFFSET","TournamentBannerCustContainer","ActionButtonWrapper","TrophyWrapper","Banner","FlexView"],"mappings":";;;;AAMO,MAAMA,IAAcC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQrBC,IAAuBD,EAAO;AAAA,gBAC3B,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA,GAMtCC,IAAgBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOvBI,IAAeJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iBAOlBK,CAAa;AAAA,oBACVC,CAAwB;AAAA,GAG/BC,IAAgCP,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWvCQ,IAAsBR,EAAO;AAAA;AAAA;AAAA;AAAA,GAM7BS,IAAgBT,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOvBU,IAASV,EAAO;AAAA,gBACb,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvBF,EAAOW,CAAQ;AAAA;AAAA;"}
+{"version":3,"file":"leaderboard-styled.js","sources":["../../../../src/features/circle-games/leaderboard/leaderboard-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport { ARC_BUTTON_BOTTOM_OFFSET } from '../../ui/arc-button/constants';\nimport FlexView from '../../ui/layout/flex-view';\nimport { BANNER_HEIGHT } from './comps/banner/constants';\n\nexport const Leaderboard = styled.div`\n  flex-direction: column;\n  overflow: hidden;\n  height: 100vh;\n  max-height: 100%;\n  position: relative;\n`;\n\nexport const LeaderboardContainer = styled.div`\n  background: ${({ theme }) => theme.colors.BLACK_1};\n  height: 100%;\n  position: relative;\n  width: 100%;\n`;\n\nexport const BannerWrapper = styled.div`\n  position: absolute;\n  top: 0;\n  width: 100%;\n  z-index: 10;\n`;\n\nexport const ItemsWrapper = styled.div`\n  background: transparent;\n  position: absolute;\n  overflow: auto;\n  width: 100%;\n  flex: 1;\n  height: 100%;\n  padding-top: ${(window.ReactNativeTopInset || 0) + BANNER_HEIGHT}px;\n  padding-bottom: ${ARC_BUTTON_BOTTOM_OFFSET}px;\n`;\n\nexport const TournamentBannerCustContainer = styled.div`\n  position: absolute;\n  display: flex;\n  top: 5px;\n  right: -2px;\n  width: 200px;\n  height: 100%;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const ActionButtonWrapper = styled.div`\n  position: absolute;\n  bottom: 0;\n  width: 100%;\n`;\n\nexport const TrophyWrapper = styled.div`\n  display: flex;\n  justify-content: center;\n  width: 150%;\n  height: 150%;\n`;\n\nexport const Banner = styled.div`\n  background: ${({ theme }) => theme.colors.YELLOW_6};\n  min-height: 32px;\n  width: 100%;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const InfoContainer = styled(FlexView)`\n  padding: 16px;\n`;\n"],"names":["Leaderboard","styled","LeaderboardContainer","theme","BannerWrapper","ItemsWrapper","BANNER_HEIGHT","ARC_BUTTON_BOTTOM_OFFSET","TournamentBannerCustContainer","ActionButtonWrapper","TrophyWrapper","Banner","FlexView"],"mappings":";;;;AAMO,MAAMA,IAAcC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQrBC,IAAuBD,EAAO;AAAA,gBAC3B,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA,GAMtCC,IAAgBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOvBI,IAAeJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAOjB,OAAO,uBAAuB,KAAKK,CAAa;AAAA,oBAC9CC,CAAwB;AAAA,GAG/BC,IAAgCP,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWvCQ,IAAsBR,EAAO;AAAA;AAAA;AAAA;AAAA,GAM7BS,IAAgBT,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,GAOvBU,IAASV,EAAO;AAAA,gBACb,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASvBF,EAAOW,CAAQ;AAAA;AAAA;"}

package/dist/features/circle-games/leaderboard/leaderboard.js

@@ -1,5 +1,5 @@
-import { jsx as e, jsxs as p } from "react/jsx-runtime";
-import { useState as a, useEffect as K } from "react";
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+import { useState as p, useEffect as K } from "react";
 import { ILLUSTRATIONS as w } from "../../../assets/illustrations/illustrations.js";
 import { LOTTIE as d } from "../../../assets/lottie/lottie.js";
 import { CircularLoader as U } from "../../ui/loader/circular-loader/circular-loader.js";
@@ -39,12 +39,12 @@ const L = {
   streakInfo: l
 }) => {
   var y, A, R, S, B, C, x, P;
-  const [i, I] = a(
+  const [i, I] = p(
     o.findIndex((t) => u === t.type)
-  ), [n, k] = a(((y = m == null ? void 0 : m[u]) == null ? void 0 : y.leaderboardPlayers) || []), [h, N] = a({
+  ), [n, k] = p(((y = m == null ? void 0 : m[u]) == null ? void 0 : y.leaderboardPlayers) || []), [h, N] = p({
     current: 0,
     end: 0
-  }), [O, f] = V(0), [c, Y] = a(!1), F = (A = n == null ? void 0 : n[0]) == null ? void 0 : A.points, $ = ((R = n == null ? void 0 : n[0]) == null ? void 0 : R.streakDays) || 0, { playButtonSound: _ } = q(), j = () => {
+  }), [O, f] = V(0), [c, Y] = p(!1), F = (A = n == null ? void 0 : n[0]) == null ? void 0 : A.points, $ = ((R = n == null ? void 0 : n[0]) == null ? void 0 : R.streakDays) || 0, { playButtonSound: _ } = q(), j = () => {
     _(), I((t) => t - 1 < 0 ? o.length - 1 : t - 1);
   }, v = () => {
     _(), I((t) => t + 1 === o.length ? 0 : t + 1);
@@ -61,8 +61,8 @@ const L = {
         end: s.endTimestamp
       }), s.currentTimestamp > s.endTimestamp && (g.splice(10), Y(!0))), k([...g]);
     }
-  }, [i, m]), /* @__PURE__ */ e(X, { children: /* @__PURE__ */ p(Z, { children: [
-    /* @__PURE__ */ p(D, { children: [
+  }, [i, m]), /* @__PURE__ */ e(X, { children: /* @__PURE__ */ a(Z, { children: [
+    /* @__PURE__ */ a(D, { children: [
       ((S = o[i]) == null ? void 0 : S.type) === r.BI_WEEKLY && /* @__PURE__ */ e(
         E,
         {
@@ -70,7 +70,7 @@ const L = {
           bgFromTopPosition: -120,
           bgFromRightPosition: -110,
           primaryText: c ? /* @__PURE__ */ e("span", { children: "New Tournament" }) : /* @__PURE__ */ e("span", { children: "Tournament" }),
-          secondaryText: c ? /* @__PURE__ */ e("span", { children: "Starts Soon" }) : /* @__PURE__ */ p("span", { children: [
+          secondaryText: c ? /* @__PURE__ */ e("span", { children: "Starts Soon" }) : /* @__PURE__ */ a("span", { children: [
             " ",
             /* @__PURE__ */ e(
               Q,
@@ -110,7 +110,7 @@ const L = {
       )
     ] }),
     T && /* @__PURE__ */ e(U, {}),
-    !T && n && /* @__PURE__ */ p(te, { topInset: 0, children: [
+    !T && n && /* @__PURE__ */ a(te, { children: [
       ((x = o[i]) == null ? void 0 : x.type) === r.ALL_TIME_STREAK && /* @__PURE__ */ e(
         J,
         {