@cuemath/leap 3.5.29 → 3.5.30-as10

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

@@ -0,0 +1,60 @@
+import { jsx as r, jsxs as c } from "react/jsx-runtime";
+import { useRef as g, useMemo as n } from "react";
+import { CarousalItem as m, CarouselWrapper as f } from "./achievements.styled.js";
+import s from "../../../../ui/text/text.js";
+import l from "../../../../ui/separator/separator.js";
+import a from "../../../../ui/layout/flex-view.js";
+import x from "../../../../ui/swipable-carousel/swipable-carousel.js";
+import { IS_APP_RUNNING_IN_RN as p } from "../../../../../constants/app-config.js";
+const B = ({ achievements: o, studentName: t }) => {
+  const d = g(null), i = n(
+    () => o.map((e) => /* @__PURE__ */ r(
+      m,
+      {
+        src: e.url,
+        alt: `Achievement ${e.asset_id}`,
+        withLoader: !0,
+        height: p ? "343px" : "480px"
+      },
+      e.asset_id
+    )),
+    [o]
+  ), h = n(
+    () => o.length >= 2 ? `Outstanding month! ${t} earned several achievements showing excellent progress across different areas.` : `Great work! ${t} earned new achievements this month, demonstrating growth in their skills.`,
+    [o.length, t]
+  ), u = !p && i.length > 1;
+  return o != null && o.length ? /* @__PURE__ */ c(a, { children: [
+    /* @__PURE__ */ r(s, { $renderAs: "ab1-bold", color: "BLACK_1", children: "Achievements" }),
+    /* @__PURE__ */ r(l, { heightX: 0.125 }),
+    /* @__PURE__ */ r(a, { $marginBottom: -24, children: /* @__PURE__ */ r(s, { $renderAs: "ub2", color: "BLUE_6", children: h }) }),
+    /* @__PURE__ */ r(f, { $height: "580px", children: /* @__PURE__ */ r(
+      x,
+      {
+        ref: d,
+        items: i,
+        defaultIndex: 0,
+        transitionDuration: 300,
+        showDots: !0,
+        dotsConfig: {
+          dotColor: "BLACK_1",
+          inactiveDotColor: "WHITE_1",
+          activeIndicatorSize: "8px",
+          inactiveIndicatorSize: "8px",
+          spacing: "8px"
+        },
+        showNavigationButtons: u,
+        navigationConfig: {
+          buttonVariant: "secondary",
+          buttonSize: "xsmall",
+          spacing: 8,
+          hideOnMobile: !0
+        }
+      }
+    ) }),
+    /* @__PURE__ */ r(l, { heightX: 0.75 })
+  ] }) : null;
+};
+export {
+  B 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        />\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      <Styled.CarouselWrapper $height=\"580px\">\n        <SwipableCarousel\n          ref={carouselRef}\n          items={carouselItems}\n          defaultIndex={0}\n          transitionDuration={300}\n          // onIndexChange={handleIndexChange}\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            hideOnMobile: true,\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,MAAA;AAAA,MAJpCH,EAAY;AAAA,IAAA,CAMpB;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,IACC,gBAAAH,EAAAQ,GAAA,EAAuB,SAAQ,SAC9B,UAAA,gBAAAR;AAAA,MAACS;AAAA,MAAA;AAAA,QACC,KAAKd;AAAA,QACL,OAAOE;AAAA,QACP,cAAc;AAAA,QACd,oBAAoB;AAAA,QAEpB,UAAU;AAAA,QACV,YAAY;AAAA,UACV,UAAU;AAAA,UACV,kBAAkB;AAAA,UAClB,qBAAqB;AAAA,UACrB,uBAAuB;AAAA,UACvB,SAAS;AAAA,QACX;AAAA,QACA,uBAAAO;AAAA,QACA,kBAAkB;AAAA,UAChB,eAAe;AAAA,UACf,YAAY;AAAA,UACZ,SAAS;AAAA,UACT,cAAc;AAAA,QAChB;AAAA,MAAA;AAAA,IAAA,GAEJ;AAAA,IACA,gBAAAJ,EAACO,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,EAC5B,EAAA,CAAA,IAvCO;AAyCX;"}

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;"}

package/dist/features/timeline/monthly-report/comps/activities/activities-card/activities-card.js

