@cuemath/leap 2.8.61-rj-12 → 2.8.61-rj-13

package/dist/features/chapters/lpar-milestone-chapter/lpar-milestone-chapter.js

@@ -1,4 +1,4 @@
-import { jsxs as V, jsx as t } from "react/jsx-runtime";
+import { jsxs as $, jsx as t } from "react/jsx-runtime";
 import { useState as j, useMemo as G } from "react";
 import { ILLUSTRATIONS as H } from "../../../assets/illustrations/illustrations.js";
 import W from "../chapter/comps/chapter-banner/chapter-banner.js";
@@ -8,11 +8,11 @@ import Z from "./block-section/block-section.js";
 import F from "./extra-practice-section/extra-practice-section.js";
 import { ChapterWrapper as q, LoaderWrapper as J } from "./lpar-milestone-chapter-styled.js";
 import K from "./puzzle-section/puzzle-section.js";
-const { MASTERY: h, EXTRA_PRACTICE: b, PUZZLE_CARDS: m } = Y, Q = ({
+const { MASTERY: h, EXTRA_PRACTICE: b, PUZZLE_CARDS: p } = Y, Q = ({
   hasMasteryData: a,
   hasExtraPracticeData: e,
   hasPuzzleCardData: r
-}) => !a && r ? m : a ? h : e ? b : m, ee = ({
+}) => !a && r ? p : a ? h : e ? b : p, ee = ({
   hasMasteryData: a,
   hasExtraPracticeData: e,
   hasPuzzleCardData: r
@@ -33,12 +33,12 @@ const { MASTERY: h, EXTRA_PRACTICE: b, PUZZLE_CARDS: m } = Y, Q = ({
     {
       key: "chapter-tab-puzzle-cards",
       label: "Puzzle cards",
-      value: m,
+      value: p,
       visible: r
     }
   ], c = s.filter((u) => u.visible).length > 1;
   return { TABS: s, showTabs: c };
-}, te = ({
+}, pe = ({
   chapterData: a,
   userType: e,
   loading: r,
@@ -47,9 +47,9 @@ const { MASTERY: h, EXTRA_PRACTICE: b, PUZZLE_CARDS: m } = Y, Q = ({
   const {
     onChangeLocation: c,
     onCreateExtraPractice: u,
-    onMarkAsFamiliar: R,
+    onMarkAsFamiliar: x,
     onPreview: C,
-    onPuzzleCardClick: x,
+    onPuzzleCardClick: R,
     onReattempt: P,
     onReset: A,
     onResume: z,
@@ -61,19 +61,19 @@ const { MASTERY: h, EXTRA_PRACTICE: b, PUZZLE_CARDS: m } = Y, Q = ({
     image_hue: _,
     image_url: v,
     name: D,
-    tabs: L,
-    user_chapter_progress: M
+    tabs: k,
+    user_chapter_progress: L
   } = a, {
     mastery: T,
     puzzle_cards: n,
     extra_practice: g
-  } = L, o = T.length > 0, i = n.length > 0, l = g.length > 0, [p, k] = j(
+  } = k, o = T.length > 0, i = n.length > 0, l = g.length > 0, [m, M] = j(
     () => Q({
       hasMasteryData: o,
       hasExtraPracticeData: l,
       hasPuzzleCardData: i
     })
-  ), w = p === h, y = p === b, B = p === m, U = o && w, I = l && y, O = i && B, { TABS: $, showTabs: N } = G(
+  ), w = m === h, y = m === b, B = m === p, U = o && w, I = l && y, O = i && B, { TABS: N, showTabs: V } = G(
     () => ee({
       hasExtraPracticeData: !o && n ? !1 : l,
       hasMasteryData: o,
@@ -81,7 +81,7 @@ const { MASTERY: h, EXTRA_PRACTICE: b, PUZZLE_CARDS: m } = Y, Q = ({
     }),
     [o, l, i, n]
   );
-  return /* @__PURE__ */ V(q, { $disablePointerEvents: r, $flexGapX: 1.5, children: [
+  return /* @__PURE__ */ $(q, { $disablePointerEvents: r, $flexGapX: 1.5, children: [
     r && /* @__PURE__ */ t(J, { children: /* @__PURE__ */ t("img", { src: H.LOADER_1, alt: "loader" }) }),
     /* @__PURE__ */ t(
       W,
@@ -89,15 +89,15 @@ const { MASTERY: h, EXTRA_PRACTICE: b, PUZZLE_CARDS: m } = Y, Q = ({
         backgroundColor: `${_ || "GREY"}_1`,
         imageUrl: v,
         name: D,
-        userChapterProgress: M
+        userChapterProgress: L
       }
     ),
-    N && /* @__PURE__ */ t(
+    V && /* @__PURE__ */ t(
       X,
       {
-        selectedChapterTab: p,
-        tabs: $,
-        setSelectedChapterTab: k
+        selectedChapterTab: m,
+        tabs: N,
+        setSelectedChapterTab: M
       }
     ),
     U && /* @__PURE__ */ t(
@@ -106,7 +106,7 @@ const { MASTERY: h, EXTRA_PRACTICE: b, PUZZLE_CARDS: m } = Y, Q = ({
         masteryData: T,
         userType: e,
         onChangeLocation: c,
-        onMarkAsFamiliar: R,
+        onMarkAsFamiliar: x,
         onPreview: C,
         onReattempt: P,
         onReset: A,
@@ -138,12 +138,12 @@ const { MASTERY: h, EXTRA_PRACTICE: b, PUZZLE_CARDS: m } = Y, Q = ({
       {
         puzzleCards: n,
         userType: e,
-        onCardClick: x
+        onCardClick: R
       }
     )
   ] });
-}, ue = te;
+};
 export {
-  ue as default
+  pe as default
 };
 //# sourceMappingURL=lpar-milestone-chapter.js.map

package/dist/features/chapters/lpar-milestone-chapter/lpar-milestone-chapter.js.map

@@ -1 +1 @@
-{"version":3,"file":"lpar-milestone-chapter.js","sources":["../../../../src/features/chapters/lpar-milestone-chapter/lpar-milestone-chapter.tsx"],"sourcesContent":["import type { ILPARMilestoneChapter } from './lpar-milestone-chapter-types';\nimport type { FC } from 'react';\n\nimport { useMemo, useState } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport ChapterBanner from '../chapter/comps/chapter-banner/chapter-banner';\nimport TabsSection from '../lpar-chapter/comps/tab-section';\nimport { MILESTONE_CHAPTER_TAB_CODES } from '../lpar-chapter/constants';\nimport BlockSection from './block-section/block-section';\nimport ExtraPracticeSection from './extra-practice-section/extra-practice-section';\nimport * as Styled from './lpar-milestone-chapter-styled';\nimport PuzzleSection from './puzzle-section/puzzle-section';\n\nconst { MASTERY, EXTRA_PRACTICE, PUZZLE_CARDS } = MILESTONE_CHAPTER_TAB_CODES;\n\nconst getDefaultTab = ({\n  hasMasteryData,\n  hasExtraPracticeData,\n  hasPuzzleCardData,\n}: {\n  hasMasteryData: boolean;\n  hasExtraPracticeData: boolean;\n  hasPuzzleCardData: boolean;\n}) => {\n  //* If MASTERY is not present, we don't consider looking for Extra Practice.\n  //* Extra Practice is not shown if MASTERY is not present and PUZZLE_CARD is present at the same time.\n  if (!hasMasteryData && hasPuzzleCardData) return PUZZLE_CARDS;\n\n  if (hasMasteryData) return MASTERY;\n\n  if (hasExtraPracticeData) return EXTRA_PRACTICE;\n\n  return PUZZLE_CARDS;\n};\n\nconst getLPARMilestoneChapterTabs = ({\n  hasMasteryData,\n  hasExtraPracticeData,\n  hasPuzzleCardData,\n}: {\n  hasMasteryData: boolean;\n  hasExtraPracticeData: boolean;\n  hasPuzzleCardData: boolean;\n}) => {\n  const TABS = [\n    {\n      key: 'chapter-tab-mastery',\n      label: 'Mastery',\n      value: MASTERY,\n      visible: hasMasteryData,\n    },\n    {\n      key: 'chapter-tab-extra-practice',\n      label: 'Extra practice',\n      value: EXTRA_PRACTICE,\n      visible: hasExtraPracticeData,\n    },\n    {\n      key: 'chapter-tab-puzzle-cards',\n      label: 'Puzzle cards',\n      value: PUZZLE_CARDS,\n      visible: hasPuzzleCardData,\n    },\n  ];\n\n  const showTabs = TABS.filter(tab => tab.visible).length > 1;\n\n  return { TABS, showTabs };\n};\n\nconst LPARMilestoneChapter: FC<ILPARMilestoneChapter> = ({\n  chapterData,\n  userType,\n  loading,\n  ...restLPARMilestoneChapterProps\n}) => {\n  const {\n    onChangeLocation,\n    onCreateExtraPractice,\n    onMarkAsFamiliar,\n    onPreview,\n    onPuzzleCardClick,\n    onReattempt,\n    onReset,\n    onResume,\n    onReview,\n    onStart,\n    onUnassign,\n    onUnlock,\n  } = restLPARMilestoneChapterProps;\n\n  const {\n    image_hue: imageHue,\n    image_url: imageUrl,\n    name: chapterName,\n    tabs,\n    user_chapter_progress: userChapterProgress,\n  } = chapterData;\n  const {\n    mastery: masteryData,\n    puzzle_cards: puzzleData,\n    extra_practice: extraPracticeData,\n  } = tabs;\n\n  const hasMasteryData = masteryData.length > 0;\n  const hasPuzzleCardData = puzzleData.length > 0;\n  const hasExtraPracticeData = extraPracticeData.length > 0;\n\n  const [selectedChapterTab, setSelectedChapterTab] = useState<string>(() =>\n    getDefaultTab({\n      hasMasteryData,\n      hasExtraPracticeData,\n      hasPuzzleCardData,\n    }),\n  );\n\n  const isMasteryTabSelected = selectedChapterTab === MASTERY;\n  const isExtraPracticeTabSelected = selectedChapterTab === EXTRA_PRACTICE;\n  const isPuzzleTabSelected = selectedChapterTab === PUZZLE_CARDS;\n\n  const canViewMastery = hasMasteryData && isMasteryTabSelected;\n  const canViewExtraPractice = hasExtraPracticeData && isExtraPracticeTabSelected;\n  const canViewPuzzleCards = hasPuzzleCardData && isPuzzleTabSelected;\n\n  const { TABS, showTabs } = useMemo(\n    () =>\n      getLPARMilestoneChapterTabs({\n        hasExtraPracticeData: !hasMasteryData && puzzleData ? false : hasExtraPracticeData,\n        hasMasteryData,\n        hasPuzzleCardData,\n      }),\n    [hasMasteryData, hasExtraPracticeData, hasPuzzleCardData, puzzleData],\n  );\n\n  return (\n    <Styled.ChapterWrapper $disablePointerEvents={loading} $flexGapX={1.5}>\n      {loading && (\n        <Styled.LoaderWrapper>\n          <img src={ILLUSTRATIONS.LOADER_1} alt=\"loader\" />\n        </Styled.LoaderWrapper>\n      )}\n      <ChapterBanner\n        backgroundColor={`${imageHue || 'GREY'}_1`}\n        imageUrl={imageUrl}\n        name={chapterName}\n        userChapterProgress={userChapterProgress}\n      />\n\n      {showTabs && (\n        <TabsSection\n          selectedChapterTab={selectedChapterTab}\n          tabs={TABS}\n          setSelectedChapterTab={setSelectedChapterTab}\n        />\n      )}\n\n      {canViewMastery && (\n        <BlockSection\n          masteryData={masteryData}\n          userType={userType}\n          onChangeLocation={onChangeLocation}\n          onMarkAsFamiliar={onMarkAsFamiliar}\n          onPreview={onPreview}\n          onReattempt={onReattempt}\n          onReset={onReset}\n          onResume={onResume}\n          onReview={onReview}\n          onStart={onStart}\n          onUnassign={onUnassign}\n          onUnlock={onUnlock}\n        />\n      )}\n\n      {canViewExtraPractice && (\n        <ExtraPracticeSection\n          extraPracticeData={extraPracticeData}\n          userType={userType}\n          onChangeLocation={onChangeLocation}\n          onCreateExtraPractice={onCreateExtraPractice}\n          onPreview={onPreview}\n          onReattempt={onReattempt}\n          onResume={onResume}\n          onReview={onReview}\n          onStart={onStart}\n          onUnassign={onUnassign}\n          onUnlock={onUnlock}\n        />\n      )}\n\n      {canViewPuzzleCards && (\n        <PuzzleSection\n          puzzleCards={puzzleData}\n          userType={userType}\n          onCardClick={onPuzzleCardClick}\n        />\n      )}\n    </Styled.ChapterWrapper>\n  );\n};\n\nexport default LPARMilestoneChapter;\n"],"names":["MASTERY","EXTRA_PRACTICE","PUZZLE_CARDS","MILESTONE_CHAPTER_TAB_CODES","getDefaultTab","hasMasteryData","hasExtraPracticeData","hasPuzzleCardData","getLPARMilestoneChapterTabs","TABS","showTabs","tab","LPARMilestoneChapter","chapterData","userType","loading","restLPARMilestoneChapterProps","onChangeLocation","onCreateExtraPractice","onMarkAsFamiliar","onPreview","onPuzzleCardClick","onReattempt","onReset","onResume","onReview","onStart","onUnassign","onUnlock","imageHue","imageUrl","chapterName","tabs","userChapterProgress","masteryData","puzzleData","extraPracticeData","selectedChapterTab","setSelectedChapterTab","useState","isMasteryTabSelected","isExtraPracticeTabSelected","isPuzzleTabSelected","canViewMastery","canViewExtraPractice","canViewPuzzleCards","useMemo","Styled.ChapterWrapper","jsx","Styled.LoaderWrapper","ILLUSTRATIONS","ChapterBanner","TabsSection","BlockSection","ExtraPracticeSection","PuzzleSection","LPARMilestoneChapter$1"],"mappings":";;;;;;;;;;AAcA,MAAM,EAAE,SAAAA,GAAS,gBAAAC,GAAgB,cAAAC,EAAA,IAAiBC,GAE5CC,IAAgB,CAAC;AAAA,EACrB,gBAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,mBAAAC;AACF,MAOM,CAACF,KAAkBE,IAA0BL,IAE7CG,IAAuBL,IAEvBM,IAA6BL,IAE1BC,GAGHM,KAA8B,CAAC;AAAA,EACnC,gBAAAH;AAAA,EACA,sBAAAC;AAAA,EACA,mBAAAC;AACF,MAIM;AACJ,QAAME,IAAO;AAAA,IACX;AAAA,MACE,KAAK;AAAA,MACL,OAAO;AAAA,MACP,OAAOT;AAAA,MACP,SAASK;AAAA,IACX;AAAA,IACA;AAAA,MACE,KAAK;AAAA,MACL,OAAO;AAAA,MACP,OAAOJ;AAAA,MACP,SAASK;AAAA,IACX;AAAA,IACA;AAAA,MACE,KAAK;AAAA,MACL,OAAO;AAAA,MACP,OAAOJ;AAAA,MACP,SAASK;AAAA,IACX;AAAA,EAAA,GAGIG,IAAWD,EAAK,OAAO,OAAOE,EAAI,OAAO,EAAE,SAAS;AAEnD,SAAA,EAAE,MAAAF,GAAM,UAAAC;AACjB,GAEME,KAAkD,CAAC;AAAA,EACvD,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACE,QAAA;AAAA,IACJ,kBAAAC;AAAA,IACA,uBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,WAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,EACE,IAAAZ,GAEE;AAAA,IACJ,WAAWa;AAAA,IACX,WAAWC;AAAA,IACX,MAAMC;AAAA,IACN,MAAAC;AAAA,IACA,uBAAuBC;AAAA,EACrB,IAAApB,GACE;AAAA,IACJ,SAASqB;AAAA,IACT,cAAcC;AAAA,IACd,gBAAgBC;AAAA,EACd,IAAAJ,GAEE3B,IAAiB6B,EAAY,SAAS,GACtC3B,IAAoB4B,EAAW,SAAS,GACxC7B,IAAuB8B,EAAkB,SAAS,GAElD,CAACC,GAAoBC,CAAqB,IAAIC;AAAA,IAAiB,MACnEnC,EAAc;AAAA,MACZ,gBAAAC;AAAA,MACA,sBAAAC;AAAA,MACA,mBAAAC;AAAA,IAAA,CACD;AAAA,EAAA,GAGGiC,IAAuBH,MAAuBrC,GAC9CyC,IAA6BJ,MAAuBpC,GACpDyC,IAAsBL,MAAuBnC,GAE7CyC,IAAiBtC,KAAkBmC,GACnCI,IAAuBtC,KAAwBmC,GAC/CI,IAAqBtC,KAAqBmC,GAE1C,EAAE,MAAAjC,GAAM,UAAAC,EAAA,IAAaoC;AAAA,IACzB,MACEtC,GAA4B;AAAA,MAC1B,sBAAsB,CAACH,KAAkB8B,IAAa,KAAQ7B;AAAA,MAC9D,gBAAAD;AAAA,MACA,mBAAAE;AAAA,IAAA,CACD;AAAA,IACH,CAACF,GAAgBC,GAAsBC,GAAmB4B,CAAU;AAAA,EAAA;AAGtE,2BACGY,GAAA,EAAsB,uBAAuBhC,GAAS,WAAW,KAC/D,UAAA;AAAA,IACCA,KAAA,gBAAAiC,EAACC,GAAA,EACC,UAAA,gBAAAD,EAAC,OAAI,EAAA,KAAKE,EAAc,UAAU,KAAI,SAAA,CAAS,EACjD,CAAA;AAAA,IAEF,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,iBAAiB,GAAGtB,KAAY,MAAM;AAAA,QACtC,UAAAC;AAAA,QACA,MAAMC;AAAA,QACN,qBAAAE;AAAA,MAAA;AAAA,IACF;AAAA,IAECvB,KACC,gBAAAsC;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,oBAAAf;AAAA,QACA,MAAM5B;AAAA,QACN,uBAAA6B;AAAA,MAAA;AAAA,IACF;AAAA,IAGDK,KACC,gBAAAK;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,aAAAnB;AAAA,QACA,UAAApB;AAAA,QACA,kBAAAG;AAAA,QACA,kBAAAE;AAAA,QACA,WAAAC;AAAA,QACA,aAAAE;AAAA,QACA,SAAAC;AAAA,QACA,UAAAC;AAAA,QACA,UAAAC;AAAA,QACA,SAAAC;AAAA,QACA,YAAAC;AAAA,QACA,UAAAC;AAAA,MAAA;AAAA,IACF;AAAA,IAGDgB,KACC,gBAAAI;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,mBAAAlB;AAAA,QACA,UAAAtB;AAAA,QACA,kBAAAG;AAAA,QACA,uBAAAC;AAAA,QACA,WAAAE;AAAA,QACA,aAAAE;AAAA,QACA,UAAAE;AAAA,QACA,UAAAC;AAAA,QACA,SAAAC;AAAA,QACA,YAAAC;AAAA,QACA,UAAAC;AAAA,MAAA;AAAA,IACF;AAAA,IAGDiB,KACC,gBAAAG;AAAA,MAACO;AAAA,MAAA;AAAA,QACC,aAAapB;AAAA,QACb,UAAArB;AAAA,QACA,aAAaO;AAAA,MAAA;AAAA,IACf;AAAA,EAEJ,EAAA,CAAA;AAEJ,GAEAmC,KAAe5C;"}
+{"version":3,"file":"lpar-milestone-chapter.js","sources":["../../../../src/features/chapters/lpar-milestone-chapter/lpar-milestone-chapter.tsx"],"sourcesContent":["import type { ILPARMilestoneChapter } from './lpar-milestone-chapter-types';\nimport type { FC } from 'react';\n\nimport { useMemo, useState } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport ChapterBanner from '../chapter/comps/chapter-banner/chapter-banner';\nimport TabsSection from '../lpar-chapter/comps/tab-section';\nimport { MILESTONE_CHAPTER_TAB_CODES } from '../lpar-chapter/constants';\nimport BlockSection from './block-section/block-section';\nimport ExtraPracticeSection from './extra-practice-section/extra-practice-section';\nimport * as Styled from './lpar-milestone-chapter-styled';\nimport PuzzleSection from './puzzle-section/puzzle-section';\n\nconst { MASTERY, EXTRA_PRACTICE, PUZZLE_CARDS } = MILESTONE_CHAPTER_TAB_CODES;\n\nconst getDefaultTab = ({\n  hasMasteryData,\n  hasExtraPracticeData,\n  hasPuzzleCardData,\n}: {\n  hasMasteryData: boolean;\n  hasExtraPracticeData: boolean;\n  hasPuzzleCardData: boolean;\n}) => {\n  //* If MASTERY is not present, we don't consider looking for Extra Practice.\n  //* Extra Practice is not shown if MASTERY is not present and PUZZLE_CARD is present at the same time.\n  if (!hasMasteryData && hasPuzzleCardData) return PUZZLE_CARDS;\n\n  if (hasMasteryData) return MASTERY;\n\n  if (hasExtraPracticeData) return EXTRA_PRACTICE;\n\n  return PUZZLE_CARDS;\n};\n\nconst getLPARMilestoneChapterTabs = ({\n  hasMasteryData,\n  hasExtraPracticeData,\n  hasPuzzleCardData,\n}: {\n  hasMasteryData: boolean;\n  hasExtraPracticeData: boolean;\n  hasPuzzleCardData: boolean;\n}) => {\n  const TABS = [\n    {\n      key: 'chapter-tab-mastery',\n      label: 'Mastery',\n      value: MASTERY,\n      visible: hasMasteryData,\n    },\n    {\n      key: 'chapter-tab-extra-practice',\n      label: 'Extra practice',\n      value: EXTRA_PRACTICE,\n      visible: hasExtraPracticeData,\n    },\n    {\n      key: 'chapter-tab-puzzle-cards',\n      label: 'Puzzle cards',\n      value: PUZZLE_CARDS,\n      visible: hasPuzzleCardData,\n    },\n  ];\n\n  const showTabs = TABS.filter(tab => tab.visible).length > 1;\n\n  return { TABS, showTabs };\n};\n\nconst LPARMilestoneChapter: FC<ILPARMilestoneChapter> = ({\n  chapterData,\n  userType,\n  loading,\n  ...restLPARMilestoneChapterProps\n}) => {\n  const {\n    onChangeLocation,\n    onCreateExtraPractice,\n    onMarkAsFamiliar,\n    onPreview,\n    onPuzzleCardClick,\n    onReattempt,\n    onReset,\n    onResume,\n    onReview,\n    onStart,\n    onUnassign,\n    onUnlock,\n  } = restLPARMilestoneChapterProps;\n\n  const {\n    image_hue: imageHue,\n    image_url: imageUrl,\n    name: chapterName,\n    tabs,\n    user_chapter_progress: userChapterProgress,\n  } = chapterData;\n  const {\n    mastery: masteryData,\n    puzzle_cards: puzzleData,\n    extra_practice: extraPracticeData,\n  } = tabs;\n\n  const hasMasteryData = masteryData.length > 0;\n  const hasPuzzleCardData = puzzleData.length > 0;\n  const hasExtraPracticeData = extraPracticeData.length > 0;\n\n  const [selectedChapterTab, setSelectedChapterTab] = useState<string>(() =>\n    getDefaultTab({\n      hasMasteryData,\n      hasExtraPracticeData,\n      hasPuzzleCardData,\n    }),\n  );\n\n  const isMasteryTabSelected = selectedChapterTab === MASTERY;\n  const isExtraPracticeTabSelected = selectedChapterTab === EXTRA_PRACTICE;\n  const isPuzzleTabSelected = selectedChapterTab === PUZZLE_CARDS;\n\n  const canViewMastery = hasMasteryData && isMasteryTabSelected;\n  const canViewExtraPractice = hasExtraPracticeData && isExtraPracticeTabSelected;\n  const canViewPuzzleCards = hasPuzzleCardData && isPuzzleTabSelected;\n\n  const { TABS, showTabs } = useMemo(\n    () =>\n      getLPARMilestoneChapterTabs({\n        hasExtraPracticeData: !hasMasteryData && puzzleData ? false : hasExtraPracticeData,\n        hasMasteryData,\n        hasPuzzleCardData,\n      }),\n    [hasMasteryData, hasExtraPracticeData, hasPuzzleCardData, puzzleData],\n  );\n\n  return (\n    <Styled.ChapterWrapper $disablePointerEvents={loading} $flexGapX={1.5}>\n      {loading && (\n        <Styled.LoaderWrapper>\n          <img src={ILLUSTRATIONS.LOADER_1} alt=\"loader\" />\n        </Styled.LoaderWrapper>\n      )}\n      <ChapterBanner\n        backgroundColor={`${imageHue || 'GREY'}_1`}\n        imageUrl={imageUrl}\n        name={chapterName}\n        userChapterProgress={userChapterProgress}\n      />\n\n      {showTabs && (\n        <TabsSection\n          selectedChapterTab={selectedChapterTab}\n          tabs={TABS}\n          setSelectedChapterTab={setSelectedChapterTab}\n        />\n      )}\n\n      {canViewMastery && (\n        <BlockSection\n          masteryData={masteryData}\n          userType={userType}\n          onChangeLocation={onChangeLocation}\n          onMarkAsFamiliar={onMarkAsFamiliar}\n          onPreview={onPreview}\n          onReattempt={onReattempt}\n          onReset={onReset}\n          onResume={onResume}\n          onReview={onReview}\n          onStart={onStart}\n          onUnassign={onUnassign}\n          onUnlock={onUnlock}\n        />\n      )}\n\n      {canViewExtraPractice && (\n        <ExtraPracticeSection\n          extraPracticeData={extraPracticeData}\n          userType={userType}\n          onChangeLocation={onChangeLocation}\n          onCreateExtraPractice={onCreateExtraPractice}\n          onPreview={onPreview}\n          onReattempt={onReattempt}\n          onResume={onResume}\n          onReview={onReview}\n          onStart={onStart}\n          onUnassign={onUnassign}\n          onUnlock={onUnlock}\n        />\n      )}\n\n      {canViewPuzzleCards && (\n        <PuzzleSection\n          puzzleCards={puzzleData}\n          userType={userType}\n          onCardClick={onPuzzleCardClick}\n        />\n      )}\n    </Styled.ChapterWrapper>\n  );\n};\n\nexport default LPARMilestoneChapter;\n"],"names":["MASTERY","EXTRA_PRACTICE","PUZZLE_CARDS","MILESTONE_CHAPTER_TAB_CODES","getDefaultTab","hasMasteryData","hasExtraPracticeData","hasPuzzleCardData","getLPARMilestoneChapterTabs","TABS","showTabs","tab","LPARMilestoneChapter","chapterData","userType","loading","restLPARMilestoneChapterProps","onChangeLocation","onCreateExtraPractice","onMarkAsFamiliar","onPreview","onPuzzleCardClick","onReattempt","onReset","onResume","onReview","onStart","onUnassign","onUnlock","imageHue","imageUrl","chapterName","tabs","userChapterProgress","masteryData","puzzleData","extraPracticeData","selectedChapterTab","setSelectedChapterTab","useState","isMasteryTabSelected","isExtraPracticeTabSelected","isPuzzleTabSelected","canViewMastery","canViewExtraPractice","canViewPuzzleCards","useMemo","Styled.ChapterWrapper","jsx","Styled.LoaderWrapper","ILLUSTRATIONS","ChapterBanner","TabsSection","BlockSection","ExtraPracticeSection","PuzzleSection"],"mappings":"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"}

package/dist/features/chapters/lpar-milestone-chapter/puzzle-section/puzzle-card-util.js.map

@@ -1 +1 @@
-{"version":3,"file":"puzzle-card-util.js","sources":["../../../../../src/features/chapters/lpar-milestone-chapter/puzzle-section/puzzle-card-util.ts"],"sourcesContent":["import type { TPuzzleCardBlockStatus } from '../../lpar-chapter/puzzle-section/puzzle-card/puzzle-card-types';\nimport type { TLPARMilestoneSheetData } from '../block-section/sheet-item/sheet-item-types';\n\nimport { SHEET_ATTEMPT_STATE } from '../../../sheets/constants/sheet';\nimport { PUZZLE_CARD_STATE } from '../../lpar-chapter/constants/puzzle-card';\n\ntype TGetPuzzleCarBlockStatus = (sheetData: TLPARMilestoneSheetData) => TPuzzleCardBlockStatus;\n\nconst getPuzzleCardBlockStatus: TGetPuzzleCarBlockStatus = sheetData => {\n  const { attempt_state: attemptState, state } = sheetData;\n\n  if (attemptState && attemptState !== SHEET_ATTEMPT_STATE.WAIT_FOR_END_REVIEW) {\n    return PUZZLE_CARD_STATE[attemptState];\n  }\n\n  if (state !== PUZZLE_CARD_STATE.LOCKED) {\n    return PUZZLE_CARD_STATE.UNLOCKED;\n  }\n\n  return PUZZLE_CARD_STATE.LOCKED;\n};\n\nexport { getPuzzleCardBlockStatus };\n"],"names":["getPuzzleCardBlockStatus","sheetData","attemptState","state","SHEET_ATTEMPT_STATE","PUZZLE_CARD_STATE"],"mappings":";;AAQA,MAAMA,IAAqD,CAAaC,MAAA;AACtE,QAAM,EAAE,eAAeC,GAAc,OAAAC,EAAA,IAAUF;AAE3C,SAAAC,KAAgBA,MAAiBE,EAAoB,sBAChDC,EAAkBH,CAAY,IAGnCC,MAAUE,EAAkB,SACvBA,EAAkB,WAGpBA,EAAkB;AAC3B;"}
+{"version":3,"file":"puzzle-card-util.js","sources":["../../../../../src/features/chapters/lpar-milestone-chapter/puzzle-section/puzzle-card-util.ts"],"sourcesContent":["import type { TPuzzleCardBlockStatus } from '../../lpar-chapter/puzzle-section/puzzle-card/puzzle-card-types';\nimport type { TLPARMilestoneSheetData } from '../block-section/sheet-item/sheet-item-types';\n\nimport { SHEET_ATTEMPT_STATE } from '../../../sheets/constants/sheet';\nimport { PUZZLE_CARD_STATE } from '../../lpar-chapter/constants/puzzle-card';\n\ntype TGetPuzzleCarBlockStatus = (sheetData: TLPARMilestoneSheetData) => TPuzzleCardBlockStatus;\n\nconst getPuzzleCardBlockStatus: TGetPuzzleCarBlockStatus = sheetData => {\n  const { attempt_state: attemptState, state } = sheetData;\n\n  if (attemptState && attemptState !== SHEET_ATTEMPT_STATE.WAIT_FOR_END_REVIEW) {\n    return PUZZLE_CARD_STATE[attemptState];\n  }\n\n  if (state !== PUZZLE_CARD_STATE.LOCKED) {\n    return PUZZLE_CARD_STATE.UNLOCKED;\n  }\n\n  return PUZZLE_CARD_STATE.LOCKED;\n};\n\nexport { getPuzzleCardBlockStatus };\n"],"names":["getPuzzleCardBlockStatus","sheetData","attemptState","state","SHEET_ATTEMPT_STATE","PUZZLE_CARD_STATE"],"mappings":";;AAQA,MAAMA,IAAqD,CAAaC,MAAA;AACtE,QAAM,EAAE,eAAeC,GAAc,OAAAC,EAAU,IAAAF;AAE3C,SAAAC,KAAgBA,MAAiBE,EAAoB,sBAChDC,EAAkBH,CAAY,IAGnCC,MAAUE,EAAkB,SACvBA,EAAkB,WAGpBA,EAAkB;AAC3B;"}

package/dist/features/chapters/lpar-milestone-chapter/puzzle-section/puzzle-card.js

@@ -2,7 +2,7 @@ import { jsxs as s, jsx as r } from "react/jsx-runtime";
 import { useCallback as L } from "react";
 import A from "../../../ui/layout/flex-view.js";
 import m from "../../../ui/text/text.js";
-import { PUZZLE_CARD_STATE as o, PUZZLE_CARD_IMAGES as E, PUZZLE_CARD_STATE_BASED_COLOR as P } from "../../lpar-chapter/constants/puzzle-card.js";
+import { PUZZLE_CARD_IMAGES as E, PUZZLE_CARD_STATE as o, PUZZLE_CARD_STATE_BASED_COLOR as P } from "../../lpar-chapter/constants/puzzle-card.js";
 import f from "../../lpar-chapter/puzzle-section/puzzle-card/cue-coins.js";
 import { PuzzleCardOverView as T, HeaderText as w, ColoredLine as y, StyledText as O, BadgeCompleted as _, CueCoinWrapper as x } from "../../lpar-chapter/puzzle-section/puzzle-card/puzzle-card-styled.js";
 import { getRewardCoins as b } from "../../lpar-chapter/puzzle-section/puzzle-section-utils.js";

package/dist/features/chapters/lpar-milestone-chapter/puzzle-section/puzzle-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"puzzle-card.js","sources":["../../../../../src/features/chapters/lpar-milestone-chapter/puzzle-section/puzzle-card.tsx"],"sourcesContent":["import type { IPuzzleCard } from './puzzle-section-types';\nimport type { FC } from 'react';\n\nimport { useCallback } from 'react';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport {\n  PUZZLE_CARD_IMAGES,\n  PUZZLE_CARD_STATE,\n  PUZZLE_CARD_STATE_BASED_COLOR,\n} from '../../lpar-chapter/constants/puzzle-card';\nimport CueCoins from '../../lpar-chapter/puzzle-section/puzzle-card/cue-coins';\nimport {\n  PuzzleCardOverView,\n  HeaderText,\n  ColoredLine,\n  StyledText,\n  BadgeCompleted,\n  CueCoinWrapper,\n} from '../../lpar-chapter/puzzle-section/puzzle-card/puzzle-card-styled';\nimport { getRewardCoins } from '../../lpar-chapter/puzzle-section/puzzle-section-utils';\nimport { getPuzzleCardBlockStatus } from './puzzle-card-util';\n\nconst PuzzleCard: FC<IPuzzleCard> = ({ blockId, programId, puzzleNo, ...restPuzzleCardProps }) => {\n  const { sheetData, onCardClick } = restPuzzleCardProps;\n\n  const blockStatus = getPuzzleCardBlockStatus(sheetData);\n  const rewardCoins = getRewardCoins(sheetData);\n\n  const { node_type: nodeType, title } = sheetData;\n  const state = !blockStatus ? PUZZLE_CARD_STATE.LOCKED : PUZZLE_CARD_STATE[blockStatus];\n  const cardImage =\n    PUZZLE_CARD_IMAGES[nodeType as keyof typeof PUZZLE_CARD_IMAGES] ??\n    PUZZLE_CARD_IMAGES.PUZZLE_EASY;\n  const puzzleStatus = PUZZLE_CARD_STATE_BASED_COLOR[state];\n  const isLocked = state === PUZZLE_CARD_STATE.LOCKED;\n\n  const handleOnClick = useCallback(() => {\n    if (isLocked) return null;\n\n    if (typeof onCardClick !== 'function') {\n      throw new Error('onCardClick is not a function');\n    }\n\n    onCardClick(sheetData, {\n      blockStatus: blockStatus,\n      chapterName: puzzleNo,\n      blockId,\n      programId,\n    });\n  }, [blockId, blockStatus, onCardClick, programId, puzzleNo, sheetData, isLocked]);\n\n  return (\n    <PuzzleCardOverView\n      $widthX={12.5}\n      $heightX={17.125}\n      $gutterX={1.5625}\n      $gapX={1.5625}\n      $bgImage={cardImage}\n      $borderRadius={8}\n      $opacity={state === PUZZLE_CARD_STATE.LOCKED ? 0.6 : 1}\n      onClick={handleOnClick}\n      $disable={isLocked}\n    >\n      <HeaderText\n        $widthX={6.6875}\n        $color={puzzleStatus?.textColor}\n        $bgColor={puzzleStatus?.background}\n        $renderAs=\"eyebrow2\"\n        $align=\"center\"\n      >\n        {state}\n      </HeaderText>\n\n      <ColoredLine />\n\n      <Text $renderAs=\"body3\" $color=\"WHITE\" $align=\"center\">\n        Puzzle {puzzleNo}\n      </Text>\n\n      <StyledText\n        $renderAs=\"body1Medium\"\n        $completed={state === PUZZLE_CARD_STATE.COMPLETED}\n        $color=\"WHITE\"\n        $align=\"center\"\n      >\n        {title}\n      </StyledText>\n\n      {state === PUZZLE_CARD_STATE.COMPLETED && (\n        <BadgeCompleted $justifyContent=\"center\">\n          <Text $renderAs=\"cta3\" $color=\"BLUE_6\" $opacity={0.5} $align=\"center\">\n            YOU EARNED\n          </Text>\n          <FlexView $flexDirection=\"row\" $justifyContent=\"center\">\n            <CueCoins coins={rewardCoins} size=\"small\" />\n          </FlexView>\n        </BadgeCompleted>\n      )}\n\n      {state !== PUZZLE_CARD_STATE.COMPLETED && state !== PUZZLE_CARD_STATE.SKIPPED && (\n        <CueCoinWrapper $flexDirection=\"row\" $justifyContent=\"center\" $width=\"100%\">\n          <CueCoins coins={rewardCoins} size=\"medium\" />\n        </CueCoinWrapper>\n      )}\n    </PuzzleCardOverView>\n  );\n};\n\nexport default PuzzleCard;\n"],"names":["PuzzleCard","blockId","programId","puzzleNo","restPuzzleCardProps","sheetData","onCardClick","blockStatus","getPuzzleCardBlockStatus","rewardCoins","getRewardCoins","nodeType","title","state","PUZZLE_CARD_STATE","cardImage","PUZZLE_CARD_IMAGES","puzzleStatus","PUZZLE_CARD_STATE_BASED_COLOR","isLocked","handleOnClick","useCallback","jsxs","PuzzleCardOverView","jsx","HeaderText","ColoredLine","Text","StyledText","BadgeCompleted","FlexView","CueCoins","CueCoinWrapper"],"mappings":";;;;;;;;;AAwBM,MAAAA,IAA8B,CAAC,EAAE,SAAAC,GAAS,WAAAC,GAAW,UAAAC,GAAU,GAAGC,QAA0B;AAC1F,QAAA,EAAE,WAAAC,GAAW,aAAAC,EAAgB,IAAAF,GAE7BG,IAAcC,EAAyBH,CAAS,GAChDI,IAAcC,EAAeL,CAAS,GAEtC,EAAE,WAAWM,GAAU,OAAAC,EAAA,IAAUP,GACjCQ,IAASN,IAAyCO,EAAkBP,CAAW,IAAxDO,EAAkB,QACzCC,IACJC,EAAmBL,CAA2C,KAC9DK,EAAmB,aACfC,IAAeC,EAA8BL,CAAK,GAClDM,IAAWN,MAAUC,EAAkB,QAEvCM,IAAgBC,EAAY,MAAM;AACtC,QAAIF,EAAiB,QAAA;AAEjB,QAAA,OAAOb,KAAgB;AACnB,YAAA,IAAI,MAAM,+BAA+B;AAGjD,IAAAA,EAAYD,GAAW;AAAA,MACrB,aAAAE;AAAA,MACA,aAAaJ;AAAA,MACb,SAAAF;AAAA,MACA,WAAAC;AAAA,IAAA,CACD;AAAA,EAAA,GACA,CAACD,GAASM,GAAaD,GAAaJ,GAAWC,GAAUE,GAAWc,CAAQ,CAAC;AAG9E,SAAA,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU;AAAA,MACV,OAAO;AAAA,MACP,UAAUR;AAAA,MACV,eAAe;AAAA,MACf,UAAUF,MAAUC,EAAkB,SAAS,MAAM;AAAA,MACrD,SAASM;AAAA,MACT,UAAUD;AAAA,MAEV,UAAA;AAAA,QAAA,gBAAAK;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT,QAAQR,KAAA,gBAAAA,EAAc;AAAA,YACtB,UAAUA,KAAA,gBAAAA,EAAc;AAAA,YACxB,WAAU;AAAA,YACV,QAAO;AAAA,YAEN,UAAAJ;AAAA,UAAA;AAAA,QACH;AAAA,0BAECa,GAAY,EAAA;AAAA,0BAEZC,GAAK,EAAA,WAAU,SAAQ,QAAO,SAAQ,QAAO,UAAS,UAAA;AAAA,UAAA;AAAA,UAC7CxB;AAAA,QAAA,GACV;AAAA,QAEA,gBAAAqB;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,YAAYf,MAAUC,EAAkB;AAAA,YACxC,QAAO;AAAA,YACP,QAAO;AAAA,YAEN,UAAAF;AAAA,UAAA;AAAA,QACH;AAAA,QAECC,MAAUC,EAAkB,aAC1B,gBAAAQ,EAAAO,GAAA,EAAe,iBAAgB,UAC9B,UAAA;AAAA,UAAC,gBAAAL,EAAAG,GAAA,EAAK,WAAU,QAAO,QAAO,UAAS,UAAU,KAAK,QAAO,UAAS,UAEtE,aAAA,CAAA;AAAA,UACC,gBAAAH,EAAAM,GAAA,EAAS,gBAAe,OAAM,iBAAgB,UAC7C,UAAC,gBAAAN,EAAAO,GAAA,EAAS,OAAOtB,GAAa,MAAK,QAAQ,CAAA,GAC7C;AAAA,QAAA,GACF;AAAA,QAGDI,MAAUC,EAAkB,aAAaD,MAAUC,EAAkB,WACpE,gBAAAU,EAACQ,KAAe,gBAAe,OAAM,iBAAgB,UAAS,QAAO,QACnE,UAAC,gBAAAR,EAAAO,GAAA,EAAS,OAAOtB,GAAa,MAAK,UAAS,EAC9C,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"puzzle-card.js","sources":["../../../../../src/features/chapters/lpar-milestone-chapter/puzzle-section/puzzle-card.tsx"],"sourcesContent":["import type { IPuzzleCard } from './puzzle-section-types';\nimport type { FC } from 'react';\n\nimport { useCallback } from 'react';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport {\n  PUZZLE_CARD_IMAGES,\n  PUZZLE_CARD_STATE,\n  PUZZLE_CARD_STATE_BASED_COLOR,\n} from '../../lpar-chapter/constants/puzzle-card';\nimport CueCoins from '../../lpar-chapter/puzzle-section/puzzle-card/cue-coins';\nimport {\n  PuzzleCardOverView,\n  HeaderText,\n  ColoredLine,\n  StyledText,\n  BadgeCompleted,\n  CueCoinWrapper,\n} from '../../lpar-chapter/puzzle-section/puzzle-card/puzzle-card-styled';\nimport { getRewardCoins } from '../../lpar-chapter/puzzle-section/puzzle-section-utils';\nimport { getPuzzleCardBlockStatus } from './puzzle-card-util';\n\nconst PuzzleCard: FC<IPuzzleCard> = ({ blockId, programId, puzzleNo, ...restPuzzleCardProps }) => {\n  const { sheetData, onCardClick } = restPuzzleCardProps;\n\n  const blockStatus = getPuzzleCardBlockStatus(sheetData);\n  const rewardCoins = getRewardCoins(sheetData);\n\n  const { node_type: nodeType, title } = sheetData;\n  const state = !blockStatus ? PUZZLE_CARD_STATE.LOCKED : PUZZLE_CARD_STATE[blockStatus];\n  const cardImage =\n    PUZZLE_CARD_IMAGES[nodeType as keyof typeof PUZZLE_CARD_IMAGES] ??\n    PUZZLE_CARD_IMAGES.PUZZLE_EASY;\n  const puzzleStatus = PUZZLE_CARD_STATE_BASED_COLOR[state];\n  const isLocked = state === PUZZLE_CARD_STATE.LOCKED;\n\n  const handleOnClick = useCallback(() => {\n    if (isLocked) return null;\n\n    if (typeof onCardClick !== 'function') {\n      throw new Error('onCardClick is not a function');\n    }\n\n    onCardClick(sheetData, {\n      blockStatus: blockStatus,\n      chapterName: puzzleNo,\n      blockId,\n      programId,\n    });\n  }, [blockId, blockStatus, onCardClick, programId, puzzleNo, sheetData, isLocked]);\n\n  return (\n    <PuzzleCardOverView\n      $widthX={12.5}\n      $heightX={17.125}\n      $gutterX={1.5625}\n      $gapX={1.5625}\n      $bgImage={cardImage}\n      $borderRadius={8}\n      $opacity={state === PUZZLE_CARD_STATE.LOCKED ? 0.6 : 1}\n      onClick={handleOnClick}\n      $disable={isLocked}\n    >\n      <HeaderText\n        $widthX={6.6875}\n        $color={puzzleStatus?.textColor}\n        $bgColor={puzzleStatus?.background}\n        $renderAs=\"eyebrow2\"\n        $align=\"center\"\n      >\n        {state}\n      </HeaderText>\n\n      <ColoredLine />\n\n      <Text $renderAs=\"body3\" $color=\"WHITE\" $align=\"center\">\n        Puzzle {puzzleNo}\n      </Text>\n\n      <StyledText\n        $renderAs=\"body1Medium\"\n        $completed={state === PUZZLE_CARD_STATE.COMPLETED}\n        $color=\"WHITE\"\n        $align=\"center\"\n      >\n        {title}\n      </StyledText>\n\n      {state === PUZZLE_CARD_STATE.COMPLETED && (\n        <BadgeCompleted $justifyContent=\"center\">\n          <Text $renderAs=\"cta3\" $color=\"BLUE_6\" $opacity={0.5} $align=\"center\">\n            YOU EARNED\n          </Text>\n          <FlexView $flexDirection=\"row\" $justifyContent=\"center\">\n            <CueCoins coins={rewardCoins} size=\"small\" />\n          </FlexView>\n        </BadgeCompleted>\n      )}\n\n      {state !== PUZZLE_CARD_STATE.COMPLETED && state !== PUZZLE_CARD_STATE.SKIPPED && (\n        <CueCoinWrapper $flexDirection=\"row\" $justifyContent=\"center\" $width=\"100%\">\n          <CueCoins coins={rewardCoins} size=\"medium\" />\n        </CueCoinWrapper>\n      )}\n    </PuzzleCardOverView>\n  );\n};\n\nexport default PuzzleCard;\n"],"names":["PuzzleCard","blockId","programId","puzzleNo","restPuzzleCardProps","sheetData","onCardClick","blockStatus","getPuzzleCardBlockStatus","rewardCoins","getRewardCoins","nodeType","title","state","PUZZLE_CARD_STATE","cardImage","PUZZLE_CARD_IMAGES","puzzleStatus","PUZZLE_CARD_STATE_BASED_COLOR","isLocked","handleOnClick","useCallback","jsxs","PuzzleCardOverView","jsx","HeaderText","ColoredLine","Text","StyledText","BadgeCompleted","FlexView","CueCoins","CueCoinWrapper"],"mappings":";;;;;;;;;AAwBM,MAAAA,IAA8B,CAAC,EAAE,SAAAC,GAAS,WAAAC,GAAW,UAAAC,GAAU,GAAGC,QAA0B;AAC1F,QAAA,EAAE,WAAAC,GAAW,aAAAC,EAAA,IAAgBF,GAE7BG,IAAcC,EAAyBH,CAAS,GAChDI,IAAcC,EAAeL,CAAS,GAEtC,EAAE,WAAWM,GAAU,OAAAC,EAAU,IAAAP,GACjCQ,IAASN,IAAyCO,EAAkBP,CAAW,IAAxDO,EAAkB,QACzCC,IACJC,EAAmBL,CAA2C,KAC9DK,EAAmB,aACfC,IAAeC,EAA8BL,CAAK,GAClDM,IAAWN,MAAUC,EAAkB,QAEvCM,IAAgBC,EAAY,MAAM;AACtC,QAAIF,EAAiB,QAAA;AAEjB,QAAA,OAAOb,KAAgB;AACnB,YAAA,IAAI,MAAM,+BAA+B;AAGjD,IAAAA,EAAYD,GAAW;AAAA,MACrB,aAAAE;AAAA,MACA,aAAaJ;AAAA,MACb,SAAAF;AAAA,MACA,WAAAC;AAAA,IAAA,CACD;AAAA,EAAA,GACA,CAACD,GAASM,GAAaD,GAAaJ,GAAWC,GAAUE,GAAWc,CAAQ,CAAC;AAG9E,SAAA,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,UAAU;AAAA,MACV,OAAO;AAAA,MACP,UAAUR;AAAA,MACV,eAAe;AAAA,MACf,UAAUF,MAAUC,EAAkB,SAAS,MAAM;AAAA,MACrD,SAASM;AAAA,MACT,UAAUD;AAAA,MAEV,UAAA;AAAA,QAAA,gBAAAK;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT,QAAQR,KAAA,gBAAAA,EAAc;AAAA,YACtB,UAAUA,KAAA,gBAAAA,EAAc;AAAA,YACxB,WAAU;AAAA,YACV,QAAO;AAAA,YAEN,UAAAJ;AAAA,UAAA;AAAA,QACH;AAAA,0BAECa,GAAY,EAAA;AAAA,0BAEZC,GAAK,EAAA,WAAU,SAAQ,QAAO,SAAQ,QAAO,UAAS,UAAA;AAAA,UAAA;AAAA,UAC7CxB;AAAA,QAAA,GACV;AAAA,QAEA,gBAAAqB;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,YAAYf,MAAUC,EAAkB;AAAA,YACxC,QAAO;AAAA,YACP,QAAO;AAAA,YAEN,UAAAF;AAAA,UAAA;AAAA,QACH;AAAA,QAECC,MAAUC,EAAkB,aAC1B,gBAAAQ,EAAAO,GAAA,EAAe,iBAAgB,UAC9B,UAAA;AAAA,UAAC,gBAAAL,EAAAG,GAAA,EAAK,WAAU,QAAO,QAAO,UAAS,UAAU,KAAK,QAAO,UAAS,UAEtE,aAAA,CAAA;AAAA,UACC,gBAAAH,EAAAM,GAAA,EAAS,gBAAe,OAAM,iBAAgB,UAC7C,UAAC,gBAAAN,EAAAO,GAAA,EAAS,OAAOtB,GAAa,MAAK,QAAA,CAAQ,EAC7C,CAAA;AAAA,QAAA,GACF;AAAA,QAGDI,MAAUC,EAAkB,aAAaD,MAAUC,EAAkB,WACpE,gBAAAU,EAACQ,KAAe,gBAAe,OAAM,iBAAgB,UAAS,QAAO,QACnE,UAAC,gBAAAR,EAAAO,GAAA,EAAS,OAAOtB,GAAa,MAAK,SAAS,CAAA,EAC9C,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ;AAEJ;"}

package/dist/features/chapters/lpar-milestone-chapter/puzzle-section/puzzle-section.js.map

@@ -1 +1 @@
-{"version":3,"file":"puzzle-section.js","sources":["../../../../../src/features/chapters/lpar-milestone-chapter/puzzle-section/puzzle-section.tsx"],"sourcesContent":["import type { IPuzzleSection } from './puzzle-section-types';\nimport type { FC } from 'react';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport {\n  PuzzleSectionTitle,\n  PuzzleSheetsContainer,\n} from '../../lpar-chapter/puzzle-section/puzzle-section-styled';\nimport PuzzleCard from './puzzle-card';\n\nconst PuzzleSection: FC<IPuzzleSection> = ({ puzzleCards, onCardClick }) => {\n  if (!puzzleCards) return null;\n\n  return (\n    <FlexView>\n      <FlexView $flexGapX={1.25}>\n        {puzzleCards.map(({ blocks, section_code: sectionCode }) => {\n          return (\n            <FlexView key={`puzzle-${sectionCode}`} $flexGapX={1.5}>\n              {blocks.map(block => {\n                const { id: blockId, name: blockName, program_id: programId, sheets } = block;\n\n                return (\n                  <FlexView key={blockId}>\n                    <PuzzleSectionTitle $renderAs=\"eyebrow2\">{blockName}</PuzzleSectionTitle>\n\n                    <PuzzleSheetsContainer>\n                      {sheets.map((sheet, idx) => {\n                        return (\n                          <PuzzleCard\n                            blockId={blockId}\n                            key={sheet.node_id}\n                            onCardClick={onCardClick}\n                            programId={programId}\n                            puzzleNo={idx + 1}\n                            sheetData={sheet}\n                          />\n                        );\n                      })}\n                    </PuzzleSheetsContainer>\n                  </FlexView>\n                );\n              })}\n            </FlexView>\n          );\n        })}\n      </FlexView>\n    </FlexView>\n  );\n};\n\nexport default PuzzleSection;\n"],"names":["PuzzleSection","puzzleCards","onCardClick","jsx","FlexView","blocks","sectionCode","block","blockId","blockName","programId","sheets","PuzzleSectionTitle","PuzzleSheetsContainer","sheet","idx","PuzzleCard"],"mappings":";;;;AAUA,MAAMA,IAAoC,CAAC,EAAE,aAAAC,GAAa,aAAAC,QACnDD,IAGF,gBAAAE,EAAAC,GAAA,EACC,UAAC,gBAAAD,EAAAC,GAAA,EAAS,WAAW,MAClB,UAAYH,EAAA,IAAI,CAAC,EAAE,QAAAI,GAAQ,cAAcC,0BAErCF,GAAuC,EAAA,WAAW,KAChD,UAAAC,EAAO,IAAI,CAASE,MAAA;AACb,QAAA,EAAE,IAAIC,GAAS,MAAMC,GAAW,YAAYC,GAAW,QAAAC,EAAW,IAAAJ;AAExE,2BACGH,GACC,EAAA,UAAA;AAAA,IAAC,gBAAAD,EAAAS,GAAA,EAAmB,WAAU,YAAY,UAAUH,GAAA;AAAA,sBAEnDI,GACE,EAAA,UAAAF,EAAO,IAAI,CAACG,GAAOC,MAEhB,gBAAAZ;AAAA,MAACa;AAAA,MAAA;AAAA,QACC,SAAAR;AAAA,QAEA,aAAAN;AAAA,QACA,WAAAQ;AAAA,QACA,UAAUK,IAAM;AAAA,QAChB,WAAWD;AAAA,MAAA;AAAA,MAJNA,EAAM;AAAA,IAAA,CAOhB,GACH;AAAA,EAAA,EAAA,GAhBaN,CAiBf;AAEH,CAAA,EAAA,GAxBY,UAAUF,CAAW,EAyBpC,CAEH,GACH,EACF,CAAA,IApCuB;"}
+{"version":3,"file":"puzzle-section.js","sources":["../../../../../src/features/chapters/lpar-milestone-chapter/puzzle-section/puzzle-section.tsx"],"sourcesContent":["import type { IPuzzleSection } from './puzzle-section-types';\nimport type { FC } from 'react';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport {\n  PuzzleSectionTitle,\n  PuzzleSheetsContainer,\n} from '../../lpar-chapter/puzzle-section/puzzle-section-styled';\nimport PuzzleCard from './puzzle-card';\n\nconst PuzzleSection: FC<IPuzzleSection> = ({ puzzleCards, onCardClick }) => {\n  if (!puzzleCards) return null;\n\n  return (\n    <FlexView>\n      <FlexView $flexGapX={1.25}>\n        {puzzleCards.map(({ blocks, section_code: sectionCode }) => {\n          return (\n            <FlexView key={`puzzle-${sectionCode}`} $flexGapX={1.5}>\n              {blocks.map(block => {\n                const { id: blockId, name: blockName, program_id: programId, sheets } = block;\n\n                return (\n                  <FlexView key={blockId}>\n                    <PuzzleSectionTitle $renderAs=\"eyebrow2\">{blockName}</PuzzleSectionTitle>\n\n                    <PuzzleSheetsContainer>\n                      {sheets.map((sheet, idx) => {\n                        return (\n                          <PuzzleCard\n                            blockId={blockId}\n                            key={sheet.node_id}\n                            onCardClick={onCardClick}\n                            programId={programId}\n                            puzzleNo={idx + 1}\n                            sheetData={sheet}\n                          />\n                        );\n                      })}\n                    </PuzzleSheetsContainer>\n                  </FlexView>\n                );\n              })}\n            </FlexView>\n          );\n        })}\n      </FlexView>\n    </FlexView>\n  );\n};\n\nexport default PuzzleSection;\n"],"names":["PuzzleSection","puzzleCards","onCardClick","jsx","FlexView","blocks","sectionCode","block","blockId","blockName","programId","sheets","PuzzleSectionTitle","PuzzleSheetsContainer","sheet","idx","PuzzleCard"],"mappings":";;;;AAUA,MAAMA,IAAoC,CAAC,EAAE,aAAAC,GAAa,aAAAC,QACnDD,IAGF,gBAAAE,EAAAC,GAAA,EACC,UAAC,gBAAAD,EAAAC,GAAA,EAAS,WAAW,MAClB,UAAYH,EAAA,IAAI,CAAC,EAAE,QAAAI,GAAQ,cAAcC,0BAErCF,GAAuC,EAAA,WAAW,KAChD,UAAAC,EAAO,IAAI,CAASE,MAAA;AACb,QAAA,EAAE,IAAIC,GAAS,MAAMC,GAAW,YAAYC,GAAW,QAAAC,MAAWJ;AAExE,2BACGH,GACC,EAAA,UAAA;AAAA,IAAC,gBAAAD,EAAAS,GAAA,EAAmB,WAAU,YAAY,UAAUH,GAAA;AAAA,sBAEnDI,GACE,EAAA,UAAAF,EAAO,IAAI,CAACG,GAAOC,MAEhB,gBAAAZ;AAAA,MAACa;AAAA,MAAA;AAAA,QACC,SAAAR;AAAA,QAEA,aAAAN;AAAA,QACA,WAAAQ;AAAA,QACA,UAAUK,IAAM;AAAA,QAChB,WAAWD;AAAA,MAAA;AAAA,MAJNA,EAAM;AAAA,IAKb,CAEH,EACH,CAAA;AAAA,EAAA,EAAA,GAhBaN,CAiBf;AAEH,CAAA,KAxBY,UAAUF,CAAW,EAyBpC,CAEH,GACH,EACF,CAAA,IApCuB;"}

package/dist/features/circle-games/game-launcher/comps/card-container/card-container-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"card-container-styled.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/card-container/card-container-styled.tsx"],"sourcesContent":["import type { TColorNames } from '../../../../ui/types';\n\nimport styled from 'styled-components';\n\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { GAME_LAUNCHER_SIZE } from './constants';\n\nexport const CardWrapper = styled.div`\n  position: relative;\n  display: flex;\n  justify-content: center;\n`;\n\nexport const ExtendedFlexView = styled(FlexView)`\n  position: absolute;\n  top: -28px;\n  display: flex;\n  justify-content: center;\n`;\n\nexport const CardContainer = styled.div<{ $strokeColor?: TColorNames }>`\n  position: relative;\n  border-radius: ${GAME_LAUNCHER_SIZE}px;\n  border: ${({ $strokeColor }) =>\n    $strokeColor ? `2px solid ${$strokeColor}` : '0 solid transparent'};\n  height: ${GAME_LAUNCHER_SIZE}px;\n  width: ${GAME_LAUNCHER_SIZE}px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  overflow: hidden;\n  align-self: center;\n  backdrop-filter: blur(0px);\n  flex-shrink: 0;\n`;\n\nexport const AnimatedLabel = styled(Text)<{ $isAnimated: boolean }>`\n  transition: color 0.5s ease-in-out;\n\n  ${({ $isAnimated }) =>\n    $isAnimated &&\n    `\n      animation: zoomInOut 1s ease-in-out infinite;\n    `}\n\n  @keyframes zoomInOut {\n    0% {\n      transform: scale(1);\n    }\n    50% {\n      transform: scale(1.05);\n    }\n    100% {\n      transform: scale(1);\n    }\n  }\n`;\n"],"names":["CardWrapper","styled","ExtendedFlexView","FlexView","CardContainer","GAME_LAUNCHER_SIZE","$strokeColor","AnimatedLabel","Text","$isAnimated"],"mappings":";;;;AAQO,MAAMA,IAAcC,EAAO;AAAA;AAAA;AAAA;AAAA,GAMrBC,IAAmBD,EAAOE,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,GAOlCC,IAAgBH,EAAO;AAAA;AAAA,mBAEjBI,CAAkB;AAAA,YACzB,CAAC,EAAE,cAAAC,EAAa,MACxBA,IAAe,aAAaA,CAAY,KAAK,qBAAqB;AAAA,YAC1DD,CAAkB;AAAA,WACnBA,CAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWhBE,IAAgBN,EAAOO,CAAI;AAAA;AAAA;AAAA,IAGpC,CAAC,EAAE,aAAAC,QACHA,KACA;AAAA;AAAA,KAEC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"card-container-styled.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/card-container/card-container-styled.tsx"],"sourcesContent":["import type { TColorNames } from '../../../../ui/types';\n\nimport styled from 'styled-components';\n\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { GAME_LAUNCHER_SIZE } from './constants';\n\nexport const CardWrapper = styled.div`\n  position: relative;\n  display: flex;\n  justify-content: center;\n`;\n\nexport const ExtendedFlexView = styled(FlexView)`\n  position: absolute;\n  top: -28px;\n  display: flex;\n  justify-content: center;\n`;\n\nexport const CardContainer = styled.div<{ $strokeColor?: TColorNames }>`\n  position: relative;\n  border-radius: ${GAME_LAUNCHER_SIZE}px;\n  border: ${({ $strokeColor }) =>\n    $strokeColor ? `2px solid ${$strokeColor}` : '0 solid transparent'};\n  height: ${GAME_LAUNCHER_SIZE}px;\n  width: ${GAME_LAUNCHER_SIZE}px;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  overflow: hidden;\n  align-self: center;\n  backdrop-filter: blur(0px);\n  flex-shrink: 0;\n`;\n\nexport const AnimatedLabel = styled(Text)<{ $isAnimated: boolean }>`\n  transition: color 0.5s ease-in-out;\n\n  ${({ $isAnimated }) =>\n    $isAnimated &&\n    `\n      animation: zoomInOut 1s ease-in-out infinite;\n    `}\n\n  @keyframes zoomInOut {\n    0% {\n      transform: scale(1);\n    }\n    50% {\n      transform: scale(1.05);\n    }\n    100% {\n      transform: scale(1);\n    }\n  }\n`;\n"],"names":["CardWrapper","styled","ExtendedFlexView","FlexView","CardContainer","GAME_LAUNCHER_SIZE","$strokeColor","AnimatedLabel","Text","$isAnimated"],"mappings":";;;;AAQO,MAAMA,IAAcC,EAAO;AAAA;AAAA;AAAA;AAAA,GAMrBC,IAAmBD,EAAOE,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,GAOlCC,IAAgBH,EAAO;AAAA;AAAA,mBAEjBI,CAAkB;AAAA,YACzB,CAAC,EAAE,cAAAC,EAAa,MACxBA,IAAe,aAAaA,CAAY,KAAK,qBAAqB;AAAA,YAC1DD,CAAkB;AAAA,WACnBA,CAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWhBE,IAAgBN,EAAOO,CAAI;AAAA;AAAA;AAAA,IAGpC,CAAC,EAAE,aAAAC,EAAY,MACfA,KACA;AAAA;AAAA,KAEC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/features/circle-games/game-launcher/comps/card-container/card-container.js.map

@@ -1 +1 @@
-{"version":3,"file":"card-container.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/card-container/card-container.tsx"],"sourcesContent":["import type { ICardContainerProps } from './card-container-types';\nimport type { ForwardRefRenderFunction } from 'react';\n\nimport { forwardRef, memo } from 'react';\n\nimport * as Styled from './card-container-styled';\n\nconst Container: ForwardRefRenderFunction<HTMLDivElement, ICardContainerProps> = (props, ref) => {\n  const {\n    children,\n    strokeColor,\n    label,\n    isAnimated,\n    labelRef,\n    showLabel = true,\n    labelColor,\n    ...rest\n  } = props;\n\n  return (\n    <Styled.CardWrapper {...rest}>\n      <Styled.ExtendedFlexView>\n        <Styled.AnimatedLabel\n          ref={labelRef}\n          $renderAs=\"ac4-black\"\n          $align=\"center\"\n          $color={labelColor}\n          $isAnimated={isAnimated}\n        >\n          {showLabel ? label : ''}\n        </Styled.AnimatedLabel>\n      </Styled.ExtendedFlexView>\n      <Styled.CardContainer ref={ref} $strokeColor={strokeColor}>\n        {children}\n      </Styled.CardContainer>\n    </Styled.CardWrapper>\n  );\n};\n\nexport const CardContainer = memo(forwardRef(Container));\n"],"names":["Container","props","ref","children","strokeColor","label","isAnimated","labelRef","showLabel","labelColor","rest","jsxs","Styled.CardWrapper","jsx","Styled.ExtendedFlexView","Styled.AnimatedLabel","Styled.CardContainer","CardContainer","memo","forwardRef"],"mappings":";;;AAOA,MAAMA,IAA2E,CAACC,GAAOC,MAAQ;AACzF,QAAA;AAAA,IACJ,UAAAC;AAAA,IACA,aAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,YAAAC;AAAA,IACA,GAAGC;AAAA,EACD,IAAAT;AAEJ,SACG,gBAAAU,EAAAC,GAAA,EAAoB,GAAGF,GACtB,UAAA;AAAA,IAAC,gBAAAG,EAAAC,GAAA,EACC,UAAA,gBAAAD;AAAA,MAACE;AAAAA,MAAA;AAAA,QACC,KAAKR;AAAA,QACL,WAAU;AAAA,QACV,QAAO;AAAA,QACP,QAAQE;AAAA,QACR,aAAaH;AAAA,QAEZ,cAAYD,IAAQ;AAAA,MAAA;AAAA,IAAA,GAEzB;AAAA,sBACCW,GAAA,EAAqB,KAAAd,GAAU,cAAcE,GAC3C,UAAAD,GACH;AAAA,EACF,EAAA,CAAA;AAEJ,GAEac,IAAgBC,EAAKC,EAAWnB,CAAS,CAAC;"}
+{"version":3,"file":"card-container.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/card-container/card-container.tsx"],"sourcesContent":["import type { ICardContainerProps } from './card-container-types';\nimport type { ForwardRefRenderFunction } from 'react';\n\nimport { forwardRef, memo } from 'react';\n\nimport * as Styled from './card-container-styled';\n\nconst Container: ForwardRefRenderFunction<HTMLDivElement, ICardContainerProps> = (props, ref) => {\n  const {\n    children,\n    strokeColor,\n    label,\n    isAnimated,\n    labelRef,\n    showLabel = true,\n    labelColor,\n    ...rest\n  } = props;\n\n  return (\n    <Styled.CardWrapper {...rest}>\n      <Styled.ExtendedFlexView>\n        <Styled.AnimatedLabel\n          ref={labelRef}\n          $renderAs=\"ac4-black\"\n          $align=\"center\"\n          $color={labelColor}\n          $isAnimated={isAnimated}\n        >\n          {showLabel ? label : ''}\n        </Styled.AnimatedLabel>\n      </Styled.ExtendedFlexView>\n      <Styled.CardContainer ref={ref} $strokeColor={strokeColor}>\n        {children}\n      </Styled.CardContainer>\n    </Styled.CardWrapper>\n  );\n};\n\nexport const CardContainer = memo(forwardRef(Container));\n"],"names":["Container","props","ref","children","strokeColor","label","isAnimated","labelRef","showLabel","labelColor","rest","jsxs","Styled.CardWrapper","jsx","Styled.ExtendedFlexView","Styled.AnimatedLabel","Styled.CardContainer","CardContainer","memo","forwardRef"],"mappings":";;;AAOA,MAAMA,IAA2E,CAACC,GAAOC,MAAQ;AACzF,QAAA;AAAA,IACJ,UAAAC;AAAA,IACA,aAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,YAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDT;AAEJ,SACG,gBAAAU,EAAAC,GAAA,EAAoB,GAAGF,GACtB,UAAA;AAAA,IAAC,gBAAAG,EAAAC,GAAA,EACC,UAAA,gBAAAD;AAAA,MAACE;AAAAA,MAAA;AAAA,QACC,KAAKR;AAAA,QACL,WAAU;AAAA,QACV,QAAO;AAAA,QACP,QAAQE;AAAA,QACR,aAAaH;AAAA,QAEZ,cAAYD,IAAQ;AAAA,MAAA;AAAA,IAAA,GAEzB;AAAA,sBACCW,GAAA,EAAqB,KAAAd,GAAU,cAAcE,GAC3C,UAAAD,EACH,CAAA;AAAA,EAAA,GACF;AAEJ,GAEac,IAAgBC,EAAKC,EAAWnB,CAAS,CAAC;"}

package/dist/features/circle-games/game-launcher/comps/carousel/carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"carousel.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/carousel/carousel.tsx"],"sourcesContent":["import type { ICarouselProps, ICarouselRefs } from './carousel-types';\nimport type { ForwardRefRenderFunction } from 'react';\n\nimport {\n  memo,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  forwardRef,\n  useImperativeHandle,\n  createRef,\n} from 'react';\n\nimport CaratLeftIcon from '../../../../../assets/line-icons/icons/carat-left';\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport Separator from '../../../../ui/separator/separator';\nimport * as Styled from './carousel-styled';\n\nconst CarouselComponent: ForwardRefRenderFunction<ICarouselRefs, ICarouselProps> = (\n  { items, defaultIndex = 0, onNext, onPrev, analyticsPrev, analyticsNext },\n  ref,\n) => {\n  const memoizedAnalyticsPrev = useMemo(() => analyticsPrev, [analyticsPrev]);\n  const memoizedAnalyticsNext = useMemo(() => analyticsNext, [analyticsNext]);\n\n  const nextBtnRef = useRef<HTMLDivElement>(null);\n  const isFirstMount = useRef(true);\n  const [currIndex, setCurrIndex] = useState(defaultIndex);\n\n  // Create a stable array of refs for indicators\n  const indicatorRefs = useMemo(() => items.map(() => createRef<HTMLDivElement>()), [items]);\n\n  const handleCarouselPrev = useCallback(() => {\n    onPrev?.();\n    setCurrIndex(prev => prev - 1);\n  }, [onPrev]);\n\n  const handleCarouselNext = useCallback(() => {\n    onNext?.();\n    setCurrIndex(prev => prev + 1);\n  }, [onNext]);\n\n  const handleCarouselIndicatorClick = useCallback((index: number) => {\n    setCurrIndex(index);\n  }, []);\n\n  useImperativeHandle(ref, () => ({\n    nextBtnRef,\n    indicatorRefs,\n    currentIndex: currIndex,\n    goToIndex: (index: number) => {\n      setCurrIndex(index);\n    },\n  }));\n\n  useEffect(() => {\n    if (isFirstMount.current) {\n      isFirstMount.current = false;\n    }\n  }, []);\n\n  // Change index from parent\n  useEffect(() => {\n    setCurrIndex(defaultIndex);\n  }, [defaultIndex]);\n\n  return (\n    <Styled.Carousel>\n      <Styled.CarouselWrapper\n        $translate={currIndex * 100}\n        $translateDuration={isFirstMount.current ? 0 : 300}\n      >\n        {items.map((item, index) => (\n          <Styled.CarouselItemContainer key={index}>{item}</Styled.CarouselItemContainer>\n        ))}\n      </Styled.CarouselWrapper>\n\n      {items.length > 1 && (\n        <Styled.ExtendedFlexView\n          $flexDirection=\"row\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $position=\"absolute\"\n        >\n          <IconButton\n            renderAs=\"secondary\"\n            Icon={CaratLeftIcon}\n            onClick={handleCarouselPrev}\n            analyticsLabel={memoizedAnalyticsPrev.analyticsLabel}\n            analyticsProps={memoizedAnalyticsPrev.analyticsProps}\n            disabled={currIndex === 0}\n          />\n          <Separator width={48} />\n          {items.map((_, index) => (\n            <Styled.Indicator\n              ref={indicatorRefs[index]}\n              $isActive={index === currIndex}\n              key={index}\n              onClick={() => handleCarouselIndicatorClick(index)}\n            />\n          ))}\n          <Separator width={48} />\n          <div ref={nextBtnRef}>\n            <IconButton\n              renderAs=\"secondary\"\n              Icon={CaratRightIcon}\n              onClick={handleCarouselNext}\n              analyticsLabel={memoizedAnalyticsNext.analyticsLabel}\n              analyticsProps={memoizedAnalyticsNext.analyticsProps}\n              disabled={currIndex === items.length - 1}\n            />\n          </div>\n        </Styled.ExtendedFlexView>\n      )}\n    </Styled.Carousel>\n  );\n};\n\nexport const Carousel = memo(forwardRef(CarouselComponent));\n"],"names":["CarouselComponent","items","defaultIndex","onNext","onPrev","analyticsPrev","analyticsNext","ref","memoizedAnalyticsPrev","useMemo","memoizedAnalyticsNext","nextBtnRef","useRef","isFirstMount","currIndex","setCurrIndex","useState","indicatorRefs","createRef","handleCarouselPrev","useCallback","prev","handleCarouselNext","handleCarouselIndicatorClick","index","useImperativeHandle","useEffect","jsxs","Styled.Carousel","jsx","Styled.CarouselWrapper","item","Styled.CarouselItemContainer","Styled.ExtendedFlexView","IconButton","CaratLeftIcon","Separator","_","Styled.Indicator","CaratRightIcon","Carousel","memo","forwardRef"],"mappings":"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"}
+{"version":3,"file":"carousel.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/carousel/carousel.tsx"],"sourcesContent":["import type { ICarouselProps, ICarouselRefs } from './carousel-types';\nimport type { ForwardRefRenderFunction } from 'react';\n\nimport {\n  memo,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  forwardRef,\n  useImperativeHandle,\n  createRef,\n} from 'react';\n\nimport CaratLeftIcon from '../../../../../assets/line-icons/icons/carat-left';\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport Separator from '../../../../ui/separator/separator';\nimport * as Styled from './carousel-styled';\n\nconst CarouselComponent: ForwardRefRenderFunction<ICarouselRefs, ICarouselProps> = (\n  { items, defaultIndex = 0, onNext, onPrev, analyticsPrev, analyticsNext },\n  ref,\n) => {\n  const memoizedAnalyticsPrev = useMemo(() => analyticsPrev, [analyticsPrev]);\n  const memoizedAnalyticsNext = useMemo(() => analyticsNext, [analyticsNext]);\n\n  const nextBtnRef = useRef<HTMLDivElement>(null);\n  const isFirstMount = useRef(true);\n  const [currIndex, setCurrIndex] = useState(defaultIndex);\n\n  // Create a stable array of refs for indicators\n  const indicatorRefs = useMemo(() => items.map(() => createRef<HTMLDivElement>()), [items]);\n\n  const handleCarouselPrev = useCallback(() => {\n    onPrev?.();\n    setCurrIndex(prev => prev - 1);\n  }, [onPrev]);\n\n  const handleCarouselNext = useCallback(() => {\n    onNext?.();\n    setCurrIndex(prev => prev + 1);\n  }, [onNext]);\n\n  const handleCarouselIndicatorClick = useCallback((index: number) => {\n    setCurrIndex(index);\n  }, []);\n\n  useImperativeHandle(ref, () => ({\n    nextBtnRef,\n    indicatorRefs,\n    currentIndex: currIndex,\n    goToIndex: (index: number) => {\n      setCurrIndex(index);\n    },\n  }));\n\n  useEffect(() => {\n    if (isFirstMount.current) {\n      isFirstMount.current = false;\n    }\n  }, []);\n\n  // Change index from parent\n  useEffect(() => {\n    setCurrIndex(defaultIndex);\n  }, [defaultIndex]);\n\n  return (\n    <Styled.Carousel>\n      <Styled.CarouselWrapper\n        $translate={currIndex * 100}\n        $translateDuration={isFirstMount.current ? 0 : 300}\n      >\n        {items.map((item, index) => (\n          <Styled.CarouselItemContainer key={index}>{item}</Styled.CarouselItemContainer>\n        ))}\n      </Styled.CarouselWrapper>\n\n      {items.length > 1 && (\n        <Styled.ExtendedFlexView\n          $flexDirection=\"row\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $position=\"absolute\"\n        >\n          <IconButton\n            renderAs=\"secondary\"\n            Icon={CaratLeftIcon}\n            onClick={handleCarouselPrev}\n            analyticsLabel={memoizedAnalyticsPrev.analyticsLabel}\n            analyticsProps={memoizedAnalyticsPrev.analyticsProps}\n            disabled={currIndex === 0}\n          />\n          <Separator width={48} />\n          {items.map((_, index) => (\n            <Styled.Indicator\n              ref={indicatorRefs[index]}\n              $isActive={index === currIndex}\n              key={index}\n              onClick={() => handleCarouselIndicatorClick(index)}\n            />\n          ))}\n          <Separator width={48} />\n          <div ref={nextBtnRef}>\n            <IconButton\n              renderAs=\"secondary\"\n              Icon={CaratRightIcon}\n              onClick={handleCarouselNext}\n              analyticsLabel={memoizedAnalyticsNext.analyticsLabel}\n              analyticsProps={memoizedAnalyticsNext.analyticsProps}\n              disabled={currIndex === items.length - 1}\n            />\n          </div>\n        </Styled.ExtendedFlexView>\n      )}\n    </Styled.Carousel>\n  );\n};\n\nexport const Carousel = memo(forwardRef(CarouselComponent));\n"],"names":["CarouselComponent","items","defaultIndex","onNext","onPrev","analyticsPrev","analyticsNext","ref","memoizedAnalyticsPrev","useMemo","memoizedAnalyticsNext","nextBtnRef","useRef","isFirstMount","currIndex","setCurrIndex","useState","indicatorRefs","createRef","handleCarouselPrev","useCallback","prev","handleCarouselNext","handleCarouselIndicatorClick","index","useImperativeHandle","useEffect","jsxs","Styled.Carousel","jsx","Styled.CarouselWrapper","item","Styled.CarouselItemContainer","Styled.ExtendedFlexView","IconButton","CaratLeftIcon","Separator","_","Styled.Indicator","CaratRightIcon","Carousel","memo","forwardRef"],"mappings":"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"}

package/dist/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"segmented-game-card-styled.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card-styled.tsx"],"sourcesContent":["import type { TSegment } from './segmented-game-card-types';\n\nimport styled from 'styled-components';\n\nimport { GAME_LAUNCHER_SIZE } from '../card-container/constants';\nimport {\n  ASSET_CONTAINER_SIZE,\n  delta,\n  ASSET_OFFSET_X,\n  ASSET_OFFSET_Y,\n  GAME_LAUNCHER_ASSET_PADDING,\n} from './constants';\n\nexport const CircularProgressLottieContainer = styled.div`\n  position: absolute;\n  z-index: 5;\n  height: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  width: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  pointer-events: none;\n`;\n\n// might be needed later-----\n// export const SegmentDevider = styled.div<{ angle: number }>`\n//   width: ${GAME_LAUNCHER_SIZE / 2}px;\n//   height: 2px;\n//   position: absolute;\n//   background: #fff;\n//   transform-origin: left;\n//   transform: ${({ angle }) => `rotate(${angle}deg)`};\n// `;\n\nconst Segment = styled.div`\n  height: ${GAME_LAUNCHER_SIZE}px;\n  width: ${GAME_LAUNCHER_SIZE}px;\n  overflow: hidden;\n  display: flex;\n  position: absolute;\n  background: ${({ theme }) => theme.colors.BLACK_1};\n  z-index: 2;\n  border: 2px solid ${({ theme }) => theme.colors.WHITE};\n  backdrop-filter: blur(0px);\n  -webkit-backdrop-filter: blur(0px);\n`;\n\nexport const SegmentLeft = styled(Segment)<{\n  $angle?: number;\n}>`\n  transform-origin: bottom right;\n  transform: rotate(-32deg) skew(-32deg);\n  translate: -${GAME_LAUNCHER_SIZE / 2}px -${GAME_LAUNCHER_SIZE / 2}px;\n  border-right-width: 1px;\n`;\n\nexport const SegmentRight = styled(Segment)<{\n  $angle?: number;\n}>`\n  transform-origin: bottom left;\n  transform: rotate(32deg) skew(32deg);\n  translate: ${GAME_LAUNCHER_SIZE / 2}px -${GAME_LAUNCHER_SIZE / 2}px;\n  border-left-width: 1px;\n`;\n\nexport const SegmentBottom = styled(Segment)<{\n  $angle?: number;\n}>`\n  height: ${GAME_LAUNCHER_SIZE / 2}px;\n  width: ${GAME_LAUNCHER_SIZE}px;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n  border: none;\n`;\n\nexport const SegmentContainer = styled.div`\n  height: inherit;\n  width: inherit;\n  overflow: hidden;\n  flex: 1;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n`;\n\nexport const SegmentContentContainer = styled.div<{ $segmentType?: TSegment }>`\n  flex: 1;\n  background: transparent;\n  height: ${GAME_LAUNCHER_SIZE / 2 + delta}px;\n  width: ${GAME_LAUNCHER_SIZE}px;\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  bottom: ${({ $segmentType = 'bottom' }) => ($segmentType === 'bottom' ? 'unset' : `-${delta}px`)};\n  transform-origin: ${({ $segmentType }) => {\n    switch ($segmentType) {\n      case 'left':\n        return 'bottom right';\n      case 'right':\n        return 'bottom left';\n      default:\n        return 'unset';\n    }\n  }};\n  transform: ${({ $segmentType = 'bottom' }) => {\n    switch ($segmentType) {\n      case 'left':\n        return 'skew(32deg) rotate(32deg)';\n      case 'right':\n        return 'skew(-32deg) rotate(-32deg)';\n      default:\n        return 'none';\n    }\n  }};\n`;\n\nexport const SegmentAssetContainer = styled.div<{\n  $segmentType?: TSegment;\n}>`\n  position: absolute;\n  right: ${({ $segmentType }) => ($segmentType === 'left' ? `-${ASSET_OFFSET_X}px` : 'unset')};\n  left: ${({ $segmentType }) => ($segmentType === 'right' ? `-${ASSET_OFFSET_X}px` : 'unset')};\n  bottom: ${({ $segmentType }) =>\n    $segmentType === 'bottom' ? `-${ASSET_OFFSET_Y}px` : `-${ASSET_OFFSET_Y}px`};\n  height: ${ASSET_CONTAINER_SIZE}px;\n  width: ${ASSET_CONTAINER_SIZE}px;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n  background-color: transparent;\n  z-index: 1;\n  flex-shrink: 0;\n  &:hover {\n    background: ${({ theme }) => theme.colors.WHITE_T_15};\n    cursor: pointer;\n  }\n`;\n\nexport const SegmentOverlay = styled.div<{ $segmentType?: TSegment }>`\n  position: absolute;\n  right: ${({ $segmentType }) => ($segmentType === 'left' ? `-${ASSET_OFFSET_X}px` : 'unset')};\n  left: ${({ $segmentType }) => ($segmentType === 'right' ? `-${ASSET_OFFSET_X}px` : 'unset')};\n  bottom: ${({ $segmentType }) =>\n    $segmentType === 'bottom' ? `-${ASSET_OFFSET_Y}px` : `-${ASSET_OFFSET_Y}px`};\n  height: ${ASSET_CONTAINER_SIZE}px;\n  width: ${ASSET_CONTAINER_SIZE}px;\n  z-index: 5;\n  backdrop-filter: blur(16px);\n  -webkit-backdrop-filter: blur(16px);\n  /* pointer-events: none; */\n  display: flex;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const IconWrapper = styled.div`\n  position: absolute;\n  z-index: 6;\n`;\n"],"names":["CircularProgressLottieContainer","styled","GAME_LAUNCHER_SIZE","GAME_LAUNCHER_ASSET_PADDING","Segment","theme","SegmentLeft","SegmentRight","SegmentBottom","SegmentContainer","SegmentContentContainer","delta","$segmentType","SegmentAssetContainer","ASSET_OFFSET_X","ASSET_OFFSET_Y","ASSET_CONTAINER_SIZE","SegmentOverlay","IconWrapper"],"mappings":";;;AAaO,MAAMA,IAAkCC,EAAO;AAAA;AAAA;AAAA,YAG1CC,IAAqBC,CAA2B;AAAA,WACjDD,IAAqBC,CAA2B;AAAA;AAAA,GAcrDC,IAAUH,EAAO;AAAA,YACXC,CAAkB;AAAA,WACnBA,CAAkB;AAAA;AAAA;AAAA;AAAA,gBAIb,CAAC,EAAE,OAAAG,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA,sBAE7B,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA,GAK1CC,IAAcL,EAAOG,CAAO;AAAA;AAAA;AAAA,gBAKzBF,IAAqB,CAAC,OAAOA,IAAqB,CAAC;AAAA;AAAA,GAItDK,IAAeN,EAAOG,CAAO;AAAA;AAAA;AAAA,eAK3BF,IAAqB,CAAC,OAAOA,IAAqB,CAAC;AAAA;AAAA,GAIrDM,IAAgBP,EAAOG,CAAO;AAAA,YAG/BF,IAAqB,CAAC;AAAA,WACvBA,CAAkB;AAAA;AAAA;AAAA;AAAA;AAAA,GAOhBO,IAAmBR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAU1BS,IAA0BT,EAAO;AAAA;AAAA;AAAA,YAGlCC,IAAqB,IAAIS,CAAK;AAAA,WAC/BT,CAAkB;AAAA;AAAA;AAAA;AAAA;AAAA,YAKjB,CAAC,EAAE,cAAAU,IAAe,SAAS,MAAOA,MAAiB,WAAW,UAAU,IAAID,CAAK,IAAK;AAAA,sBAC5E,CAAC,EAAE,cAAAC,QAAmB;AACxC,UAAQA,GAAc;AAAA,IACpB,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AACI,aAAA;AAAA,IACT;AACS,aAAA;AAAA,EACX;AACF,CAAC;AAAA,eACY,CAAC,EAAE,cAAAA,IAAe,eAAe;AAC5C,UAAQA,GAAc;AAAA,IACpB,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AACI,aAAA;AAAA,IACT;AACS,aAAA;AAAA,EACX;AACF,CAAC;AAAA,GAGUC,IAAwBZ,EAAO;AAAA;AAAA,WAIjC,CAAC,EAAE,cAAAW,EAAa,MAAOA,MAAiB,SAAS,IAAIE,CAAc,OAAO,OAAQ;AAAA,UACnF,CAAC,EAAE,cAAAF,EAAa,MAAOA,MAAiB,UAAU,IAAIE,CAAc,OAAO,OAAQ;AAAA,YACjF,CAAC,EAAE,cAAAF,EAAA,MACXA,MAAiB,WAAW,IAAIG,CAAc,OAAO,IAAIA,CAAc,IAAI;AAAA,YACnEC,CAAoB;AAAA,WACrBA,CAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAQb,CAAC,EAAE,OAAAX,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA;AAAA;AAAA,GAK3CY,IAAiBhB,EAAO;AAAA;AAAA,WAE1B,CAAC,EAAE,cAAAW,EAAa,MAAOA,MAAiB,SAAS,IAAIE,CAAc,OAAO,OAAQ;AAAA,UACnF,CAAC,EAAE,cAAAF,EAAa,MAAOA,MAAiB,UAAU,IAAIE,CAAc,OAAO,OAAQ;AAAA,YACjF,CAAC,EAAE,cAAAF,EAAA,MACXA,MAAiB,WAAW,IAAIG,CAAc,OAAO,IAAIA,CAAc,IAAI;AAAA,YACnEC,CAAoB;AAAA,WACrBA,CAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUlBE,IAAcjB,EAAO;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"segmented-game-card-styled.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card-styled.tsx"],"sourcesContent":["import type { TSegment } from './segmented-game-card-types';\n\nimport styled from 'styled-components';\n\nimport { GAME_LAUNCHER_SIZE } from '../card-container/constants';\nimport {\n  ASSET_CONTAINER_SIZE,\n  delta,\n  ASSET_OFFSET_X,\n  ASSET_OFFSET_Y,\n  GAME_LAUNCHER_ASSET_PADDING,\n} from './constants';\n\nexport const CircularProgressLottieContainer = styled.div`\n  position: absolute;\n  z-index: 5;\n  height: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  width: ${GAME_LAUNCHER_SIZE + GAME_LAUNCHER_ASSET_PADDING}px;\n  pointer-events: none;\n`;\n\n// might be needed later-----\n// export const SegmentDevider = styled.div<{ angle: number }>`\n//   width: ${GAME_LAUNCHER_SIZE / 2}px;\n//   height: 2px;\n//   position: absolute;\n//   background: #fff;\n//   transform-origin: left;\n//   transform: ${({ angle }) => `rotate(${angle}deg)`};\n// `;\n\nconst Segment = styled.div`\n  height: ${GAME_LAUNCHER_SIZE}px;\n  width: ${GAME_LAUNCHER_SIZE}px;\n  overflow: hidden;\n  display: flex;\n  position: absolute;\n  background: ${({ theme }) => theme.colors.BLACK_1};\n  z-index: 2;\n  border: 2px solid ${({ theme }) => theme.colors.WHITE};\n  backdrop-filter: blur(0px);\n  -webkit-backdrop-filter: blur(0px);\n`;\n\nexport const SegmentLeft = styled(Segment)<{\n  $angle?: number;\n}>`\n  transform-origin: bottom right;\n  transform: rotate(-32deg) skew(-32deg);\n  translate: -${GAME_LAUNCHER_SIZE / 2}px -${GAME_LAUNCHER_SIZE / 2}px;\n  border-right-width: 1px;\n`;\n\nexport const SegmentRight = styled(Segment)<{\n  $angle?: number;\n}>`\n  transform-origin: bottom left;\n  transform: rotate(32deg) skew(32deg);\n  translate: ${GAME_LAUNCHER_SIZE / 2}px -${GAME_LAUNCHER_SIZE / 2}px;\n  border-left-width: 1px;\n`;\n\nexport const SegmentBottom = styled(Segment)<{\n  $angle?: number;\n}>`\n  height: ${GAME_LAUNCHER_SIZE / 2}px;\n  width: ${GAME_LAUNCHER_SIZE}px;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n  border: none;\n`;\n\nexport const SegmentContainer = styled.div`\n  height: inherit;\n  width: inherit;\n  overflow: hidden;\n  flex: 1;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n`;\n\nexport const SegmentContentContainer = styled.div<{ $segmentType?: TSegment }>`\n  flex: 1;\n  background: transparent;\n  height: ${GAME_LAUNCHER_SIZE / 2 + delta}px;\n  width: ${GAME_LAUNCHER_SIZE}px;\n  position: absolute;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  bottom: ${({ $segmentType = 'bottom' }) => ($segmentType === 'bottom' ? 'unset' : `-${delta}px`)};\n  transform-origin: ${({ $segmentType }) => {\n    switch ($segmentType) {\n      case 'left':\n        return 'bottom right';\n      case 'right':\n        return 'bottom left';\n      default:\n        return 'unset';\n    }\n  }};\n  transform: ${({ $segmentType = 'bottom' }) => {\n    switch ($segmentType) {\n      case 'left':\n        return 'skew(32deg) rotate(32deg)';\n      case 'right':\n        return 'skew(-32deg) rotate(-32deg)';\n      default:\n        return 'none';\n    }\n  }};\n`;\n\nexport const SegmentAssetContainer = styled.div<{\n  $segmentType?: TSegment;\n}>`\n  position: absolute;\n  right: ${({ $segmentType }) => ($segmentType === 'left' ? `-${ASSET_OFFSET_X}px` : 'unset')};\n  left: ${({ $segmentType }) => ($segmentType === 'right' ? `-${ASSET_OFFSET_X}px` : 'unset')};\n  bottom: ${({ $segmentType }) =>\n    $segmentType === 'bottom' ? `-${ASSET_OFFSET_Y}px` : `-${ASSET_OFFSET_Y}px`};\n  height: ${ASSET_CONTAINER_SIZE}px;\n  width: ${ASSET_CONTAINER_SIZE}px;\n  display: flex;\n  align-items: center;\n  overflow: hidden;\n  background-color: transparent;\n  z-index: 1;\n  flex-shrink: 0;\n  &:hover {\n    background: ${({ theme }) => theme.colors.WHITE_T_15};\n    cursor: pointer;\n  }\n`;\n\nexport const SegmentOverlay = styled.div<{ $segmentType?: TSegment }>`\n  position: absolute;\n  right: ${({ $segmentType }) => ($segmentType === 'left' ? `-${ASSET_OFFSET_X}px` : 'unset')};\n  left: ${({ $segmentType }) => ($segmentType === 'right' ? `-${ASSET_OFFSET_X}px` : 'unset')};\n  bottom: ${({ $segmentType }) =>\n    $segmentType === 'bottom' ? `-${ASSET_OFFSET_Y}px` : `-${ASSET_OFFSET_Y}px`};\n  height: ${ASSET_CONTAINER_SIZE}px;\n  width: ${ASSET_CONTAINER_SIZE}px;\n  z-index: 5;\n  backdrop-filter: blur(16px);\n  -webkit-backdrop-filter: blur(16px);\n  /* pointer-events: none; */\n  display: flex;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const IconWrapper = styled.div`\n  position: absolute;\n  z-index: 6;\n`;\n"],"names":["CircularProgressLottieContainer","styled","GAME_LAUNCHER_SIZE","GAME_LAUNCHER_ASSET_PADDING","Segment","theme","SegmentLeft","SegmentRight","SegmentBottom","SegmentContainer","SegmentContentContainer","delta","$segmentType","SegmentAssetContainer","ASSET_OFFSET_X","ASSET_OFFSET_Y","ASSET_CONTAINER_SIZE","SegmentOverlay","IconWrapper"],"mappings":";;;AAaO,MAAMA,IAAkCC,EAAO;AAAA;AAAA;AAAA,YAG1CC,IAAqBC,CAA2B;AAAA,WACjDD,IAAqBC,CAA2B;AAAA;AAAA,GAcrDC,IAAUH,EAAO;AAAA,YACXC,CAAkB;AAAA,WACnBA,CAAkB;AAAA;AAAA;AAAA;AAAA,gBAIb,CAAC,EAAE,OAAAG,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA,sBAE7B,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA,GAK1CC,IAAcL,EAAOG,CAAO;AAAA;AAAA;AAAA,gBAKzBF,IAAqB,CAAC,OAAOA,IAAqB,CAAC;AAAA;AAAA,GAItDK,IAAeN,EAAOG,CAAO;AAAA;AAAA;AAAA,eAK3BF,IAAqB,CAAC,OAAOA,IAAqB,CAAC;AAAA;AAAA,GAIrDM,IAAgBP,EAAOG,CAAO;AAAA,YAG/BF,IAAqB,CAAC;AAAA,WACvBA,CAAkB;AAAA;AAAA;AAAA;AAAA;AAAA,GAOhBO,IAAmBR,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAU1BS,IAA0BT,EAAO;AAAA;AAAA;AAAA,YAGlCC,IAAqB,IAAIS,CAAK;AAAA,WAC/BT,CAAkB;AAAA;AAAA;AAAA;AAAA;AAAA,YAKjB,CAAC,EAAE,cAAAU,IAAe,SAAS,MAAOA,MAAiB,WAAW,UAAU,IAAID,CAAK,IAAK;AAAA,sBAC5E,CAAC,EAAE,cAAAC,QAAmB;AACxC,UAAQA,GAAc;AAAA,IACpB,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AACI,aAAA;AAAA,IACT;AACS,aAAA;AAAA,EAAA;AAEb,CAAC;AAAA,eACY,CAAC,EAAE,cAAAA,IAAe,eAAe;AAC5C,UAAQA,GAAc;AAAA,IACpB,KAAK;AACI,aAAA;AAAA,IACT,KAAK;AACI,aAAA;AAAA,IACT;AACS,aAAA;AAAA,EAAA;AAEb,CAAC;AAAA,GAGUC,IAAwBZ,EAAO;AAAA;AAAA,WAIjC,CAAC,EAAE,cAAAW,EAAa,MAAOA,MAAiB,SAAS,IAAIE,CAAc,OAAO,OAAQ;AAAA,UACnF,CAAC,EAAE,cAAAF,EAAa,MAAOA,MAAiB,UAAU,IAAIE,CAAc,OAAO,OAAQ;AAAA,YACjF,CAAC,EAAE,cAAAF,EAAA,MACXA,MAAiB,WAAW,IAAIG,CAAc,OAAO,IAAIA,CAAc,IAAI;AAAA,YACnEC,CAAoB;AAAA,WACrBA,CAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAQb,CAAC,EAAE,OAAAX,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA;AAAA;AAAA,GAK3CY,IAAiBhB,EAAO;AAAA;AAAA,WAE1B,CAAC,EAAE,cAAAW,EAAa,MAAOA,MAAiB,SAAS,IAAIE,CAAc,OAAO,OAAQ;AAAA,UACnF,CAAC,EAAE,cAAAF,EAAa,MAAOA,MAAiB,UAAU,IAAIE,CAAc,OAAO,OAAQ;AAAA,YACjF,CAAC,EAAE,cAAAF,EAAA,MACXA,MAAiB,WAAW,IAAIG,CAAc,OAAO,IAAIA,CAAc,IAAI;AAAA,YACnEC,CAAoB;AAAA,WACrBA,CAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUlBE,IAAcjB,EAAO;AAAA;AAAA;AAAA;"}

package/dist/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card.js

@@ -1,16 +1,16 @@
-import { jsx as n, jsxs as L } from "react/jsx-runtime";
-import { memo as P, useCallback as m, forwardRef as O, useRef as E, useState as f, useImperativeHandle as F, useMemo as A } from "react";
+import { jsxs as L, jsx as n } from "react/jsx-runtime";
+import { memo as P, forwardRef as O, useRef as E, useState as f, useCallback as m, useImperativeHandle as F, useMemo as A } from "react";
 import G from "../../../../../assets/line-icons/icons/check.js";
 import { LOTTIE as $ } from "../../../../../assets/lottie/lottie.js";
 import R from "../../../../ui/lottie-animation/lottie-animation.js";
 import { CardContainer as j } from "../card-container/card-container.js";
-import { SegmentContainer as w, SegmentContentContainer as U, SegmentAssetContainer as x, SegmentOverlay as B, IconWrapper as N, CircularProgressLottieContainer as q, SegmentLeft as z, SegmentRight as D, SegmentBottom as J } from "./segmented-game-card-styled.js";
+import { CircularProgressLottieContainer as w, SegmentLeft as U, SegmentRight as x, SegmentBottom as B, SegmentContainer as N, SegmentContentContainer as q, SegmentAssetContainer as z, SegmentOverlay as D, IconWrapper as J } from "./segmented-game-card-styled.js";
 const K = { renderer: "canvas", loop: !0 }, C = P(
   ({ segmentType: e, isCompleted: o, card: c, name: i, onMouseEnter: s }) => {
     const a = m(() => s(i), [s, i]);
-    return /* @__PURE__ */ n(w, { children: /* @__PURE__ */ L(U, { $segmentType: e, onMouseEnter: a, children: [
-      /* @__PURE__ */ n(x, { $segmentType: e, children: /* @__PURE__ */ n(R, { src: c, settings: K, animateOnIntersect: !0 }) }),
-      o && /* @__PURE__ */ n(B, { $segmentType: e, children: /* @__PURE__ */ n(N, { children: /* @__PURE__ */ n(G, { color: "#fff", height: 40, width: 40 }) }) })
+    return /* @__PURE__ */ n(N, { children: /* @__PURE__ */ L(q, { $segmentType: e, onMouseEnter: a, children: [
+      /* @__PURE__ */ n(z, { $segmentType: e, children: /* @__PURE__ */ n(R, { src: c, settings: K, animateOnIntersect: !0 }) }),
+      o && /* @__PURE__ */ n(D, { $segmentType: e, children: /* @__PURE__ */ n(J, { children: /* @__PURE__ */ n(G, { color: "#fff", height: 40, width: 40 }) }) })
     ] }) });
   }
 ), Q = ({ data: e, label: o, initialValue: c = 0, value: i, maxValue: s = 1 }, a) => {
@@ -56,7 +56,7 @@ const K = { renderer: "canvas", loop: !0 }, C = P(
       onMouseLeave: k,
       labelColor: T ? b : W ? "WHITE_T_87" : "WHITE_T_60",
       children: [
-        /* @__PURE__ */ n(q, { children: /* @__PURE__ */ n(
+        /* @__PURE__ */ n(w, { children: /* @__PURE__ */ n(
           R,
           {
             src: $.LEVELUP_RINGS,
@@ -64,7 +64,7 @@ const K = { renderer: "canvas", loop: !0 }, C = P(
             animateOnIntersect: !0
           }
         ) }),
-        /* @__PURE__ */ n(z, { onClick: () => p(0), children: /* @__PURE__ */ n(
+        /* @__PURE__ */ n(U, { onClick: () => p(0), children: /* @__PURE__ */ n(
           C,
           {
             segmentType: "left",
@@ -74,7 +74,7 @@ const K = { renderer: "canvas", loop: !0 }, C = P(
             onMouseEnter: d
           }
         ) }),
-        /* @__PURE__ */ n(D, { onClick: () => p(1), children: /* @__PURE__ */ n(
+        /* @__PURE__ */ n(x, { onClick: () => p(1), children: /* @__PURE__ */ n(
           C,
           {
             segmentType: "right",
@@ -84,7 +84,7 @@ const K = { renderer: "canvas", loop: !0 }, C = P(
             onMouseEnter: d
           }
         ) }),
-        /* @__PURE__ */ n(J, { onClick: () => p(2), children: /* @__PURE__ */ n(
+        /* @__PURE__ */ n(B, { onClick: () => p(2), children: /* @__PURE__ */ n(
           C,
           {
             segmentType: "bottom",

package/dist/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"segmented-game-card.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card.tsx"],"sourcesContent":["import type { TColorNames } from '../../../../ui/types';\nimport type {\n  IGameCardSegmentContentProps,\n  ISegmentedGameCardProps,\n  ISegmentedGameCardRefs,\n} from './segmented-game-card-types';\nimport type { ForwardRefRenderFunction } from 'react';\n\nimport {\n  forwardRef,\n  memo,\n  useCallback,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\n\nimport CheckIcon from '../../../../../assets/line-icons/icons/check';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport { CardContainer } from '../card-container/card-container';\nimport * as Styled from './segmented-game-card-styled';\n\nconst renderSettings = { renderer: 'canvas', loop: true };\n\nexport const SegmentContent = memo(\n  ({ segmentType, isCompleted, card, name, onMouseEnter }: IGameCardSegmentContentProps) => {\n    const handleMouseEnter = useCallback(() => onMouseEnter(name), [onMouseEnter, name]);\n\n    return (\n      <Styled.SegmentContainer>\n        <Styled.SegmentContentContainer $segmentType={segmentType} onMouseEnter={handleMouseEnter}>\n          <Styled.SegmentAssetContainer $segmentType={segmentType}>\n            <LottieAnimation src={card} settings={renderSettings} animateOnIntersect />\n          </Styled.SegmentAssetContainer>\n\n          {isCompleted && (\n            <Styled.SegmentOverlay $segmentType={segmentType}>\n              <Styled.IconWrapper>\n                <CheckIcon color=\"#fff\" height={40} width={40} />\n              </Styled.IconWrapper>\n            </Styled.SegmentOverlay>\n          )}\n        </Styled.SegmentContentContainer>\n      </Styled.SegmentContainer>\n    );\n  },\n);\n\nconst SegmentedGameCardComponent: ForwardRefRenderFunction<\n  ISegmentedGameCardRefs,\n  ISegmentedGameCardProps\n> = ({ data, label: gameCategoryLabel, initialValue = 0, value, maxValue = 1 }, ref) => {\n  const labelRef = useRef<HTMLDivElement>(null);\n  const cardWrapperRef = useRef<HTMLDivElement>(null);\n\n  const [label, setLabel] = useState<string>(gameCategoryLabel);\n  const [isAnimated, setIsAnimated] = useState(false);\n  const [animatedColor, setAnimatedColor] = useState<TColorNames>('WHITE_T_87');\n\n  const isLabelHighlighted = label !== gameCategoryLabel;\n\n  const onMouseEnter = useCallback((gameName: string) => {\n    setLabel(gameName);\n  }, []);\n\n  const onMouseLeave = useCallback(() => {\n    setLabel(gameCategoryLabel);\n  }, [gameCategoryLabel]);\n\n  const onSegmentPress = useCallback(\n    (index: number) => {\n      data[index]?.onPress?.();\n    },\n    [data],\n  );\n\n  const startLabelAnimation = useCallback((color: TColorNames) => {\n    setIsAnimated(true);\n    setAnimatedColor(color);\n  }, []);\n\n  useImperativeHandle(ref, () => ({\n    labelRef,\n    segmentedCardWrapperRef: cardWrapperRef,\n    startLabelAnimation,\n  }));\n\n  const animationSegments: [number, number] | undefined = useMemo(() => {\n    if (maxValue <= 0) {\n      return;\n    }\n\n    const totalFrames = 92;\n    const framesPerValue = totalFrames / maxValue;\n\n    const initialFrameToPlay = Math.min(framesPerValue * initialValue, totalFrames);\n    const finalFrameToPlay = Math.min(framesPerValue * value + 1, totalFrames);\n\n    return [initialFrameToPlay, finalFrameToPlay];\n  }, [initialValue, maxValue, value]);\n\n  const levelUpAnimationSettings = useMemo(\n    () => ({\n      renderer: 'canvas',\n      autoplay: true,\n      loop: false,\n      initialSegment: animationSegments,\n    }),\n    [animationSegments],\n  );\n\n  return (\n    <CardContainer\n      ref={cardWrapperRef}\n      labelRef={labelRef}\n      label={label}\n      isAnimated={isAnimated}\n      onMouseLeave={onMouseLeave}\n      labelColor={isAnimated ? animatedColor : isLabelHighlighted ? 'WHITE_T_87' : 'WHITE_T_60'}\n    >\n      <Styled.CircularProgressLottieContainer>\n        <LottieAnimation\n          src={LOTTIE.LEVELUP_RINGS}\n          settings={levelUpAnimationSettings}\n          animateOnIntersect\n        />\n      </Styled.CircularProgressLottieContainer>\n      {/* left segment */}\n      <Styled.SegmentLeft onClick={() => onSegmentPress(0)}>\n        <SegmentContent\n          segmentType={'left'}\n          card={data[0]!.card}\n          name={data[0]!.name}\n          isCompleted={data[0]!.isCompleted}\n          onMouseEnter={onMouseEnter}\n        />\n      </Styled.SegmentLeft>\n\n      {/* right segment */}\n      <Styled.SegmentRight onClick={() => onSegmentPress(1)}>\n        <SegmentContent\n          segmentType={'right'}\n          card={data[1]!.card}\n          name={data[1]!.name}\n          isCompleted={data[1]!.isCompleted}\n          onMouseEnter={onMouseEnter}\n        />\n      </Styled.SegmentRight>\n\n      {/* bottom segment */}\n      <Styled.SegmentBottom onClick={() => onSegmentPress(2)}>\n        <SegmentContent\n          segmentType={'bottom'}\n          card={data[2]!.card}\n          name={data[2]!.name}\n          isCompleted={data[2]!.isCompleted}\n          onMouseEnter={onMouseEnter}\n        />\n      </Styled.SegmentBottom>\n    </CardContainer>\n  );\n};\n\nexport const SegmentedGameCard = memo(forwardRef(SegmentedGameCardComponent));\n"],"names":["renderSettings","SegmentContent","memo","segmentType","isCompleted","card","name","onMouseEnter","handleMouseEnter","useCallback","jsx","Styled.SegmentContainer","jsxs","Styled.SegmentContentContainer","Styled.SegmentAssetContainer","LottieAnimation","Styled.SegmentOverlay","Styled.IconWrapper","CheckIcon","SegmentedGameCardComponent","data","gameCategoryLabel","initialValue","value","maxValue","ref","labelRef","useRef","cardWrapperRef","label","setLabel","useState","isAnimated","setIsAnimated","animatedColor","setAnimatedColor","isLabelHighlighted","gameName","onMouseLeave","onSegmentPress","index","_b","_a","startLabelAnimation","color","useImperativeHandle","animationSegments","useMemo","totalFrames","framesPerValue","initialFrameToPlay","finalFrameToPlay","levelUpAnimationSettings","CardContainer","Styled.CircularProgressLottieContainer","LOTTIE","Styled.SegmentLeft","Styled.SegmentRight","Styled.SegmentBottom","SegmentedGameCard","forwardRef"],"mappings":";;;;;;;AAwBA,MAAMA,IAAiB,EAAE,UAAU,UAAU,MAAM,GAAK,GAE3CC,IAAiBC;AAAA,EAC5B,CAAC,EAAE,aAAAC,GAAa,aAAAC,GAAa,MAAAC,GAAM,MAAAC,GAAM,cAAAC,QAAiD;AAClF,UAAAC,IAAmBC,EAAY,MAAMF,EAAaD,CAAI,GAAG,CAACC,GAAcD,CAAI,CAAC;AAGjF,WAAA,gBAAAI,EAACC,GAAA,EACC,UAAA,gBAAAC,EAACC,GAAA,EAA+B,cAAcV,GAAa,cAAcK,GACvE,UAAA;AAAA,MAAA,gBAAAE,EAACI,GAAA,EAA6B,cAAcX,GAC1C,UAAA,gBAAAO,EAACK,GAAgB,EAAA,KAAKV,GAAM,UAAUL,GAAgB,oBAAkB,GAAC,CAAA,GAC3E;AAAA,MAECI,uBACEY,GAAA,EAAsB,cAAcb,GACnC,4BAACc,GAAA,EACC,UAAC,gBAAAP,EAAAQ,GAAA,EAAU,OAAM,QAAO,QAAQ,IAAI,OAAO,GAAA,CAAI,EACjD,CAAA,GACF;AAAA,IAAA,EAEJ,CAAA,EACF,CAAA;AAAA,EAEJ;AACF,GAEMC,IAGF,CAAC,EAAE,MAAAC,GAAM,OAAOC,GAAmB,cAAAC,IAAe,GAAG,OAAAC,GAAO,UAAAC,IAAW,EAAE,GAAGC,MAAQ;AAChF,QAAAC,IAAWC,EAAuB,IAAI,GACtCC,IAAiBD,EAAuB,IAAI,GAE5C,CAACE,GAAOC,CAAQ,IAAIC,EAAiBV,CAAiB,GACtD,CAACW,GAAYC,CAAa,IAAIF,EAAS,EAAK,GAC5C,CAACG,GAAeC,CAAgB,IAAIJ,EAAsB,YAAY,GAEtEK,IAAqBP,MAAUR,GAE/Bd,IAAeE,EAAY,CAAC4B,MAAqB;AACrD,IAAAP,EAASO,CAAQ;AAAA,EACnB,GAAG,CAAE,CAAA,GAECC,IAAe7B,EAAY,MAAM;AACrC,IAAAqB,EAAST,CAAiB;AAAA,EAAA,GACzB,CAACA,CAAiB,CAAC,GAEhBkB,IAAiB9B;AAAA,IACrB,CAAC+B,MAAkB;;AACZ,OAAAC,KAAAC,IAAAtB,EAAAoB,CAAK,MAAL,gBAAAE,EAAQ,YAAR,QAAAD,EAAA,KAAAC;AAAA,IACP;AAAA,IACA,CAACtB,CAAI;AAAA,EAAA,GAGDuB,IAAsBlC,EAAY,CAACmC,MAAuB;AAC9D,IAAAX,EAAc,EAAI,GAClBE,EAAiBS,CAAK;AAAA,EACxB,GAAG,CAAE,CAAA;AAEL,EAAAC,EAAoBpB,GAAK,OAAO;AAAA,IAC9B,UAAAC;AAAA,IACA,yBAAyBE;AAAA,IACzB,qBAAAe;AAAA,EACA,EAAA;AAEI,QAAAG,IAAkDC,EAAQ,MAAM;AACpE,QAAIvB,KAAY;AACd;AAGF,UAAMwB,IAAc,IACdC,IAAiBD,IAAcxB,GAE/B0B,IAAqB,KAAK,IAAID,IAAiB3B,GAAc0B,CAAW,GACxEG,IAAmB,KAAK,IAAIF,IAAiB1B,IAAQ,GAAGyB,CAAW;AAElE,WAAA,CAACE,GAAoBC,CAAgB;AAAA,EAC3C,GAAA,CAAC7B,GAAcE,GAAUD,CAAK,CAAC,GAE5B6B,IAA2BL;AAAA,IAC/B,OAAO;AAAA,MACL,UAAU;AAAA,MACV,UAAU;AAAA,MACV,MAAM;AAAA,MACN,gBAAgBD;AAAA,IAAA;AAAA,IAElB,CAACA,CAAiB;AAAA,EAAA;AAIlB,SAAA,gBAAAlC;AAAA,IAACyC;AAAA,IAAA;AAAA,MACC,KAAKzB;AAAA,MACL,UAAAF;AAAA,MACA,OAAAG;AAAA,MACA,YAAAG;AAAA,MACA,cAAAM;AAAA,MACA,YAAYN,IAAaE,IAAgBE,IAAqB,eAAe;AAAA,MAE7E,UAAA;AAAA,QAAC,gBAAA1B,EAAA4C,GAAA,EACC,UAAA,gBAAA5C;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,KAAKwC,EAAO;AAAA,YACZ,UAAUH;AAAA,YACV,oBAAkB;AAAA,UAAA;AAAA,QAAA,GAEtB;AAAA,QAEA,gBAAA1C,EAAC8C,GAAA,EAAmB,SAAS,MAAMjB,EAAe,CAAC,GACjD,UAAA,gBAAA7B;AAAA,UAACT;AAAA,UAAA;AAAA,YACC,aAAa;AAAA,YACb,MAAMmB,EAAK,CAAC,EAAG;AAAA,YACf,MAAMA,EAAK,CAAC,EAAG;AAAA,YACf,aAAaA,EAAK,CAAC,EAAG;AAAA,YACtB,cAAAb;AAAA,UAAA;AAAA,QAAA,GAEJ;AAAA,QAGA,gBAAAG,EAAC+C,GAAA,EAAoB,SAAS,MAAMlB,EAAe,CAAC,GAClD,UAAA,gBAAA7B;AAAA,UAACT;AAAA,UAAA;AAAA,YACC,aAAa;AAAA,YACb,MAAMmB,EAAK,CAAC,EAAG;AAAA,YACf,MAAMA,EAAK,CAAC,EAAG;AAAA,YACf,aAAaA,EAAK,CAAC,EAAG;AAAA,YACtB,cAAAb;AAAA,UAAA;AAAA,QAAA,GAEJ;AAAA,QAGA,gBAAAG,EAACgD,GAAA,EAAqB,SAAS,MAAMnB,EAAe,CAAC,GACnD,UAAA,gBAAA7B;AAAA,UAACT;AAAA,UAAA;AAAA,YACC,aAAa;AAAA,YACb,MAAMmB,EAAK,CAAC,EAAG;AAAA,YACf,MAAMA,EAAK,CAAC,EAAG;AAAA,YACf,aAAaA,EAAK,CAAC,EAAG;AAAA,YACtB,cAAAb;AAAA,UAAA;AAAA,QAAA,GAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEaoD,KAAoBzD,EAAK0D,EAAWzC,CAA0B,CAAC;"}
+{"version":3,"file":"segmented-game-card.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/segmented-game-card/segmented-game-card.tsx"],"sourcesContent":["import type { TColorNames } from '../../../../ui/types';\nimport type {\n  IGameCardSegmentContentProps,\n  ISegmentedGameCardProps,\n  ISegmentedGameCardRefs,\n} from './segmented-game-card-types';\nimport type { ForwardRefRenderFunction } from 'react';\n\nimport {\n  forwardRef,\n  memo,\n  useCallback,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\n\nimport CheckIcon from '../../../../../assets/line-icons/icons/check';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport { CardContainer } from '../card-container/card-container';\nimport * as Styled from './segmented-game-card-styled';\n\nconst renderSettings = { renderer: 'canvas', loop: true };\n\nexport const SegmentContent = memo(\n  ({ segmentType, isCompleted, card, name, onMouseEnter }: IGameCardSegmentContentProps) => {\n    const handleMouseEnter = useCallback(() => onMouseEnter(name), [onMouseEnter, name]);\n\n    return (\n      <Styled.SegmentContainer>\n        <Styled.SegmentContentContainer $segmentType={segmentType} onMouseEnter={handleMouseEnter}>\n          <Styled.SegmentAssetContainer $segmentType={segmentType}>\n            <LottieAnimation src={card} settings={renderSettings} animateOnIntersect />\n          </Styled.SegmentAssetContainer>\n\n          {isCompleted && (\n            <Styled.SegmentOverlay $segmentType={segmentType}>\n              <Styled.IconWrapper>\n                <CheckIcon color=\"#fff\" height={40} width={40} />\n              </Styled.IconWrapper>\n            </Styled.SegmentOverlay>\n          )}\n        </Styled.SegmentContentContainer>\n      </Styled.SegmentContainer>\n    );\n  },\n);\n\nconst SegmentedGameCardComponent: ForwardRefRenderFunction<\n  ISegmentedGameCardRefs,\n  ISegmentedGameCardProps\n> = ({ data, label: gameCategoryLabel, initialValue = 0, value, maxValue = 1 }, ref) => {\n  const labelRef = useRef<HTMLDivElement>(null);\n  const cardWrapperRef = useRef<HTMLDivElement>(null);\n\n  const [label, setLabel] = useState<string>(gameCategoryLabel);\n  const [isAnimated, setIsAnimated] = useState(false);\n  const [animatedColor, setAnimatedColor] = useState<TColorNames>('WHITE_T_87');\n\n  const isLabelHighlighted = label !== gameCategoryLabel;\n\n  const onMouseEnter = useCallback((gameName: string) => {\n    setLabel(gameName);\n  }, []);\n\n  const onMouseLeave = useCallback(() => {\n    setLabel(gameCategoryLabel);\n  }, [gameCategoryLabel]);\n\n  const onSegmentPress = useCallback(\n    (index: number) => {\n      data[index]?.onPress?.();\n    },\n    [data],\n  );\n\n  const startLabelAnimation = useCallback((color: TColorNames) => {\n    setIsAnimated(true);\n    setAnimatedColor(color);\n  }, []);\n\n  useImperativeHandle(ref, () => ({\n    labelRef,\n    segmentedCardWrapperRef: cardWrapperRef,\n    startLabelAnimation,\n  }));\n\n  const animationSegments: [number, number] | undefined = useMemo(() => {\n    if (maxValue <= 0) {\n      return;\n    }\n\n    const totalFrames = 92;\n    const framesPerValue = totalFrames / maxValue;\n\n    const initialFrameToPlay = Math.min(framesPerValue * initialValue, totalFrames);\n    const finalFrameToPlay = Math.min(framesPerValue * value + 1, totalFrames);\n\n    return [initialFrameToPlay, finalFrameToPlay];\n  }, [initialValue, maxValue, value]);\n\n  const levelUpAnimationSettings = useMemo(\n    () => ({\n      renderer: 'canvas',\n      autoplay: true,\n      loop: false,\n      initialSegment: animationSegments,\n    }),\n    [animationSegments],\n  );\n\n  return (\n    <CardContainer\n      ref={cardWrapperRef}\n      labelRef={labelRef}\n      label={label}\n      isAnimated={isAnimated}\n      onMouseLeave={onMouseLeave}\n      labelColor={isAnimated ? animatedColor : isLabelHighlighted ? 'WHITE_T_87' : 'WHITE_T_60'}\n    >\n      <Styled.CircularProgressLottieContainer>\n        <LottieAnimation\n          src={LOTTIE.LEVELUP_RINGS}\n          settings={levelUpAnimationSettings}\n          animateOnIntersect\n        />\n      </Styled.CircularProgressLottieContainer>\n      {/* left segment */}\n      <Styled.SegmentLeft onClick={() => onSegmentPress(0)}>\n        <SegmentContent\n          segmentType={'left'}\n          card={data[0]!.card}\n          name={data[0]!.name}\n          isCompleted={data[0]!.isCompleted}\n          onMouseEnter={onMouseEnter}\n        />\n      </Styled.SegmentLeft>\n\n      {/* right segment */}\n      <Styled.SegmentRight onClick={() => onSegmentPress(1)}>\n        <SegmentContent\n          segmentType={'right'}\n          card={data[1]!.card}\n          name={data[1]!.name}\n          isCompleted={data[1]!.isCompleted}\n          onMouseEnter={onMouseEnter}\n        />\n      </Styled.SegmentRight>\n\n      {/* bottom segment */}\n      <Styled.SegmentBottom onClick={() => onSegmentPress(2)}>\n        <SegmentContent\n          segmentType={'bottom'}\n          card={data[2]!.card}\n          name={data[2]!.name}\n          isCompleted={data[2]!.isCompleted}\n          onMouseEnter={onMouseEnter}\n        />\n      </Styled.SegmentBottom>\n    </CardContainer>\n  );\n};\n\nexport const SegmentedGameCard = memo(forwardRef(SegmentedGameCardComponent));\n"],"names":["renderSettings","SegmentContent","memo","segmentType","isCompleted","card","name","onMouseEnter","handleMouseEnter","useCallback","jsx","Styled.SegmentContainer","jsxs","Styled.SegmentContentContainer","Styled.SegmentAssetContainer","LottieAnimation","Styled.SegmentOverlay","Styled.IconWrapper","CheckIcon","SegmentedGameCardComponent","data","gameCategoryLabel","initialValue","value","maxValue","ref","labelRef","useRef","cardWrapperRef","label","setLabel","useState","isAnimated","setIsAnimated","animatedColor","setAnimatedColor","isLabelHighlighted","gameName","onMouseLeave","onSegmentPress","index","_b","_a","startLabelAnimation","color","useImperativeHandle","animationSegments","useMemo","totalFrames","framesPerValue","initialFrameToPlay","finalFrameToPlay","levelUpAnimationSettings","CardContainer","Styled.CircularProgressLottieContainer","LOTTIE","Styled.SegmentLeft","Styled.SegmentRight","Styled.SegmentBottom","SegmentedGameCard","forwardRef"],"mappings":";;;;;;;AAwBA,MAAMA,IAAiB,EAAE,UAAU,UAAU,MAAM,GAAK,GAE3CC,IAAiBC;AAAA,EAC5B,CAAC,EAAE,aAAAC,GAAa,aAAAC,GAAa,MAAAC,GAAM,MAAAC,GAAM,cAAAC,QAAiD;AAClF,UAAAC,IAAmBC,EAAY,MAAMF,EAAaD,CAAI,GAAG,CAACC,GAAcD,CAAI,CAAC;AAGjF,WAAA,gBAAAI,EAACC,GAAA,EACC,UAAA,gBAAAC,EAACC,GAAA,EAA+B,cAAcV,GAAa,cAAcK,GACvE,UAAA;AAAA,MAAA,gBAAAE,EAACI,GAAA,EAA6B,cAAcX,GAC1C,UAAA,gBAAAO,EAACK,GAAgB,EAAA,KAAKV,GAAM,UAAUL,GAAgB,oBAAkB,GAAC,CAAA,GAC3E;AAAA,MAECI,uBACEY,GAAA,EAAsB,cAAcb,GACnC,4BAACc,GAAA,EACC,UAAC,gBAAAP,EAAAQ,GAAA,EAAU,OAAM,QAAO,QAAQ,IAAI,OAAO,IAAI,GACjD,EACF,CAAA;AAAA,IAAA,EAAA,CAEJ,EACF,CAAA;AAAA,EAAA;AAGN,GAEMC,IAGF,CAAC,EAAE,MAAAC,GAAM,OAAOC,GAAmB,cAAAC,IAAe,GAAG,OAAAC,GAAO,UAAAC,IAAW,EAAE,GAAGC,MAAQ;AAChF,QAAAC,IAAWC,EAAuB,IAAI,GACtCC,IAAiBD,EAAuB,IAAI,GAE5C,CAACE,GAAOC,CAAQ,IAAIC,EAAiBV,CAAiB,GACtD,CAACW,GAAYC,CAAa,IAAIF,EAAS,EAAK,GAC5C,CAACG,GAAeC,CAAgB,IAAIJ,EAAsB,YAAY,GAEtEK,IAAqBP,MAAUR,GAE/Bd,IAAeE,EAAY,CAAC4B,MAAqB;AACrD,IAAAP,EAASO,CAAQ;AAAA,EACnB,GAAG,EAAE,GAECC,IAAe7B,EAAY,MAAM;AACrC,IAAAqB,EAAST,CAAiB;AAAA,EAAA,GACzB,CAACA,CAAiB,CAAC,GAEhBkB,IAAiB9B;AAAA,IACrB,CAAC+B,MAAkB;;AACZ,OAAAC,KAAAC,IAAAtB,EAAAoB,CAAK,MAAL,gBAAAE,EAAQ,YAAR,QAAAD,EAAA,KAAAC;AAAA,IACP;AAAA,IACA,CAACtB,CAAI;AAAA,EACP,GAEMuB,IAAsBlC,EAAY,CAACmC,MAAuB;AAC9D,IAAAX,EAAc,EAAI,GAClBE,EAAiBS,CAAK;AAAA,EACxB,GAAG,EAAE;AAEL,EAAAC,EAAoBpB,GAAK,OAAO;AAAA,IAC9B,UAAAC;AAAA,IACA,yBAAyBE;AAAA,IACzB,qBAAAe;AAAA,EAAA,EACA;AAEI,QAAAG,IAAkDC,EAAQ,MAAM;AACpE,QAAIvB,KAAY;AACd;AAGF,UAAMwB,IAAc,IACdC,IAAiBD,IAAcxB,GAE/B0B,IAAqB,KAAK,IAAID,IAAiB3B,GAAc0B,CAAW,GACxEG,IAAmB,KAAK,IAAIF,IAAiB1B,IAAQ,GAAGyB,CAAW;AAElE,WAAA,CAACE,GAAoBC,CAAgB;AAAA,EAC3C,GAAA,CAAC7B,GAAcE,GAAUD,CAAK,CAAC,GAE5B6B,IAA2BL;AAAA,IAC/B,OAAO;AAAA,MACL,UAAU;AAAA,MACV,UAAU;AAAA,MACV,MAAM;AAAA,MACN,gBAAgBD;AAAA,IAAA;AAAA,IAElB,CAACA,CAAiB;AAAA,EACpB;AAGE,SAAA,gBAAAlC;AAAA,IAACyC;AAAA,IAAA;AAAA,MACC,KAAKzB;AAAA,MACL,UAAAF;AAAA,MACA,OAAAG;AAAA,MACA,YAAAG;AAAA,MACA,cAAAM;AAAA,MACA,YAAYN,IAAaE,IAAgBE,IAAqB,eAAe;AAAA,MAE7E,UAAA;AAAA,QAAC,gBAAA1B,EAAA4C,GAAA,EACC,UAAA,gBAAA5C;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,KAAKwC,EAAO;AAAA,YACZ,UAAUH;AAAA,YACV,oBAAkB;AAAA,UAAA;AAAA,QAAA,GAEtB;AAAA,QAEA,gBAAA1C,EAAC8C,GAAA,EAAmB,SAAS,MAAMjB,EAAe,CAAC,GACjD,UAAA,gBAAA7B;AAAA,UAACT;AAAA,UAAA;AAAA,YACC,aAAa;AAAA,YACb,MAAMmB,EAAK,CAAC,EAAG;AAAA,YACf,MAAMA,EAAK,CAAC,EAAG;AAAA,YACf,aAAaA,EAAK,CAAC,EAAG;AAAA,YACtB,cAAAb;AAAA,UAAA;AAAA,QAAA,GAEJ;AAAA,QAGA,gBAAAG,EAAC+C,GAAA,EAAoB,SAAS,MAAMlB,EAAe,CAAC,GAClD,UAAA,gBAAA7B;AAAA,UAACT;AAAA,UAAA;AAAA,YACC,aAAa;AAAA,YACb,MAAMmB,EAAK,CAAC,EAAG;AAAA,YACf,MAAMA,EAAK,CAAC,EAAG;AAAA,YACf,aAAaA,EAAK,CAAC,EAAG;AAAA,YACtB,cAAAb;AAAA,UAAA;AAAA,QAAA,GAEJ;AAAA,QAGA,gBAAAG,EAACgD,GAAA,EAAqB,SAAS,MAAMnB,EAAe,CAAC,GACnD,UAAA,gBAAA7B;AAAA,UAACT;AAAA,UAAA;AAAA,YACC,aAAa;AAAA,YACb,MAAMmB,EAAK,CAAC,EAAG;AAAA,YACf,MAAMA,EAAK,CAAC,EAAG;AAAA,YACf,aAAaA,EAAK,CAAC,EAAG;AAAA,YACtB,cAAAb;AAAA,UAAA;AAAA,QAAA,EAEJ,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF;AAEJ,GAEaoD,KAAoBzD,EAAK0D,EAAWzC,CAA0B,CAAC;"}

package/dist/features/circle-games/game-launcher/comps/tables-card/table-mode/table-mode.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-mode.js","sources":["../../../../../../../src/features/circle-games/game-launcher/comps/tables-card/table-mode/table-mode.tsx"],"sourcesContent":["import type { TTableMode } from '../../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { ITableModeProps } from './table-mode-types';\nimport type { FC } from 'react';\n\nimport { memo } from 'react';\n\nimport { LOTTIE } from '../../../../../../assets/lottie/lottie';\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 { GAME_LAUNCHER_SIZE, GAME_LAUNCHER_SIZE_LARGE } from '../../card-container/constants';\nimport TableStar from '../table-mode-star/table-mode-star';\nimport * as Styled from './table-mode-styled';\n\nconst LOAD_LOTTIE: Partial<Record<TTableMode, string>> = {\n  sequence: LOTTIE.SEQUENCE_MODE_SEGMENT_LOTTIE,\n  random: LOTTIE.RANDOM_MODE_SEGMENT_LOTTIE,\n  advance: LOTTIE.ADVANCE_MODE_SEGMENT_LOTTIE,\n};\n\nconst TableMode: FC<ITableModeProps> = memo(({ tableNumber, isStarAchieved, type, rewardStar }) => {\n  return (\n    <FlexView $alignItems=\"center\">\n      <TableStar isStarAchieved={isStarAchieved} rewardStar={rewardStar} />\n      <Separator height={GAME_LAUNCHER_SIZE * 0.055} />\n      <FlexView $flexDirection=\"row\">\n        <Styled.ModeContentSquareBlock>\n          <Text\n            $renderAs={GAME_LAUNCHER_SIZE === GAME_LAUNCHER_SIZE_LARGE ? 'ac3-black' : 'ab2-bold'}\n            $color=\"WHITE\"\n          >\n            {tableNumber}\n          </Text>\n        </Styled.ModeContentSquareBlock>\n        <Styled.ModeContentSquareBlock>\n          <Text\n            $renderAs={GAME_LAUNCHER_SIZE === GAME_LAUNCHER_SIZE_LARGE ? 'ac3-black' : 'ab2-bold'}\n            $color=\"WHITE\"\n          >\n            ×\n          </Text>\n        </Styled.ModeContentSquareBlock>\n        <Styled.ModeContentSquareBlock $isBorderRightRequired={type === 'advance'}>\n          <Styled.TableModeLottieContainer\n            $bottom={type === 'advance' ? '-1px' : 'unset'}\n            $right={type === 'advance' ? '-1px' : 'unset'}\n          >\n            <LottieAnimation src={LOAD_LOTTIE[type] ?? ''} />\n          </Styled.TableModeLottieContainer>\n        </Styled.ModeContentSquareBlock>\n      </FlexView>\n    </FlexView>\n  );\n});\n\nexport default TableMode;\n"],"names":["LOAD_LOTTIE","LOTTIE","TableMode","memo","tableNumber","isStarAchieved","type","rewardStar","jsxs","FlexView","jsx","TableStar","Separator","GAME_LAUNCHER_SIZE","Styled.ModeContentSquareBlock","Text","GAME_LAUNCHER_SIZE_LARGE","Styled.TableModeLottieContainer","LottieAnimation"],"mappings":";;;;;;;;;;AAeA,MAAMA,IAAmD;AAAA,EACvD,UAAUC,EAAO;AAAA,EACjB,QAAQA,EAAO;AAAA,EACf,SAASA,EAAO;AAClB,GAEMC,IAAiCC,EAAK,CAAC,EAAE,aAAAC,GAAa,gBAAAC,GAAgB,MAAAC,GAAM,YAAAC,QAE9E,gBAAAC,EAACC,GAAS,EAAA,aAAY,UACpB,UAAA;AAAA,EAAC,gBAAAC,EAAAC,GAAA,EAAU,gBAAAN,GAAgC,YAAAE,EAAwB,CAAA;AAAA,EAClE,gBAAAG,EAAAE,GAAA,EAAU,QAAQC,IAAqB,MAAO,CAAA;AAAA,EAC/C,gBAAAL,EAACC,GAAS,EAAA,gBAAe,OACvB,UAAA;AAAA,IAAC,gBAAAC,EAAAI,GAAA,EACC,UAAA,gBAAAJ;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,WAAWF,MAAuBG,IAA2B,cAAc;AAAA,QAC3E,QAAO;AAAA,QAEN,UAAAZ;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,IACA,gBAAAM,EAACI,GAAA,EACC,UAAA,gBAAAJ;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,WAAWF,MAAuBG,IAA2B,cAAc;AAAA,QAC3E,QAAO;AAAA,QACR,UAAA;AAAA,MAAA;AAAA,IAAA,GAGH;AAAA,sBACCF,GAAA,EAA8B,wBAAwBR,MAAS,WAC9D,UAAA,gBAAAI;AAAA,MAACO;AAAAA,MAAA;AAAA,QACC,SAASX,MAAS,YAAY,SAAS;AAAA,QACvC,QAAQA,MAAS,YAAY,SAAS;AAAA,QAEtC,4BAACY,GAAgB,EAAA,KAAKlB,EAAYM,CAAI,KAAK,IAAI;AAAA,MAAA;AAAA,IAAA,GAEnD;AAAA,EAAA,GACF;AACF,EAAA,CAAA,CAEH;"}
+{"version":3,"file":"table-mode.js","sources":["../../../../../../../src/features/circle-games/game-launcher/comps/tables-card/table-mode/table-mode.tsx"],"sourcesContent":["import type { TTableMode } from '../../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { ITableModeProps } from './table-mode-types';\nimport type { FC } from 'react';\n\nimport { memo } from 'react';\n\nimport { LOTTIE } from '../../../../../../assets/lottie/lottie';\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 { GAME_LAUNCHER_SIZE, GAME_LAUNCHER_SIZE_LARGE } from '../../card-container/constants';\nimport TableStar from '../table-mode-star/table-mode-star';\nimport * as Styled from './table-mode-styled';\n\nconst LOAD_LOTTIE: Partial<Record<TTableMode, string>> = {\n  sequence: LOTTIE.SEQUENCE_MODE_SEGMENT_LOTTIE,\n  random: LOTTIE.RANDOM_MODE_SEGMENT_LOTTIE,\n  advance: LOTTIE.ADVANCE_MODE_SEGMENT_LOTTIE,\n};\n\nconst TableMode: FC<ITableModeProps> = memo(({ tableNumber, isStarAchieved, type, rewardStar }) => {\n  return (\n    <FlexView $alignItems=\"center\">\n      <TableStar isStarAchieved={isStarAchieved} rewardStar={rewardStar} />\n      <Separator height={GAME_LAUNCHER_SIZE * 0.055} />\n      <FlexView $flexDirection=\"row\">\n        <Styled.ModeContentSquareBlock>\n          <Text\n            $renderAs={GAME_LAUNCHER_SIZE === GAME_LAUNCHER_SIZE_LARGE ? 'ac3-black' : 'ab2-bold'}\n            $color=\"WHITE\"\n          >\n            {tableNumber}\n          </Text>\n        </Styled.ModeContentSquareBlock>\n        <Styled.ModeContentSquareBlock>\n          <Text\n            $renderAs={GAME_LAUNCHER_SIZE === GAME_LAUNCHER_SIZE_LARGE ? 'ac3-black' : 'ab2-bold'}\n            $color=\"WHITE\"\n          >\n            ×\n          </Text>\n        </Styled.ModeContentSquareBlock>\n        <Styled.ModeContentSquareBlock $isBorderRightRequired={type === 'advance'}>\n          <Styled.TableModeLottieContainer\n            $bottom={type === 'advance' ? '-1px' : 'unset'}\n            $right={type === 'advance' ? '-1px' : 'unset'}\n          >\n            <LottieAnimation src={LOAD_LOTTIE[type] ?? ''} />\n          </Styled.TableModeLottieContainer>\n        </Styled.ModeContentSquareBlock>\n      </FlexView>\n    </FlexView>\n  );\n});\n\nexport default TableMode;\n"],"names":["LOAD_LOTTIE","LOTTIE","TableMode","memo","tableNumber","isStarAchieved","type","rewardStar","jsxs","FlexView","jsx","TableStar","Separator","GAME_LAUNCHER_SIZE","Styled.ModeContentSquareBlock","Text","GAME_LAUNCHER_SIZE_LARGE","Styled.TableModeLottieContainer","LottieAnimation"],"mappings":";;;;;;;;;;AAeA,MAAMA,IAAmD;AAAA,EACvD,UAAUC,EAAO;AAAA,EACjB,QAAQA,EAAO;AAAA,EACf,SAASA,EAAO;AAClB,GAEMC,IAAiCC,EAAK,CAAC,EAAE,aAAAC,GAAa,gBAAAC,GAAgB,MAAAC,GAAM,YAAAC,QAE9E,gBAAAC,EAACC,GAAS,EAAA,aAAY,UACpB,UAAA;AAAA,EAAC,gBAAAC,EAAAC,GAAA,EAAU,gBAAAN,GAAgC,YAAAE,EAAwB,CAAA;AAAA,EAClE,gBAAAG,EAAAE,GAAA,EAAU,QAAQC,IAAqB,MAAO,CAAA;AAAA,EAC/C,gBAAAL,EAACC,GAAS,EAAA,gBAAe,OACvB,UAAA;AAAA,IAAC,gBAAAC,EAAAI,GAAA,EACC,UAAA,gBAAAJ;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,WAAWF,MAAuBG,IAA2B,cAAc;AAAA,QAC3E,QAAO;AAAA,QAEN,UAAAZ;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,IACA,gBAAAM,EAACI,GAAA,EACC,UAAA,gBAAAJ;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,WAAWF,MAAuBG,IAA2B,cAAc;AAAA,QAC3E,QAAO;AAAA,QACR,UAAA;AAAA,MAAA;AAAA,IAAA,GAGH;AAAA,sBACCF,GAAA,EAA8B,wBAAwBR,MAAS,WAC9D,UAAA,gBAAAI;AAAA,MAACO;AAAAA,MAAA;AAAA,QACC,SAASX,MAAS,YAAY,SAAS;AAAA,QACvC,QAAQA,MAAS,YAAY,SAAS;AAAA,QAEtC,4BAACY,GAAgB,EAAA,KAAKlB,EAAYM,CAAI,KAAK,GAAI,CAAA;AAAA,MAAA;AAAA,IAAA,EAEnD,CAAA;AAAA,EAAA,EACF,CAAA;AAAA,GACF,CAEH;"}

package/dist/features/circle-games/game-launcher/comps/tables-card/table-mode-star/table-mode-star.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-mode-star.js","sources":["../../../../../../../src/features/circle-games/game-launcher/comps/tables-card/table-mode-star/table-mode-star.tsx"],"sourcesContent":["import type { ITableModeStarProps } from './table-mode-star-types';\nimport type { AnimationEventName } from 'lottie-web';\n\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { LOTTIE } from '../../../../../../assets/lottie/lottie';\nimport LottieAnimation from '../../../../../ui/lottie-animation/lottie-animation';\nimport { STAR_SIZE } from './constants';\nimport * as Styled from './table-mode-star-styled';\n\nconst settings = {\n  loop: false,\n};\n\nconst TableModeStar: React.FC<ITableModeStarProps> = ({ isStarAchieved, rewardStar }) => {\n  const [animateStar, setAnimateStar] = useState(false);\n  const [starRewarded, setStarRewarded] = useState(isStarAchieved && !rewardStar);\n\n  const onAnimationFinish = useMemo(() => {\n    return {\n      name: 'complete' as AnimationEventName,\n      callback: () => {\n        setStarRewarded(true);\n        setAnimateStar(false);\n      },\n    };\n  }, []);\n\n  useEffect(() => {\n    let timer: ReturnType<typeof setTimeout>;\n\n    if (isStarAchieved && rewardStar) {\n      timer = setTimeout(() => {\n        setAnimateStar(true);\n      }, 1000);\n    }\n\n    return () => {\n      timer && clearTimeout(timer);\n    };\n  }, [isStarAchieved, rewardStar]);\n\n  return (\n    <Styled.StarContainer>\n      {animateStar && (\n        <Styled.LottieContainer>\n          <LottieAnimation\n            src={LOTTIE.TABLE_MODE_STAR}\n            settings={settings}\n            eventListener={onAnimationFinish}\n          />\n        </Styled.LottieContainer>\n      )}\n      {!animateStar && (\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width={STAR_SIZE}\n          height={STAR_SIZE}\n          viewBox=\"0 0 16 16\"\n          fill=\"none\"\n        >\n          <Styled.Circle cx=\"8\" cy=\"8\" r=\"8\" $fill={starRewarded ? 'GREEN_6' : 'WHITE_T_15'} />\n          <Styled.Path\n            d=\"M8 2L6.23664 5.57295L2.29366 6.1459L5.14683 8.92705L4.47329 12.8541L8 11L11.5267 12.8541L10.8532 8.92705L13.7063 6.1459L9.76336 5.57295L8 2Z\"\n            $fill={starRewarded ? 'GREEN_4' : 'WHITE_T_15'}\n          />\n        </svg>\n      )}\n    </Styled.StarContainer>\n  );\n};\n\nexport default TableModeStar;\n"],"names":["settings","TableModeStar","isStarAchieved","rewardStar","animateStar","setAnimateStar","useState","starRewarded","setStarRewarded","onAnimationFinish","useMemo","useEffect","timer","jsxs","Styled.StarContainer","jsx","Styled.LottieContainer","LottieAnimation","LOTTIE","STAR_SIZE","Styled.Circle","Styled.Path"],"mappings":";;;;;;AAUA,MAAMA,IAAW;AAAA,EACf,MAAM;AACR,GAEMC,IAA+C,CAAC,EAAE,gBAAAC,GAAgB,YAAAC,QAAiB;AACvF,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9C,CAACC,GAAcC,CAAe,IAAIF,EAASJ,KAAkB,CAACC,CAAU,GAExEM,IAAoBC,EAAQ,OACzB;AAAA,IACL,MAAM;AAAA,IACN,UAAU,MAAM;AACd,MAAAF,EAAgB,EAAI,GACpBH,EAAe,EAAK;AAAA,IACtB;AAAA,EAAA,IAED,CAAE,CAAA;AAEL,SAAAM,EAAU,MAAM;AACV,QAAAC;AAEJ,WAAIV,KAAkBC,MACpBS,IAAQ,WAAW,MAAM;AACvB,MAAAP,EAAe,EAAI;AAAA,OAClB,GAAI,IAGF,MAAM;AACX,MAAAO,KAAS,aAAaA,CAAK;AAAA,IAAA;AAAA,EAC7B,GACC,CAACV,GAAgBC,CAAU,CAAC,GAG7B,gBAAAU,EAACC,GAAA,EACE,UAAA;AAAA,IACCV,KAAA,gBAAAW,EAACC,GAAA,EACC,UAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,KAAKC,EAAO;AAAA,QACZ,UAAAlB;AAAA,QACA,eAAeS;AAAA,MAAA;AAAA,IAAA,GAEnB;AAAA,IAED,CAACL,KACA,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAOM;AAAA,QACP,QAAQA;AAAA,QACR,SAAQ;AAAA,QACR,MAAK;AAAA,QAEL,UAAA;AAAA,UAAA,gBAAAJ,EAACK,GAAA,EAAc,IAAG,KAAI,IAAG,KAAI,GAAE,KAAI,OAAOb,IAAe,YAAY,aAAc,CAAA;AAAA,UACnF,gBAAAQ;AAAA,YAACM;AAAAA,YAAA;AAAA,cACC,GAAE;AAAA,cACF,OAAOd,IAAe,YAAY;AAAA,YAAA;AAAA,UACpC;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"table-mode-star.js","sources":["../../../../../../../src/features/circle-games/game-launcher/comps/tables-card/table-mode-star/table-mode-star.tsx"],"sourcesContent":["import type { ITableModeStarProps } from './table-mode-star-types';\nimport type { AnimationEventName } from 'lottie-web';\n\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { LOTTIE } from '../../../../../../assets/lottie/lottie';\nimport LottieAnimation from '../../../../../ui/lottie-animation/lottie-animation';\nimport { STAR_SIZE } from './constants';\nimport * as Styled from './table-mode-star-styled';\n\nconst settings = {\n  loop: false,\n};\n\nconst TableModeStar: React.FC<ITableModeStarProps> = ({ isStarAchieved, rewardStar }) => {\n  const [animateStar, setAnimateStar] = useState(false);\n  const [starRewarded, setStarRewarded] = useState(isStarAchieved && !rewardStar);\n\n  const onAnimationFinish = useMemo(() => {\n    return {\n      name: 'complete' as AnimationEventName,\n      callback: () => {\n        setStarRewarded(true);\n        setAnimateStar(false);\n      },\n    };\n  }, []);\n\n  useEffect(() => {\n    let timer: ReturnType<typeof setTimeout>;\n\n    if (isStarAchieved && rewardStar) {\n      timer = setTimeout(() => {\n        setAnimateStar(true);\n      }, 1000);\n    }\n\n    return () => {\n      timer && clearTimeout(timer);\n    };\n  }, [isStarAchieved, rewardStar]);\n\n  return (\n    <Styled.StarContainer>\n      {animateStar && (\n        <Styled.LottieContainer>\n          <LottieAnimation\n            src={LOTTIE.TABLE_MODE_STAR}\n            settings={settings}\n            eventListener={onAnimationFinish}\n          />\n        </Styled.LottieContainer>\n      )}\n      {!animateStar && (\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width={STAR_SIZE}\n          height={STAR_SIZE}\n          viewBox=\"0 0 16 16\"\n          fill=\"none\"\n        >\n          <Styled.Circle cx=\"8\" cy=\"8\" r=\"8\" $fill={starRewarded ? 'GREEN_6' : 'WHITE_T_15'} />\n          <Styled.Path\n            d=\"M8 2L6.23664 5.57295L2.29366 6.1459L5.14683 8.92705L4.47329 12.8541L8 11L11.5267 12.8541L10.8532 8.92705L13.7063 6.1459L9.76336 5.57295L8 2Z\"\n            $fill={starRewarded ? 'GREEN_4' : 'WHITE_T_15'}\n          />\n        </svg>\n      )}\n    </Styled.StarContainer>\n  );\n};\n\nexport default TableModeStar;\n"],"names":["settings","TableModeStar","isStarAchieved","rewardStar","animateStar","setAnimateStar","useState","starRewarded","setStarRewarded","onAnimationFinish","useMemo","useEffect","timer","jsxs","Styled.StarContainer","jsx","Styled.LottieContainer","LottieAnimation","LOTTIE","STAR_SIZE","Styled.Circle","Styled.Path"],"mappings":";;;;;;AAUA,MAAMA,IAAW;AAAA,EACf,MAAM;AACR,GAEMC,IAA+C,CAAC,EAAE,gBAAAC,GAAgB,YAAAC,QAAiB;AACvF,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9C,CAACC,GAAcC,CAAe,IAAIF,EAASJ,KAAkB,CAACC,CAAU,GAExEM,IAAoBC,EAAQ,OACzB;AAAA,IACL,MAAM;AAAA,IACN,UAAU,MAAM;AACd,MAAAF,EAAgB,EAAI,GACpBH,EAAe,EAAK;AAAA,IAAA;AAAA,EAExB,IACC,EAAE;AAEL,SAAAM,EAAU,MAAM;AACV,QAAAC;AAEJ,WAAIV,KAAkBC,MACpBS,IAAQ,WAAW,MAAM;AACvB,MAAAP,EAAe,EAAI;AAAA,OAClB,GAAI,IAGF,MAAM;AACX,MAAAO,KAAS,aAAaA,CAAK;AAAA,IAC7B;AAAA,EAAA,GACC,CAACV,GAAgBC,CAAU,CAAC,GAG7B,gBAAAU,EAACC,GAAA,EACE,UAAA;AAAA,IACCV,KAAA,gBAAAW,EAACC,GAAA,EACC,UAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,KAAKC,EAAO;AAAA,QACZ,UAAAlB;AAAA,QACA,eAAeS;AAAA,MAAA;AAAA,IAAA,GAEnB;AAAA,IAED,CAACL,KACA,gBAAAS;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAOM;AAAA,QACP,QAAQA;AAAA,QACR,SAAQ;AAAA,QACR,MAAK;AAAA,QAEL,UAAA;AAAA,UAAA,gBAAAJ,EAACK,GAAA,EAAc,IAAG,KAAI,IAAG,KAAI,GAAE,KAAI,OAAOb,IAAe,YAAY,aAAc,CAAA;AAAA,UACnF,gBAAAQ;AAAA,YAACM;AAAAA,YAAA;AAAA,cACC,GAAE;AAAA,cACF,OAAOd,IAAe,YAAY;AAAA,YAAA;AAAA,UAAA;AAAA,QACpC;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GAEJ;AAEJ;"}

package/dist/features/circle-games/game-launcher/comps/tables-card/table-segment-star/table-segment-star.js.map

@@ -1 +1 @@
-{"version":3,"file":"table-segment-star.js","sources":["../../../../../../../src/features/circle-games/game-launcher/comps/tables-card/table-segment-star/table-segment-star.tsx"],"sourcesContent":["import type { ITableSegmentStarProps } from './table-segment-star-types';\nimport type { AnimationEventName } from 'lottie-web';\n\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { LOTTIE } from '../../../../../../assets/lottie/lottie';\nimport LottieAnimation from '../../../../../ui/lottie-animation/lottie-animation';\nimport * as Styled from './table-segment-star-styled';\n\nconst settings = {\n  loop: false,\n};\n\nconst TableSegmentStar: React.FC<ITableSegmentStarProps> = ({ isStarAchieved, rewardStar }) => {\n  const [animateStar, setAnimateStar] = useState(false);\n  const [starRewarded, setStarRewarded] = useState(isStarAchieved && !rewardStar);\n\n  const onAnimationFinish = useMemo(() => {\n    return {\n      name: 'complete' as AnimationEventName,\n      callback: () => {\n        setStarRewarded(true);\n        setAnimateStar(false);\n      },\n    };\n  }, []);\n\n  useEffect(() => {\n    let timer: ReturnType<typeof setTimeout>;\n\n    if (isStarAchieved && rewardStar) {\n      timer = setTimeout(() => {\n        setAnimateStar(true);\n      }, 1000);\n    }\n\n    return () => {\n      timer && clearTimeout(timer);\n    };\n  }, [isStarAchieved, rewardStar]);\n\n  return (\n    <Styled.StarContainer>\n      {animateStar && (\n        <Styled.LottieContainer>\n          <LottieAnimation\n            src={LOTTIE.TABLE_SEGMENT_STAR}\n            settings={settings}\n            eventListener={onAnimationFinish}\n          />\n        </Styled.LottieContainer>\n      )}\n      {!animateStar && <Styled.TableStar $isStarAchieved={starRewarded} />}\n    </Styled.StarContainer>\n  );\n};\n\nexport default TableSegmentStar;\n"],"names":["settings","TableSegmentStar","isStarAchieved","rewardStar","animateStar","setAnimateStar","useState","starRewarded","setStarRewarded","onAnimationFinish","useMemo","useEffect","timer","jsxs","Styled.StarContainer","jsx","Styled.LottieContainer","LottieAnimation","LOTTIE","Styled.TableStar"],"mappings":";;;;;AASA,MAAMA,IAAW;AAAA,EACf,MAAM;AACR,GAEMC,IAAqD,CAAC,EAAE,gBAAAC,GAAgB,YAAAC,QAAiB;AAC7F,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9C,CAACC,GAAcC,CAAe,IAAIF,EAASJ,KAAkB,CAACC,CAAU,GAExEM,IAAoBC,EAAQ,OACzB;AAAA,IACL,MAAM;AAAA,IACN,UAAU,MAAM;AACd,MAAAF,EAAgB,EAAI,GACpBH,EAAe,EAAK;AAAA,IACtB;AAAA,EAAA,IAED,CAAE,CAAA;AAEL,SAAAM,EAAU,MAAM;AACV,QAAAC;AAEJ,WAAIV,KAAkBC,MACpBS,IAAQ,WAAW,MAAM;AACvB,MAAAP,EAAe,EAAI;AAAA,OAClB,GAAI,IAGF,MAAM;AACX,MAAAO,KAAS,aAAaA,CAAK;AAAA,IAAA;AAAA,EAC7B,GACC,CAACV,GAAgBC,CAAU,CAAC,GAG7B,gBAAAU,EAACC,GAAA,EACE,UAAA;AAAA,IACCV,KAAA,gBAAAW,EAACC,GAAA,EACC,UAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,KAAKC,EAAO;AAAA,QACZ,UAAAlB;AAAA,QACA,eAAeS;AAAA,MAAA;AAAA,IAAA,GAEnB;AAAA,IAED,CAACL,KAAe,gBAAAW,EAACI,GAAA,EAAiB,iBAAiBZ,EAAc,CAAA;AAAA,EACpE,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"table-segment-star.js","sources":["../../../../../../../src/features/circle-games/game-launcher/comps/tables-card/table-segment-star/table-segment-star.tsx"],"sourcesContent":["import type { ITableSegmentStarProps } from './table-segment-star-types';\nimport type { AnimationEventName } from 'lottie-web';\n\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { LOTTIE } from '../../../../../../assets/lottie/lottie';\nimport LottieAnimation from '../../../../../ui/lottie-animation/lottie-animation';\nimport * as Styled from './table-segment-star-styled';\n\nconst settings = {\n  loop: false,\n};\n\nconst TableSegmentStar: React.FC<ITableSegmentStarProps> = ({ isStarAchieved, rewardStar }) => {\n  const [animateStar, setAnimateStar] = useState(false);\n  const [starRewarded, setStarRewarded] = useState(isStarAchieved && !rewardStar);\n\n  const onAnimationFinish = useMemo(() => {\n    return {\n      name: 'complete' as AnimationEventName,\n      callback: () => {\n        setStarRewarded(true);\n        setAnimateStar(false);\n      },\n    };\n  }, []);\n\n  useEffect(() => {\n    let timer: ReturnType<typeof setTimeout>;\n\n    if (isStarAchieved && rewardStar) {\n      timer = setTimeout(() => {\n        setAnimateStar(true);\n      }, 1000);\n    }\n\n    return () => {\n      timer && clearTimeout(timer);\n    };\n  }, [isStarAchieved, rewardStar]);\n\n  return (\n    <Styled.StarContainer>\n      {animateStar && (\n        <Styled.LottieContainer>\n          <LottieAnimation\n            src={LOTTIE.TABLE_SEGMENT_STAR}\n            settings={settings}\n            eventListener={onAnimationFinish}\n          />\n        </Styled.LottieContainer>\n      )}\n      {!animateStar && <Styled.TableStar $isStarAchieved={starRewarded} />}\n    </Styled.StarContainer>\n  );\n};\n\nexport default TableSegmentStar;\n"],"names":["settings","TableSegmentStar","isStarAchieved","rewardStar","animateStar","setAnimateStar","useState","starRewarded","setStarRewarded","onAnimationFinish","useMemo","useEffect","timer","jsxs","Styled.StarContainer","jsx","Styled.LottieContainer","LottieAnimation","LOTTIE","Styled.TableStar"],"mappings":";;;;;AASA,MAAMA,IAAW;AAAA,EACf,MAAM;AACR,GAEMC,IAAqD,CAAC,EAAE,gBAAAC,GAAgB,YAAAC,QAAiB;AAC7F,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAS,EAAK,GAC9C,CAACC,GAAcC,CAAe,IAAIF,EAASJ,KAAkB,CAACC,CAAU,GAExEM,IAAoBC,EAAQ,OACzB;AAAA,IACL,MAAM;AAAA,IACN,UAAU,MAAM;AACd,MAAAF,EAAgB,EAAI,GACpBH,EAAe,EAAK;AAAA,IAAA;AAAA,EAExB,IACC,EAAE;AAEL,SAAAM,EAAU,MAAM;AACV,QAAAC;AAEJ,WAAIV,KAAkBC,MACpBS,IAAQ,WAAW,MAAM;AACvB,MAAAP,EAAe,EAAI;AAAA,OAClB,GAAI,IAGF,MAAM;AACX,MAAAO,KAAS,aAAaA,CAAK;AAAA,IAC7B;AAAA,EAAA,GACC,CAACV,GAAgBC,CAAU,CAAC,GAG7B,gBAAAU,EAACC,GAAA,EACE,UAAA;AAAA,IACCV,KAAA,gBAAAW,EAACC,GAAA,EACC,UAAA,gBAAAD;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,KAAKC,EAAO;AAAA,QACZ,UAAAlB;AAAA,QACA,eAAeS;AAAA,MAAA;AAAA,IAAA,GAEnB;AAAA,IAED,CAACL,KAAe,gBAAAW,EAACI,GAAA,EAAiB,iBAAiBZ,EAAc,CAAA;AAAA,EAAA,GACpE;AAEJ;"}

package/dist/features/circle-games/game-launcher/comps/tables-card/tables-card-styled.js

@@ -1,7 +1,7 @@
 import e, { keyframes as s } from "styled-components";
 import d from "../../../../ui/layout/flex-view.js";
 import { GAME_LAUNCHER_SIZE as o } from "../card-container/constants.js";
-import { TABLE_CARD_SHADOW_Z_INDEX as l, TABLE_MODE_CONTAINER_Z_INDEX as p, TABLE_MODE_OVERLAY_Z_INDEX as h, ABSOLUTE_VIEW_Z_INDEX as f, INFINITE_MODE_Z_INDEX as E, TABLE_REVEAL_ANIMATION as n } from "./constants.js";
+import { INFINITE_MODE_Z_INDEX as l, ABSOLUTE_VIEW_Z_INDEX as p, TABLE_CARD_SHADOW_Z_INDEX as h, TABLE_MODE_CONTAINER_Z_INDEX as f, TABLE_MODE_OVERLAY_Z_INDEX as E, TABLE_REVEAL_ANIMATION as n } from "./constants.js";
 const a = 2 * Math.PI * (o / 2), r = 30, m = n.REVEAL_CONTENT[0] / r, $ = (n.REVEAL_CONTENT[1] - n.REVEAL_CONTENT[0]) / r, g = (n.DISAPPEAR_CONTENT[1] - n.DISAPPEAR_CONTENT[0]) / r, c = e.div`
   position: relative;
   height: inherit;
@@ -21,7 +21,7 @@ const a = 2 * Math.PI * (o / 2), r = 30, m = n.REVEAL_CONTENT[0] / r, $ = (n.REV
     rgba(13, 13, 13, 0.5) 0%,
     rgba(13, 13, 13, 0) 100%
   );
-  z-index: ${l};
+  z-index: ${h};
   pointer-events: none;
 `, y = e.div`
   display: flex;
@@ -71,7 +71,7 @@ const a = 2 * Math.PI * (o / 2), r = 30, m = n.REVEAL_CONTENT[0] / r, $ = (n.REV
   align-items: center;
 `, C = e.div`
   position: absolute;
-  z-index: ${p};
+  z-index: ${f};
   height: inherit;
   width: inherit;
   top: 0;
@@ -89,7 +89,7 @@ const a = 2 * Math.PI * (o / 2), r = 30, m = n.REVEAL_CONTENT[0] / r, $ = (n.REV
   width: ${81.08 * o / 100}px;
   border-radius: 100%;
   transform: ${({ $top: t = "50%", $left: i = "50%" }) => `translate(${i}, ${t})`};
-  z-index: ${h};
+  z-index: ${E};
   cursor: pointer;
   &:hover {
     background-color: ${({ $hoverColor: t }) => t};
@@ -99,7 +99,7 @@ const a = 2 * Math.PI * (o / 2), r = 30, m = n.REVEAL_CONTENT[0] / r, $ = (n.REV
   pointer-events: ${({ $isPointerEventsNone: t = !1 }) => t ? "none" : "auto"};
   top: ${({ $top: t = 0, $valueInPx: i }) => i ? `${t}px` : `${t}%`};
   left: ${({ $left: t = 0, $valueInPx: i }) => i ? `${t}px` : `${t}%`};
-  z-index: ${f};
+  z-index: ${p};
   transform: ${({ $alignCenter: t }) => t ? "translate(-50%, -50%)" : "none"};
   display: flex;
   align-items: center;
@@ -134,7 +134,7 @@ to {
   position: relative;
   height: ${o * 24.5 / 100}px;
   width: ${o * 24.5 / 100}px;
-  z-index: ${E};
+  z-index: ${l};
   cursor: pointer;
 `;
 export {