@cuemath/leap 3.1.31 → 3.1.32

package/dist/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey-styled.js

@@ -0,0 +1,13 @@
+import t from "styled-components";
+const i = t.div`
+  border: 1px solid ${({ theme: r }) => r.colors.WHITE};
+  height: 8px;
+  width: 8px;
+  border-radius: 100%;
+  background: ${({ theme: r, $isActive: o }) => o ? r.colors.WHITE : "transparent"};
+  cursor: pointer;
+`;
+export {
+  i as Indicator
+};
+//# sourceMappingURL=use-table-infinite-launcher-journey-styled.js.map

package/dist/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-table-infinite-launcher-journey-styled.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Indicator = styled.div<{ $isActive?: boolean }>`\n  border: 1px solid ${({ theme }) => theme.colors.WHITE};\n  height: 8px;\n  width: 8px;\n  border-radius: 100%;\n  background: ${({ theme, $isActive }) => ($isActive ? theme.colors.WHITE : 'transparent')};\n  cursor: pointer;\n`;\n"],"names":["Indicator","styled","theme","$isActive"],"mappings":";AAEO,MAAMA,IAAYC,EAAO;AAAA,sBACV,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA,gBAIvC,CAAC,EAAE,OAAAA,GAAO,WAAAC,QAAiBA,IAAYD,EAAM,OAAO,QAAQ,aAAc;AAAA;AAAA;"}

package/dist/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey.js

@@ -0,0 +1,126 @@
+import { jsx as n, Fragment as x } from "react/jsx-runtime";
+import { useRef as U, useCallback as m, useEffect as w } from "react";
+import { JOURNEY_ID_STUDENT as F } from "../../../../journey/journey-id/journey-id-student.js";
+import { IndicatorType as l } from "../../../../journey/use-journey/constants.js";
+import { useJourney as J } from "../../../../journey/use-journey/use-journey.js";
+import W from "../../../../ui/layout/flex-view.js";
+import k from "../../../../ui/text/text.js";
+import { getTheme as P } from "../../../../ui/theme/get-theme.js";
+import { useCircleSounds as b } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
+import { INFINITE_MODE_TEXT as v } from "../../comps/tables-card/constants.js";
+import R from "../../comps/tables-card/infinite-button/infinite-mode-launcher-button.js";
+import { TABLE_CARD_INDEX as I, GO_TO_TABLE_LAUNCHER_DURATION_MS as X, SHOW_CLICK_TABLE_NUDGE_AFTER_MS as B, LESSON_CARD_INDEX as $, SHOW_INITIAL_COACHMARK_AFTER_MS as G, SHOW_INITIAL_TOOLTIP_AFTER_MS as j } from "./constants.js";
+import { Indicator as K } from "./use-table-infinite-launcher-journey-styled.js";
+const V = {
+  top: 6,
+  left: 8,
+  cursor: "pointer"
+}, mt = ({
+  carouselRefs: o,
+  originalTableRef: t,
+  onTableInfiniteModeClick: T,
+  onJourneyComplete: a
+}) => {
+  const e = F.CIRCLE_TABLES_INFINTE_JOURNEY, { device: Y } = P(), p = Y === "mobile" ? "ab3-bold" : "ab2-bold", h = U([]), { playButtonSound: A } = b(), { nextCoachmark: c, setJourney: E, addCoachmark: _, endJourney: f } = J(), g = m(() => {
+    var r;
+    f(e), T(), (r = t == null ? void 0 : t.current) == null || r.stopLabelAnimation(), a(e);
+  }, [f, e, a, T, t]), s = m(
+    (r, u) => {
+      c(e, !1, r);
+      const i = setTimeout(() => {
+        var d;
+        clearTimeout(i), (d = t.current) == null || d.startLabelAnimation("YELLOW_4"), t.current && t.current.labelRef.current && (t.current.labelRef.current.innerText = v), c(e, !0);
+      }, u);
+      h.current.push(i);
+    },
+    [e, c, t]
+  ), C = m(() => {
+    var r;
+    A(), (r = o.current) == null || r.goToIndex(I), s(X, B);
+  }, [o, A, s]), M = m(() => {
+    var O, L, N, y, S, D, H;
+    const r = (O = o.current) == null ? void 0 : O.indicatorRefs, u = (L = o.current) == null ? void 0 : L.nextBtnRef, i = r == null ? void 0 : r[I];
+    if (!((N = t.current) != null && N.segmentedCardWrapperRef.current) || !((y = t.current) != null && y.labelRef.current) || !r || !(u != null && u.current) || !i || !i.current)
+      return;
+    const d = (S = t.current) == null ? void 0 : S.segmentedCardWrapperRef.current.getBoundingClientRect();
+    ((D = o.current) == null ? void 0 : D.currentIndex) === I ? (E(e, []), s(0, B)) : (E(e, [
+      {
+        originalElementToHighlightRef: i,
+        isActive: !1,
+        type: l.TOOLTIP,
+        elementToHighlight: /* @__PURE__ */ n(K, { $isActive: !1 }),
+        indicator: {
+          position: "bottom",
+          backgroundColor: "YELLOW_4",
+          width: 52,
+          tooltipItem: /* @__PURE__ */ n(
+            W,
+            {
+              $position: "absolute",
+              $flexDirection: "row",
+              style: V,
+              onClick: C,
+              children: /* @__PURE__ */ n(k, { $renderAs: p, children: "NEW" })
+            }
+          ),
+          tooltipYCoOrdinates: 14
+          // Need some offset in Y direction from top
+        }
+      },
+      {
+        originalElementToHighlightRef: i,
+        isActive: !1,
+        type: l.NUDGE,
+        indicator: {
+          nudge: "click",
+          content: "",
+          nudgePointerY: 20
+        },
+        elementToHighlight: /* @__PURE__ */ n(x, {})
+      }
+    ]), (H = o.current) == null || H.goToIndex($), c(e, !1, G), c(e, !0, j)), _(e, {
+      originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
+      isActive: !1,
+      type: l.TOOLTIP,
+      elementToHighlight: /* @__PURE__ */ n(x, {}),
+      indicator: {
+        position: "top",
+        backgroundColor: "YELLOW_4",
+        width: 260,
+        tooltipItem: /* @__PURE__ */ n(W, { children: /* @__PURE__ */ n(k, { $renderAs: p, children: "Challenge yourself in Infinity Mode! Break records and climb the leaderboard." }) }),
+        tooltipXCoOrdinates: d.width / 2,
+        tooltipYCoOrdinates: -(1 * d.height) / 3
+      }
+    }), _(e, {
+      originalElementToHighlightRef: t.current.infiniteButtonRef,
+      isActive: !1,
+      type: l.NUDGE,
+      indicator: {
+        nudge: "click",
+        nudgePointerX: 0,
+        nudgePointerY: 10
+      },
+      elementToHighlight: /* @__PURE__ */ n(R, { onClick: g })
+    });
+  }, [
+    _,
+    o,
+    C,
+    g,
+    e,
+    c,
+    t,
+    E,
+    s,
+    p
+  ]);
+  return w(() => () => {
+    h.current.forEach((r) => clearTimeout(r)), h.current = [];
+  }, [e]), {
+    startJourney: M
+  };
+};
+export {
+  mt as useTableInfiniteLauncherJourney
+};
+//# sourceMappingURL=use-table-infinite-launcher-journey.js.map

