@cuemath/leap 3.5.30-gg5 → 3.5.30-j2

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 {\n  type ForwardRefRenderFunction,\n  memo,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  forwardRef,\n  useImperativeHandle,\n  createRef,\n} from 'react';\nimport { type AnimationEventName } from 'lottie-web';\n\nimport useClickHandler from '../../../../ui/hooks/use-click-handler';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport * as Styled from './carousel-styled';\nimport type { ICarouselProps, ICarouselRefs } from './carousel-types';\nimport SwipeableComponent from '../swipable-component/swipeable-component';\nimport { CarouselIndicator } from './carousel-indicator/carousel-indicator';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport { allGreenTickLottienAimationSettings } from './constants';\nimport { CircleSoundKey } from '../../../hooks/use-circle-sounds/use-circle-sounds-enums';\n\nconst CarouselComponent: ForwardRefRenderFunction<ICarouselRefs, ICarouselProps> = (\n  {\n    items,\n    defaultIndex = 0,\n    analyticsSwipeLeft,\n    analyticsSwipeRight,\n    analyticsIndicatorClick,\n    playAllGreenTickAnimation,\n    onAllGreenTickAnimationComplete,\n  },\n  ref,\n) => {\n  const { playSwipeSound, play } = useCircleSounds();\n  const isFirstMount = useRef(true);\n  const [currIndex, setCurrIndex] = useState(defaultIndex);\n  const [playAllGreenTickAnimationLottie, setPlayAllGreenTickAnimationLottie] = useState(false);\n\n  const { handleClick: handlePrevClick } = useClickHandler(\n    {\n      analyticsLabel: analyticsSwipeRight.analyticsLabel,\n      analyticsProps: analyticsSwipeRight.analyticsProps,\n    },\n    () =>\n      setCurrIndex(prev => {\n        if (prev <= 0) return 0;\n\n        return prev - 1;\n      }),\n  );\n\n  const { handleClick: handleNextClick } = useClickHandler(\n    {\n      analyticsLabel: analyticsSwipeLeft.analyticsLabel,\n      analyticsProps: analyticsSwipeLeft.analyticsProps,\n    },\n    () =>\n      setCurrIndex(prev => {\n        if (prev >= items.length - 1) return prev;\n\n        return prev + 1;\n      }),\n  );\n\n  const { handleClick: handleItemClick } = useClickHandler({\n    analyticsLabel: analyticsIndicatorClick.analyticsLabel,\n    analyticsProps: analyticsIndicatorClick.analyticsProps,\n  });\n\n  const onAllGreenTickLottieAnimationComplete = useCallback(() => {\n    setPlayAllGreenTickAnimationLottie(false);\n    onAllGreenTickAnimationComplete?.();\n  }, [onAllGreenTickAnimationComplete]);\n\n  const allGreenTickAnimationEvent = useMemo(\n    () => ({\n      name: 'complete' as AnimationEventName,\n      callback: onAllGreenTickLottieAnimationComplete,\n    }),\n    [onAllGreenTickLottieAnimationComplete],\n  );\n\n  const indicatorRefs = useMemo(() => items.map(() => createRef<HTMLDivElement>()), [items]);\n\n  const handleCarouselIndicatorClick = useCallback(\n    (index: number) => {\n      playSwipeSound();\n      handleItemClick();\n      setCurrIndex(index);\n    },\n    [handleItemClick, playSwipeSound],\n  );\n\n  useImperativeHandle(ref, () => ({\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  useEffect(() => {\n    setCurrIndex(defaultIndex);\n  }, [defaultIndex]);\n\n  useEffect(() => {\n    const playAnimation = items.every(item => item.indicatorType === 'green-tick');\n\n    if (playAllGreenTickAnimation && playAnimation) {\n      play(CircleSoundKey.ALL_ACTIVITIES_COMPLETE);\n      setPlayAllGreenTickAnimationLottie(true);\n    }\n  }, [playAllGreenTickAnimation, play, items]);\n\n  return (\n    <SwipeableComponent onSwipeLeft={handleNextClick} onSwipeRight={handlePrevClick}>\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.element}</Styled.CarouselItemContainer>\n          ))}\n        </Styled.CarouselWrapper>\n        {items.length > 1 && (\n          <Styled.ExtendedFlexView\n            $flexDirection=\"row\"\n            $alignItems=\"center\"\n            $justifyContent=\"center\"\n            $position=\"absolute\"\n          >\n            <Styled.CarouselIdicatorContainer>\n              {playAllGreenTickAnimationLottie && (\n                <Styled.AllGreenTickLottieWrapper>\n                  <LottieAnimation\n                    src={LOTTIE.DAILY_WORK_OUT_COMPLETE}\n                    settings={allGreenTickLottienAimationSettings}\n                    eventListener={allGreenTickAnimationEvent}\n                  />\n                </Styled.AllGreenTickLottieWrapper>\n              )}\n              {items.map((item, index) => (\n                <CarouselIndicator\n                  ref={indicatorRefs[index]}\n                  key={index}\n                  indicatorType={item.indicatorType}\n                  isActive={index === currIndex}\n                  textToShowInsideIndicator={(index + 1).toString()}\n                  onClick={() => handleCarouselIndicatorClick(index)}\n                />\n              ))}\n            </Styled.CarouselIdicatorContainer>\n          </Styled.ExtendedFlexView>\n        )}\n      </Styled.Carousel>\n    </SwipeableComponent>\n  );\n};\n\nexport const Carousel = memo(forwardRef(CarouselComponent));\n"],"names":["CarouselComponent","items","defaultIndex","analyticsSwipeLeft","analyticsSwipeRight","analyticsIndicatorClick","playAllGreenTickAnimation","onAllGreenTickAnimationComplete","ref","playSwipeSound","play","useCircleSounds","isFirstMount","useRef","currIndex","setCurrIndex","useState","playAllGreenTickAnimationLottie","setPlayAllGreenTickAnimationLottie","handlePrevClick","useClickHandler","prev","handleNextClick","handleItemClick","onAllGreenTickLottieAnimationComplete","useCallback","allGreenTickAnimationEvent","useMemo","indicatorRefs","createRef","handleCarouselIndicatorClick","index","useImperativeHandle","useEffect","playAnimation","item","CircleSoundKey","jsx","SwipeableComponent","jsxs","Styled.Carousel","Styled.CarouselWrapper","Styled.CarouselItemContainer","Styled.ExtendedFlexView","Styled.CarouselIdicatorContainer","Styled.AllGreenTickLottieWrapper","LottieAnimation","LOTTIE","allGreenTickLottienAimationSettings","CarouselIndicator","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 {\n  type ForwardRefRenderFunction,\n  memo,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  forwardRef,\n  useImperativeHandle,\n  createRef,\n} from 'react';\nimport { type AnimationEventName } from 'lottie-web';\n\nimport useClickHandler from '../../../../ui/hooks/use-click-handler';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport * as Styled from './carousel-styled';\nimport type { ICarouselProps, ICarouselRefs } from './carousel-types';\nimport { CarouselIndicator } from './carousel-indicator/carousel-indicator';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport { allGreenTickLottienAimationSettings } from './constants';\nimport { CircleSoundKey } from '../../../hooks/use-circle-sounds/use-circle-sounds-enums';\nimport type { ISwipableCarouselRefs } from '../../../../ui/swipable-carousel/swipable-carousel-types';\nimport SwipableCarousel from '../../../../ui/swipable-carousel/swipable-carousel';\n\nconst CarouselComponent: ForwardRefRenderFunction<ICarouselRefs, ICarouselProps> = (\n  {\n    items,\n    defaultIndex = 0,\n    analyticsSwipeLeft,\n    analyticsSwipeRight,\n    analyticsIndicatorClick,\n    playAllGreenTickAnimation,\n    onAllGreenTickAnimationComplete,\n  },\n  ref,\n) => {\n  const { playSwipeSound, play } = useCircleSounds();\n  const isFirstMount = useRef(true);\n  const carousalRef = useRef<ISwipableCarouselRefs>(null);\n  const [currIndex, setCurrIndex] = useState(carousalRef.current?.currentIndex ?? defaultIndex);\n  const [playAllGreenTickAnimationLottie, setPlayAllGreenTickAnimationLottie] = useState(false);\n\n  const { handleClick: handlePrevClick } = useClickHandler({\n    analyticsLabel: analyticsSwipeRight.analyticsLabel,\n    analyticsProps: analyticsSwipeRight.analyticsProps,\n  });\n\n  const { handleClick: handleNextClick } = useClickHandler({\n    analyticsLabel: analyticsSwipeLeft.analyticsLabel,\n    analyticsProps: analyticsSwipeLeft.analyticsProps,\n  });\n\n  const { handleClick: handleItemClick } = useClickHandler({\n    analyticsLabel: analyticsIndicatorClick.analyticsLabel,\n    analyticsProps: analyticsIndicatorClick.analyticsProps,\n  });\n\n  const onAllGreenTickLottieAnimationComplete = useCallback(() => {\n    setPlayAllGreenTickAnimationLottie(false);\n    onAllGreenTickAnimationComplete?.();\n  }, [onAllGreenTickAnimationComplete]);\n\n  const allGreenTickAnimationEvent = useMemo(\n    () => ({\n      name: 'complete' as AnimationEventName,\n      callback: onAllGreenTickLottieAnimationComplete,\n    }),\n    [onAllGreenTickLottieAnimationComplete],\n  );\n\n  const indicatorRefs = useMemo(() => items.map(() => createRef<HTMLDivElement>()), [items]);\n\n  const goToIndex = useCallback(\n    (index: number) => {\n      if (index < 0 || index >= items.length || index === currIndex) return;\n      carousalRef.current?.goToIndex(index);\n      setCurrIndex(index);\n    },\n    [currIndex, items.length],\n  );\n\n  const handleCarouselIndicatorClick = useCallback(\n    (index: number) => {\n      playSwipeSound();\n      handleItemClick();\n      setCurrIndex(index);\n      goToIndex(index);\n    },\n    [handleItemClick, playSwipeSound],\n  );\n\n  useImperativeHandle(ref, () => ({\n    indicatorRefs,\n    currentIndex: currIndex,\n    goToIndex,\n  }));\n\n  useEffect(() => {\n    if (isFirstMount.current) {\n      isFirstMount.current = false;\n    }\n  }, []);\n\n  useEffect(() => {\n    setCurrIndex(carousalRef.current?.currentIndex ?? defaultIndex);\n  }, [defaultIndex]);\n\n  useEffect(() => {\n    const playAnimation = items.every(item => item.indicatorType === 'green-tick');\n\n    if (playAllGreenTickAnimation && playAnimation) {\n      play(CircleSoundKey.ALL_ACTIVITIES_COMPLETE);\n      setPlayAllGreenTickAnimationLottie(true);\n    }\n  }, [playAllGreenTickAnimation, play, items]);\n\n  return (\n    <SwipableCarousel\n      ref={carousalRef}\n      items={items.map((item, index) => (\n        <Styled.CarouselItemContainer key={index}>{item.element}</Styled.CarouselItemContainer>\n      ))}\n      defaultIndex={defaultIndex}\n      transitionDuration={isFirstMount.current ? 0 : 300}\n      onSwipeLeft={handleNextClick}\n      onSwipeRight={handlePrevClick}\n    >\n      {items.length > 1 && (\n        <Styled.ExtendedFlexView\n          $flexDirection=\"row\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $position=\"absolute\"\n        >\n          <Styled.CarouselIdicatorContainer>\n            {playAllGreenTickAnimationLottie && (\n              <Styled.AllGreenTickLottieWrapper>\n                <LottieAnimation\n                  src={LOTTIE.DAILY_WORK_OUT_COMPLETE}\n                  settings={allGreenTickLottienAimationSettings}\n                  eventListener={allGreenTickAnimationEvent}\n                />\n              </Styled.AllGreenTickLottieWrapper>\n            )}\n            {items.map((item, index) => (\n              <CarouselIndicator\n                ref={indicatorRefs[index]}\n                key={index}\n                indicatorType={item.indicatorType}\n                isActive={index === currIndex}\n                textToShowInsideIndicator={(index + 1).toString()}\n                onClick={() => handleCarouselIndicatorClick(index)}\n              />\n            ))}\n          </Styled.CarouselIdicatorContainer>\n        </Styled.ExtendedFlexView>\n      )}\n    </SwipableCarousel>\n  );\n};\n\nexport const Carousel = memo(forwardRef(CarouselComponent));\n"],"names":["CarouselComponent","items","defaultIndex","analyticsSwipeLeft","analyticsSwipeRight","analyticsIndicatorClick","playAllGreenTickAnimation","onAllGreenTickAnimationComplete","ref","playSwipeSound","play","useCircleSounds","isFirstMount","useRef","carousalRef","currIndex","setCurrIndex","useState","_a","playAllGreenTickAnimationLottie","setPlayAllGreenTickAnimationLottie","handlePrevClick","useClickHandler","handleNextClick","handleItemClick","onAllGreenTickLottieAnimationComplete","useCallback","allGreenTickAnimationEvent","useMemo","indicatorRefs","createRef","goToIndex","index","handleCarouselIndicatorClick","useImperativeHandle","useEffect","playAnimation","item","CircleSoundKey","jsx","SwipableCarousel","Styled.CarouselItemContainer","Styled.ExtendedFlexView","jsxs","Styled.CarouselIdicatorContainer","Styled.AllGreenTickLottieWrapper","LottieAnimation","LOTTIE","allGreenTickLottienAimationSettings","CarouselIndicator","Carousel","memo","forwardRef"],"mappings":";;;;;;;;;;;AA0BA,MAAMA,IAA6E,CACjF;AAAA,EACE,OAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,oBAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,yBAAAC;AAAA,EACA,2BAAAC;AAAA,EACA,iCAAAC;AACF,GACAC,MACG;;AACH,QAAM,EAAE,gBAAAC,GAAgB,MAAAC,EAAK,IAAIC,EAAgB,GAC3CC,IAAeC,EAAO,EAAI,GAC1BC,IAAcD,EAA8B,IAAI,GAChD,CAACE,GAAWC,CAAY,IAAIC,IAASC,IAAAJ,EAAY,YAAZ,gBAAAI,EAAqB,iBAAgBhB,CAAY,GACtF,CAACiB,GAAiCC,CAAkC,IAAIH,EAAS,EAAK,GAEtF,EAAE,aAAaI,EAAgB,IAAIC,EAAgB;AAAA,IACvD,gBAAgBlB,EAAoB;AAAA,IACpC,gBAAgBA,EAAoB;AAAA,EAAA,CACrC,GAEK,EAAE,aAAamB,EAAgB,IAAID,EAAgB;AAAA,IACvD,gBAAgBnB,EAAmB;AAAA,IACnC,gBAAgBA,EAAmB;AAAA,EAAA,CACpC,GAEK,EAAE,aAAaqB,EAAgB,IAAIF,EAAgB;AAAA,IACvD,gBAAgBjB,EAAwB;AAAA,IACxC,gBAAgBA,EAAwB;AAAA,EAAA,CACzC,GAEKoB,IAAwCC,EAAY,MAAM;AAC9D,IAAAN,EAAmC,EAAK,GACNb,KAAA,QAAAA;AAAA,EAAA,GACjC,CAACA,CAA+B,CAAC,GAE9BoB,IAA6BC;AAAA,IACjC,OAAO;AAAA,MACL,MAAM;AAAA,MACN,UAAUH;AAAA,IAAA;AAAA,IAEZ,CAACA,CAAqC;AAAA,EAAA,GAGlCI,IAAgBD,EAAQ,MAAM3B,EAAM,IAAI,MAAM6B,GAA2B,GAAG,CAAC7B,CAAK,CAAC,GAEnF8B,IAAYL;AAAA,IAChB,CAACM,MAAkB;;AACjB,MAAIA,IAAQ,KAAKA,KAAS/B,EAAM,UAAU+B,MAAUjB,OACxCG,IAAAJ,EAAA,YAAA,QAAAI,EAAS,UAAUc,IAC/BhB,EAAagB,CAAK;AAAA,IACpB;AAAA,IACA,CAACjB,GAAWd,EAAM,MAAM;AAAA,EAAA,GAGpBgC,IAA+BP;AAAA,IACnC,CAACM,MAAkB;AACF,MAAAvB,KACCe,KAChBR,EAAagB,CAAK,GAClBD,EAAUC,CAAK;AAAA,IACjB;AAAA,IACA,CAACR,GAAiBf,CAAc;AAAA,EAAA;AAGlC,SAAAyB,EAAoB1B,GAAK,OAAO;AAAA,IAC9B,eAAAqB;AAAA,IACA,cAAcd;AAAA,IACd,WAAAgB;AAAA,EACA,EAAA,GAEFI,EAAU,MAAM;AACd,IAAIvB,EAAa,YACfA,EAAa,UAAU;AAAA,EAE3B,GAAG,CAAE,CAAA,GAELuB,EAAU,MAAM;;AACD,IAAAnB,IAAAE,IAAAJ,EAAY,YAAZ,gBAAAI,EAAqB,iBAAgBhB,CAAY;AAAA,EAAA,GAC7D,CAACA,CAAY,CAAC,GAEjBiC,EAAU,MAAM;AACd,UAAMC,IAAgBnC,EAAM,MAAM,CAAQoC,MAAAA,EAAK,kBAAkB,YAAY;AAE7E,IAAI/B,KAA6B8B,MAC/B1B,EAAK4B,EAAe,uBAAuB,GAC3ClB,EAAmC,EAAI;AAAA,EAExC,GAAA,CAACd,GAA2BI,GAAMT,CAAK,CAAC,GAGzC,gBAAAsC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAK1B;AAAA,MACL,OAAOb,EAAM,IAAI,CAACoC,GAAML,MACrB,gBAAAO,EAAAE,GAAA,EAA0C,UAAKJ,EAAA,QAAA,GAAbL,CAAqB,CACzD;AAAA,MACD,cAAA9B;AAAA,MACA,oBAAoBU,EAAa,UAAU,IAAI;AAAA,MAC/C,aAAaW;AAAA,MACb,cAAcF;AAAA,MAEb,UAAApB,EAAM,SAAS,KACd,gBAAAsC;AAAA,QAACG;AAAAA,QAAA;AAAA,UACC,gBAAe;AAAA,UACf,aAAY;AAAA,UACZ,iBAAgB;AAAA,UAChB,WAAU;AAAA,UAEV,UAAA,gBAAAC,EAACC,GAAA,EACE,UAAA;AAAA,YACCzB,KAAA,gBAAAoB,EAACM,GAAA,EACC,UAAA,gBAAAN;AAAA,cAACO;AAAA,cAAA;AAAA,gBACC,KAAKC,EAAO;AAAA,gBACZ,UAAUC;AAAA,gBACV,eAAerB;AAAA,cAAA;AAAA,YAAA,GAEnB;AAAA,YAED1B,EAAM,IAAI,CAACoC,GAAML,MAChB,gBAAAO;AAAA,cAACU;AAAA,cAAA;AAAA,gBACC,KAAKpB,EAAcG,CAAK;AAAA,gBAExB,eAAeK,EAAK;AAAA,gBACpB,UAAUL,MAAUjB;AAAA,gBACpB,4BAA4BiB,IAAQ,GAAG,SAAS;AAAA,gBAChD,SAAS,MAAMC,EAA6BD,CAAK;AAAA,cAAA;AAAA,cAJ5CA;AAAA,YAAA,CAMR;AAAA,UAAA,GACH;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAIR,GAEakB,KAAWC,EAAKC,EAAWpD,CAAiB,CAAC;"}

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

@@ -1,4 +1,4 @@
-import { jsx as i } from "react/jsx-runtime";
+import { jsx as n } from "react/jsx-runtime";
 import { useRef as N, useCallback as f, useMemo as J, useEffect as X } from "react";
 import { useTheme as $ } from "styled-components";
 import { PLATFORM_EVENTS_STUDENT as B } from "../../../../analytics-events/platform-events-student.js";
@@ -9,35 +9,35 @@ import A from "../../../../ui/text/text.js";
 import { EDeviceType as Q } from "../../../../ui/theme/constants.js";
 import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as S } from "../../../enum/circle-onboarding-steps.js";
 import { CircularGameCard as D } from "../../comps/circular-game-card/circular-game-card.js";