@@ -0,0 +1,128 @@
+import { jsxs as l, jsx as r } from "react/jsx-runtime";
+import { memo as D, useRef as R, useState as z, useMemo as g, useCallback as d } from "react";
+import { getCardTypeIconMap as u, stateIcon as p } from "../constants.js";
+import { CARD_TYPE as f } from "../../../monthly-report-types.js";
+import { ActivityCardContainerWrapper as I, ActivityCardContainer as B } from "./activities-card.styled.js";
+import t from "../../../../../ui/layout/flex-view.js";
+import M from "../../../../../ui/lottie-animation/lottie-animation.js";
+import m from "../../../../../ui/text/text.js";
+import S from "../../../../../homework/card-title.js";
+import T from "../activities-card-puzzles/activities-card-puzzles.js";
+import { NODE_STATE as $ } from "../../../../daily-timeline-types.js";
+import k from "../../../../../ui/buttons/text-button/text-button.js";
+import { countActivitiesByState as y } from "../utils.js";
+const G = {
+  autoplay: !1,
+  loop: !0,
+  renderer: "canvas"
+}, j = ({
+  cardType: n,
+  nodeType: A,
+  activitiesList: o = [],
+  onPuzzleClick: C
+}) => {
+  const a = R(null), [s, b] = z(!1), x = g(() => {
+    const { totalDone: e, totalPending: i, totalOverdue: c } = y(o);
+    return [
+      e > 0 && `${e} Done`,
+      i > 0 && `${i} In-progress`,
+      c > 0 && `${c} Overdue`
+    ].filter(Boolean).join(", ");
+  }, [o]), { displayedActivities: X, remainingCount: h } = g(() => {
+    if (n === f.puzzle)
+      return { displayedActivities: o, remainingCount: 0 };
+    const e = 3, i = o.length > e;
+    return s || !i ? { displayedActivities: o, remainingCount: 0 } : {
+      displayedActivities: o.slice(0, e),
+      remainingCount: o.length - e
+    };
+  }, [o, s, n]), E = d(() => {
+    var e;
+    (e = a.current) == null || e.play();
+  }, []), w = d(() => {
+    var e;
+    (e = a.current) == null || e.stop();
+  }, []), _ = d(() => {
+    b((e) => !e);
+  }, []);
+  return /* @__PURE__ */ l(t, { onMouseEnter: E, onMouseLeave: w, children: [
+    /* @__PURE__ */ r(
+      I,
+      {
+        $background: u(n).color,
+        children: /* @__PURE__ */ l(
+          B,
+          {
+            $flexDirection: "row",
+            $alignItems: "center",
+            $height: "56px",
+            $bgImage: u(n).background,
+            $gutterX: 0.78125,
+            $flexGap: 8.5,
+            children: [
+              /* @__PURE__ */ r(
+                t,
+                {
+                  $widthX: 2,
+                  $heightX: 2,
+                  $borderRadiusX: 2,
+                  $background: "WHITE_1",
+                  $position: "relative",
+                  $alignItems: "center",
+                  $justifyContent: "center",
+                  children: /* @__PURE__ */ r(
+                    M,
+                    {
+                      ref: a,
+                      src: u(n).lottie,
+                      width: 32,
+                      height: 32,
+                      settings: G
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ l(t, { children: [
+                /* @__PURE__ */ r(S, { cardHeader: n, nodeType: A }),
+                /* @__PURE__ */ r(m, { $renderAs: "ub3", $color: "BLACK_1", children: x })
+              ] })
+            ]
+          }
+        )
+      }
+    ),
+    o.length > 0 && (n === f.puzzle ? /* @__PURE__ */ r(T, { puzzles: o, onPuzzleClick: C }) : /* @__PURE__ */ l(t, { $flexRowGapX: 1.25, $gutterX: 1, $gapX: 1, $borderColor: "GREY_2", children: [
+      X.map(({ state: e, title: i, subtext: c, id: v }) => /* @__PURE__ */ l(t, { $flexDirection: "row", $flexGapX: 1.05, children: [
+        /* @__PURE__ */ r(t, { $gapX: 0.25, children: /* @__PURE__ */ r(
+          t,
+          {
+            $borderRadiusX: 1,
+            $background: e === $.PENDING || e === $.NOT_STARTED ? "RED" : "BLACK_1",
+            $widthX: 1,
+            $heightX: 1,
+            $alignItems: "center",
+            $justifyContent: "center",
+            children: !!e && (p[e] || p[$.COMPLETED])
+          }
+        ) }),
+        /* @__PURE__ */ l(t, { $flexRowGap: 4, children: [
+          /* @__PURE__ */ r(m, { $renderAs: "ub2", $color: "BLACK_1", children: i || "" }),
+          /* @__PURE__ */ r(m, { $renderAs: "ub3", $color: "BLACK_T_60", children: c || "" })
+        ] })
+      ] }, v)),
+      (h > 0 || s) && o.length > 3 && /* @__PURE__ */ r(t, { $gutterX: 2, children: /* @__PURE__ */ r(
+        k,
+        {
+          label: s ? "Show less" : `+${h} activities`,
+          size: "regular",
+          color: "BLACK_1",
+          onClick: _
+        }
+      ) })
+    ] }))
+  ] });
+}, Z = D(j);
+export {
+  Z as default
+};
+//# sourceMappingURL=activities-card.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"activities-card.js","sources":["../../../../../../../src/features/timeline/monthly-report/comps/activities/activities-card/activities-card.tsx"],"sourcesContent":["import { memo, type FC, useRef, useCallback, useMemo, useState } from 'react';\n\nimport { type IActivitiesCardProps } from './activities-card-types';\nimport { getCardTypeIconMap, stateIcon } from '../constants';\nimport { CARD_TYPE } from '../../../monthly-report-types';\nimport * as Styled from './activities-card.styled';\nimport FlexView from '../../../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../../../ui/lottie-animation/lottie-animation';\nimport { type ILottieAnimationRef } from '../../../../../ui/lottie-animation/types';\nimport Text from '../../../../../ui/text/text';\nimport CardTitle from '../../../../../homework/card-title';\nimport { type TColorNames } from '../../../../../ui/types';\nimport ActivitiesCardPuzzles from '../activities-card-puzzles/activities-card-puzzles';\nimport { NODE_STATE } from '../../../../daily-timeline-types';\nimport TextButton from '../../../../../ui/buttons/text-button/text-button';\nimport { countActivitiesByState } from '../utils';\n\nconst lottieSettings = {\n  autoplay: false,\n  loop: true,\n  renderer: 'canvas',\n};\n\nconst ActivitiesCard: FC<IActivitiesCardProps> = ({\n  cardType,\n  nodeType,\n  activitiesList = [],\n  onPuzzleClick,\n}) => {\n  const lottieRef = useRef<ILottieAnimationRef>(null);\n  const [showAllActivities, setShowAllActivities] = useState(false);\n\n  const progressStatus = useMemo(() => {\n    const { totalDone, totalPending, totalOverdue } = countActivitiesByState(activitiesList);\n\n    return [\n      totalDone > 0 && `${totalDone} Done`,\n      totalPending > 0 && `${totalPending} In-progress`,\n      totalOverdue > 0 && `${totalOverdue} Overdue`,\n    ]\n      .filter(Boolean)\n      .join(', ');\n  }, [activitiesList]);\n\n  const { displayedActivities, remainingCount } = useMemo(() => {\n    if (cardType === CARD_TYPE.puzzle) {\n      return { displayedActivities: activitiesList, remainingCount: 0 };\n    }\n\n    const maxVisible = 3;\n    const hasMore = activitiesList.length > maxVisible;\n\n    if (showAllActivities || !hasMore) {\n      return { displayedActivities: activitiesList, remainingCount: 0 };\n    }\n\n    return {\n      displayedActivities: activitiesList.slice(0, maxVisible),\n      remainingCount: activitiesList.length - maxVisible,\n    };\n  }, [activitiesList, showAllActivities, cardType]);\n\n  const handleMouseEnter = useCallback(() => {\n    lottieRef.current?.play();\n  }, []);\n\n  const handleMouseLeave = useCallback(() => {\n    lottieRef.current?.stop();\n  }, []);\n\n  const handleToggleActivities = useCallback(() => {\n    setShowAllActivities(prev => !prev);\n  }, []);\n\n  return (\n    <FlexView onMouseEnter={handleMouseEnter} onMouseLeave={handleMouseLeave}>\n      <Styled.ActivityCardContainerWrapper\n        $background={getCardTypeIconMap(cardType).color as TColorNames}\n      >\n        <Styled.ActivityCardContainer\n          $flexDirection=\"row\"\n          $alignItems=\"center\"\n          $height=\"56px\"\n          $bgImage={getCardTypeIconMap(cardType).background}\n          $gutterX={0.78125}\n          $flexGap={8.5}\n        >\n          <FlexView\n            $widthX={2}\n            $heightX={2}\n            $borderRadiusX={2}\n            $background=\"WHITE_1\"\n            $position=\"relative\"\n            $alignItems=\"center\"\n            $justifyContent=\"center\"\n          >\n            <LottieAnimation\n              ref={lottieRef}\n              src={getCardTypeIconMap(cardType).lottie}\n              width={32}\n              height={32}\n              settings={lottieSettings}\n            />\n          </FlexView>\n          <FlexView>\n            <CardTitle cardHeader={cardType} nodeType={nodeType} />\n            <Text $renderAs=\"ub3\" $color=\"BLACK_1\">\n              {progressStatus}\n            </Text>\n          </FlexView>\n        </Styled.ActivityCardContainer>\n      </Styled.ActivityCardContainerWrapper>\n      {activitiesList.length > 0 &&\n        (cardType === CARD_TYPE.puzzle ? (\n          <ActivitiesCardPuzzles puzzles={activitiesList} onPuzzleClick={onPuzzleClick} />\n        ) : (\n          <FlexView $flexRowGapX={1.25} $gutterX={1} $gapX={1} $borderColor=\"GREY_2\">\n            {displayedActivities.map(({ state, title, subtext, id }) => (\n              <FlexView $flexDirection=\"row\" $flexGapX={1.05} key={id}>\n                <FlexView $gapX={0.25}>\n                  <FlexView\n                    $borderRadiusX={1}\n                    $background={\n                      state === NODE_STATE.PENDING || state === NODE_STATE.NOT_STARTED\n                        ? 'RED'\n                        : 'BLACK_1'\n                    }\n                    $widthX={1}\n                    $heightX={1}\n                    $alignItems=\"center\"\n                    $justifyContent=\"center\"\n                  >\n                    {!!state && (stateIcon[state as NODE_STATE] || stateIcon[NODE_STATE.COMPLETED])}\n                  </FlexView>\n                </FlexView>\n                <FlexView $flexRowGap={4}>\n                  <Text $renderAs=\"ub2\" $color=\"BLACK_1\">\n                    {title || ''}\n                  </Text>\n                  <Text $renderAs=\"ub3\" $color=\"BLACK_T_60\">\n                    {subtext || ''}\n                  </Text>\n                </FlexView>\n              </FlexView>\n            ))}\n            {(remainingCount > 0 || showAllActivities) && activitiesList.length > 3 && (\n              <FlexView $gutterX={2}>\n                <TextButton\n                  label={showAllActivities ? 'Show less' : `+${remainingCount} activities`}\n                  size=\"regular\"\n                  color=\"BLACK_1\"\n                  onClick={handleToggleActivities}\n                />\n              </FlexView>\n            )}\n          </FlexView>\n        ))}\n    </FlexView>\n  );\n};\n\nexport default memo(ActivitiesCard);\n"],"names":["lottieSettings","ActivitiesCard","cardType","nodeType","activitiesList","onPuzzleClick","lottieRef","useRef","showAllActivities","setShowAllActivities","useState","progressStatus","useMemo","totalDone","totalPending","totalOverdue","countActivitiesByState","displayedActivities","remainingCount","CARD_TYPE","maxVisible","hasMore","handleMouseEnter","useCallback","_a","handleMouseLeave","handleToggleActivities","prev","jsxs","FlexView","jsx","Styled.ActivityCardContainerWrapper","getCardTypeIconMap","Styled.ActivityCardContainer","LottieAnimation","CardTitle","Text","ActivitiesCardPuzzles","state","title","subtext","id","NODE_STATE","stateIcon","TextButton","ActivitiesCard$1","memo"],"mappings":"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"}

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

@@ -0,0 +1,53 @@
+import r from "styled-components";
+import e from "../../../../../ui/layout/flex-view.js";
+const n = r(e)`
+  background-image: url(${({ $bgImage: o }) => o});
+  background-size: cover;
+  background-position: center left;
+  background-repeat: no-repeat;
+  max-width: 512px;
+  position: relative;
+  overflow: hidden;
+`, d = r(e)`
+  position: relative;
+  outline: 1px solid ${({ theme: o }) => o.colors.WHITE_5};
+`;
+r(e)`
+  border: 2px dashed ${({ theme: o }) => o.colors.ORANGE_2};
+  border-radius: 8px;
+  padding: 12px;
+  margin-top: 8px;
+  position: relative;
+`;
+r(e)`
+  background-color: ${({ theme: o }) => o.colors.ORANGE_2};
+  color: white;
+  border-radius: 4px;
+  padding: 4px 8px;
+  font-size: 12px;
+  font-weight: 600;
+  min-width: 24px;
+  height: 20px;
+  align-items: center;
+  justify-content: center;
+`;
+r.button`
+  background: none;
+  border: none;
+  color: ${({ theme: o }) => o.colors.BLACK_1};
+  text-decoration: underline;
+  cursor: pointer;
+  font-size: 14px;
+  font-weight: 500;
+  padding: 0;
+  margin: 0;
+
+  &:hover {
+    color: ${({ theme: o }) => o.colors.ORANGE_2};
+  }
+`;
+export {
+  n as ActivityCardContainer,
+  d as ActivityCardContainerWrapper
+};
+//# sourceMappingURL=activities-card.styled.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"activities-card.styled.js","sources":["../../../../../../../src/features/timeline/monthly-report/comps/activities/activities-card/activities-card.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../../../ui/layout/flex-view';\n\nexport const ActivityCardContainer = styled(FlexView)<{ $bgImage: string }>`\n  background-image: url(${({ $bgImage }) => $bgImage});\n  background-size: cover;\n  background-position: center left;\n  background-repeat: no-repeat;\n  max-width: 512px;\n  position: relative;\n  overflow: hidden;\n`;\n\nexport const ActivityCardContainerWrapper = styled(FlexView)`\n  position: relative;\n  outline: 1px solid ${({ theme }) => theme.colors.WHITE_5};\n`;\n\nexport const MoreActivitiesContainer = styled(FlexView)`\n  border: 2px dashed ${({ theme }) => theme.colors.ORANGE_2};\n  border-radius: 8px;\n  padding: 12px;\n  margin-top: 8px;\n  position: relative;\n`;\n\nexport const CountBadge = styled(FlexView)`\n  background-color: ${({ theme }) => theme.colors.ORANGE_2};\n  color: white;\n  border-radius: 4px;\n  padding: 4px 8px;\n  font-size: 12px;\n  font-weight: 600;\n  min-width: 24px;\n  height: 20px;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport const MoreActivitiesLink = styled.button`\n  background: none;\n  border: none;\n  color: ${({ theme }) => theme.colors.BLACK_1};\n  text-decoration: underline;\n  cursor: pointer;\n  font-size: 14px;\n  font-weight: 500;\n  padding: 0;\n  margin: 0;\n\n  &:hover {\n    color: ${({ theme }) => theme.colors.ORANGE_2};\n  }\n`;\n"],"names":["ActivityCardContainer","styled","FlexView","$bgImage","ActivityCardContainerWrapper","theme"],"mappings":";;AAIa,MAAAA,IAAwBC,EAAOC,CAAQ;AAAA,0BAC1B,CAAC,EAAE,UAAAC,EAAS,MAAMA,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GASvCC,IAA+BH,EAAOC,CAAQ;AAAA;AAAA,uBAEpC,CAAC,EAAE,OAAAG,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAGnBJ,EAAOC,CAAQ;AAAA,uBAC/B,CAAC,EAAE,OAAAG,EAAA,MAAYA,EAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAOjCJ,EAAOC,CAAQ;AAAA,sBACnB,CAAC,EAAE,OAAAG,EAAA,MAAYA,EAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYxBJ,EAAO;AAAA;AAAA;AAAA,WAG9B,CAAC,EAAE,OAAAI,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aASjC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,QAAQ;AAAA;AAAA;"}

package/dist/features/timeline/monthly-report/comps/activities/activities-card-puzzles/activities-card-puzzles.js

@@ -0,0 +1,120 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { memo as L, useRef as R, useState as h, useCallback as l, useEffect as v } from "react";
+import X from "../../../../../../assets/line-icons/icons/chevron-left.js";
+import w from "../../../../../../assets/line-icons/icons/chevron-right.js";
+import { PuzzleContainer as T, StatusIcon as x, ContentWrapper as A, ScrollButton as m, ScrollContainer as I } from "./activities-card-puzzles.styled.js";
+import i from "../../../../../ui/layout/flex-view.js";
+import B from "../../../../../ui/image/image.js";
+import k from "../../../../../ui/separator/separator.js";
+import D from "../../../../../ui/text/text.js";
+import { NODE_STATE as a } from "../../../../daily-timeline-types.js";
+import { stateIcon as d } from "../constants.js";
+const N = ({
+  puzzles: f,
+  onPuzzleClick: o
+}) => {
+  const n = f || [], r = R(null), [$, g] = h(!1), [u, _] = h(!1), C = l(() => {
+    r.current && r.current.scrollBy({ left: -180, behavior: "smooth" });
+  }, []), b = l(() => {
+    r.current && r.current.scrollBy({ left: 180, behavior: "smooth" });
+  }, []), c = l(() => {
+    if (r.current) {
+      const { scrollLeft: t, scrollWidth: E, clientWidth: S } = r.current;
+      g(t > 0), _(t < E - S - 10);
+    }
+  }, []);
+  v(() => {
+    const t = r.current;
+    if (t)
+      return c(), t.addEventListener("scroll", c), () => {
+        t.removeEventListener("scroll", c);
+      };
+  }, [c, n.length]);
+  const p = l(
+    (t) => /* @__PURE__ */ s(
+      T,
+      {
+        $gapX: 1,
+        $imageHue: t.image_hue || "BLUE",
+        $width: 146,
+        $height: 162,
+        $background: `${t.image_hue || "BLUE"}_2`,
+        onClick: () => o == null ? void 0 : o({
+          item_ref: t.item_ref,
+          feedback_comments: t.feedback_comments,
+          image_hue: t.image_hue,
+          title: t.title,
+          tip: t.tip
+        }),
+        children: [
+          /* @__PURE__ */ e(
+            x,
+            {
+              $borderRadiusX: 1,
+              $background: t.state === a.PENDING || t.state === a.NOT_STARTED ? "RED" : "BLACK_1",
+              $widthX: 1,
+              $heightX: 1,
+              $alignItems: "center",
+              $justifyContent: "center",
+              children: t.state && (d[t.state] || d[a.COMPLETED])
+            }
+          ),
+          /* @__PURE__ */ s(i, { $background: "TRANSPARENT", $alignItems: "center", children: [
+            t.image_url && /* @__PURE__ */ e(
+              B,
+              {
+                src: t.image_url ?? "",
+                alt: "Puzzle illustration",
+                width: 68,
+                height: 68,
+                withLoader: !0
+              }
+            ),
+            /* @__PURE__ */ e(k, { heightX: 1 }),
+            /* @__PURE__ */ e(i, { $gutterX: 0.25, children: /* @__PURE__ */ e(D, { $renderAs: "ab3", $align: "center", children: t.title }) })
+          ] })
+        ]
+      },
+      t.id
+    ),
+    [o]
+  );
+  return !n || n.length === 0 ? null : /* @__PURE__ */ e(A, { $flexRowGapX: 1, children: /* @__PURE__ */ s(i, { $position: "relative", $borderColor: "GREY_2", children: [
+    /* @__PURE__ */ e(
+      m,
+      {
+        $background: "BLACK_T_60",
+        $justifyContent: "center",
+        $alignItems: "center",
+        $widthX: 2,
+        $height: "100%",
+        onClick: C,
+        $visible: $,
+        $left: "0px",
+        $right: "auto",
+        children: /* @__PURE__ */ e(X, { width: 24, height: 24 })
+      }
+    ),
+    /* @__PURE__ */ e(i, { $gutterX: 1, $gapX: 1, children: /* @__PURE__ */ e(I, { ref: r, children: /* @__PURE__ */ e(i, { $flexDirection: "row", $flexGapX: 1, children: n.map(p) }) }) }),
+    /* @__PURE__ */ e(
+      m,
+      {
+        $position: "absolute",
+        $widthX: 2,
+        $height: "100%",
+        $background: "BLACK_T_60",
+        $justifyContent: "center",
+        $alignItems: "center",
+        onClick: b,
+        $visible: u,
+        $left: "auto",
+        $right: "0px",
+        children: /* @__PURE__ */ e(w, { width: 24, height: 24 })
+      }
+    )
+  ] }) });
+}, V = L(N);
+export {
+  V as default
+};
+//# sourceMappingURL=activities-card-puzzles.js.map

package/dist/features/timeline/monthly-report/comps/activities/activities-card-puzzles/activities-card-puzzles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"activities-card-puzzles.js","sources":["../../../../../../../src/features/timeline/monthly-report/comps/activities/activities-card-puzzles/activities-card-puzzles.tsx"],"sourcesContent":["import { type FC, useRef, memo, useCallback, useState, useEffect } from 'react';\n\nimport ChevronLeftIcon from '../../../../../../assets/line-icons/icons/chevron-left';\nimport ChevronRightIcon from '../../../../../../assets/line-icons/icons/chevron-right';\nimport { type IActivitiesCardPuzzlesProps } from './activities-card-puzzles-types';\nimport { type IMonthlyActivity } from '../../../monthly-report-types';\nimport * as Styled from './activities-card-puzzles.styled';\nimport FlexView from '../../../../../ui/layout/flex-view';\nimport Image from '../../../../../ui/image/image';\nimport Separator from '../../../../../ui/separator/separator';\nimport Text from '../../../../../ui/text/text';\nimport { NODE_STATE } from '../../../../daily-timeline-types';\nimport { stateIcon } from '../constants';\n\nconst ActivitiesCardPuzzles: FC<IActivitiesCardPuzzlesProps> = ({\n  puzzles: newPuzzles,\n  onPuzzleClick,\n}) => {\n  const puzzles = newPuzzles || [];\n  const scrollRef = useRef<HTMLDivElement>(null);\n  const [canScrollLeft, setCanScrollLeft] = useState(false);\n  const [canScrollRight, setCanScrollRight] = useState(false);\n\n  const handleScrollLeft = useCallback(() => {\n    if (scrollRef.current) {\n      scrollRef.current.scrollBy({ left: -180, behavior: 'smooth' });\n    }\n  }, []);\n\n  const handleScrollRight = useCallback(() => {\n    if (scrollRef.current) {\n      scrollRef.current.scrollBy({ left: 180, behavior: 'smooth' });\n    }\n  }, []);\n\n  const updateScrollButtons = useCallback(() => {\n    if (scrollRef.current) {\n      const { scrollLeft, scrollWidth, clientWidth } = scrollRef.current;\n\n      setCanScrollLeft(scrollLeft > 0);\n      setCanScrollRight(scrollLeft < scrollWidth - clientWidth - 10);\n    }\n  }, []);\n\n  useEffect(() => {\n    const scrollElement = scrollRef.current;\n\n    if (scrollElement) {\n      updateScrollButtons();\n\n      scrollElement.addEventListener('scroll', updateScrollButtons);\n\n      return () => {\n        scrollElement.removeEventListener('scroll', updateScrollButtons);\n      };\n    }\n  }, [updateScrollButtons, puzzles.length]);\n\n  const renderPuzzleCard = useCallback(\n    (puzzle: IMonthlyActivity) => (\n      <Styled.PuzzleContainer\n        key={puzzle.id}\n        $gapX={1}\n        $imageHue={puzzle.image_hue || 'BLUE'}\n        $width={146}\n        $height={162}\n        $background={`${puzzle.image_hue || 'BLUE'}_2`}\n        onClick={() =>\n          onPuzzleClick?.({\n            item_ref: puzzle.item_ref,\n            feedback_comments: puzzle.feedback_comments,\n            image_hue: puzzle.image_hue,\n            title: puzzle.title,\n            tip: puzzle.tip,\n          })\n        }\n      >\n        <Styled.StatusIcon\n          $borderRadiusX={1}\n          $background={\n            puzzle.state === NODE_STATE.PENDING || puzzle.state === NODE_STATE.NOT_STARTED\n              ? 'RED'\n              : 'BLACK_1'\n          }\n          $widthX={1}\n          $heightX={1}\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n        >\n          {puzzle.state &&\n            (stateIcon[puzzle.state as NODE_STATE] || stateIcon[NODE_STATE.COMPLETED])}\n        </Styled.StatusIcon>\n        <FlexView $background=\"TRANSPARENT\" $alignItems=\"center\">\n          {puzzle.image_url && (\n            <Image\n              src={puzzle.image_url ?? ''}\n              alt=\"Puzzle illustration\"\n              width={68}\n              height={68}\n              withLoader={true}\n            />\n          )}\n          <Separator heightX={1} />\n          <FlexView $gutterX={0.25}>\n            <Text $renderAs=\"ab3\" $align=\"center\">\n              {puzzle.title}\n            </Text>\n          </FlexView>\n        </FlexView>\n      </Styled.PuzzleContainer>\n    ),\n    [onPuzzleClick],\n  );\n\n  if (!puzzles || puzzles.length === 0) return null;\n\n  return (\n    <Styled.ContentWrapper $flexRowGapX={1}>\n      <FlexView $position=\"relative\" $borderColor=\"GREY_2\">\n        <Styled.ScrollButton\n          $background=\"BLACK_T_60\"\n          $justifyContent=\"center\"\n          $alignItems=\"center\"\n          $widthX={2}\n          $height=\"100%\"\n          onClick={handleScrollLeft}\n          $visible={canScrollLeft}\n          $left=\"0px\"\n          $right=\"auto\"\n        >\n          <ChevronLeftIcon width={24} height={24} />\n        </Styled.ScrollButton>\n        <FlexView $gutterX={1} $gapX={1}>\n          <Styled.ScrollContainer ref={scrollRef}>\n            <FlexView $flexDirection=\"row\" $flexGapX={1}>\n              {puzzles.map(renderPuzzleCard)}\n            </FlexView>\n          </Styled.ScrollContainer>\n        </FlexView>\n\n        <Styled.ScrollButton\n          $position=\"absolute\"\n          $widthX={2}\n          $height=\"100%\"\n          $background=\"BLACK_T_60\"\n          $justifyContent=\"center\"\n          $alignItems=\"center\"\n          onClick={handleScrollRight}\n          $visible={canScrollRight}\n          $left=\"auto\"\n          $right=\"0px\"\n        >\n          <ChevronRightIcon width={24} height={24} />\n        </Styled.ScrollButton>\n      </FlexView>\n    </Styled.ContentWrapper>\n  );\n};\n\nexport default memo(ActivitiesCardPuzzles);\n"],"names":["ActivitiesCardPuzzles","newPuzzles","onPuzzleClick","puzzles","scrollRef","useRef","canScrollLeft","setCanScrollLeft","useState","canScrollRight","setCanScrollRight","handleScrollLeft","useCallback","handleScrollRight","updateScrollButtons","scrollLeft","scrollWidth","clientWidth","useEffect","scrollElement","renderPuzzleCard","puzzle","jsxs","Styled.PuzzleContainer","jsx","Styled.StatusIcon","NODE_STATE","stateIcon","FlexView","Image","Separator","Text","Styled.ContentWrapper","Styled.ScrollButton","ChevronLeftIcon","Styled.ScrollContainer","ChevronRightIcon","ActivitiesCardPuzzles$1","memo"],"mappings":"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"}

package/dist/features/timeline/monthly-report/comps/activities/activities-card-puzzles/activities-card-puzzles.styled.js

@@ -0,0 +1,58 @@
+import t from "styled-components";
+import i from "../../../../../ui/layout/flex-view.js";
+import { EDeviceType as r } from "../../../../../ui/theme/constants.js";
+import { getPuzzleCardPattern as n } from "../../../../../puzzles/utils/puzzle-pattern.js";
+const c = t(i)`
+  position: relative;
+  min-width: 126px;
+  max-width: 126px;
+  margin-top: 6px;
+  border: 2px solid ${({ theme: o, $imageHue: e }) => o.colors[`${e || "BLUE"}_4`]};
+
+  &::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-image: ${({ $imageHue: o }) => `url(${n(o)})`};
+    background-size: cover;
+    opacity: 0.4;
+  }
+`, d = t(i)`
+  width: 100%;
+  max-width: 512px;
+  position: relative;
+`, m = t(i)`
+  position: absolute;
+  right: ${({ $right: o }) => o};
+  left: ${({ $left: o }) => o};
+  cursor: pointer;
+  transition: opacity 0.3s ease-in-out;
+  opacity: ${({ $visible: o }) => o ? 1 : 0};
+  pointer-events: ${({ $visible: o }) => o ? "auto" : "none"};
+  z-index: 10;
+  path {
+    fill: ${({ theme: o }) => o.colors.WHITE};
+  }
+`, u = t(i)`
+  overflow-x: ${({ theme: o }) => o.device <= r.TABLET ? "scroll" : "hidden"};
+  overflow-y: visible;
+  scroll-behavior: smooth;
+  &::-webkit-scrollbar {
+    display: none;
+  }
+`, x = t(i)`
+  position: absolute;
+  right: -8px;
+  top: -8px;
+`;
+export {
+  d as ContentWrapper,
+  c as PuzzleContainer,
+  m as ScrollButton,
+  u as ScrollContainer,
+  x as StatusIcon
+};
+//# sourceMappingURL=activities-card-puzzles.styled.js.map

package/dist/features/timeline/monthly-report/comps/activities/activities-card-puzzles/activities-card-puzzles.styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"activities-card-puzzles.styled.js","sources":["../../../../../../../src/features/timeline/monthly-report/comps/activities/activities-card-puzzles/activities-card-puzzles.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../../../ui/layout/flex-view';\nimport { type THueNames } from '../../../../../ui/types';\nimport { EDeviceType } from '../../../../../ui/theme/constants';\nimport { getPuzzleCardPattern } from '../../../../../puzzles/utils/puzzle-pattern';\n\nexport const PuzzleContainer = styled(FlexView)<{\n  $imageHue: THueNames;\n}>`\n  position: relative;\n  min-width: 126px;\n  max-width: 126px;\n  margin-top: 6px;\n  border: 2px solid ${({ theme, $imageHue }) => theme.colors[`${$imageHue || 'BLUE'}_4`]};\n\n  &::before {\n    content: '';\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background-image: ${({ $imageHue }) => `url(${getPuzzleCardPattern($imageHue)})`};\n    background-size: cover;\n    opacity: 0.4;\n  }\n`;\n\nexport const ContentWrapper = styled(FlexView)`\n  width: 100%;\n  max-width: 512px;\n  position: relative;\n`;\n\nexport const ScrollButton = styled(FlexView)<{\n  $visible?: boolean;\n  $left: string;\n  $right: string;\n}>`\n  position: absolute;\n  right: ${({ $right }) => $right};\n  left: ${({ $left }) => $left};\n  cursor: pointer;\n  transition: opacity 0.3s ease-in-out;\n  opacity: ${({ $visible }) => ($visible ? 1 : 0)};\n  pointer-events: ${({ $visible }) => ($visible ? 'auto' : 'none')};\n  z-index: 10;\n  path {\n    fill: ${({ theme }) => theme.colors.WHITE};\n  }\n`;\n\nexport const ScrollContainer = styled(FlexView)`\n  overflow-x: ${({ theme }) => (theme.device <= EDeviceType.TABLET ? 'scroll' : 'hidden')};\n  overflow-y: visible;\n  scroll-behavior: smooth;\n  &::-webkit-scrollbar {\n    display: none;\n  }\n`;\n\nexport const StatusIcon = styled(FlexView)`\n  position: absolute;\n  right: -8px;\n  top: -8px;\n`;\n"],"names":["PuzzleContainer","styled","FlexView","theme","$imageHue","getPuzzleCardPattern","ContentWrapper","ScrollButton","$right","$left","$visible","ScrollContainer","EDeviceType","StatusIcon"],"mappings":";;;;AAOa,MAAAA,IAAkBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,sBAOxB,CAAC,EAAE,OAAAC,GAAO,WAAAC,EAAU,MAAMD,EAAM,OAAO,GAAGC,KAAa,MAAM,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAShE,CAAC,EAAE,WAAAA,EAAU,MAAM,OAAOC,EAAqBD,CAAS,CAAC,GAAG;AAAA;AAAA;AAAA;AAAA,GAMvEE,IAAiBL,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,GAMhCK,IAAeN,EAAOC,CAAQ;AAAA;AAAA,WAMhC,CAAC,EAAE,QAAAM,EAAO,MAAMA,CAAM;AAAA,UACvB,CAAC,EAAE,OAAAC,EAAM,MAAMA,CAAK;AAAA;AAAA;AAAA,aAGjB,CAAC,EAAE,UAAAC,EAAA,MAAgBA,IAAW,IAAI,CAAE;AAAA,oBAC7B,CAAC,EAAE,UAAAA,EAAA,MAAgBA,IAAW,SAAS,MAAO;AAAA;AAAA;AAAA,YAGtD,CAAC,EAAE,OAAAP,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA,GAIhCQ,IAAkBV,EAAOC,CAAQ;AAAA,gBAC9B,CAAC,EAAE,OAAAC,EAAM,MAAOA,EAAM,UAAUS,EAAY,SAAS,WAAW,QAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQ5EC,IAAaZ,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;"}

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

@@ -0,0 +1,27 @@
+import { jsxs as f, jsx as e } from "react/jsx-runtime";
+import { memo as t } from "react";
+import d from "./activities-card/activities-card.js";
+import l from "../../../../ui/layout/flex-view.js";
+import h from "../../../../ui/text/text.js";
+import u from "../../../../ui/separator/separator.js";
+const x = ({ activities: o, onPuzzleClick: p }) => !o || Object.keys(o).length === 0 ? null : /* @__PURE__ */ f(l, { children: [
+  /* @__PURE__ */ e(h, { $renderAs: "ab1-bold", $color: "BLACK_1", children: "Activities" }),
+  /* @__PURE__ */ e(u, { heightX: 1 }),
+  /* @__PURE__ */ e(l, { $flexRowGapX: 1.5, children: Object.entries(o).map(([n, r]) => {
+    var m;
+    return r != null && r.length ? /* @__PURE__ */ e(
+      d,
+      {
+        nodeType: (m = r[0]) == null ? void 0 : m.node_type,
+        cardType: n,
+        activitiesList: r,
+        onPuzzleClick: p
+      },
+      n
+    ) : null;
+  }) })
+] }), w = t(x);
+export {
+  w as default
+};
+//# sourceMappingURL=activities.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"activities.js","sources":["../../../../../../src/features/timeline/monthly-report/comps/activities/activities.tsx"],"sourcesContent":["import { memo, type FC } from 'react';\n\nimport { type IActivitiesProps } from './activities-types';\nimport { type TNodeTypes } from '../../../../chapters-v2/comps/node-card/node-card-types';\nimport ActivitiesCard from './activities-card/activities-card';\nimport { type CARD_TYPE } from '../../monthly-report-types';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport Separator from '../../../../ui/separator/separator';\n\nconst Activities: FC<IActivitiesProps> = ({ activities, onPuzzleClick }) => {\n  if (!activities || Object.keys(activities).length === 0) return null;\n\n  return (\n    <FlexView>\n      <Text $renderAs=\"ab1-bold\" $color=\"BLACK_1\">\n        Activities\n      </Text>\n      <Separator heightX={1} />\n      <FlexView $flexRowGapX={1.5}>\n        {Object.entries(activities).map(([cardType, activitiesList]) => {\n          if (!activitiesList?.length) return null;\n\n          return (\n            <ActivitiesCard\n              key={cardType}\n              nodeType={activitiesList[0]?.node_type as TNodeTypes}\n              cardType={cardType as CARD_TYPE}\n              activitiesList={activitiesList}\n              onPuzzleClick={onPuzzleClick}\n            />\n          );\n        })}\n      </FlexView>\n    </FlexView>\n  );\n};\n\nexport default memo(Activities);\n"],"names":["Activities","activities","onPuzzleClick","FlexView","jsx","Text","Separator","cardType","activitiesList","ActivitiesCard","_a","Activities$1","memo"],"mappings":";;;;;;AAUA,MAAMA,IAAmC,CAAC,EAAE,YAAAC,GAAY,eAAAC,QAClD,CAACD,KAAc,OAAO,KAAKA,CAAU,EAAE,WAAW,IAAU,yBAG7DE,GACC,EAAA,UAAA;AAAA,EAAA,gBAAAC,EAACC,GAAK,EAAA,WAAU,YAAW,QAAO,WAAU,UAE5C,cAAA;AAAA,EACA,gBAAAD,EAACE,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,EACtB,gBAAAF,EAAAD,GAAA,EAAS,cAAc,KACrB,UAAO,OAAA,QAAQF,CAAU,EAAE,IAAI,CAAC,CAACM,GAAUC,CAAc,MAAM;;AAC1D,WAACA,KAAA,QAAAA,EAAgB,SAGnB,gBAAAJ;AAAA,MAACK;AAAA,MAAA;AAAA,QAEC,WAAUC,IAAAF,EAAe,CAAC,MAAhB,gBAAAE,EAAmB;AAAA,QAC7B,UAAAH;AAAA,QACA,gBAAAC;AAAA,QACA,eAAAN;AAAA,MAAA;AAAA,MAJKK;AAAA,IAAA,IAJ2B;AAAA,EAWrC,CAAA,GACH;AACF,EAAA,CAAA,GAIWI,IAAAC,EAAKZ,CAAU;"}

package/dist/features/timeline/monthly-report/comps/activities/constants.js

@@ -0,0 +1,95 @@
+import { jsx as t } from "react/jsx-runtime";
+import { LOTTIE as r } from "../../../../../assets/lottie/lottie.js";
+import _ from "../../../../../assets/line-icons/icons/check2.js";
+import T from "../../../../../assets/line-icons/icons/status.js";
+import e from "../../../../../assets/line-icons/icons/exclamation.js";
+import { NODE_STATE as E } from "../../../daily-timeline-types.js";
+import { ILLUSTRATIONS as c } from "../../../../../assets/illustrations/illustrations.js";
+import { CARD_TYPE as o } from "../../monthly-report-types.js";
+function R(a) {
+  switch (a) {
+    case o.learn:
+      return {
+        lottie: r.LEARN,
+        color: "YELLOW_2",
+        background: c.NODE_LEARN_BG
+      };
+    case o.practice:
+    case o.smart_practice:
+    case o.extra_practice:
+      return {
+        lottie: r.PRACTICE,
+        color: "PURPLE_2",
+        background: c.NODE_PRACTICE_BG
+      };
+    case o.puzzle:
+      return {
+        lottie: r.PUZZLE,
+        color: "PURPLE_2",
+        background: c.NODE_PUZZLE_BG
+      };
+    case o.test:
+    case o.diagnostic:
+      return {
+        lottie: r.TEST,
+        color: "ORANGE_2",
+        background: c.NODE_CUSTOM_TEST_BG
+      };
+    case o.challenge:
+      return {
+        lottie: r.COMPETITIVE_ARENA,
+        color: "ORANGE_2",
+        background: c.NODE_TEST_PREP_BG
+      };
+    case o.advanced:
+      return {
+        lottie: r.TEST,
+        color: "GREEN_2",
+        background: c.NODE_TEST_PREP_BG
+      };
+    case o.subjective:
+      return {
+        lottie: r.SUBJECTIVE,
+        color: "BLUE_2",
+        background: c.NODE_SUBJECTIVE_BG
+      };
+    case o.recap:
+    case o.remedial:
+    case o.revision:
+      return {
+        lottie: r.RECAP,
+        color: "BLUE_2",
+        background: c.NODE_RECAP_BG
+      };
+    case o.activity:
+    case o.wb_activity:
+      return {
+        lottie: r.ACTIVITY,
+        color: "ORANGE_2",
+        background: c.NODE_ACTIVITY_BG
+      };
+    case o.video:
+      return {
+        lottie: r.VIDEO,
+        color: "GREEN_2",
+        background: c.NODE_VIDEO_BG
+      };
+    default:
+      return {
+        lottie: r.PROJECT,
+        color: "GREEN_2",
+        background: c.NODE_PROJECT_BG
+      };
+  }
+}
+const P = {
+  [E.COMPLETED]: /* @__PURE__ */ t(_, { color: "WHITE" }),
+  [E.IN_PROGRESS]: /* @__PURE__ */ t(T, { color: "WHITE" }),
+  [E.PENDING]: /* @__PURE__ */ t(e, { color: "WHITE" }),
+  [E.NOT_STARTED]: /* @__PURE__ */ t(e, { color: "WHITE" })
+};
+export {
+  R as getCardTypeIconMap,
+  P as stateIcon
+};
+//# sourceMappingURL=constants.js.map