package/dist/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-table-infinite-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-infinite-launcher-journey/use-table-infinite-launcher-journey.tsx"],"sourcesContent":["import type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { IUseInfiniteTableJourneyProps } from './use-table-infinite-launcher-journey-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport { JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { getTheme } from '../../../../ui/theme/get-theme';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { INFINITE_MODE_TEXT } from '../../comps/tables-card/constants';\nimport InfiniteButtonCard from '../../comps/tables-card/infinite-button/infinite-mode-launcher-button';\nimport { LESSON_CARD_INDEX, TABLE_CARD_INDEX } from './constants';\nimport {\n  GO_TO_TABLE_LAUNCHER_DURATION_MS,\n  SHOW_CLICK_TABLE_NUDGE_AFTER_MS,\n  SHOW_INITIAL_COACHMARK_AFTER_MS,\n  SHOW_INITIAL_TOOLTIP_AFTER_MS,\n} from './constants';\nimport * as S from './use-table-infinite-launcher-journey-styled';\n\nconst tooltipItemStyle: React.CSSProperties = {\n  top: 6,\n  left: 8,\n  cursor: 'pointer',\n};\n\nexport const useTableInfiniteLauncherJourney = ({\n  carouselRefs,\n  originalTableRef,\n  onTableInfiniteModeClick,\n  onJourneyComplete,\n}: IUseInfiniteTableJourneyProps) => {\n  const journeyId = JOURNEY_ID_STUDENT.CIRCLE_TABLES_INFINTE_JOURNEY;\n\n  const { device } = getTheme();\n  const isMobile = device === 'mobile';\n  const tooltipTextRenderAs = isMobile ? 'ab3-bold' : 'ab2-bold';\n\n  const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n  const { playButtonSound } = useCircleSounds();\n  const { nextCoachmark, setJourney, addCoachmark, endJourney } = useJourney();\n\n  const handleEndJourney = useCallback(() => {\n    endJourney(journeyId);\n    // Only when User clicked on play\n    onTableInfiniteModeClick();\n    // Reset original table card ref label\n    originalTableRef?.current?.stopLabelAnimation();\n    onJourneyComplete(journeyId);\n  }, [endJourney, journeyId, onJourneyComplete, onTableInfiniteModeClick, originalTableRef]);\n\n  const showToolTipAndNudge = useCallback(\n    (dealyToShowToolTip: number, delayToShowNudge: number) => {\n      nextCoachmark(journeyId, false, dealyToShowToolTip);\n\n      const showNudge = setTimeout(() => {\n        clearTimeout(showNudge);\n\n        originalTableRef.current?.startLabelAnimation('YELLOW_4');\n        if (originalTableRef.current && originalTableRef.current.labelRef.current) {\n          originalTableRef.current.labelRef.current.innerText = INFINITE_MODE_TEXT;\n        }\n        nextCoachmark(journeyId, true);\n      }, delayToShowNudge);\n\n      timerRefs.current.push(showNudge);\n    },\n    [journeyId, nextCoachmark, originalTableRef],\n  );\n\n  const goToTableLauncher = useCallback(() => {\n    playButtonSound();\n    carouselRefs.current?.goToIndex(TABLE_CARD_INDEX);\n    showToolTipAndNudge(GO_TO_TABLE_LAUNCHER_DURATION_MS, SHOW_CLICK_TABLE_NUDGE_AFTER_MS);\n  }, [carouselRefs, playButtonSound, showToolTipAndNudge]);\n\n  const startJourney = useCallback(() => {\n    const paginationList = carouselRefs.current?.indicatorRefs;\n    const carouselNextBtnRef = carouselRefs.current?.nextBtnRef;\n    const tablePaginationRef = paginationList?.[TABLE_CARD_INDEX];\n\n    if (\n      !originalTableRef.current?.segmentedCardWrapperRef.current ||\n      !originalTableRef.current?.labelRef.current ||\n      !paginationList ||\n      !carouselNextBtnRef?.current ||\n      !tablePaginationRef ||\n      !tablePaginationRef.current\n    ) {\n      return;\n    }\n\n    const tableCardDims =\n      originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n    // USER ON TABLE CARD\n    if (carouselRefs.current?.currentIndex === TABLE_CARD_INDEX) {\n      setJourney(journeyId, []);\n      showToolTipAndNudge(0, SHOW_CLICK_TABLE_NUDGE_AFTER_MS);\n    } else {\n      // USER ON LESSON CARD\n      setJourney(journeyId, [\n        {\n          originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n          isActive: false,\n          type: IndicatorType.TOOLTIP,\n          elementToHighlight: <S.Indicator $isActive={false} />,\n          indicator: {\n            position: 'bottom',\n            backgroundColor: 'YELLOW_4',\n            width: 52,\n            tooltipItem: (\n              <FlexView\n                $position=\"absolute\"\n                $flexDirection=\"row\"\n                style={tooltipItemStyle}\n                onClick={goToTableLauncher}\n              >\n                <Text $renderAs={tooltipTextRenderAs}>NEW</Text>\n              </FlexView>\n            ),\n            tooltipYCoOrdinates: 14, // Need some offset in Y direction from top\n          } as IArrowTooltipProps,\n        },\n        {\n          originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n          isActive: false,\n          type: IndicatorType.NUDGE,\n          indicator: {\n            nudge: 'click',\n            content: '',\n            nudgePointerY: 20,\n          } as INudgeProps,\n          elementToHighlight: <></>,\n        },\n      ]);\n      carouselRefs.current?.goToIndex(LESSON_CARD_INDEX);\n      nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show Coachmark => NEW\n      nextCoachmark(journeyId, true, SHOW_INITIAL_TOOLTIP_AFTER_MS); // Show Nudge over Coachmark\n    }\n\n    // SHOW THE USER SELECT INFINITE MODE\n    addCoachmark(journeyId, {\n      originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n      isActive: false,\n      type: IndicatorType.TOOLTIP,\n      elementToHighlight: <></>,\n      indicator: {\n        position: 'top',\n        backgroundColor: 'YELLOW_4',\n        width: 260,\n        tooltipItem: (\n          <FlexView>\n            <Text $renderAs={tooltipTextRenderAs}>\n              Challenge yourself in Infinity Mode! Break records and climb the leaderboard.\n            </Text>\n          </FlexView>\n        ),\n        tooltipXCoOrdinates: tableCardDims.width / 2,\n        tooltipYCoOrdinates: -(1 * tableCardDims.height) / 3,\n      } as IArrowTooltipProps,\n    });\n\n    addCoachmark(journeyId, {\n      originalElementToHighlightRef: originalTableRef.current.infiniteButtonRef,\n      isActive: false,\n      type: IndicatorType.NUDGE,\n      indicator: {\n        nudge: 'click',\n        nudgePointerX: 0,\n        nudgePointerY: 10,\n      } as INudgeProps,\n      elementToHighlight: <InfiniteButtonCard onClick={handleEndJourney} />,\n    });\n  }, [\n    addCoachmark,\n    carouselRefs,\n    goToTableLauncher,\n    handleEndJourney,\n    journeyId,\n    nextCoachmark,\n    originalTableRef,\n    setJourney,\n    showToolTipAndNudge,\n    tooltipTextRenderAs,\n  ]);\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      timerRefs.current.forEach(timer => clearTimeout(timer));\n      timerRefs.current = [];\n    };\n  }, [journeyId]);\n\n  return {\n    startJourney,\n  };\n};\n"],"names":["tooltipItemStyle","useTableInfiniteLauncherJourney","carouselRefs","originalTableRef","onTableInfiniteModeClick","onJourneyComplete","journeyId","JOURNEY_ID_STUDENT","device","getTheme","tooltipTextRenderAs","timerRefs","useRef","playButtonSound","useCircleSounds","nextCoachmark","setJourney","addCoachmark","endJourney","useJourney","handleEndJourney","useCallback","_a","showToolTipAndNudge","dealyToShowToolTip","delayToShowNudge","showNudge","INFINITE_MODE_TEXT","goToTableLauncher","TABLE_CARD_INDEX","GO_TO_TABLE_LAUNCHER_DURATION_MS","SHOW_CLICK_TABLE_NUDGE_AFTER_MS","startJourney","paginationList","carouselNextBtnRef","_b","tablePaginationRef","_c","_d","tableCardDims","_e","_f","IndicatorType","jsx","S.Indicator","FlexView","Text","Fragment","_g","LESSON_CARD_INDEX","SHOW_INITIAL_COACHMARK_AFTER_MS","SHOW_INITIAL_TOOLTIP_AFTER_MS","InfiniteButtonCard","useEffect","timer"],"mappings":";;;;;;;;;;;;;AAwBA,MAAMA,IAAwC;AAAA,EAC5C,KAAK;AAAA,EACL,MAAM;AAAA,EACN,QAAQ;AACV,GAEaC,KAAkC,CAAC;AAAA,EAC9C,cAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,0BAAAC;AAAA,EACA,mBAAAC;AACF,MAAqC;AACnC,QAAMC,IAAYC,EAAmB,+BAE/B,EAAE,QAAAC,MAAWC,KAEbC,IADWF,MAAW,WACW,aAAa,YAE9CG,IAAYC,EAAwC,CAAA,CAAE,GAEtD,EAAE,iBAAAC,MAAoBC,KACtB,EAAE,eAAAC,GAAe,YAAAC,GAAY,cAAAC,GAAc,YAAAC,EAAA,IAAeC,KAE1DC,IAAmBC,EAAY,MAAM;;AACzC,IAAAH,EAAWZ,CAAS,GAEKF,MAEzBkB,IAAAnB,KAAA,gBAAAA,EAAkB,YAAlB,QAAAmB,EAA2B,sBAC3BjB,EAAkBC,CAAS;AAAA,EAAA,GAC1B,CAACY,GAAYZ,GAAWD,GAAmBD,GAA0BD,CAAgB,CAAC,GAEnFoB,IAAsBF;AAAA,IAC1B,CAACG,GAA4BC,MAA6B;AAC1C,MAAAV,EAAAT,GAAW,IAAOkB,CAAkB;AAE5C,YAAAE,IAAY,WAAW,MAAM;;AACjC,qBAAaA,CAAS,IAELJ,IAAAnB,EAAA,YAAA,QAAAmB,EAAS,oBAAoB,aAC1CnB,EAAiB,WAAWA,EAAiB,QAAQ,SAAS,YAC/CA,EAAA,QAAQ,SAAS,QAAQ,YAAYwB,IAExDZ,EAAcT,GAAW,EAAI;AAAA,SAC5BmB,CAAgB;AAET,MAAAd,EAAA,QAAQ,KAAKe,CAAS;AAAA,IAClC;AAAA,IACA,CAACpB,GAAWS,GAAeZ,CAAgB;AAAA,EAAA,GAGvCyB,IAAoBP,EAAY,MAAM;;AAC1B,IAAAR,MACHS,IAAApB,EAAA,YAAA,QAAAoB,EAAS,UAAUO,IAChCN,EAAoBO,GAAkCC,CAA+B;AAAA,EACpF,GAAA,CAAC7B,GAAcW,GAAiBU,CAAmB,CAAC,GAEjDS,IAAeX,EAAY,MAAM;;AAC/B,UAAAY,KAAiBX,IAAApB,EAAa,YAAb,gBAAAoB,EAAsB,eACvCY,KAAqBC,IAAAjC,EAAa,YAAb,gBAAAiC,EAAsB,YAC3CC,IAAqBH,KAAA,gBAAAA,EAAiBJ;AAE5C,QACE,GAACQ,IAAAlC,EAAiB,YAAjB,QAAAkC,EAA0B,wBAAwB,YACnD,GAACC,IAAAnC,EAAiB,YAAjB,QAAAmC,EAA0B,SAAS,YACpC,CAACL,KACD,EAACC,KAAA,QAAAA,EAAoB,YACrB,CAACE,KACD,CAACA,EAAmB;AAEpB;AAGF,UAAMG,KACJC,IAAArC,EAAiB,YAAjB,gBAAAqC,EAA0B,wBAAwB,QAAQ;AAGxD,MAAAC,IAAAvC,EAAa,YAAb,gBAAAuC,EAAsB,kBAAiBZ,KAC9Bb,EAAAV,GAAW,CAAA,CAAE,GACxBiB,EAAoB,GAAGQ,CAA+B,MAGtDf,EAAWV,GAAW;AAAA,MACpB;AAAA,QACE,+BAA+B8B;AAAA,QAC/B,UAAU;AAAA,QACV,MAAMM,EAAc;AAAA,QACpB,oBAAqB,gBAAAC,EAAAC,GAAA,EAAY,WAAW,GAAO,CAAA;AAAA,QACnD,WAAW;AAAA,UACT,UAAU;AAAA,UACV,iBAAiB;AAAA,UACjB,OAAO;AAAA,UACP,aACE,gBAAAD;AAAA,YAACE;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,gBAAe;AAAA,cACf,OAAO7C;AAAA,cACP,SAAS4B;AAAA,cAET,UAAC,gBAAAe,EAAAG,GAAA,EAAK,WAAWpC,GAAqB,UAAG,OAAA;AAAA,YAAA;AAAA,UAC3C;AAAA,UAEF,qBAAqB;AAAA;AAAA,QACvB;AAAA,MACF;AAAA,MACA;AAAA,QACE,+BAA+B0B;AAAA,QAC/B,UAAU;AAAA,QACV,MAAMM,EAAc;AAAA,QACpB,WAAW;AAAA,UACT,OAAO;AAAA,UACP,SAAS;AAAA,UACT,eAAe;AAAA,QACjB;AAAA,QACA,oBAAsB,gBAAAC,EAAAI,GAAA,EAAA;AAAA,MACxB;AAAA,IAAA,CACD,IACYC,IAAA9C,EAAA,YAAA,QAAA8C,EAAS,UAAUC,IAClBlC,EAAAT,GAAW,IAAO4C,CAA+B,GACjDnC,EAAAT,GAAW,IAAM6C,CAA6B,IAI9DlC,EAAaX,GAAW;AAAA,MACtB,+BAA+BH,EAAiB,QAAQ;AAAA,MACxD,UAAU;AAAA,MACV,MAAMuC,EAAc;AAAA,MACpB,oBAAsB,gBAAAC,EAAAI,GAAA,EAAA;AAAA,MACtB,WAAW;AAAA,QACT,UAAU;AAAA,QACV,iBAAiB;AAAA,QACjB,OAAO;AAAA,QACP,+BACGF,GACC,EAAA,UAAA,gBAAAF,EAACG,KAAK,WAAWpC,GAAqB,2FAEtC,EACF,CAAA;AAAA,QAEF,qBAAqB6B,EAAc,QAAQ;AAAA,QAC3C,qBAAqB,EAAE,IAAIA,EAAc,UAAU;AAAA,MACrD;AAAA,IAAA,CACD,GAEDtB,EAAaX,GAAW;AAAA,MACtB,+BAA+BH,EAAiB,QAAQ;AAAA,MACxD,UAAU;AAAA,MACV,MAAMuC,EAAc;AAAA,MACpB,WAAW;AAAA,QACT,OAAO;AAAA,QACP,eAAe;AAAA,QACf,eAAe;AAAA,MACjB;AAAA,MACA,oBAAoB,gBAAAC,EAACS,GAAmB,EAAA,SAAShC,EAAkB,CAAA;AAAA,IAAA,CACpE;AAAA,EAAA,GACA;AAAA,IACDH;AAAA,IACAf;AAAA,IACA0B;AAAA,IACAR;AAAA,IACAd;AAAA,IACAS;AAAA,IACAZ;AAAA,IACAa;AAAA,IACAO;AAAA,IACAb;AAAA,EAAA,CACD;AAGD,SAAA2C,EAAU,MACD,MAAM;AACX,IAAA1C,EAAU,QAAQ,QAAQ,CAAS2C,MAAA,aAAaA,CAAK,CAAC,GACtD3C,EAAU,UAAU;EAAC,GAEtB,CAACL,CAAS,CAAC,GAEP;AAAA,IACL,cAAA0B;AAAA,EAAA;AAEJ;"}