-import j from "../../comps/swipable-component/swipeable-component.js";
+import j from "../../../../ui/swipeable-component/swipeable-component.js";
 import { SHOW_NUDGE_AFTER_MS as V, SLIDE_TO_LESSON_MS as ee } from "./constants.js";
-import { SwipableArea as te } from "./use-game-launcher-journey-style.js";
-import { CarouselIndicator as re } from "../../comps/carousel/carousel-indicator/carousel-indicator.js";
-import { ProjectType as n } from "../../../games/web-view/enums/project-type-enum.js";
+import { SwipableArea as re } from "./use-game-launcher-journey-style.js";
+import { CarouselIndicator as te } from "../../comps/carousel/carousel-indicator/carousel-indicator.js";
+import { ProjectType as i } from "../../../games/web-view/enums/project-type-enum.js";
 const Se = ({
   carouselRefs: o,
   onSegmentClick: d,
   onJourneyComplete: a
 }) => {
   const { device: W } = $(), l = W <= Q.TABLET, L = N([]), c = N(null), C = N(null), { nextCoachmark: u, setJourney: _, endJourney: h } = K(), { onEvent: p } = q(), E = f(
-    (r) => {
+    (t) => {
       p(B.ONBOARDING_STEP_COMPLETED, {
-        step: r
+        step: t
       });
     },
     [p]
   ), O = f(
-    (r, e) => {
-      d(r, n.PUZZLE), E(S.PUZZLE_ACTIVITY), h(e), a(e);
+    (t, e) => {
+      d(t, i.PUZZLE), E(S.PUZZLE_ACTIVITY), h(e), a(e);
     },
     [h, a, d, E]
   ), y = f(
-    (r, e) => {
-      d(r, n.LESSON), E(S.SKILL_ACTIVITY), h(e), a(e);
+    (t, e) => {
+      d(t, i.LESSON), E(S.SKILL_ACTIVITY), h(e), a(e);
     },
     [h, a, d, E]
   ), R = f(
-    (r, e) => {
+    (t, e) => {
       var G, w, x, P, U, Y, Z, k, H, M, z;
       const T = (G = o.current) == null ? void 0 : G.indicatorRefs, s = ((x = (w = c.current) == null ? void 0 : w.circularCardWrapperRef.current) == null ? void 0 : x.getBoundingClientRect()) || {
         height: 0,
@@ -49,56 +49,56 @@ const Se = ({
       (P = e == null ? void 0 : e.games) != null && P.data.length && ((U = e == null ? void 0 : e.puzzles) != null && U.data.length) && g.push(
         {
           projectData: e.games.data[0],
-          type: n.GAME
+          type: i.GAME
         },
         {
           projectData: e.puzzles.data[0],
-          type: n.PUZZLE
+          type: i.PUZZLE
         }
       ), (Y = e == null ? void 0 : e.lessons) != null && Y.data.length && g.push(
-        { projectData: e.lessons.data[0], type: n.LESSON },
-        { projectData: e.lessons.data[1], type: n.LESSON }
+        { projectData: e.lessons.data[0], type: i.LESSON },
+        { projectData: e.lessons.data[1], type: i.LESSON }
       );
-      const t = g[1];
+      const r = g[1];
       p(B.ONBOARDING_STEP_VIEWED, {
-        step: ((Z = g[0]) == null ? void 0 : Z.type) === n.LESSON ? S.SKILL_ACTIVITY : S.GAMES_ACTIVITY
+        step: ((Z = g[0]) == null ? void 0 : Z.type) === i.LESSON ? S.SKILL_ACTIVITY : S.GAMES_ACTIVITY
       });
       const F = [
         l ? {
           originalElementToHighlightRef: c.current.circularCardWrapperRef,
           type: I.NUDGE,
-          elementToHighlight: /* @__PURE__ */ i(
+          elementToHighlight: /* @__PURE__ */ n(
             j,
             {
               onSwipeLeft: () => {
                 var m;
-                (m = o.current) == null || m.goToIndex(1), u(r, !1, V);
+                (m = o.current) == null || m.goToIndex(1), u(t, !1, V);
               },
-              children: /* @__PURE__ */ i(te, {})
+              children: /* @__PURE__ */ n(re, {})
             }
           ),
           indicator: {
             nudge: "swipe",
-            content: /* @__PURE__ */ i(A, { $renderAs: "ab2-bold", children: "Swipe to explore" }),
+            content: /* @__PURE__ */ n(A, { $renderAs: "ab2-bold", children: "Swipe to explore" }),
             nudgePointerX: s.width / 2 - 30,
             nudgePointerY: s.height / 2
           }
         } : {
           originalElementToHighlightRef: T[1],
           type: I.NUDGE,
-          elementToHighlight: /* @__PURE__ */ i(
-            re,
+          elementToHighlight: /* @__PURE__ */ n(
+            te,
             {
               textToShowInsideIndicator: "2",
               onClick: () => {
                 var m;
-                (m = o.current) == null || m.goToIndex(1), u(r, !1, V);
+                (m = o.current) == null || m.goToIndex(1), u(t, !1, V);
               }
             }
           ),
           indicator: {
             nudge: "click",
-            content: /* @__PURE__ */ i(A, { $renderAs: "ab1-bold", children: "Click to proceed" }),
+            content: /* @__PURE__ */ n(A, { $renderAs: "ab1-bold", children: "Click to proceed" }),
             nudgePointerX: 0,
             nudgePointerY: 0
           }
@@ -106,32 +106,32 @@ const Se = ({
         {
           originalElementToHighlightRef: C.current.circularCardWrapperRef,
           type: I.NUDGE,
-          elementToHighlight: /* @__PURE__ */ i(
+          elementToHighlight: /* @__PURE__ */ n(
             D,
             {
               label: "",
               data: {
-                card: ((k = t == null ? void 0 : t.projectData) == null ? void 0 : k.cardLottie) ?? "",
-                name: ((H = t == null ? void 0 : t.projectData) == null ? void 0 : H.name) ?? "",
+                card: ((k = r == null ? void 0 : r.projectData) == null ? void 0 : k.cardLottie) ?? "",
+                name: ((H = r == null ? void 0 : r.projectData) == null ? void 0 : H.name) ?? "",
                 isCompleted: !1,
-                displayNameImage: (M = t == null ? void 0 : t.projectData) == null ? void 0 : M.displayNameImage,
+                displayNameImage: (M = r == null ? void 0 : r.projectData) == null ? void 0 : M.displayNameImage,
                 onPress: () => {
-                  (t == null ? void 0 : t.type) === n.LESSON && y(t.projectData, r), (t == null ? void 0 : t.type) === n.PUZZLE && O(t.projectData, r);
+                  (r == null ? void 0 : r.type) === i.LESSON && y(r.projectData, t), (r == null ? void 0 : r.type) === i.PUZZLE && O(r.projectData, t);
                 }
               }
             }
           ),
           indicator: {
             nudge: "click",
-            content: /* @__PURE__ */ i(A, { $renderAs: l ? "ab2-bold" : "ab1-bold", children: l ? "Tap to start" : " Click to start" }),
+            content: /* @__PURE__ */ n(A, { $renderAs: l ? "ab2-bold" : "ab1-bold", children: l ? "Tap to start" : " Click to start" }),
             nudgePointerX: l ? s.width / 2 : s.width / 1.3,
             nudgePointerY: l ? s.height / 2 : s.height / 1.3
           }
         }
       ];
-      _(r, F), (z = o.current) == null || z.goToIndex(0);
+      _(t, F), (z = o.current) == null || z.goToIndex(0);
       const b = setTimeout(() => {
-        clearTimeout(b), u(r);
+        clearTimeout(b), u(t);
       }, ee);
       L.current.push(b);
     },
@@ -153,7 +153,7 @@ const Se = ({
     [R]
   );
   return X(() => () => {
-    L.current.forEach((r) => clearTimeout(r)), L.current = [];
+    L.current.forEach((t) => clearTimeout(t)), L.current = [];
   }, [o]), v;
 };
 export {

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

@@ -1 +1 @@
-{"version":3,"file":"use-game-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport {\n  PLATFORM_EVENTS_STUDENT as AnalyticsLabel,\n  PLATFORM_EVENTS_STUDENT,\n} from '../../../../analytics-events/platform-events-student';\nimport { type JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport type { TCoachmarkJourneyProps } from '../../../../journey/use-journey/journey-context-types';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport { useUIContext } from '../../../../ui/context/context';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport Text from '../../../../ui/text/text';\nimport { EDeviceType } from '../../../../ui/theme/constants';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as ActionEvent } from '../../../enum/circle-onboarding-steps';\nimport { ProjectType } from '../../../games/web-view/enums';\nimport { CircularGameCard } from '../../comps/circular-game-card/circular-game-card';\nimport { type ICircularGameCardRefs } from '../../comps/circular-game-card/circular-game-card-types';\nimport SwipeableCard from '../../comps/swipable-component/swipeable-component';\nimport type {\n  Lesson,\n  Puzzle,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport { type IProjectData } from '../../game-launcher-types';\nimport { SHOW_NUDGE_AFTER_MS, SLIDE_TO_LESSON_MS } from './constants';\nimport type { IUseGameLauncherJourneyProps } from './use-game-launcher-journey-types';\nimport { SwipableArea } from './use-game-launcher-journey-style';\nimport { CarouselIndicator } from '../../comps/carousel/carousel-indicator/carousel-indicator';\n\nexport const useGameLauncherJourney = ({\n  carouselRefs,\n  onSegmentClick,\n  onJourneyComplete,\n}: IUseGameLauncherJourneyProps) => {\n  const { device } = useTheme();\n  const isCompact = device <= EDeviceType.TABLET;\n\n  const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n  const firstCardRefs = useRef<ICircularGameCardRefs>(null);\n  const secondCardRefs = useRef<ICircularGameCardRefs>(null);\n  const { nextCoachmark, setJourney, endJourney } = useJourney();\n  const { onEvent: trackAnalytics } = useUIContext();\n\n  const trackEventCompleted = useCallback(\n    (step: ActionEvent) => {\n      trackAnalytics(AnalyticsLabel.ONBOARDING_STEP_COMPLETED, {\n        step,\n      });\n    },\n    [trackAnalytics],\n  );\n\n  const handleEndJourneyForPuzzle = useCallback(\n    (puzzlesData: Puzzle, journeyId: JOURNEY_ID_STUDENT) => {\n      onSegmentClick(puzzlesData, ProjectType.PUZZLE);\n      trackEventCompleted(ActionEvent.PUZZLE_ACTIVITY);\n      endJourney(journeyId);\n      onJourneyComplete(journeyId);\n    },\n    [endJourney, onJourneyComplete, onSegmentClick, trackEventCompleted],\n  );\n\n  const handleEndJourneyForLesson = useCallback(\n    (lessonsData: Lesson, journeyId: JOURNEY_ID_STUDENT) => {\n      onSegmentClick(lessonsData, ProjectType.LESSON);\n      trackEventCompleted(ActionEvent.SKILL_ACTIVITY);\n      endJourney(journeyId);\n      onJourneyComplete(journeyId);\n    },\n    [endJourney, onJourneyComplete, onSegmentClick, trackEventCompleted],\n  );\n\n  const startJourney = useCallback(\n    (journeyId: JOURNEY_ID_STUDENT, projectData?: IProjectData) => {\n      const paginationList = carouselRefs.current?.indicatorRefs;\n\n      const launcherDims =\n        firstCardRefs.current?.circularCardWrapperRef.current?.getBoundingClientRect() || {\n          height: 0,\n          width: 0,\n        };\n\n      // Exit early if required refs or data are missing\n      if (paginationList?.length < 2 || !secondCardRefs.current || !firstCardRefs.current) {\n        return;\n      }\n\n      // prepare journey projects based on the data available as\n      // games and puzzles are not aviailbale for K-1\n      const journeyProjectsData = [];\n\n      if (projectData?.games?.data.length && projectData?.puzzles?.data.length) {\n        journeyProjectsData.push(\n          {\n            projectData: projectData.games.data[0],\n            type: ProjectType.GAME,\n          },\n          {\n            projectData: projectData.puzzles.data[0],\n            type: ProjectType.PUZZLE,\n          },\n        );\n      }\n\n      if (projectData?.lessons?.data.length) {\n        journeyProjectsData.push(\n          { projectData: projectData.lessons.data[0], type: ProjectType.LESSON },\n          { projectData: projectData.lessons.data[1], type: ProjectType.LESSON },\n        );\n      }\n\n      const secondProjectData = journeyProjectsData[1];\n\n      trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_VIEWED, {\n        step:\n          journeyProjectsData[0]?.type === ProjectType.LESSON\n            ? ActionEvent.SKILL_ACTIVITY\n            : ActionEvent.GAMES_ACTIVITY,\n      });\n\n      const coachmarks: TCoachmarkJourneyProps[] = [\n        isCompact\n          ? {\n              originalElementToHighlightRef: firstCardRefs.current.circularCardWrapperRef,\n              type: IndicatorType.NUDGE,\n              elementToHighlight: (\n                <SwipeableCard\n                  onSwipeLeft={() => {\n                    carouselRefs.current?.goToIndex(1);\n                    nextCoachmark(journeyId, false, SHOW_NUDGE_AFTER_MS);\n                  }}\n                >\n                  <SwipableArea />\n                </SwipeableCard>\n              ),\n              indicator: {\n                nudge: 'swipe',\n                content: <Text $renderAs=\"ab2-bold\">Swipe to explore</Text>,\n                nudgePointerX: launcherDims.width / 2 - 30,\n                nudgePointerY: launcherDims.height / 2,\n              } as INudgeProps,\n            }\n          : {\n              originalElementToHighlightRef: paginationList[1] as React.RefObject<HTMLDivElement>,\n              type: IndicatorType.NUDGE,\n              elementToHighlight: (\n                <CarouselIndicator\n                  textToShowInsideIndicator=\"2\"\n                  onClick={() => {\n                    carouselRefs.current?.goToIndex(1);\n                    nextCoachmark(journeyId, false, SHOW_NUDGE_AFTER_MS);\n                  }}\n                />\n              ),\n              indicator: {\n                nudge: 'click',\n                content: <Text $renderAs=\"ab1-bold\">Click to proceed</Text>,\n                nudgePointerX: 0,\n                nudgePointerY: 0,\n              } as INudgeProps,\n            },\n        {\n          originalElementToHighlightRef: secondCardRefs.current.circularCardWrapperRef,\n          type: IndicatorType.NUDGE,\n          elementToHighlight: (\n            <CircularGameCard\n              label=\"\"\n              data={{\n                card: secondProjectData?.projectData?.cardLottie ?? '',\n                name: secondProjectData?.projectData?.name ?? '',\n                isCompleted: false,\n                displayNameImage: secondProjectData?.projectData?.displayNameImage,\n                onPress: () => {\n                  if (secondProjectData?.type === ProjectType.LESSON) {\n                    handleEndJourneyForLesson(secondProjectData.projectData as Lesson, journeyId);\n                  }\n\n                  if (secondProjectData?.type === ProjectType.PUZZLE) {\n                    handleEndJourneyForPuzzle(secondProjectData.projectData as Puzzle, journeyId);\n                  }\n                },\n              }}\n            />\n          ),\n          indicator: {\n            nudge: 'click',\n            content: (\n              <Text $renderAs={isCompact ? 'ab2-bold' : 'ab1-bold'}>\n                {isCompact ? 'Tap to start' : ' Click to start'}\n              </Text>\n            ),\n            nudgePointerX: isCompact ? launcherDims.width / 2 : launcherDims.width / 1.3,\n            nudgePointerY: isCompact ? launcherDims.height / 2 : launcherDims.height / 1.3,\n          } as INudgeProps,\n        },\n      ];\n\n      setJourney(journeyId, coachmarks);\n      carouselRefs.current?.goToIndex(0);\n      const delayBeforeStart = setTimeout(() => {\n        clearTimeout(delayBeforeStart);\n        nextCoachmark(journeyId);\n      }, SLIDE_TO_LESSON_MS);\n\n      timerRefs.current.push(delayBeforeStart);\n    },\n    [\n      carouselRefs,\n      trackAnalytics,\n      isCompact,\n      setJourney,\n      nextCoachmark,\n      handleEndJourneyForLesson,\n      handleEndJourneyForPuzzle,\n    ],\n  );\n\n  const data = useMemo(\n    () => ({\n      firstCardRefs,\n      secondCardRefs,\n      startJourney,\n    }),\n    [startJourney],\n  );\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      timerRefs.current.forEach(timer => clearTimeout(timer));\n      timerRefs.current = [];\n    };\n  }, [carouselRefs]);\n\n  return data;\n};\n"],"names":["useGameLauncherJourney","carouselRefs","onSegmentClick","onJourneyComplete","device","useTheme","isCompact","EDeviceType","timerRefs","useRef","firstCardRefs","secondCardRefs","nextCoachmark","setJourney","endJourney","useJourney","trackAnalytics","useUIContext","trackEventCompleted","useCallback","step","AnalyticsLabel","handleEndJourneyForPuzzle","puzzlesData","journeyId","ProjectType","ActionEvent","handleEndJourneyForLesson","lessonsData","startJourney","projectData","paginationList","_a","launcherDims","_c","_b","journeyProjectsData","_d","_e","_f","secondProjectData","PLATFORM_EVENTS_STUDENT","_g","coachmarks","IndicatorType","jsx","SwipeableCard","SHOW_NUDGE_AFTER_MS","SwipableArea","Text","CarouselIndicator","CircularGameCard","_h","_i","_j","_k","delayBeforeStart","SLIDE_TO_LESSON_MS","data","useMemo","useEffect","timer"],"mappings":"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"}
+{"version":3,"file":"use-game-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport {\n  PLATFORM_EVENTS_STUDENT as AnalyticsLabel,\n  PLATFORM_EVENTS_STUDENT,\n} from '../../../../analytics-events/platform-events-student';\nimport { type JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport type { TCoachmarkJourneyProps } from '../../../../journey/use-journey/journey-context-types';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport { useUIContext } from '../../../../ui/context/context';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport Text from '../../../../ui/text/text';\nimport { EDeviceType } from '../../../../ui/theme/constants';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as ActionEvent } from '../../../enum/circle-onboarding-steps';\nimport { ProjectType } from '../../../games/web-view/enums';\nimport { CircularGameCard } from '../../comps/circular-game-card/circular-game-card';\nimport { type ICircularGameCardRefs } from '../../comps/circular-game-card/circular-game-card-types';\nimport SwipeableCard from '../../../../ui/swipeable-component/swipeable-component';\nimport type {\n  Lesson,\n  Puzzle,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport { type IProjectData } from '../../game-launcher-types';\nimport { SHOW_NUDGE_AFTER_MS, SLIDE_TO_LESSON_MS } from './constants';\nimport type { IUseGameLauncherJourneyProps } from './use-game-launcher-journey-types';\nimport { SwipableArea } from './use-game-launcher-journey-style';\nimport { CarouselIndicator } from '../../comps/carousel/carousel-indicator/carousel-indicator';\n\nexport const useGameLauncherJourney = ({\n  carouselRefs,\n  onSegmentClick,\n  onJourneyComplete,\n}: IUseGameLauncherJourneyProps) => {\n  const { device } = useTheme();\n  const isCompact = device <= EDeviceType.TABLET;\n\n  const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n  const firstCardRefs = useRef<ICircularGameCardRefs>(null);\n  const secondCardRefs = useRef<ICircularGameCardRefs>(null);\n  const { nextCoachmark, setJourney, endJourney } = useJourney();\n  const { onEvent: trackAnalytics } = useUIContext();\n\n  const trackEventCompleted = useCallback(\n    (step: ActionEvent) => {\n      trackAnalytics(AnalyticsLabel.ONBOARDING_STEP_COMPLETED, {\n        step,\n      });\n    },\n    [trackAnalytics],\n  );\n\n  const handleEndJourneyForPuzzle = useCallback(\n    (puzzlesData: Puzzle, journeyId: JOURNEY_ID_STUDENT) => {\n      onSegmentClick(puzzlesData, ProjectType.PUZZLE);\n      trackEventCompleted(ActionEvent.PUZZLE_ACTIVITY);\n      endJourney(journeyId);\n      onJourneyComplete(journeyId);\n    },\n    [endJourney, onJourneyComplete, onSegmentClick, trackEventCompleted],\n  );\n\n  const handleEndJourneyForLesson = useCallback(\n    (lessonsData: Lesson, journeyId: JOURNEY_ID_STUDENT) => {\n      onSegmentClick(lessonsData, ProjectType.LESSON);\n      trackEventCompleted(ActionEvent.SKILL_ACTIVITY);\n      endJourney(journeyId);\n      onJourneyComplete(journeyId);\n    },\n    [endJourney, onJourneyComplete, onSegmentClick, trackEventCompleted],\n  );\n\n  const startJourney = useCallback(\n    (journeyId: JOURNEY_ID_STUDENT, projectData?: IProjectData) => {\n      const paginationList = carouselRefs.current?.indicatorRefs;\n\n      const launcherDims =\n        firstCardRefs.current?.circularCardWrapperRef.current?.getBoundingClientRect() || {\n          height: 0,\n          width: 0,\n        };\n\n      // Exit early if required refs or data are missing\n      if (paginationList?.length < 2 || !secondCardRefs.current || !firstCardRefs.current) {\n        return;\n      }\n\n      // prepare journey projects based on the data available as\n      // games and puzzles are not aviailbale for K-1\n      const journeyProjectsData = [];\n\n      if (projectData?.games?.data.length && projectData?.puzzles?.data.length) {\n        journeyProjectsData.push(\n          {\n            projectData: projectData.games.data[0],\n            type: ProjectType.GAME,\n          },\n          {\n            projectData: projectData.puzzles.data[0],\n            type: ProjectType.PUZZLE,\n          },\n        );\n      }\n\n      if (projectData?.lessons?.data.length) {\n        journeyProjectsData.push(\n          { projectData: projectData.lessons.data[0], type: ProjectType.LESSON },\n          { projectData: projectData.lessons.data[1], type: ProjectType.LESSON },\n        );\n      }\n\n      const secondProjectData = journeyProjectsData[1];\n\n      trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_VIEWED, {\n        step:\n          journeyProjectsData[0]?.type === ProjectType.LESSON\n            ? ActionEvent.SKILL_ACTIVITY\n            : ActionEvent.GAMES_ACTIVITY,\n      });\n\n      const coachmarks: TCoachmarkJourneyProps[] = [\n        isCompact\n          ? {\n              originalElementToHighlightRef: firstCardRefs.current.circularCardWrapperRef,\n              type: IndicatorType.NUDGE,\n              elementToHighlight: (\n                <SwipeableCard\n                  onSwipeLeft={() => {\n                    carouselRefs.current?.goToIndex(1);\n                    nextCoachmark(journeyId, false, SHOW_NUDGE_AFTER_MS);\n                  }}\n                >\n                  <SwipableArea />\n                </SwipeableCard>\n              ),\n              indicator: {\n                nudge: 'swipe',\n                content: <Text $renderAs=\"ab2-bold\">Swipe to explore</Text>,\n                nudgePointerX: launcherDims.width / 2 - 30,\n                nudgePointerY: launcherDims.height / 2,\n              } as INudgeProps,\n            }\n          : {\n              originalElementToHighlightRef: paginationList[1] as React.RefObject<HTMLDivElement>,\n              type: IndicatorType.NUDGE,\n              elementToHighlight: (\n                <CarouselIndicator\n                  textToShowInsideIndicator=\"2\"\n                  onClick={() => {\n                    carouselRefs.current?.goToIndex(1);\n                    nextCoachmark(journeyId, false, SHOW_NUDGE_AFTER_MS);\n                  }}\n                />\n              ),\n              indicator: {\n                nudge: 'click',\n                content: <Text $renderAs=\"ab1-bold\">Click to proceed</Text>,\n                nudgePointerX: 0,\n                nudgePointerY: 0,\n              } as INudgeProps,\n            },\n        {\n          originalElementToHighlightRef: secondCardRefs.current.circularCardWrapperRef,\n          type: IndicatorType.NUDGE,\n          elementToHighlight: (\n            <CircularGameCard\n              label=\"\"\n              data={{\n                card: secondProjectData?.projectData?.cardLottie ?? '',\n                name: secondProjectData?.projectData?.name ?? '',\n                isCompleted: false,\n                displayNameImage: secondProjectData?.projectData?.displayNameImage,\n                onPress: () => {\n                  if (secondProjectData?.type === ProjectType.LESSON) {\n                    handleEndJourneyForLesson(secondProjectData.projectData as Lesson, journeyId);\n                  }\n\n                  if (secondProjectData?.type === ProjectType.PUZZLE) {\n                    handleEndJourneyForPuzzle(secondProjectData.projectData as Puzzle, journeyId);\n                  }\n                },\n              }}\n            />\n          ),\n          indicator: {\n            nudge: 'click',\n            content: (\n              <Text $renderAs={isCompact ? 'ab2-bold' : 'ab1-bold'}>\n                {isCompact ? 'Tap to start' : ' Click to start'}\n              </Text>\n            ),\n            nudgePointerX: isCompact ? launcherDims.width / 2 : launcherDims.width / 1.3,\n            nudgePointerY: isCompact ? launcherDims.height / 2 : launcherDims.height / 1.3,\n          } as INudgeProps,\n        },\n      ];\n\n      setJourney(journeyId, coachmarks);\n      carouselRefs.current?.goToIndex(0);\n      const delayBeforeStart = setTimeout(() => {\n        clearTimeout(delayBeforeStart);\n        nextCoachmark(journeyId);\n      }, SLIDE_TO_LESSON_MS);\n\n      timerRefs.current.push(delayBeforeStart);\n    },\n    [\n      carouselRefs,\n      trackAnalytics,\n      isCompact,\n      setJourney,\n      nextCoachmark,\n      handleEndJourneyForLesson,\n      handleEndJourneyForPuzzle,\n    ],\n  );\n\n  const data = useMemo(\n    () => ({\n      firstCardRefs,\n      secondCardRefs,\n      startJourney,\n    }),\n    [startJourney],\n  );\n\n  // Cleanup on unmount\n  useEffect(() => {\n    return () => {\n      timerRefs.current.forEach(timer => clearTimeout(timer));\n      timerRefs.current = [];\n    };\n  }, [carouselRefs]);\n\n  return data;\n};\n"],"names":["useGameLauncherJourney","carouselRefs","onSegmentClick","onJourneyComplete","device","useTheme","isCompact","EDeviceType","timerRefs","useRef","firstCardRefs","secondCardRefs","nextCoachmark","setJourney","endJourney","useJourney","trackAnalytics","useUIContext","trackEventCompleted","useCallback","step","AnalyticsLabel","handleEndJourneyForPuzzle","puzzlesData","journeyId","ProjectType","ActionEvent","handleEndJourneyForLesson","lessonsData","startJourney","projectData","paginationList","_a","launcherDims","_c","_b","journeyProjectsData","_d","_e","_f","secondProjectData","PLATFORM_EVENTS_STUDENT","_g","coachmarks","IndicatorType","jsx","SwipeableCard","SHOW_NUDGE_AFTER_MS","SwipableArea","Text","CarouselIndicator","CircularGameCard","_h","_i","_j","_k","delayBeforeStart","SLIDE_TO_LESSON_MS","data","useMemo","useEffect","timer"],"mappings":"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"}

package/dist/features/stickers/hooks/use-handle-sticker-send/use-handle-sticker-send.js

@@ -37,7 +37,6 @@ const u = (t, s) => {
         n(r, { baseEventData: i });
       }
     },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
     [n, e, a, t, c]
   );
 };

package/dist/features/stickers/hooks/use-handle-sticker-send/use-handle-sticker-send.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-handle-sticker-send.js","sources":["../../../../../src/features/stickers/hooks/use-handle-sticker-send/use-handle-sticker-send.tsx"],"sourcesContent":["import { useCallback } from 'react';\n\nimport useInClassMessageBroker from '../../../communication/hooks/use-inclass-message-broker/use-inclass-message-broker';\nimport { useUIContext } from '../../../ui/context/context';\nimport { STICKERS_ANALYTICS_EVENT } from '../../stickers-analytics-events';\nimport { useStickers } from '../../stickers-effects/hooks/use-stickers';\nimport type {\n  IStickerData,\n  TStickerAnimationEffects,\n  TStickersPayload,\n} from '../../stickers-types';\nimport { useStickersErrorLogger } from '../use-stickers-error-logger';\nimport { type TUseStickerSendMetaData } from './use-handle-sticker-send-types';\n\nexport const useHandleStickerSend = (\n  studentClassroomId: string,\n  metaData: TUseStickerSendMetaData,\n) => {\n  const { publish } = useInClassMessageBroker({\n    studentClassroomId,\n  });\n\n  const { onEvent: trackEvent } = useUIContext();\n  const logError = useStickersErrorLogger();\n\n  const { showSticker } = useStickers();\n\n  const sendSticker = useCallback(\n    (sticker: IStickerData, effect: TStickerAnimationEffects) => {\n      const baseEventData = {\n        classroom_id: studentClassroomId,\n        sticker: sticker.id,\n        teacherClassroomId: metaData.teacherClassroomId,\n        triggerType: metaData.triggerType,\n      };\n\n      try {\n        const payload: TStickersPayload = {\n          message: {\n            data: {\n              selectedSticker: {\n                id: sticker.id,\n                name: sticker.name,\n              },\n              effectId: effect,\n            },\n          },\n          type: 'STICKERS',\n        };\n\n        showSticker(payload);\n\n        publish?.({\n          eventName: 'STICKERS',\n          eventPayload: payload,\n        });\n\n        trackEvent(STICKERS_ANALYTICS_EVENT.STICKER_SENT, baseEventData);\n      } catch (error) {\n        logError(error, { baseEventData });\n      }\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [logError, publish, showSticker, studentClassroomId, trackEvent],\n  );\n\n  return sendSticker;\n};\n"],"names":["useHandleStickerSend","studentClassroomId","metaData","publish","useInClassMessageBroker","trackEvent","useUIContext","logError","useStickersErrorLogger","showSticker","useStickers","useCallback","sticker","effect","baseEventData","payload","STICKERS_ANALYTICS_EVENT","error"],"mappings":";;;;;;AAca,MAAAA,IAAuB,CAClCC,GACAC,MACG;AACG,QAAA,EAAE,SAAAC,EAAQ,IAAIC,EAAwB;AAAA,IAC1C,oBAAAH;AAAA,EAAA,CACD,GAEK,EAAE,SAASI,EAAW,IAAIC,EAAa,GACvCC,IAAWC,KAEX,EAAE,aAAAC,MAAgBC;AAyCjB,SAvCaC;AAAA,IAClB,CAACC,GAAuBC,MAAqC;AAC3D,YAAMC,IAAgB;AAAA,QACpB,cAAcb;AAAA,QACd,SAASW,EAAQ;AAAA,QACjB,oBAAoBV,EAAS;AAAA,QAC7B,aAAaA,EAAS;AAAA,MAAA;AAGpB,UAAA;AACF,cAAMa,IAA4B;AAAA,UAChC,SAAS;AAAA,YACP,MAAM;AAAA,cACJ,iBAAiB;AAAA,gBACf,IAAIH,EAAQ;AAAA,gBACZ,MAAMA,EAAQ;AAAA,cAChB;AAAA,cACA,UAAUC;AAAA,YACZ;AAAA,UACF;AAAA,UACA,MAAM;AAAA,QAAA;AAGR,QAAAJ,EAAYM,CAAO,GAETZ,KAAA,QAAAA,EAAA;AAAA,UACR,WAAW;AAAA,UACX,cAAcY;AAAA,QAAA,IAGLV,EAAAW,EAAyB,cAAcF,CAAa;AAAA,eACxDG,GAAO;AACL,QAAAV,EAAAU,GAAO,EAAE,eAAAH,EAAA,CAAe;AAAA,MACnC;AAAA,IACF;AAAA;AAAA,IAEA,CAACP,GAAUJ,GAASM,GAAaR,GAAoBI,CAAU;AAAA,EAAA;AAInE;"}
+{"version":3,"file":"use-handle-sticker-send.js","sources":["../../../../../src/features/stickers/hooks/use-handle-sticker-send/use-handle-sticker-send.tsx"],"sourcesContent":["import { useCallback } from 'react';\n\nimport useInClassMessageBroker from '../../../communication/hooks/use-inclass-message-broker/use-inclass-message-broker';\nimport { useUIContext } from '../../../ui/context/context';\nimport { STICKERS_ANALYTICS_EVENT } from '../../stickers-analytics-events';\nimport { useStickers } from '../../stickers-effects/hooks/use-stickers';\nimport type {\n  IStickerData,\n  TStickerAnimationEffects,\n  TStickersPayload,\n} from '../../stickers-types';\nimport { useStickersErrorLogger } from '../use-stickers-error-logger';\nimport { type TUseStickerSendMetaData } from './use-handle-sticker-send-types';\n\nexport const useHandleStickerSend = (\n  studentClassroomId: string,\n  metaData: TUseStickerSendMetaData,\n) => {\n  const { publish } = useInClassMessageBroker({\n    studentClassroomId,\n  });\n\n  const { onEvent: trackEvent } = useUIContext();\n  const logError = useStickersErrorLogger();\n\n  const { showSticker } = useStickers();\n\n  const sendSticker = useCallback(\n    (sticker: IStickerData, effect: TStickerAnimationEffects) => {\n      const baseEventData = {\n        classroom_id: studentClassroomId,\n        sticker: sticker.id,\n        teacherClassroomId: metaData.teacherClassroomId,\n        triggerType: metaData.triggerType,\n      };\n\n      try {\n        const payload: TStickersPayload = {\n          message: {\n            data: {\n              selectedSticker: {\n                id: sticker.id,\n                name: sticker.name,\n              },\n              effectId: effect,\n            },\n          },\n          type: 'STICKERS',\n        };\n\n        showSticker(payload);\n\n        publish?.({\n          eventName: 'STICKERS',\n          eventPayload: payload,\n        });\n\n        trackEvent(STICKERS_ANALYTICS_EVENT.STICKER_SENT, baseEventData);\n      } catch (error) {\n        logError(error, { baseEventData });\n      }\n    },\n    [logError, publish, showSticker, studentClassroomId, trackEvent],\n  );\n\n  return sendSticker;\n};\n"],"names":["useHandleStickerSend","studentClassroomId","metaData","publish","useInClassMessageBroker","trackEvent","useUIContext","logError","useStickersErrorLogger","showSticker","useStickers","useCallback","sticker","effect","baseEventData","payload","STICKERS_ANALYTICS_EVENT","error"],"mappings":";;;;;;AAca,MAAAA,IAAuB,CAClCC,GACAC,MACG;AACG,QAAA,EAAE,SAAAC,EAAQ,IAAIC,EAAwB;AAAA,IAC1C,oBAAAH;AAAA,EAAA,CACD,GAEK,EAAE,SAASI,EAAW,IAAIC,EAAa,GACvCC,IAAWC,KAEX,EAAE,aAAAC,MAAgBC;AAwCjB,SAtCaC;AAAA,IAClB,CAACC,GAAuBC,MAAqC;AAC3D,YAAMC,IAAgB;AAAA,QACpB,cAAcb;AAAA,QACd,SAASW,EAAQ;AAAA,QACjB,oBAAoBV,EAAS;AAAA,QAC7B,aAAaA,EAAS;AAAA,MAAA;AAGpB,UAAA;AACF,cAAMa,IAA4B;AAAA,UAChC,SAAS;AAAA,YACP,MAAM;AAAA,cACJ,iBAAiB;AAAA,gBACf,IAAIH,EAAQ;AAAA,gBACZ,MAAMA,EAAQ;AAAA,cAChB;AAAA,cACA,UAAUC;AAAA,YACZ;AAAA,UACF;AAAA,UACA,MAAM;AAAA,QAAA;AAGR,QAAAJ,EAAYM,CAAO,GAETZ,KAAA,QAAAA,EAAA;AAAA,UACR,WAAW;AAAA,UACX,cAAcY;AAAA,QAAA,IAGLV,EAAAW,EAAyB,cAAcF,CAAa;AAAA,eACxDG,GAAO;AACL,QAAAV,EAAAU,GAAO,EAAE,eAAAH,EAAA,CAAe;AAAA,MACnC;AAAA,IACF;AAAA,IACA,CAACP,GAAUJ,GAASM,GAAaR,GAAoBI,CAAU;AAAA,EAAA;AAInE;"}

package/dist/features/timeline/daily-timeline-styled.js

@@ -1,21 +1,25 @@
-import i from "styled-components";
-import o from "../ui/layout/flex-view.js";
-const r = i(o)`
+import t from "styled-components";
+import e from "../ui/layout/flex-view.js";
+import o from "../ui/text/text.js";
+const n = t(e)`
   overflow-y: auto;
   width: 100%;
   scroll-behavior: smooth;
   will-change: height;
-`, h = i(o)`
+`, a = t(e)`
   max-width: 512px;
   width: 100%;
   will-change: height;
-`, a = i(o)`
-  margin-top: ${({ $addedMonthBreak: t }) => t ? "-108px" : "0"};
+`, m = t(e)`
+  margin-top: ${({ $addedMonthBreak: i }) => i ? "-108px" : "0"};
   z-index: 1;
+`, p = t(o)`
+  line-height: 8px;
 `;
 export {
-  a as DailyItems,
-  h as DailyTimelineContainer,
-  r as ScrollWrapper
+  m as DailyItems,
+  a as DailyTimelineContainer,
+  p as DateText,
+  n as ScrollWrapper
 };
 //# sourceMappingURL=daily-timeline-styled.js.map

package/dist/features/timeline/daily-timeline-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"daily-timeline-styled.js","sources":["../../../src/features/timeline/daily-timeline-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../ui/layout/flex-view';\n\nconst ScrollWrapper = styled(FlexView)`\n  overflow-y: auto;\n  width: 100%;\n  scroll-behavior: smooth;\n  will-change: height;\n`;\n\nconst DailyTimelineContainer = styled(FlexView)`\n  max-width: 512px;\n  width: 100%;\n  will-change: height;\n`;\n\nconst DailyItems = styled(FlexView)<{ $addedMonthBreak?: boolean }>`\n  margin-top: ${({ $addedMonthBreak }) =>\n    $addedMonthBreak\n      ? '-108px' // 64px card height + 16px(separator) + 16(date text) + 12(separator)\n      : '0'};\n  z-index: 1;\n`;\n\nexport { DailyTimelineContainer, DailyItems, ScrollWrapper };\n"],"names":["ScrollWrapper","styled","FlexView","DailyTimelineContainer","DailyItems","$addedMonthBreak"],"mappings":";;AAIM,MAAAA,IAAgBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,GAO/BC,IAAyBF,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,GAMxCE,IAAaH,EAAOC,CAAQ;AAAA,gBAClB,CAAC,EAAE,kBAAAG,EAAA,MACfA,IACI,WACA,GAAG;AAAA;AAAA;"}
+{"version":3,"file":"daily-timeline-styled.js","sources":["../../../src/features/timeline/daily-timeline-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../ui/layout/flex-view';\nimport Text from '../ui/text/text';\n\nconst ScrollWrapper = styled(FlexView)`\n  overflow-y: auto;\n  width: 100%;\n  scroll-behavior: smooth;\n  will-change: height;\n`;\n\nconst DailyTimelineContainer = styled(FlexView)`\n  max-width: 512px;\n  width: 100%;\n  will-change: height;\n`;\n\nconst DailyItems = styled(FlexView)<{ $addedMonthBreak?: boolean }>`\n  margin-top: ${({ $addedMonthBreak }) =>\n    $addedMonthBreak\n      ? '-108px' // 64px card height + 16px(separator) + 16(date text) + 12(separator)\n      : '0'};\n  z-index: 1;\n`;\n\nconst DateText = styled(Text)`\n  line-height: 8px;\n`;\n\nexport { DailyTimelineContainer, DailyItems, ScrollWrapper, DateText };\n"],"names":["ScrollWrapper","styled","FlexView","DailyTimelineContainer","DailyItems","$addedMonthBreak","DateText","Text"],"mappings":";;;AAKM,MAAAA,IAAgBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,GAO/BC,IAAyBF,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,GAMxCE,IAAaH,EAAOC,CAAQ;AAAA,gBAClB,CAAC,EAAE,kBAAAG,EAAA,MACfA,IACI,WACA,GAAG;AAAA;AAAA,GAILC,IAAWL,EAAOM,CAAI;AAAA;AAAA;"}

package/dist/features/timeline/daily-timeline-view.js

@@ -2,10 +2,9 @@ import { jsxs as s, Fragment as j, jsx as t } from "react/jsx-runtime";
 import { getDayMonthYear as D } from "./comps/utils.js";
 import w from "../ui/layout/flex-view.js";
 import x from "./comps/year-break/year-break.js";
-import m from "../ui/separator/separator.js";
+import a from "../ui/separator/separator.js";
 import A from "./comps/month-break/month-break.js";
-import { DailyItems as B } from "./daily-timeline-styled.js";
-import C from "../ui/text/text.js";
+import { DailyItems as B, DateText as C } from "./daily-timeline-styled.js";
 import I from "./comps/daily-timeline-items/daily-timeline-items.js";
 import S from "./comps/no-activity.js";
 import { CARD_TYPE as k } from "./daily-timeline-types.js";
@@ -20,7 +19,7 @@ const b = ({
   studentId: L,
   userType: T
 }) => {
-  const { daily_logs: r, from_date: a, to_date: h } = $, N = u(a), f = u(h), { day: y, month: c, monthName: O } = D(N), {
+  const { daily_logs: r, from_date: m, to_date: h } = $, N = u(m), f = u(h), { day: y, month: c, monthName: O } = D(N), {
     day: p,
     month: d,
     year: X,
@@ -29,7 +28,7 @@ const b = ({
   return r ? /* @__PURE__ */ s(w, { children: [
     !n && /* @__PURE__ */ s(j, { children: [
       /* @__PURE__ */ t(x, { toYear: X, isLastDayOfYear: e }),
-      !e && c && e && /* @__PURE__ */ t(m, { heightX: 1 }),
+      !e && c && e && /* @__PURE__ */ t(a, { heightX: 1 }),
       /* @__PURE__ */ t(
         A,
         {
@@ -45,9 +44,9 @@ const b = ({
         $gutterX: 1,
         $addedMonthBreak: !!(i && d && !n),
         children: [
-          /* @__PURE__ */ t(m, { heightX: 1 }),
-          /* @__PURE__ */ t(C, { $renderAs: "ac4", $color: "BLACK_T_60", children: a === h ? `${y} ${O}` : `${y} - ${p} ${Y}` }),
-          /* @__PURE__ */ t(m, { heightX: 0.75 }),
+          /* @__PURE__ */ t(a, { heightX: 1 }),
+          /* @__PURE__ */ t(C, { $renderAs: "ac4", $color: "BLACK_T_60", children: m === h ? `${y} ${O}` : `${y} - ${p} ${Y}` }),
+          /* @__PURE__ */ t(a, { heightX: 0.75 }),
           r.length > 0 ? r.map((o, l) => /* @__PURE__ */ t(
             I,
             {
@@ -60,12 +59,12 @@ const b = ({
               userType: T,
               shouldShowTag: g && o.course_stream !== k.CIRCLE,
               isLastItem: l === r.length - 1,
-              fromDate: a,
+              fromDate: m,
               studentId: L
             },
             `timeline-${l}`
           )) : /* @__PURE__ */ t(S, {}),
-          /* @__PURE__ */ t(m, { heightX: 1 })
+          /* @__PURE__ */ t(a, { heightX: 1 })
         ]
       }
     )

package/dist/features/timeline/daily-timeline-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"daily-timeline-view.js","sources":["../../../src/features/timeline/daily-timeline-view.tsx"],"sourcesContent":["import { isLastDayOfMonth, parseISO } from 'date-fns';\nimport { type FC } from 'react';\n\nimport { getDayMonthYear } from './comps/utils';\nimport FlexView from '../ui/layout/flex-view';\nimport YearBreak from './comps/year-break/year-break';\nimport Separator from '../ui/separator/separator';\nimport MonthBreak from './comps/month-break/month-break';\nimport * as Styled from './daily-timeline-styled';\nimport Text from '../ui/text/text';\nimport DailyTimelineItems from './comps/daily-timeline-items/daily-timeline-items';\nimport NoActivity from './comps/no-activity';\nimport { CARD_TYPE, type IDailyTimelineItemsProps } from './daily-timeline-types';\n\nconst DailyTimelineView: FC<IDailyTimelineItemsProps> = ({\n  entry,\n  isFirstElement,\n  onPuzzleClick,\n  onReviewClick,\n  shouldShowTag,\n  studentId,\n  userType,\n}) => {\n  const { daily_logs: dailyLogs, from_date: fromDate, to_date: toDate } = entry;\n  const fromDateObj = parseISO(fromDate);\n  const toDateObj = parseISO(toDate);\n\n  const { day: fromDay, month: fromMonth, monthName: fromMonthName } = getDayMonthYear(fromDateObj);\n\n  const {\n    day: toDay,\n    month: toMonth,\n    year: toYear,\n    monthName: toMonthName,\n  } = getDayMonthYear(toDateObj);\n\n  const isLastDayOfMth = isLastDayOfMonth(toDateObj);\n  const isLastDayOfYear = isLastDayOfMth && toMonth === 12 && toDay === 31;\n\n  if (!dailyLogs) {\n    return null;\n  }\n\n  return (\n    <FlexView>\n      {!isFirstElement && (\n        <>\n          <YearBreak toYear={toYear} isLastDayOfYear={isLastDayOfYear} />\n          {!isLastDayOfYear && fromMonth && isLastDayOfYear && <Separator heightX={1} />}\n          <MonthBreak\n            fromMonth={fromMonth}\n            isLastDayOfMth={isLastDayOfMth}\n            isLastDayOfYear={isLastDayOfYear}\n          />\n        </>\n      )}\n      <Styled.DailyItems\n        $gutterX={1}\n        $addedMonthBreak={!!(isLastDayOfMth && toMonth && !isFirstElement)}\n      >\n        <Separator heightX={1} />\n        <Text $renderAs=\"ac4\" $color=\"BLACK_T_60\">\n          {fromDate === toDate\n            ? `${fromDay} ${fromMonthName}`\n            : `${fromDay} - ${toDay} ${toMonthName}`}\n        </Text>\n        <Separator heightX={0.75} />\n        {dailyLogs.length > 0 ? (\n          dailyLogs.map((log, logIndex) => (\n            <DailyTimelineItems\n              key={`timeline-${logIndex}`}\n              type={log.type}\n              summary={log.summary ?? ''}\n              courseStream={log.course_stream}\n              cards={log.cards}\n              onPuzzleClick={onPuzzleClick}\n              onReviewClick={onReviewClick}\n              userType={userType}\n              shouldShowTag={shouldShowTag && log.course_stream !== CARD_TYPE.CIRCLE}\n              isLastItem={logIndex === dailyLogs.length - 1}\n              fromDate={fromDate}\n              studentId={studentId}\n            />\n          ))\n        ) : (\n          <NoActivity />\n        )}\n        <Separator heightX={1} />\n      </Styled.DailyItems>\n    </FlexView>\n  );\n};\n\nDailyTimelineView.displayName = 'DailyTimelineView';\n\nexport default DailyTimelineView;\n"],"names":["DailyTimelineView","entry","isFirstElement","onPuzzleClick","onReviewClick","shouldShowTag","studentId","userType","dailyLogs","fromDate","toDate","fromDateObj","parseISO","toDateObj","fromDay","fromMonth","fromMonthName","getDayMonthYear","toDay","toMonth","toYear","toMonthName","isLastDayOfMth","isLastDayOfMonth","isLastDayOfYear","FlexView","jsxs","Fragment","jsx","YearBreak","Separator","MonthBreak","Styled.DailyItems","Text","log","logIndex","DailyTimelineItems","CARD_TYPE","NoActivity"],"mappings":";;;;;;;;;;;;;AAcA,MAAMA,IAAkD,CAAC;AAAA,EACvD,OAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,eAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AACF,MAAM;AACJ,QAAM,EAAE,YAAYC,GAAW,WAAWC,GAAU,SAASC,EAAW,IAAAT,GAClEU,IAAcC,EAASH,CAAQ,GAC/BI,IAAYD,EAASF,CAAM,GAE3B,EAAE,KAAKI,GAAS,OAAOC,GAAW,WAAWC,EAAkB,IAAAC,EAAgBN,CAAW,GAE1F;AAAA,IACJ,KAAKO;AAAA,IACL,OAAOC;AAAA,IACP,MAAMC;AAAA,IACN,WAAWC;AAAA,EAAA,IACTJ,EAAgBJ,CAAS,GAEvBS,IAAiBC,EAAiBV,CAAS,GAC3CW,IAAkBF,KAAkBH,MAAY,MAAMD,MAAU;AAEtE,SAAKV,sBAKFiB,GACE,EAAA,UAAA;AAAA,IAAA,CAACvB,KAEE,gBAAAwB,EAAAC,GAAA,EAAA,UAAA;AAAA,MAAC,gBAAAC,EAAAC,GAAA,EAAU,QAAAT,GAAgB,iBAAAI,EAAkC,CAAA;AAAA,MAC5D,CAACA,KAAmBT,KAAaS,KAAoB,gBAAAI,EAAAE,GAAA,EAAU,SAAS,GAAG;AAAA,MAC5E,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,WAAAhB;AAAA,UACA,gBAAAO;AAAA,UACA,iBAAAE;AAAA,QAAA;AAAA,MACF;AAAA,IAAA,GACF;AAAA,IAEF,gBAAAE;AAAA,MAACM;AAAAA,MAAA;AAAA,QACC,UAAU;AAAA,QACV,kBAAkB,CAAC,EAAEV,KAAkBH,KAAW,CAACjB;AAAA,QAEnD,UAAA;AAAA,UAAC,gBAAA0B,EAAAE,GAAA,EAAU,SAAS,EAAG,CAAA;AAAA,4BACtBG,GAAK,EAAA,WAAU,OAAM,QAAO,cAC1B,gBAAavB,IACV,GAAGI,CAAO,IAAIE,CAAa,KAC3B,GAAGF,CAAO,MAAMI,CAAK,IAAIG,CAAW,IAC1C;AAAA,UACA,gBAAAO,EAACE,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,UACzBtB,EAAU,SAAS,IAClBA,EAAU,IAAI,CAAC0B,GAAKC,MAClB,gBAAAP;AAAA,YAACQ;AAAA,YAAA;AAAA,cAEC,MAAMF,EAAI;AAAA,cACV,SAASA,EAAI,WAAW;AAAA,cACxB,cAAcA,EAAI;AAAA,cAClB,OAAOA,EAAI;AAAA,cACX,eAAA/B;AAAA,cACA,eAAAC;AAAA,cACA,UAAAG;AAAA,cACA,eAAeF,KAAiB6B,EAAI,kBAAkBG,EAAU;AAAA,cAChE,YAAYF,MAAa3B,EAAU,SAAS;AAAA,cAC5C,UAAAC;AAAA,cACA,WAAAH;AAAA,YAAA;AAAA,YAXK,YAAY6B,CAAQ;AAAA,UAAA,CAa5B,IAED,gBAAAP,EAACU,GAAW,EAAA;AAAA,UAEd,gBAAAV,EAACE,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACzB;AAAA,EACF,EAAA,CAAA,IAjDO;AAmDX;AAEA9B,EAAkB,cAAc;"}
+{"version":3,"file":"daily-timeline-view.js","sources":["../../../src/features/timeline/daily-timeline-view.tsx"],"sourcesContent":["import { isLastDayOfMonth, parseISO } from 'date-fns';\nimport { type FC } from 'react';\n\nimport { getDayMonthYear } from './comps/utils';\nimport FlexView from '../ui/layout/flex-view';\nimport YearBreak from './comps/year-break/year-break';\nimport Separator from '../ui/separator/separator';\nimport MonthBreak from './comps/month-break/month-break';\nimport * as Styled from './daily-timeline-styled';\nimport DailyTimelineItems from './comps/daily-timeline-items/daily-timeline-items';\nimport NoActivity from './comps/no-activity';\nimport { CARD_TYPE, type IDailyTimelineItemsProps } from './daily-timeline-types';\n\nconst DailyTimelineView: FC<IDailyTimelineItemsProps> = ({\n  entry,\n  isFirstElement,\n  onPuzzleClick,\n  onReviewClick,\n  shouldShowTag,\n  studentId,\n  userType,\n}) => {\n  const { daily_logs: dailyLogs, from_date: fromDate, to_date: toDate } = entry;\n  const fromDateObj = parseISO(fromDate);\n  const toDateObj = parseISO(toDate);\n\n  const { day: fromDay, month: fromMonth, monthName: fromMonthName } = getDayMonthYear(fromDateObj);\n\n  const {\n    day: toDay,\n    month: toMonth,\n    year: toYear,\n    monthName: toMonthName,\n  } = getDayMonthYear(toDateObj);\n\n  const isLastDayOfMth = isLastDayOfMonth(toDateObj);\n  const isLastDayOfYear = isLastDayOfMth && toMonth === 12 && toDay === 31;\n\n  if (!dailyLogs) {\n    return null;\n  }\n\n  return (\n    <FlexView>\n      {!isFirstElement && (\n        <>\n          <YearBreak toYear={toYear} isLastDayOfYear={isLastDayOfYear} />\n          {!isLastDayOfYear && fromMonth && isLastDayOfYear && <Separator heightX={1} />}\n          <MonthBreak\n            fromMonth={fromMonth}\n            isLastDayOfMth={isLastDayOfMth}\n            isLastDayOfYear={isLastDayOfYear}\n          />\n        </>\n      )}\n      <Styled.DailyItems\n        $gutterX={1}\n        $addedMonthBreak={!!(isLastDayOfMth && toMonth && !isFirstElement)}\n      >\n        <Separator heightX={1} />\n        <Styled.DateText $renderAs=\"ac4\" $color=\"BLACK_T_60\">\n          {fromDate === toDate\n            ? `${fromDay} ${fromMonthName}`\n            : `${fromDay} - ${toDay} ${toMonthName}`}\n        </Styled.DateText>\n        <Separator heightX={0.75} />\n        {dailyLogs.length > 0 ? (\n          dailyLogs.map((log, logIndex) => (\n            <DailyTimelineItems\n              key={`timeline-${logIndex}`}\n              type={log.type}\n              summary={log.summary ?? ''}\n              courseStream={log.course_stream}\n              cards={log.cards}\n              onPuzzleClick={onPuzzleClick}\n              onReviewClick={onReviewClick}\n              userType={userType}\n              shouldShowTag={shouldShowTag && log.course_stream !== CARD_TYPE.CIRCLE}\n              isLastItem={logIndex === dailyLogs.length - 1}\n              fromDate={fromDate}\n              studentId={studentId}\n            />\n          ))\n        ) : (\n          <NoActivity />\n        )}\n        <Separator heightX={1} />\n      </Styled.DailyItems>\n    </FlexView>\n  );\n};\n\nDailyTimelineView.displayName = 'DailyTimelineView';\n\nexport default DailyTimelineView;\n"],"names":["DailyTimelineView","entry","isFirstElement","onPuzzleClick","onReviewClick","shouldShowTag","studentId","userType","dailyLogs","fromDate","toDate","fromDateObj","parseISO","toDateObj","fromDay","fromMonth","fromMonthName","getDayMonthYear","toDay","toMonth","toYear","toMonthName","isLastDayOfMth","isLastDayOfMonth","isLastDayOfYear","FlexView","jsxs","Fragment","jsx","YearBreak","Separator","MonthBreak","Styled.DailyItems","Styled.DateText","log","logIndex","DailyTimelineItems","CARD_TYPE","NoActivity"],"mappings":";;;;;;;;;;;;AAaA,MAAMA,IAAkD,CAAC;AAAA,EACvD,OAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,eAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AACF,MAAM;AACJ,QAAM,EAAE,YAAYC,GAAW,WAAWC,GAAU,SAASC,EAAW,IAAAT,GAClEU,IAAcC,EAASH,CAAQ,GAC/BI,IAAYD,EAASF,CAAM,GAE3B,EAAE,KAAKI,GAAS,OAAOC,GAAW,WAAWC,EAAkB,IAAAC,EAAgBN,CAAW,GAE1F;AAAA,IACJ,KAAKO;AAAA,IACL,OAAOC;AAAA,IACP,MAAMC;AAAA,IACN,WAAWC;AAAA,EAAA,IACTJ,EAAgBJ,CAAS,GAEvBS,IAAiBC,EAAiBV,CAAS,GAC3CW,IAAkBF,KAAkBH,MAAY,MAAMD,MAAU;AAEtE,SAAKV,sBAKFiB,GACE,EAAA,UAAA;AAAA,IAAA,CAACvB,KAEE,gBAAAwB,EAAAC,GAAA,EAAA,UAAA;AAAA,MAAC,gBAAAC,EAAAC,GAAA,EAAU,QAAAT,GAAgB,iBAAAI,EAAkC,CAAA;AAAA,MAC5D,CAACA,KAAmBT,KAAaS,KAAoB,gBAAAI,EAAAE,GAAA,EAAU,SAAS,GAAG;AAAA,MAC5E,gBAAAF;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,WAAAhB;AAAA,UACA,gBAAAO;AAAA,UACA,iBAAAE;AAAA,QAAA;AAAA,MACF;AAAA,IAAA,GACF;AAAA,IAEF,gBAAAE;AAAA,MAACM;AAAAA,MAAA;AAAA,QACC,UAAU;AAAA,QACV,kBAAkB,CAAC,EAAEV,KAAkBH,KAAW,CAACjB;AAAA,QAEnD,UAAA;AAAA,UAAC,gBAAA0B,EAAAE,GAAA,EAAU,SAAS,EAAG,CAAA;AAAA,UACvB,gBAAAF,EAACK,GAAA,EAAgB,WAAU,OAAM,QAAO,cACrC,UAAaxB,MAAAC,IACV,GAAGI,CAAO,IAAIE,CAAa,KAC3B,GAAGF,CAAO,MAAMI,CAAK,IAAIG,CAAW,IAC1C;AAAA,UACA,gBAAAO,EAACE,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,UACzBtB,EAAU,SAAS,IAClBA,EAAU,IAAI,CAAC0B,GAAKC,MAClB,gBAAAP;AAAA,YAACQ;AAAA,YAAA;AAAA,cAEC,MAAMF,EAAI;AAAA,cACV,SAASA,EAAI,WAAW;AAAA,cACxB,cAAcA,EAAI;AAAA,cAClB,OAAOA,EAAI;AAAA,cACX,eAAA/B;AAAA,cACA,eAAAC;AAAA,cACA,UAAAG;AAAA,cACA,eAAeF,KAAiB6B,EAAI,kBAAkBG,EAAU;AAAA,cAChE,YAAYF,MAAa3B,EAAU,SAAS;AAAA,cAC5C,UAAAC;AAAA,cACA,WAAAH;AAAA,YAAA;AAAA,YAXK,YAAY6B,CAAQ;AAAA,UAAA,CAa5B,IAED,gBAAAP,EAACU,GAAW,EAAA;AAAA,UAEd,gBAAAV,EAACE,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACzB;AAAA,EACF,EAAA,CAAA,IAjDO;AAmDX;AAEA9B,EAAkB,cAAc;"}

package/dist/features/timeline/monthly-report/api/use-monthly-report-get.js

@@ -0,0 +1,13 @@
+import { createGetAPI as r, createPatchAPI as o } from "@cuemath/rest-api";
+import { BASE_URL_V1 as e } from "../../../../constants/api.js";
+const { useGet: p, invalidate: a } = r({
+  getURL: (t) => `${e}/monthly-progress-reports/${t}`
+}), { usePatch: h } = o({
+  getURL: (t) => `${e}/monthly-progress-reports/${t}`
+});
+export {
+  a as invalidateMonthlyReport,
+  p as useMonthlyReportGet,
+  h as useMonthlyReportPatch
+};
+//# sourceMappingURL=use-monthly-report-get.js.map

package/dist/features/timeline/monthly-report/api/use-monthly-report-get.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-monthly-report-get.js","sources":["../../../../../src/features/timeline/monthly-report/api/use-monthly-report-get.ts"],"sourcesContent":["import { createGetAPI, createPatchAPI } from '@cuemath/rest-api';\n\nimport { BASE_URL_V1 } from '../../../../constants/api';\nimport { type IMonthlyReportResponse } from '../monthly-report-types';\n\nconst { useGet: useMonthlyReportGet, invalidate: invalidateMonthlyReport } =\n  createGetAPI<IMonthlyReportResponse>({\n    getURL: (reportId: string) => {\n      return `${BASE_URL_V1}/monthly-progress-reports/${reportId}`;\n    },\n  });\n\nconst { usePatch: useMonthlyReportPatch } = createPatchAPI<\n  IMonthlyReportResponse,\n  { feedback: string }\n>({\n  getURL: (reportId: string) => {\n    return `${BASE_URL_V1}/monthly-progress-reports/${reportId}`;\n  },\n});\n\nexport { useMonthlyReportGet, useMonthlyReportPatch, invalidateMonthlyReport };\n"],"names":["useMonthlyReportGet","invalidateMonthlyReport","createGetAPI","reportId","BASE_URL_V1","useMonthlyReportPatch","createPatchAPI"],"mappings":";;AAKA,MAAM,EAAE,QAAQA,GAAqB,YAAYC,EAAA,IAC/CC,EAAqC;AAAA,EACnC,QAAQ,CAACC,MACA,GAAGC,CAAW,6BAA6BD,CAAQ;AAE9D,CAAC,GAEG,EAAE,UAAUE,EAAsB,IAAIC,EAG1C;AAAA,EACA,QAAQ,CAACH,MACA,GAAGC,CAAW,6BAA6BD,CAAQ;AAE9D,CAAC;"}

package/dist/features/timeline/monthly-report/comps/achievements/achievements.js

@@ -0,0 +1,68 @@
+import { jsx as r, jsxs as m } from "react/jsx-runtime";
+import { useRef as c, useMemo as a } from "react";
+import { CarousalItem as u, CarouselWrapper as f } from "./achievements.styled.js";
+import l from "../../../../ui/text/text.js";
+import n from "../../../../ui/separator/separator.js";
+import p from "../../../../ui/layout/flex-view.js";
+import x from "../../../../ui/swipable-carousel/swipable-carousel.js";
+import { IS_APP_RUNNING_IN_RN as t } from "../../../../../constants/app-config.js";
+const S = ({ achievements: o, studentName: e }) => {
+  const h = c(null), s = a(
+    () => o.map((i) => /* @__PURE__ */ r(
+      u,
+      {
+        src: i.url,
+        alt: `Achievement ${i.asset_id}`,
+        withLoader: !0,
+        height: t ? "343px" : "480px",
+        width: t ? "343px" : "480px"
+      },
+      i.asset_id
+    )),
+    [o]
+  ), d = a(
+    () => o.length >= 2 ? `Outstanding month! ${e} earned several achievements showing excellent progress across different areas.` : `Great work! ${e} earned new achievements this month, demonstrating growth in their skills.`,
+    [o.length, e]
+  ), g = !t && s.length > 1;
+  return o != null && o.length ? /* @__PURE__ */ m(p, { children: [
+    /* @__PURE__ */ r(l, { $renderAs: "ab1-bold", color: "BLACK_1", children: "Achievements" }),
+    /* @__PURE__ */ r(n, { heightX: 0.125 }),
+    /* @__PURE__ */ r(p, { $marginBottom: -24, children: /* @__PURE__ */ r(l, { $renderAs: "ub2", color: "BLUE_6", children: d }) }),
+    t && /* @__PURE__ */ r(n, { heightX: 1 }),
+    /* @__PURE__ */ r(
+      f,
+      {
+        $height: t ? "380px" : "580px",
+        $marginBottomX: t ? -0.5 : -1,
+        children: /* @__PURE__ */ r(
+          x,
+          {
+            ref: h,
+            items: s,
+            defaultIndex: 0,
+            transitionDuration: 300,
+            showDots: !0,
+            dotsConfig: {
+              dotColor: "BLACK_1",
+              inactiveDotColor: "WHITE_1",
+              activeIndicatorSize: "8px",
+              inactiveIndicatorSize: "8px",
+              spacing: "8px"
+            },
+            showNavigationButtons: g,
+            navigationConfig: {
+              buttonVariant: "secondary",
+              buttonSize: "xsmall",
+              spacing: 8
+            }
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ r(n, { heightX: 0.75 })
+  ] }) : null;
+};
+export {
+  S as default
+};
+//# sourceMappingURL=achievements.js.map

package/dist/features/timeline/monthly-report/comps/achievements/achievements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"achievements.js","sources":["../../../../../../src/features/timeline/monthly-report/comps/achievements/achievements.tsx"],"sourcesContent":["import { useMemo, useRef, type FC } from 'react';\n\nimport { type IAchievementsProps } from './achievements-types';\nimport type { ISwipableCarouselRefs } from '../../../../ui/swipable-carousel/swipable-carousel-types';\nimport * as Styled from './achievements.styled';\nimport Text from '../../../../ui/text/text';\nimport Separator from '../../../../ui/separator/separator';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport SwipableCarousel from '../../../../ui/swipable-carousel/swipable-carousel';\nimport { IS_APP_RUNNING_IN_RN } from '../../../../../constants/app-config';\n\nconst Achievements: FC<IAchievementsProps> = ({ achievements, studentName }) => {\n  const carouselRef = useRef<ISwipableCarouselRefs>(null);\n\n  const carouselItems = useMemo(\n    () =>\n      achievements.map(achievement => (\n        <Styled.CarousalItem\n          key={achievement.asset_id}\n          src={achievement.url}\n          alt={`Achievement ${achievement.asset_id}`}\n          withLoader\n          height={IS_APP_RUNNING_IN_RN ? '343px' : '480px'}\n          width={IS_APP_RUNNING_IN_RN ? '343px' : '480px'}\n        />\n      )),\n    [achievements],\n  );\n\n  const tipText = useMemo(\n    () =>\n      achievements.length >= 2\n        ? `Outstanding month! ${studentName} earned several achievements showing excellent progress across different areas.`\n        : `Great work! ${studentName} earned new achievements this month, demonstrating growth in their skills.`,\n    [achievements.length, studentName],\n  );\n\n  const showNavigationButtons = !IS_APP_RUNNING_IN_RN && carouselItems.length > 1;\n\n  if (!achievements?.length) {\n    return null;\n  }\n\n  return (\n    <FlexView>\n      <Text $renderAs=\"ab1-bold\" color=\"BLACK_1\">\n        Achievements\n      </Text>\n      <Separator heightX={0.125} />\n      <FlexView $marginBottom={-24}>\n        <Text $renderAs=\"ub2\" color=\"BLUE_6\">\n          {tipText}\n        </Text>\n      </FlexView>\n      {IS_APP_RUNNING_IN_RN && <Separator heightX={1} />}\n      <Styled.CarouselWrapper\n        $height={IS_APP_RUNNING_IN_RN ? '380px' : '580px'}\n        $marginBottomX={IS_APP_RUNNING_IN_RN ? -0.5 : -1}\n      >\n        <SwipableCarousel\n          ref={carouselRef}\n          items={carouselItems}\n          defaultIndex={0}\n          transitionDuration={300}\n          showDots={true}\n          dotsConfig={{\n            dotColor: 'BLACK_1',\n            inactiveDotColor: 'WHITE_1',\n            activeIndicatorSize: '8px',\n            inactiveIndicatorSize: '8px',\n            spacing: '8px',\n          }}\n          showNavigationButtons={showNavigationButtons}\n          navigationConfig={{\n            buttonVariant: 'secondary',\n            buttonSize: 'xsmall',\n            spacing: 8,\n          }}\n        />\n      </Styled.CarouselWrapper>\n      <Separator heightX={0.75} />\n    </FlexView>\n  );\n};\n\nexport default Achievements;\n"],"names":["Achievements","achievements","studentName","carouselRef","useRef","carouselItems","useMemo","achievement","jsx","Styled.CarousalItem","IS_APP_RUNNING_IN_RN","tipText","showNavigationButtons","FlexView","Text","Separator","Styled.CarouselWrapper","SwipableCarousel"],"mappings":";;;;;;;;AAWA,MAAMA,IAAuC,CAAC,EAAE,cAAAC,GAAc,aAAAC,QAAkB;AACxE,QAAAC,IAAcC,EAA8B,IAAI,GAEhDC,IAAgBC;AAAA,IACpB,MACEL,EAAa,IAAI,CACfM,MAAA,gBAAAC;AAAA,MAACC;AAAAA,MAAA;AAAA,QAEC,KAAKF,EAAY;AAAA,QACjB,KAAK,eAAeA,EAAY,QAAQ;AAAA,QACxC,YAAU;AAAA,QACV,QAAQG,IAAuB,UAAU;AAAA,QACzC,OAAOA,IAAuB,UAAU;AAAA,MAAA;AAAA,MALnCH,EAAY;AAAA,IAAA,CAOpB;AAAA,IACH,CAACN,CAAY;AAAA,EAAA,GAGTU,IAAUL;AAAA,IACd,MACEL,EAAa,UAAU,IACnB,sBAAsBC,CAAW,oFACjC,eAAeA,CAAW;AAAA,IAChC,CAACD,EAAa,QAAQC,CAAW;AAAA,EAAA,GAG7BU,IAAwB,CAACF,KAAwBL,EAAc,SAAS;AAE1E,SAACJ,KAAA,QAAAA,EAAc,2BAKhBY,GACC,EAAA,UAAA;AAAA,IAAA,gBAAAL,EAACM,GAAK,EAAA,WAAU,YAAW,OAAM,WAAU,UAE3C,gBAAA;AAAA,IACA,gBAAAN,EAACO,GAAU,EAAA,SAAS,MAAO,CAAA;AAAA,IAC3B,gBAAAP,EAACK,GAAS,EAAA,eAAe,KACvB,UAAA,gBAAAL,EAACM,GAAK,EAAA,WAAU,OAAM,OAAM,UACzB,UAAAH,EACH,CAAA,GACF;AAAA,IACCD,KAAwB,gBAAAF,EAACO,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,IAChD,gBAAAP;AAAA,MAACQ;AAAAA,MAAA;AAAA,QACC,SAASN,IAAuB,UAAU;AAAA,QAC1C,gBAAgBA,IAAuB,OAAO;AAAA,QAE9C,UAAA,gBAAAF;AAAA,UAACS;AAAA,UAAA;AAAA,YACC,KAAKd;AAAA,YACL,OAAOE;AAAA,YACP,cAAc;AAAA,YACd,oBAAoB;AAAA,YACpB,UAAU;AAAA,YACV,YAAY;AAAA,cACV,UAAU;AAAA,cACV,kBAAkB;AAAA,cAClB,qBAAqB;AAAA,cACrB,uBAAuB;AAAA,cACvB,SAAS;AAAA,YACX;AAAA,YACA,uBAAAO;AAAA,YACA,kBAAkB;AAAA,cAChB,eAAe;AAAA,cACf,YAAY;AAAA,cACZ,SAAS;AAAA,YACX;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,IACA,gBAAAJ,EAACO,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,EAC5B,EAAA,CAAA,IAzCO;AA2CX;"}

package/dist/features/timeline/monthly-report/comps/achievements/achievements.styled.js

@@ -0,0 +1,15 @@
+import o from "styled-components";
+import t from "../../../../ui/image/image.js";
+import e from "../../../../ui/layout/flex-view.js";
+const m = o(e)`
+  overflow: hidden;
+  position: relative;
+`, p = o(t)`
+  position: relative;
+  touch-action: auto;
+`;
+export {
+  p as CarousalItem,
+  m as CarouselWrapper
+};
+//# sourceMappingURL=achievements.styled.js.map

package/dist/features/timeline/monthly-report/comps/achievements/achievements.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"achievements.styled.js","sources":["../../../../../../src/features/timeline/monthly-report/comps/achievements/achievements.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport Image from '../../../../ui/image/image';\nimport FlexView from '../../../../ui/layout/flex-view';\n\nexport const CarouselWrapper = styled(FlexView)`\n  overflow: hidden;\n  position: relative;\n`;\n\nexport const CarousalItem = styled(Image)`\n  position: relative;\n  touch-action: auto;\n`;\n"],"names":["CarouselWrapper","styled","FlexView","CarousalItem","Image"],"mappings":";;;AAKa,MAAAA,IAAkBC,EAAOC,CAAQ;AAAA;AAAA;AAAA,GAKjCC,IAAeF,EAAOG,CAAK;AAAA;AAAA;AAAA;"}