package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js

@@ -1,122 +1,142 @@
-import { jsx as r, Fragment as O } from "react/jsx-runtime";
-import { useRef as N, useCallback as L, useEffect as j } from "react";
-import Z from "../../../../../assets/line-icons/icons/carat-right.js";
-import { PLATFORM_EVENTS_STUDENT as M } from "../../../../analytics-events/platform-events-student.js";
-import { JOURNEY_ID_STUDENT as q } from "../../../../journey/journey-id/journey-id-student.js";
-import { IndicatorType as d } from "../../../../journey/use-journey/constants.js";
-import { useJourney as z } from "../../../../journey/use-journey/use-journey.js";
-import Q from "../../../../ui/buttons/icon-button/icon-button.js";
-import { useUIContext as ee } from "../../../../ui/context/context.js";
-import S from "../../../../ui/layout/flex-view.js";
-import T from "../../../../ui/text/text.js";
-import { getTheme as te } from "../../../../ui/theme/get-theme.js";
-import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as x } from "../../../enum/circle-onboarding-steps.js";
-import { useCircleSounds as re } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
-import { TablesCard as $ } from "../../comps/tables-card/tables-card.js";
-import { GAME_LAUNCHER_ANALYTICS_EVENTS as ne } from "../../game-launcher-analytics-events.js";
-import { SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS as oe, SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS as ie, START_ANIMATING_CLONED_ELEM as w, TABLE_CARD_INDEX as F, GO_TO_TABLE_LAUNCHER_DURATION_MS as le, SHOW_CLICK_TABLE_NUDGE_AFTER_MS as ce, PUZZLE_CARD_INDEX as ae, SHOW_INITIAL_COACHMARK_AFTER_MS as V, LESSON_CARD_INDEX as se, SHOW_INITIAL_TOOLTIP_AFTER_MS as de } from "./constants.js";
-import { Indicator as ue } from "./use-table-launcher-journey-styled.js";
-const He = ({
-  carouselRefs: a,
-  onTableSegmentClick: P,
-  onJourneyComplete: H
+import { jsx as r, Fragment as S } from "react/jsx-runtime";
+import { useRef as x, useCallback as C, useEffect as z } from "react";
+import Q from "../../../../../assets/line-icons/icons/carat-right.js";
+import { PLATFORM_EVENTS_STUDENT as w } from "../../../../analytics-events/platform-events-student.js";
+import { JOURNEY_ID_STUDENT as tt } from "../../../../journey/journey-id/journey-id-student.js";
+import { IndicatorType as u } from "../../../../journey/use-journey/constants.js";
+import { useJourney as et } from "../../../../journey/use-journey/use-journey.js";
+import rt from "../../../../ui/buttons/icon-button/icon-button.js";
+import { useUIContext as nt } from "../../../../ui/context/context.js";
+import P from "../../../../ui/layout/flex-view.js";
+import E from "../../../../ui/text/text.js";
+import { getTheme as ot } from "../../../../ui/theme/get-theme.js";
+import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as F } from "../../../enum/circle-onboarding-steps.js";
+import { useCircleSounds as it } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
+import { TablesCard as V } from "../../comps/tables-card/tables-card.js";
+import { GAME_LAUNCHER_ANALYTICS_EVENTS as ct } from "../../game-launcher-analytics-events.js";
+import { SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS as st, SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS as dt, START_ANIMATING_CLONED_ELEM as X, TABLE_CARD_INDEX as J, GO_TO_TABLE_LAUNCHER_DURATION_MS as lt, SHOW_CLICK_TABLE_NUDGE_AFTER_MS as ut, PUZZLE_CARD_INDEX as mt, SHOW_INITIAL_COACHMARK_AFTER_MS as K, LESSON_CARD_INDEX as at, SHOW_INITIAL_TOOLTIP_AFTER_MS as Et } from "./constants.js";
+import { Indicator as ht } from "./use-table-launcher-journey-styled.js";
+const bt = ({
+  carouselRefs: d,
+  originalTableRef: t,
+  onTableSegmentClick: H,
+  onJourneyComplete: y,
+  onNextJourney: D
 }) => {
-  const e = q.CIRCLE_TABLES_INTRO_JOURNEY, { device: X } = te(), u = X === "mobile", g = u ? "ab3-bold" : "ab2-bold", t = N(null), A = N(null), E = N([]), { playButtonSound: y } = re(), { nextCoachmark: l, setJourney: I, addCoachmark: m, endJourney: D } = z(), { onEvent: C } = ee(), R = L(
+  const e = tt.CIRCLE_TABLES_INTRO_JOURNEY, { device: j } = ot(), m = j === "mobile", h = m ? "ab3-bold" : "ab2-bold", L = x(null), p = x([]), { playButtonSound: W } = it(), { nextCoachmark: c, setJourney: f, addCoachmark: a, endJourney: R } = et(), { onEvent: I } = nt(), O = C(
     (n) => {
-      var c, o;
-      D(e), n && P(n), C(M.ONBOARDING_STEP_COMPLETED, {
-        step: x.TABLES
-      }), (c = t == null ? void 0 : t.current) == null || c.setLabelVisiblity(!0), (o = t == null ? void 0 : t.current) == null || o.stopLabelAnimation(), H(e);
+      var s, o;
+      R(e), n && H(n), I(w.ONBOARDING_STEP_COMPLETED, {
+        step: F.TABLES
+      }), (s = t == null ? void 0 : t.current) == null || s.setLabelVisiblity(!0), (o = t == null ? void 0 : t.current) == null || o.stopLabelAnimation(), y(e);
     },
-    [D, e, H, P, C]
-  ), W = L(
-    (n, c) => {
-      var h, p, _;
-      if (!((h = t.current) != null && h.segmentedCardWrapperRef.current) || !((p = t.current) != null && p.labelRef.current))
+    [
+      R,
+      e,
+      y,
+      H,
+      t,
+      I
+    ]
+  ), b = C(() => {
+    O(), D();
+  }, [O, D]), Y = C(
+    (n, s) => {
+      var _, T, A;
+      if (!((_ = t.current) != null && _.segmentedCardWrapperRef.current) || !((T = t.current) != null && T.labelRef.current))
         return;
-      const o = t.current.labelRef.current.getBoundingClientRect(), i = (_ = t.current) == null ? void 0 : _.segmentedCardWrapperRef.current.getBoundingClientRect();
-      m(e, {
+      const o = t.current.labelRef.current.getBoundingClientRect(), i = (A = t.current) == null ? void 0 : A.segmentedCardWrapperRef.current.getBoundingClientRect();
+      a(e, {
         originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
         isActive: !1,
-        type: d.TOOLTIP,
+        type: u.TOOLTIP,
         elementToHighlight: /* @__PURE__ */ r(
-          $,
+          V,
           {
-            ref: A,
-            defaultTable: c,
+            ref: L,
+            defaultTable: s,
             label: n.label,
             data: n.data,
-            onPress: R,
-            onGoBackFromTableLevel: R
+            onPress: O,
+            onGoBackFromTableLevel: b
           }
         ),
         indicator: {
           position: "top",
           backgroundColor: "YELLOW_4",
           width: 236,
-          tooltipItem: /* @__PURE__ */ r(S, { children: /* @__PURE__ */ r(T, { $renderAs: g, children: "Each table has 3 levels—clear them and earn 3 stars!" }) }),
+          tooltipItem: /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(E, { $renderAs: h, children: "Each table has 3 levels—clear them and earn 3 stars!" }) }),
           tooltipXCoOrdinates: o.width / 2,
           tooltipYCoOrdinates: 45
         }
-      }), m(e, {
+      }), a(e, {
         originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
         isActive: !1,
-        type: d.NUDGE,
+        type: u.NUDGE,
         indicator: {
           nudge: "click",
-          content: !u && /* @__PURE__ */ r(T, { $renderAs: "ab1", $color: "WHITE", children: "Pick a level" }),
+          content: !m && /* @__PURE__ */ r(E, { $renderAs: "ab1", $color: "WHITE", children: "Pick a level" }),
           nudgePointerX: i.width / 2 + 50,
           nudgePointerY: i.height * 0.4
         },
-        elementToHighlight: /* @__PURE__ */ r(O, {})
-      }), l(e, !1, oe), l(e, !0, ie);
-      const s = setTimeout(() => {
-        var f;
-        clearTimeout(s), (f = A.current) == null || f.startLabelAnimation("YELLOW_4");
-      }, w);
-      E.current.push(s);
+        elementToHighlight: /* @__PURE__ */ r(S, {})
+      }), c(e, !1, st), c(e, !0, dt);
+      const l = setTimeout(() => {
+        var g;
+        clearTimeout(l), (g = L.current) == null || g.startLabelAnimation("YELLOW_4");
+      }, X);
+      p.current.push(l);
     },
-    [m, R, u, e, l, g]
-  ), b = L(() => {
+    [
+      a,
+      b,
+      O,
+      m,
+      e,
+      c,
+      t,
+      h
+    ]
+  ), N = C(() => {
     var o;
-    y(), (o = a.current) == null || o.goToIndex(F), l(e, !1, le), C(M.ONBOARDING_STEP_VIEWED, {
-      step: x.TABLES
+    W(), (o = d.current) == null || o.goToIndex(J), c(e, !1, lt), I(w.ONBOARDING_STEP_VIEWED, {
+      step: F.TABLES
     });
     const n = setTimeout(() => {
       var i;
-      clearTimeout(n), (i = t.current) == null || i.setLabelVisiblity(!1), l(e, !0);
-    }, ce);
-    E.current.push(n);
-    const c = setTimeout(() => {
+      clearTimeout(n), (i = t.current) == null || i.setLabelVisiblity(!1), c(e, !0);
+    }, ut);
+    p.current.push(n);
+    const s = setTimeout(() => {
       var i;
-      clearTimeout(c), (i = A.current) == null || i.startLabelAnimation("YELLOW_4");
-    }, w);
-    E.current.push(c);
-  }, [a, e, l, y, C]), J = L(
-    (n, c = !1) => {
-      var _, f, Y, k, B, U, v, G;
-      const o = (_ = a.current) == null ? void 0 : _.indicatorRefs, i = (f = a.current) == null ? void 0 : f.nextBtnRef, s = o == null ? void 0 : o[F];
-      if (!((Y = t.current) != null && Y.segmentedCardWrapperRef.current) || !((k = t.current) != null && k.labelRef.current) || !o || !(i != null && i.current) || !s || !s.current)
+      clearTimeout(s), (i = L.current) == null || i.startLabelAnimation("YELLOW_4");
+    }, X);
+    p.current.push(s);
+  }, [d, e, c, t, W, I]), Z = C(
+    (n, s = !1) => {
+      var A, g, k, B, U, v, G, M, $;
+      const o = (A = d.current) == null ? void 0 : A.indicatorRefs, i = (g = d.current) == null ? void 0 : g.nextBtnRef, l = o == null ? void 0 : o[J];
+      if (!((k = t.current) != null && k.segmentedCardWrapperRef.current) || !((B = t.current) != null && B.labelRef.current) || !o || !(i != null && i.current) || !l || !l.current)
         return;
-      const h = t.current.labelRef.current.getBoundingClientRect(), p = (B = t.current) == null ? void 0 : B.segmentedCardWrapperRef.current.getBoundingClientRect();
-      c ? (I(e, [
+      const _ = (U = t.current) == null ? void 0 : U.labelRef.current.getBoundingClientRect(), T = (v = t.current) == null ? void 0 : v.segmentedCardWrapperRef.current.getBoundingClientRect();
+      s ? (f(e, [
         {
-          originalElementToHighlightRef: s,
+          originalElementToHighlightRef: l,
           isActive: !1,
-          type: d.TOOLTIP,
-          elementToHighlight: /* @__PURE__ */ r(ue, { $isActive: !1 }),
+          type: u.TOOLTIP,
+          elementToHighlight: /* @__PURE__ */ r(ht, { $isActive: !1 }),
           indicator: {
             position: "bottom",
             backgroundColor: "YELLOW_4",
             width: 52,
             tooltipItem: /* @__PURE__ */ r(
-              S,
+              P,
               {
                 $position: "absolute",
                 $flexDirection: "row",
                 style: { top: 6, left: 8, cursor: "pointer" },
-                onClick: b,
-                children: /* @__PURE__ */ r(T, { $renderAs: g, children: "NEW" })
+                onClick: N,
+                children: /* @__PURE__ */ r(E, { $renderAs: h, children: "NEW" })
               }
             ),
             tooltipYCoOrdinates: 14
@@ -124,93 +144,93 @@ const He = ({
           }
         },
         {
-          originalElementToHighlightRef: s,
+          originalElementToHighlightRef: l,
           isActive: !1,
-          type: d.NUDGE,
+          type: u.NUDGE,
           indicator: {
             nudge: "click",
             content: "",
             nudgePointerY: 20
           },
-          elementToHighlight: /* @__PURE__ */ r(O, {})
+          elementToHighlight: /* @__PURE__ */ r(S, {})
         }
-      ]), (G = a.current) == null || G.goToIndex(se), l(e, !1, V), l(e, !0, de)) : (I(e, [
+      ]), ($ = d.current) == null || $.goToIndex(at), c(e, !1, K), c(e, !0, Et)) : (f(e, [
         {
-          originalElementToHighlightRef: (U = a.current) == null ? void 0 : U.nextBtnRef,
+          originalElementToHighlightRef: (G = d.current) == null ? void 0 : G.nextBtnRef,
           isActive: !1,
-          type: d.NUDGE,
+          type: u.NUDGE,
           indicator: {
             nudge: "click",
-            content: !u && /* @__PURE__ */ r(T, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
+            content: !m && /* @__PURE__ */ r(E, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
             nudgePointerX: 0,
             nudgePointerY: 0
           },
           elementToHighlight: /* @__PURE__ */ r(
-            Q,
+            rt,
             {
               renderAs: "secondary",
-              Icon: Z,
-              onClick: b,
-              analyticsLabel: ne.JOURNEY_NEXT_ACTIVITY
+              Icon: Q,
+              onClick: N,
+              analyticsLabel: ct.JOURNEY_NEXT_ACTIVITY
             }
           )
         }
-      ]), (v = a.current) == null || v.goToIndex(ae), l(e, !1, V)), m(e, {
+      ]), (M = d.current) == null || M.goToIndex(mt), c(e, !1, K)), a(e, {
         originalElementToHighlightRef: t.current.labelRef,
         isActive: !1,
-        type: d.TOOLTIP,
-        elementToHighlight: /* @__PURE__ */ r(O, {}),
+        type: u.TOOLTIP,
+        elementToHighlight: /* @__PURE__ */ r(S, {}),
         indicator: {
           position: "top",
           backgroundColor: "YELLOW_4",
           width: 264,
-          tooltipItem: /* @__PURE__ */ r(S, { children: /* @__PURE__ */ r(T, { $renderAs: g, children: "Get faster at multiplication! Practice everyday and become a Tables champ." }) }),
-          tooltipXCoOrdinates: h.width / 2,
-          tooltipYCoOrdinates: h.height + 10
+          tooltipItem: /* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(E, { $renderAs: h, children: "Get faster at multiplication! Practice everyday and become a Tables champ." }) }),
+          tooltipXCoOrdinates: _.width / 2,
+          tooltipYCoOrdinates: _.height + 10
         }
-      }), m(e, {
+      }), a(e, {
         originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
         isActive: !1,
-        type: d.NUDGE,
+        type: u.NUDGE,
         indicator: {
           nudge: "click",
-          content: !u && /* @__PURE__ */ r(T, { $renderAs: "ab1", $color: "WHITE", children: "Pick a table to start" }),
-          nudgePointerX: p.width / 2 + 50,
-          nudgePointerY: p.height / 2
+          content: !m && /* @__PURE__ */ r(E, { $renderAs: "ab1", $color: "WHITE", children: "Pick a table to start" }),
+          nudgePointerX: T.width / 2 + 50,
+          nudgePointerY: T.height / 2
         },
         elementToHighlight: /* @__PURE__ */ r(
-          $,
+          V,
           {
-            ref: A,
+            ref: L,
             label: n.label,
             data: n.data,
             onPress: () => {
             },
-            onPressTableSegment: (K) => W(n, K)
+            onPressTableSegment: (q) => Y(n, q)
           }
         )
       });
     },
     [
-      m,
       a,
-      b,
-      W,
-      u,
+      d,
+      N,
+      Y,
+      m,
       e,
-      l,
-      I,
-      g
+      c,
+      t,
+      f,
+      h
     ]
   );
-  return j(() => () => {
-    E.current.forEach((n) => clearTimeout(n)), E.current = [];
+  return z(() => () => {
+    p.current.forEach((n) => clearTimeout(n)), p.current = [];
   }, [e]), {
-    tableRef: t,
-    startJourney: J
+    startJourney: Z
   };
 };
 export {
-  He as useTableLauncherJourney
+  bt as useTableLauncherJourney
 };
 //# sourceMappingURL=use-table-launcher-journey.js.map

package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-table-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.tsx"],"sourcesContent":["/* eslint-disable react-native/no-inline-styles */\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { ITableCardRef, ITableDetails } from '../../comps/tables-card/tables-card-types';\nimport type {\n  ITableInfo,\n  ITables,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseTableJourneyProps } from './use-table-launcher-journey-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT } from '../../../../analytics-events/platform-events-student';\nimport { JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { getTheme } from '../../../../ui/theme/get-theme';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as Action } from '../../../enum/circle-onboarding-steps';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { TablesCard } from '../../comps/tables-card/tables-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport {\n  LESSON_CARD_INDEX,\n  PUZZLE_CARD_INDEX,\n  SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS,\n  SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS,\n  TABLE_CARD_INDEX,\n} from './constants';\nimport {\n  GO_TO_TABLE_LAUNCHER_DURATION_MS,\n  SHOW_CLICK_TABLE_NUDGE_AFTER_MS,\n  SHOW_INITIAL_COACHMARK_AFTER_MS,\n  SHOW_INITIAL_TOOLTIP_AFTER_MS,\n  START_ANIMATING_CLONED_ELEM,\n} from './constants';\nimport * as S from './use-table-launcher-journey-styled';\n\nexport const useTableLauncherJourney = ({\n  carouselRefs,\n  onTableSegmentClick,\n  onJourneyComplete,\n}: IUseTableJourneyProps) => {\n  const journeyId = JOURNEY_ID_STUDENT.CIRCLE_TABLES_INTRO_JOURNEY;\n\n  const { device } = getTheme();\n  const isMobile = device === 'mobile';\n  const tooltipTextRenderAs = isMobile ? 'ab3-bold' : 'ab2-bold';\n\n  const originalTableRef = useRef<ITableCardRef>(null);\n  const highlightedTableRef = useRef<ITableCardRef>(null);\n\n  const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n  const { playButtonSound } = useCircleSounds();\n  const { nextCoachmark, setJourney, addCoachmark, endJourney } = useJourney();\n  const { onEvent: trackAnalytics } = useUIContext();\n\n  const handleEndJourney = useCallback(\n    (tableDetails?: ITableDetails) => {\n      endJourney(journeyId);\n      // Only when User clicked on play\n      if (tableDetails) {\n        onTableSegmentClick(tableDetails);\n      }\n      trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_COMPLETED, {\n        step: Action.TABLES,\n      });\n\n      // Reset original table card ref label\n      originalTableRef?.current?.setLabelVisiblity(true);\n      originalTableRef?.current?.stopLabelAnimation();\n      onJourneyComplete(journeyId);\n    },\n    [endJourney, journeyId, onJourneyComplete, onTableSegmentClick, trackAnalytics],\n  );\n\n  const handleTableSegmentClick = useCallback(\n    (launcherData: ITables, tableData: ITableInfo) => {\n      if (\n        !originalTableRef.current?.segmentedCardWrapperRef.current ||\n        !originalTableRef.current?.labelRef.current\n      ) {\n        return;\n      }\n\n      const segmentedCardDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n      const tableCardDims =\n        originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n      addCoachmark(journeyId, {\n        originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n        isActive: false,\n        type: IndicatorType.TOOLTIP,\n        elementToHighlight: (\n          <TablesCard\n            ref={highlightedTableRef}\n            defaultTable={tableData}\n            label={launcherData.label}\n            data={launcherData.data}\n            onPress={handleEndJourney}\n            onGoBackFromTableLevel={handleEndJourney}\n          />\n        ),\n        indicator: {\n          position: 'top',\n          backgroundColor: 'YELLOW_4',\n          width: 236,\n          tooltipItem: (\n            <FlexView>\n              <Text $renderAs={tooltipTextRenderAs}>\n                Each table has 3 levels—clear them and earn 3 stars!\n              </Text>\n            </FlexView>\n          ),\n          tooltipXCoOrdinates: segmentedCardDims.width / 2,\n          tooltipYCoOrdinates: 45,\n        } as IArrowTooltipProps,\n      });\n\n      addCoachmark(journeyId, {\n        originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n        isActive: false,\n        type: IndicatorType.NUDGE,\n        indicator: {\n          nudge: 'click',\n          content: !isMobile && (\n            <Text $renderAs=\"ab1\" $color=\"WHITE\">\n              Pick a level\n            </Text>\n          ),\n          nudgePointerX: tableCardDims.width / 2 + 50,\n          nudgePointerY: tableCardDims.height * 0.4,\n        } as INudgeProps,\n        elementToHighlight: <></>,\n      });\n\n      nextCoachmark(journeyId, false, SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS); // Show coachmark => Each table has 3... and Hide the previous two\n      nextCoachmark(journeyId, true, SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS); // Show nudge => Pick a level\n\n      const startAnimationOnLabelAgain = setTimeout(() => {\n        clearTimeout(startAnimationOnLabelAgain);\n        highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n      }, START_ANIMATING_CLONED_ELEM);\n\n      timerRefs.current.push(startAnimationOnLabelAgain);\n    },\n    [addCoachmark, handleEndJourney, isMobile, journeyId, nextCoachmark, tooltipTextRenderAs],\n  );\n\n  const goToTableLauncher = useCallback(() => {\n    playButtonSound();\n    carouselRefs.current?.goToIndex(TABLE_CARD_INDEX);\n    nextCoachmark(journeyId, false, GO_TO_TABLE_LAUNCHER_DURATION_MS);\n\n    trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_VIEWED, {\n      step: Action.TABLES,\n    });\n\n    const showNudge = setTimeout(() => {\n      clearTimeout(showNudge);\n      originalTableRef.current?.setLabelVisiblity(false);\n      nextCoachmark(journeyId, true);\n    }, SHOW_CLICK_TABLE_NUDGE_AFTER_MS);\n\n    timerRefs.current.push(showNudge);\n\n    const animateLabel = setTimeout(() => {\n      clearTimeout(animateLabel);\n      highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n    }, START_ANIMATING_CLONED_ELEM);\n\n    timerRefs.current.push(animateLabel);\n  }, [carouselRefs, journeyId, nextCoachmark, playButtonSound, trackAnalytics]);\n\n  const startJourney = useCallback(\n    (tablesData: ITables, isTutorialOnboardingDone: boolean = false) => {\n      const paginationList = carouselRefs.current?.indicatorRefs;\n      const carouselNextBtnRef = carouselRefs.current?.nextBtnRef;\n      const tablePaginationRef = paginationList?.[TABLE_CARD_INDEX];\n\n      if (\n        !originalTableRef.current?.segmentedCardWrapperRef.current ||\n        !originalTableRef.current?.labelRef.current ||\n        !paginationList ||\n        !carouselNextBtnRef?.current ||\n        !tablePaginationRef ||\n        !tablePaginationRef.current\n      ) {\n        return;\n      }\n\n      const labelDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n      const tableCardDims =\n        originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n      // TAKE THE USER TO THE TABLE CARD\n      if (!isTutorialOnboardingDone) {\n        setJourney(journeyId, [\n          {\n            originalElementToHighlightRef: carouselRefs.current?.nextBtnRef,\n            isActive: false,\n            type: IndicatorType.NUDGE,\n            indicator: {\n              nudge: 'click',\n              content: !isMobile && (\n                <Text $renderAs=\"ab1\" $color=\"WHITE\">\n                  Click to proceed\n                </Text>\n              ),\n              nudgePointerX: 0,\n              nudgePointerY: 0,\n            } as INudgeProps,\n            elementToHighlight: (\n              <IconButton\n                renderAs=\"secondary\"\n                Icon={CaratRightIcon}\n                onClick={goToTableLauncher}\n                analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n              />\n            ),\n          },\n        ]);\n        carouselRefs.current?.goToIndex(PUZZLE_CARD_INDEX);\n        nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show nudge => Click to proceed\n      } else {\n        setJourney(journeyId, [\n          {\n            originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n            isActive: false,\n            type: IndicatorType.TOOLTIP,\n            elementToHighlight: <S.Indicator $isActive={false} />,\n            indicator: {\n              position: 'bottom',\n              backgroundColor: 'YELLOW_4',\n              width: 52,\n              tooltipItem: (\n                <FlexView\n                  $position=\"absolute\"\n                  $flexDirection=\"row\"\n                  style={{ top: 6, left: 8, cursor: 'pointer' }}\n                  onClick={goToTableLauncher}\n                >\n                  <Text $renderAs={tooltipTextRenderAs}>NEW</Text>\n                </FlexView>\n              ),\n              tooltipYCoOrdinates: 14, // Need some offset in Y direction from top\n            } as IArrowTooltipProps,\n          },\n          {\n            originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n            isActive: false,\n            type: IndicatorType.NUDGE,\n            indicator: {\n              nudge: 'click',\n              content: '',\n              nudgePointerY: 20,\n            } as INudgeProps,\n            elementToHighlight: <></>,\n          },\n        ]);\n        carouselRefs.current?.goToIndex(LESSON_CARD_INDEX);\n        nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show Coachmark => NEW\n        nextCoachmark(journeyId, true, SHOW_INITIAL_TOOLTIP_AFTER_MS); // Show Nudge over Coachmark\n      }\n\n      // SHOW THE USER SELECT A TABLE\n      addCoachmark(journeyId, {\n        originalElementToHighlightRef: originalTableRef.current.labelRef,\n        isActive: false,\n        type: IndicatorType.TOOLTIP,\n        elementToHighlight: <></>,\n        indicator: {\n          position: 'top',\n          backgroundColor: 'YELLOW_4',\n          width: 264,\n          tooltipItem: (\n            <FlexView>\n              <Text $renderAs={tooltipTextRenderAs}>\n                Get faster at multiplication! Practice everyday and become a Tables champ.\n              </Text>\n            </FlexView>\n          ),\n          tooltipXCoOrdinates: labelDims.width / 2,\n          tooltipYCoOrdinates: labelDims.height + 10,\n        } as IArrowTooltipProps,\n      });\n\n      addCoachmark(journeyId, {\n        originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n        isActive: false,\n        type: IndicatorType.NUDGE,\n        indicator: {\n          nudge: 'click',\n          content: !isMobile && (\n            <Text $renderAs=\"ab1\" $color=\"WHITE\">\n              {'Pick a table to start'}\n            </Text>\n          ),\n          nudgePointerX: tableCardDims.width / 2 + 50,\n          nudgePointerY: tableCardDims.height / 2,\n        } as INudgeProps,\n        elementToHighlight: (\n          <TablesCard\n            ref={highlightedTableRef}\n            label={tablesData.label}\n            data={tablesData.data}\n            onPress={() => {}}\n            onPressTableSegment={tableInfo => handleTableSegmentClick(tablesData, tableInfo)}\n          />\n        ),\n      });\n    },\n    [\n      addCoachmark,\n      carouselRefs,\n      goToTableLauncher,\n      handleTableSegmentClick,\n      isMobile,\n      journeyId,\n      nextCoachmark,\n      setJourney,\n      tooltipTextRenderAs,\n    ],\n  );\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      timerRefs.current.forEach(timer => clearTimeout(timer));\n      timerRefs.current = [];\n    };\n  }, [journeyId]);\n\n  return {\n    tableRef: originalTableRef,\n    startJourney,\n  };\n};\n"],"names":["useTableLauncherJourney","carouselRefs","onTableSegmentClick","onJourneyComplete","journeyId","JOURNEY_ID_STUDENT","device","getTheme","isMobile","tooltipTextRenderAs","originalTableRef","useRef","highlightedTableRef","timerRefs","playButtonSound","useCircleSounds","nextCoachmark","setJourney","addCoachmark","endJourney","useJourney","trackAnalytics","useUIContext","handleEndJourney","useCallback","tableDetails","PLATFORM_EVENTS_STUDENT","Action","_a","_b","handleTableSegmentClick","launcherData","tableData","segmentedCardDims","tableCardDims","_c","IndicatorType","jsx","TablesCard","FlexView","Text","Fragment","SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS","SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS","startAnimationOnLabelAgain","START_ANIMATING_CLONED_ELEM","goToTableLauncher","TABLE_CARD_INDEX","GO_TO_TABLE_LAUNCHER_DURATION_MS","showNudge","SHOW_CLICK_TABLE_NUDGE_AFTER_MS","animateLabel","startJourney","tablesData","isTutorialOnboardingDone","paginationList","carouselNextBtnRef","tablePaginationRef","_d","labelDims","_e","S.Indicator","_h","LESSON_CARD_INDEX","SHOW_INITIAL_COACHMARK_AFTER_MS","SHOW_INITIAL_TOOLTIP_AFTER_MS","_f","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","_g","PUZZLE_CARD_INDEX","tableInfo","useEffect","timer"],"mappings":"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"}
+{"version":3,"file":"use-table-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.tsx"],"sourcesContent":["/* eslint-disable react-native/no-inline-styles */\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { ITableCardRef, ITableDetails } from '../../comps/tables-card/tables-card-types';\nimport type {\n  ITableInfo,\n  ITables,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseTableJourneyProps } from './use-table-launcher-journey-types';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT } from '../../../../analytics-events/platform-events-student';\nimport { JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { getTheme } from '../../../../ui/theme/get-theme';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as Action } from '../../../enum/circle-onboarding-steps';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { TablesCard } from '../../comps/tables-card/tables-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport {\n  LESSON_CARD_INDEX,\n  PUZZLE_CARD_INDEX,\n  SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS,\n  SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS,\n  TABLE_CARD_INDEX,\n} from './constants';\nimport {\n  GO_TO_TABLE_LAUNCHER_DURATION_MS,\n  SHOW_CLICK_TABLE_NUDGE_AFTER_MS,\n  SHOW_INITIAL_COACHMARK_AFTER_MS,\n  SHOW_INITIAL_TOOLTIP_AFTER_MS,\n  START_ANIMATING_CLONED_ELEM,\n} from './constants';\nimport * as S from './use-table-launcher-journey-styled';\n\nexport const useTableLauncherJourney = ({\n  carouselRefs,\n  originalTableRef,\n  onTableSegmentClick,\n  onJourneyComplete,\n  onNextJourney,\n}: IUseTableJourneyProps) => {\n  const journeyId = JOURNEY_ID_STUDENT.CIRCLE_TABLES_INTRO_JOURNEY;\n\n  const { device } = getTheme();\n  const isMobile = device === 'mobile';\n  const tooltipTextRenderAs = isMobile ? 'ab3-bold' : 'ab2-bold';\n\n  const highlightedTableRef = useRef<ITableCardRef>(null);\n\n  const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n  const { playButtonSound } = useCircleSounds();\n  const { nextCoachmark, setJourney, addCoachmark, endJourney } = useJourney();\n  const { onEvent: trackAnalytics } = useUIContext();\n\n  const handleEndJourney = useCallback(\n    (tableDetails?: ITableDetails) => {\n      endJourney(journeyId);\n      // Only when User clicked on play\n      if (tableDetails) {\n        onTableSegmentClick(tableDetails);\n      }\n      trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_COMPLETED, {\n        step: Action.TABLES,\n      });\n\n      // Reset original table card ref label\n      originalTableRef?.current?.setLabelVisiblity(true);\n      originalTableRef?.current?.stopLabelAnimation();\n      onJourneyComplete(journeyId);\n    },\n    [\n      endJourney,\n      journeyId,\n      onJourneyComplete,\n      onTableSegmentClick,\n      originalTableRef,\n      trackAnalytics,\n    ],\n  );\n\n  const handleContinueJourney = useCallback(() => {\n    handleEndJourney();\n    onNextJourney();\n  }, [handleEndJourney, onNextJourney]);\n\n  const handleTableSegmentClick = useCallback(\n    (launcherData: ITables, tableData: ITableInfo) => {\n      if (\n        !originalTableRef.current?.segmentedCardWrapperRef.current ||\n        !originalTableRef.current?.labelRef.current\n      ) {\n        return;\n      }\n\n      const segmentedCardDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n      const tableCardDims =\n        originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n      addCoachmark(journeyId, {\n        originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n        isActive: false,\n        type: IndicatorType.TOOLTIP,\n        elementToHighlight: (\n          <TablesCard\n            ref={highlightedTableRef}\n            defaultTable={tableData}\n            label={launcherData.label}\n            data={launcherData.data}\n            onPress={handleEndJourney}\n            onGoBackFromTableLevel={handleContinueJourney}\n          />\n        ),\n        indicator: {\n          position: 'top',\n          backgroundColor: 'YELLOW_4',\n          width: 236,\n          tooltipItem: (\n            <FlexView>\n              <Text $renderAs={tooltipTextRenderAs}>\n                Each table has 3 levels—clear them and earn 3 stars!\n              </Text>\n            </FlexView>\n          ),\n          tooltipXCoOrdinates: segmentedCardDims.width / 2,\n          tooltipYCoOrdinates: 45,\n        } as IArrowTooltipProps,\n      });\n\n      addCoachmark(journeyId, {\n        originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n        isActive: false,\n        type: IndicatorType.NUDGE,\n        indicator: {\n          nudge: 'click',\n          content: !isMobile && (\n            <Text $renderAs=\"ab1\" $color=\"WHITE\">\n              Pick a level\n            </Text>\n          ),\n          nudgePointerX: tableCardDims.width / 2 + 50,\n          nudgePointerY: tableCardDims.height * 0.4,\n        } as INudgeProps,\n        elementToHighlight: <></>,\n      });\n\n      nextCoachmark(journeyId, false, SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS); // Show coachmark => Each table has 3... and Hide the previous two\n      nextCoachmark(journeyId, true, SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS); // Show nudge => Pick a level\n\n      const startAnimationOnLabelAgain = setTimeout(() => {\n        clearTimeout(startAnimationOnLabelAgain);\n        highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n      }, START_ANIMATING_CLONED_ELEM);\n\n      timerRefs.current.push(startAnimationOnLabelAgain);\n    },\n    [\n      addCoachmark,\n      handleContinueJourney,\n      handleEndJourney,\n      isMobile,\n      journeyId,\n      nextCoachmark,\n      originalTableRef,\n      tooltipTextRenderAs,\n    ],\n  );\n\n  const goToTableLauncher = useCallback(() => {\n    playButtonSound();\n    carouselRefs.current?.goToIndex(TABLE_CARD_INDEX);\n    nextCoachmark(journeyId, false, GO_TO_TABLE_LAUNCHER_DURATION_MS);\n\n    trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_VIEWED, {\n      step: Action.TABLES,\n    });\n\n    const showNudge = setTimeout(() => {\n      clearTimeout(showNudge);\n      originalTableRef.current?.setLabelVisiblity(false);\n      nextCoachmark(journeyId, true);\n    }, SHOW_CLICK_TABLE_NUDGE_AFTER_MS);\n\n    timerRefs.current.push(showNudge);\n\n    const animateLabel = setTimeout(() => {\n      clearTimeout(animateLabel);\n      highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n    }, START_ANIMATING_CLONED_ELEM);\n\n    timerRefs.current.push(animateLabel);\n  }, [carouselRefs, journeyId, nextCoachmark, originalTableRef, playButtonSound, trackAnalytics]);\n\n  const startJourney = useCallback(\n    (tablesData: ITables, isTutorialOnboardingDone: boolean = false) => {\n      const paginationList = carouselRefs.current?.indicatorRefs;\n      const carouselNextBtnRef = carouselRefs.current?.nextBtnRef;\n      const tablePaginationRef = paginationList?.[TABLE_CARD_INDEX];\n\n      if (\n        !originalTableRef.current?.segmentedCardWrapperRef.current ||\n        !originalTableRef.current?.labelRef.current ||\n        !paginationList ||\n        !carouselNextBtnRef?.current ||\n        !tablePaginationRef ||\n        !tablePaginationRef.current\n      ) {\n        return;\n      }\n\n      const labelDims = originalTableRef.current?.labelRef.current.getBoundingClientRect();\n      const tableCardDims =\n        originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n      // TAKE THE USER TO THE TABLE CARD\n      if (!isTutorialOnboardingDone) {\n        setJourney(journeyId, [\n          {\n            originalElementToHighlightRef: carouselRefs.current?.nextBtnRef,\n            isActive: false,\n            type: IndicatorType.NUDGE,\n            indicator: {\n              nudge: 'click',\n              content: !isMobile && (\n                <Text $renderAs=\"ab1\" $color=\"WHITE\">\n                  Click to proceed\n                </Text>\n              ),\n              nudgePointerX: 0,\n              nudgePointerY: 0,\n            } as INudgeProps,\n            elementToHighlight: (\n              <IconButton\n                renderAs=\"secondary\"\n                Icon={CaratRightIcon}\n                onClick={goToTableLauncher}\n                analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n              />\n            ),\n          },\n        ]);\n        carouselRefs.current?.goToIndex(PUZZLE_CARD_INDEX);\n        nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show nudge => Click to proceed\n      } else {\n        setJourney(journeyId, [\n          {\n            originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n            isActive: false,\n            type: IndicatorType.TOOLTIP,\n            elementToHighlight: <S.Indicator $isActive={false} />,\n            indicator: {\n              position: 'bottom',\n              backgroundColor: 'YELLOW_4',\n              width: 52,\n              tooltipItem: (\n                <FlexView\n                  $position=\"absolute\"\n                  $flexDirection=\"row\"\n                  style={{ top: 6, left: 8, cursor: 'pointer' }}\n                  onClick={goToTableLauncher}\n                >\n                  <Text $renderAs={tooltipTextRenderAs}>NEW</Text>\n                </FlexView>\n              ),\n              tooltipYCoOrdinates: 14, // Need some offset in Y direction from top\n            } as IArrowTooltipProps,\n          },\n          {\n            originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n            isActive: false,\n            type: IndicatorType.NUDGE,\n            indicator: {\n              nudge: 'click',\n              content: '',\n              nudgePointerY: 20,\n            } as INudgeProps,\n            elementToHighlight: <></>,\n          },\n        ]);\n        carouselRefs.current?.goToIndex(LESSON_CARD_INDEX);\n        nextCoachmark(journeyId, false, SHOW_INITIAL_COACHMARK_AFTER_MS); // Show Coachmark => NEW\n        nextCoachmark(journeyId, true, SHOW_INITIAL_TOOLTIP_AFTER_MS); // Show Nudge over Coachmark\n      }\n\n      // SHOW THE USER SELECT A TABLE\n      addCoachmark(journeyId, {\n        originalElementToHighlightRef: originalTableRef.current.labelRef,\n        isActive: false,\n        type: IndicatorType.TOOLTIP,\n        elementToHighlight: <></>,\n        indicator: {\n          position: 'top',\n          backgroundColor: 'YELLOW_4',\n          width: 264,\n          tooltipItem: (\n            <FlexView>\n              <Text $renderAs={tooltipTextRenderAs}>\n                Get faster at multiplication! Practice everyday and become a Tables champ.\n              </Text>\n            </FlexView>\n          ),\n          tooltipXCoOrdinates: labelDims.width / 2,\n          tooltipYCoOrdinates: labelDims.height + 10,\n        } as IArrowTooltipProps,\n      });\n\n      addCoachmark(journeyId, {\n        originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n        isActive: false,\n        type: IndicatorType.NUDGE,\n        indicator: {\n          nudge: 'click',\n          content: !isMobile && (\n            <Text $renderAs=\"ab1\" $color=\"WHITE\">\n              {'Pick a table to start'}\n            </Text>\n          ),\n          nudgePointerX: tableCardDims.width / 2 + 50,\n          nudgePointerY: tableCardDims.height / 2,\n        } as INudgeProps,\n        elementToHighlight: (\n          <TablesCard\n            ref={highlightedTableRef}\n            label={tablesData.label}\n            data={tablesData.data}\n            onPress={() => {}}\n            onPressTableSegment={tableInfo => handleTableSegmentClick(tablesData, tableInfo)}\n          />\n        ),\n      });\n    },\n    [\n      addCoachmark,\n      carouselRefs,\n      goToTableLauncher,\n      handleTableSegmentClick,\n      isMobile,\n      journeyId,\n      nextCoachmark,\n      originalTableRef,\n      setJourney,\n      tooltipTextRenderAs,\n    ],\n  );\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      timerRefs.current.forEach(timer => clearTimeout(timer));\n      timerRefs.current = [];\n    };\n  }, [journeyId]);\n\n  return {\n    startJourney,\n  };\n};\n"],"names":["useTableLauncherJourney","carouselRefs","originalTableRef","onTableSegmentClick","onJourneyComplete","onNextJourney","journeyId","JOURNEY_ID_STUDENT","device","getTheme","isMobile","tooltipTextRenderAs","highlightedTableRef","useRef","timerRefs","playButtonSound","useCircleSounds","nextCoachmark","setJourney","addCoachmark","endJourney","useJourney","trackAnalytics","useUIContext","handleEndJourney","useCallback","tableDetails","PLATFORM_EVENTS_STUDENT","Action","_a","_b","handleContinueJourney","handleTableSegmentClick","launcherData","tableData","segmentedCardDims","tableCardDims","_c","IndicatorType","jsx","TablesCard","FlexView","Text","Fragment","SHOW_PICK_A_LEVEL_TOOLTIP_AFTER_MS","SHOW_PICK_A_LEVEL_NUDGE_AFTER_MS","startAnimationOnLabelAgain","START_ANIMATING_CLONED_ELEM","goToTableLauncher","TABLE_CARD_INDEX","GO_TO_TABLE_LAUNCHER_DURATION_MS","showNudge","SHOW_CLICK_TABLE_NUDGE_AFTER_MS","animateLabel","startJourney","tablesData","isTutorialOnboardingDone","paginationList","carouselNextBtnRef","tablePaginationRef","_d","labelDims","_e","_f","S.Indicator","_i","LESSON_CARD_INDEX","SHOW_INITIAL_COACHMARK_AFTER_MS","SHOW_INITIAL_TOOLTIP_AFTER_MS","_g","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","_h","PUZZLE_CARD_INDEX","tableInfo","useEffect","timer"],"mappings":"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"}