@cuemath/leap 3.2.9-link.0 → 3.2.9-pzd-0.1-testing

package/dist/features/journey/hooks/use-puzzles-journey/use-puzzle-review-journey.js

@@ -0,0 +1,59 @@
+import { jsx as t } from "react/jsx-runtime";
+import { useRef as c, useCallback as r, useMemo as f } from "react";
+import y from "../../../ui/buttons/button/button.js";
+import { JOURNEY_ID_TEACHER as h } from "../../journey-id/journey-id-teacher.js";
+import { IndicatorType as C } from "../../use-journey/constants.js";
+import { useJourney as E } from "../../use-journey/use-journey.js";
+import T from "../use-home-page-journey/tooltip-item.js";
+const k = () => {
+  const o = h.PUZZLE_REVIEW_JOURNEY, e = c(null), d = c([]), { setJourney: n, endJourney: i, nextCoachmark: s } = E(), l = r(() => {
+    s(o, !1, 0, !1);
+  }, [o, s]), a = r(() => {
+    document.body.style.overflow = "unset", i(o);
+  }, [i, o]), u = r(() => {
+    if (!(e != null && e.current))
+      return;
+    const p = [
+      {
+        originalElementToHighlightRef: e,
+        elementToHighlight: /* @__PURE__ */ t("div", { children: /* @__PURE__ */ t(y, { widthX: 6, renderAs: "primary", size: "small", label: "Review" }) }),
+        type: C.TOOLTIP,
+        indicator: {
+          renderAs: "primary",
+          tooltipXCoOrdinates: -100,
+          arrowSize: 12,
+          arrowXCoOrdinates: 100,
+          position: "top",
+          backgroundColor: "ORANGE_4",
+          borderColor: "BLACK",
+          arrowColor: "BLACK",
+          tooltipItem: /* @__PURE__ */ t(
+            T,
+            {
+              text: "Click here to review the student's solution.",
+              buttonLabel: "Got it",
+              onButtonClick: a
+            }
+          )
+        },
+        isActive: !1
+      }
+    ];
+    n(o, p);
+    const m = setTimeout(() => {
+      clearTimeout(m), document.body.style.overflow = "hidden", l();
+    }, 500);
+    d.current.push(m);
+  }, [a, l, o, n]);
+  return f(
+    () => ({
+      puzzleReviewCtaRef: e,
+      startJourney: u
+    }),
+    [u]
+  );
+};
+export {
+  k as usePuzzleReviewJourney
+};
+//# sourceMappingURL=use-puzzle-review-journey.js.map

package/dist/features/journey/hooks/use-puzzles-journey/use-puzzle-review-journey.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-puzzle-review-journey.js","sources":["../../../../../src/features/journey/hooks/use-puzzles-journey/use-puzzle-review-journey.tsx"],"sourcesContent":["import type { IArrowTooltipProps } from '../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { ICoachmarkProps } from '../../use-journey/journey-context-types';\n\nimport { useCallback, useMemo, useRef } from 'react';\n\nimport Button from '../../../ui/buttons/button/button';\nimport { JOURNEY_ID_TEACHER } from '../../journey-id/journey-id-teacher';\nimport { IndicatorType } from '../../use-journey/constants';\nimport { useJourney } from '../../use-journey/use-journey';\nimport TooltipItem from '../use-home-page-journey/tooltip-item';\n\nconst usePuzzleReviewJourney = () => {\n  const journeyId = JOURNEY_ID_TEACHER.PUZZLE_REVIEW_JOURNEY;\n\n  const puzzleReviewCtaRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n  const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n  const { setJourney, endJourney, nextCoachmark } = useJourney();\n\n  const handleNextCoachMark = useCallback(() => {\n    nextCoachmark(journeyId, false, 0, false);\n  }, [journeyId, nextCoachmark]);\n\n  const handleEndJourney = useCallback(() => {\n    document.body.style.overflow = 'unset';\n    endJourney(journeyId);\n  }, [endJourney, journeyId]);\n\n  const startJourney = useCallback(() => {\n    if (!puzzleReviewCtaRef?.current) {\n      return;\n    }\n\n    const puzzleAttemptSteps: ICoachmarkProps[] = [\n      {\n        originalElementToHighlightRef: puzzleReviewCtaRef,\n        elementToHighlight: (\n          <div>\n            <Button widthX={6} renderAs=\"primary\" size=\"small\" label=\"Review\" />\n          </div>\n        ),\n        type: IndicatorType.TOOLTIP,\n        indicator: {\n          renderAs: 'primary',\n          tooltipXCoOrdinates: -100,\n          arrowSize: 12,\n          arrowXCoOrdinates: 100,\n          position: 'top',\n          backgroundColor: 'ORANGE_4',\n          borderColor: 'BLACK',\n          arrowColor: 'BLACK',\n          tooltipItem: (\n            <TooltipItem\n              text={`Click here to review the student's solution.`}\n              buttonLabel=\"Got it\"\n              onButtonClick={handleEndJourney}\n            />\n          ),\n        } as IArrowTooltipProps,\n        isActive: false,\n      },\n    ];\n\n    setJourney(journeyId, puzzleAttemptSteps);\n\n    const delayBeforeStart = setTimeout(() => {\n      clearTimeout(delayBeforeStart);\n      document.body.style.overflow = 'hidden';\n      handleNextCoachMark();\n    }, 500);\n\n    timerRefs.current.push(delayBeforeStart);\n  }, [handleEndJourney, handleNextCoachMark, journeyId, setJourney]);\n\n  const data = useMemo(\n    () => ({\n      puzzleReviewCtaRef,\n      startJourney,\n    }),\n    [startJourney],\n  );\n\n  return data;\n};\n\nexport { usePuzzleReviewJourney };\n"],"names":["usePuzzleReviewJourney","journeyId","JOURNEY_ID_TEACHER","puzzleReviewCtaRef","useRef","timerRefs","setJourney","endJourney","nextCoachmark","useJourney","handleNextCoachMark","useCallback","handleEndJourney","startJourney","puzzleAttemptSteps","jsx","Button","IndicatorType","TooltipItem","delayBeforeStart","useMemo"],"mappings":";;;;;;;AAWA,MAAMA,IAAyB,MAAM;AACnC,QAAMC,IAAYC,EAAmB,uBAE/BC,IAAqBC,EAAuB,IAAI,GAChDC,IAAYD,EAAwC,CAAA,CAAE,GAEtD,EAAE,YAAAE,GAAY,YAAAC,GAAY,eAAAC,MAAkBC,EAAW,GAEvDC,IAAsBC,EAAY,MAAM;AAC9B,IAAAH,EAAAP,GAAW,IAAO,GAAG,EAAK;AAAA,EAAA,GACvC,CAACA,GAAWO,CAAa,CAAC,GAEvBI,IAAmBD,EAAY,MAAM;AAChC,aAAA,KAAK,MAAM,WAAW,SAC/BJ,EAAWN,CAAS;AAAA,EAAA,GACnB,CAACM,GAAYN,CAAS,CAAC,GAEpBY,IAAeF,EAAY,MAAM;AACjC,QAAA,EAACR,KAAA,QAAAA,EAAoB;AACvB;AAGF,UAAMW,IAAwC;AAAA,MAC5C;AAAA,QACE,+BAA+BX;AAAA,QAC/B,oBACE,gBAAAY,EAAC,OACC,EAAA,UAAA,gBAAAA,EAACC,GAAO,EAAA,QAAQ,GAAG,UAAS,WAAU,MAAK,SAAQ,OAAM,SAAS,CAAA,GACpE;AAAA,QAEF,MAAMC,EAAc;AAAA,QACpB,WAAW;AAAA,UACT,UAAU;AAAA,UACV,qBAAqB;AAAA,UACrB,WAAW;AAAA,UACX,mBAAmB;AAAA,UACnB,UAAU;AAAA,UACV,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,YAAY;AAAA,UACZ,aACE,gBAAAF;AAAA,YAACG;AAAA,YAAA;AAAA,cACC,MAAM;AAAA,cACN,aAAY;AAAA,cACZ,eAAeN;AAAA,YAAA;AAAA,UACjB;AAAA,QAEJ;AAAA,QACA,UAAU;AAAA,MACZ;AAAA,IAAA;AAGF,IAAAN,EAAWL,GAAWa,CAAkB;AAElC,UAAAK,IAAmB,WAAW,MAAM;AACxC,mBAAaA,CAAgB,GACpB,SAAA,KAAK,MAAM,WAAW,UACXT;OACnB,GAAG;AAEI,IAAAL,EAAA,QAAQ,KAAKc,CAAgB;AAAA,KACtC,CAACP,GAAkBF,GAAqBT,GAAWK,CAAU,CAAC;AAU1D,SARMc;AAAA,IACX,OAAO;AAAA,MACL,oBAAAjB;AAAA,MACA,cAAAU;AAAA,IAAA;AAAA,IAEF,CAACA,CAAY;AAAA,EAAA;AAIjB;"}

package/dist/features/journey/hooks/use-puzzles-journey/use-puzzle-unassign-journey.js

@@ -0,0 +1,59 @@
+import { jsx as e } from "react/jsx-runtime";
+import { useRef as c, useCallback as r, useMemo as f } from "react";
+import y from "../../../ui/buttons/button/button.js";
+import { JOURNEY_ID_TEACHER as h } from "../../journey-id/journey-id-teacher.js";
+import { IndicatorType as C } from "../../use-journey/constants.js";
+import { useJourney as T } from "../../use-journey/use-journey.js";
+import b from "../use-home-page-journey/tooltip-item.js";
+const L = () => {
+  const o = h.PUZZLE_UNASSIGN_JOURNEY, t = c(null), d = c([]), { setJourney: n, endJourney: i, nextCoachmark: s } = T(), a = r(() => {
+    s(o, !1, 0, !1);
+  }, [o, s]), l = r(() => {
+    document.body.style.overflow = "unset", i(o);
+  }, [i, o]), u = r(() => {
+    if (!(t != null && t.current))
+      return;
+    const p = [
+      {
+        originalElementToHighlightRef: t,
+        elementToHighlight: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(y, { widthX: 6, renderAs: "primary", size: "small", label: "Unassign" }) }),
+        type: C.TOOLTIP,
+        indicator: {
+          renderAs: "primary",
+          tooltipXCoOrdinates: -100,
+          arrowSize: 12,
+          arrowXCoOrdinates: 100,
+          position: "top",
+          backgroundColor: "PURPLE_4",
+          borderColor: "BLACK",
+          arrowColor: "BLACK",
+          tooltipItem: /* @__PURE__ */ e(
+            b,
+            {
+              text: "You can click here to unassign the puzzle.",
+              buttonLabel: "Got it",
+              onButtonClick: l
+            }
+          )
+        },
+        isActive: !1
+      }
+    ];
+    n(o, p);
+    const m = setTimeout(() => {
+      clearTimeout(m), document.body.style.overflow = "hidden", a();
+    }, 500);
+    d.current.push(m);
+  }, [l, a, o, n]);
+  return f(
+    () => ({
+      puzzleUnassignRef: t,
+      startJourney: u
+    }),
+    [u]
+  );
+};
+export {
+  L as usePuzzleUnassignJourney
+};
+//# sourceMappingURL=use-puzzle-unassign-journey.js.map

package/dist/features/journey/hooks/use-puzzles-journey/use-puzzle-unassign-journey.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-puzzle-unassign-journey.js","sources":["../../../../../src/features/journey/hooks/use-puzzles-journey/use-puzzle-unassign-journey.tsx"],"sourcesContent":["import type { IArrowTooltipProps } from '../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { ICoachmarkProps } from '../../use-journey/journey-context-types';\n\nimport { useCallback, useMemo, useRef } from 'react';\n\nimport Button from '../../../ui/buttons/button/button';\nimport { JOURNEY_ID_TEACHER } from '../../journey-id/journey-id-teacher';\nimport { IndicatorType } from '../../use-journey/constants';\nimport { useJourney } from '../../use-journey/use-journey';\nimport TooltipItem from '../use-home-page-journey/tooltip-item';\n\nconst usePuzzleUnassignJourney = () => {\n  const journeyId = JOURNEY_ID_TEACHER.PUZZLE_UNASSIGN_JOURNEY;\n\n  const puzzleUnassignRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n  const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n  const { setJourney, endJourney, nextCoachmark } = useJourney();\n\n  const handleNextCoachMark = useCallback(() => {\n    nextCoachmark(journeyId, false, 0, false);\n  }, [journeyId, nextCoachmark]);\n\n  const handleEndJourney = useCallback(() => {\n    document.body.style.overflow = 'unset';\n    endJourney(journeyId);\n  }, [endJourney, journeyId]);\n\n  const startJourney = useCallback(() => {\n    if (!puzzleUnassignRef?.current) {\n      return;\n    }\n\n    const puzzleAttemptSteps: ICoachmarkProps[] = [\n      {\n        originalElementToHighlightRef: puzzleUnassignRef,\n        elementToHighlight: (\n          <div>\n            <Button widthX={6} renderAs=\"primary\" size=\"small\" label=\"Unassign\" />\n          </div>\n        ),\n        type: IndicatorType.TOOLTIP,\n        indicator: {\n          renderAs: 'primary',\n          tooltipXCoOrdinates: -100,\n          arrowSize: 12,\n          arrowXCoOrdinates: 100,\n          position: 'top',\n          backgroundColor: 'PURPLE_4',\n          borderColor: 'BLACK',\n          arrowColor: 'BLACK',\n          tooltipItem: (\n            <TooltipItem\n              text=\"You can click here to unassign the puzzle.\"\n              buttonLabel=\"Got it\"\n              onButtonClick={handleEndJourney}\n            />\n          ),\n        } as IArrowTooltipProps,\n        isActive: false,\n      },\n    ];\n\n    setJourney(journeyId, puzzleAttemptSteps);\n\n    const delayBeforeStart = setTimeout(() => {\n      clearTimeout(delayBeforeStart);\n      document.body.style.overflow = 'hidden';\n      handleNextCoachMark();\n    }, 500);\n\n    timerRefs.current.push(delayBeforeStart);\n  }, [handleEndJourney, handleNextCoachMark, journeyId, setJourney]);\n\n  const data = useMemo(\n    () => ({\n      puzzleUnassignRef,\n      startJourney,\n    }),\n    [startJourney],\n  );\n\n  return data;\n};\n\nexport { usePuzzleUnassignJourney };\n"],"names":["usePuzzleUnassignJourney","journeyId","JOURNEY_ID_TEACHER","puzzleUnassignRef","useRef","timerRefs","setJourney","endJourney","nextCoachmark","useJourney","handleNextCoachMark","useCallback","handleEndJourney","startJourney","puzzleAttemptSteps","jsx","Button","IndicatorType","TooltipItem","delayBeforeStart","useMemo"],"mappings":";;;;;;;AAWA,MAAMA,IAA2B,MAAM;AACrC,QAAMC,IAAYC,EAAmB,yBAE/BC,IAAoBC,EAAuB,IAAI,GAC/CC,IAAYD,EAAwC,CAAA,CAAE,GAEtD,EAAE,YAAAE,GAAY,YAAAC,GAAY,eAAAC,MAAkBC,EAAW,GAEvDC,IAAsBC,EAAY,MAAM;AAC9B,IAAAH,EAAAP,GAAW,IAAO,GAAG,EAAK;AAAA,EAAA,GACvC,CAACA,GAAWO,CAAa,CAAC,GAEvBI,IAAmBD,EAAY,MAAM;AAChC,aAAA,KAAK,MAAM,WAAW,SAC/BJ,EAAWN,CAAS;AAAA,EAAA,GACnB,CAACM,GAAYN,CAAS,CAAC,GAEpBY,IAAeF,EAAY,MAAM;AACjC,QAAA,EAACR,KAAA,QAAAA,EAAmB;AACtB;AAGF,UAAMW,IAAwC;AAAA,MAC5C;AAAA,QACE,+BAA+BX;AAAA,QAC/B,oBACE,gBAAAY,EAAC,OACC,EAAA,UAAA,gBAAAA,EAACC,GAAO,EAAA,QAAQ,GAAG,UAAS,WAAU,MAAK,SAAQ,OAAM,WAAW,CAAA,GACtE;AAAA,QAEF,MAAMC,EAAc;AAAA,QACpB,WAAW;AAAA,UACT,UAAU;AAAA,UACV,qBAAqB;AAAA,UACrB,WAAW;AAAA,UACX,mBAAmB;AAAA,UACnB,UAAU;AAAA,UACV,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,YAAY;AAAA,UACZ,aACE,gBAAAF;AAAA,YAACG;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,aAAY;AAAA,cACZ,eAAeN;AAAA,YAAA;AAAA,UACjB;AAAA,QAEJ;AAAA,QACA,UAAU;AAAA,MACZ;AAAA,IAAA;AAGF,IAAAN,EAAWL,GAAWa,CAAkB;AAElC,UAAAK,IAAmB,WAAW,MAAM;AACxC,mBAAaA,CAAgB,GACpB,SAAA,KAAK,MAAM,WAAW,UACXT;OACnB,GAAG;AAEI,IAAAL,EAAA,QAAQ,KAAKc,CAAgB;AAAA,KACtC,CAACP,GAAkBF,GAAqBT,GAAWK,CAAU,CAAC;AAU1D,SARMc;AAAA,IACX,OAAO;AAAA,MACL,mBAAAjB;AAAA,MACA,cAAAU;AAAA,IAAA;AAAA,IAEF,CAACA,CAAY;AAAA,EAAA;AAIjB;"}

package/dist/features/journey/hooks/use-puzzles-journey/use-teacher-puzzle-assigned-journey.js

@@ -0,0 +1,70 @@
+import { jsx as t } from "react/jsx-runtime";
+import { useRef as u, useCallback as r, useMemo as p } from "react";
+import h from "../../../ui/layout/flex-view.js";
+import y from "../../../ui/text/text.js";
+import { JOURNEY_ID_TEACHER as C } from "../../journey-id/journey-id-teacher.js";
+import { IndicatorType as T } from "../../use-journey/constants.js";
+import { useJourney as g } from "../../use-journey/use-journey.js";
+import E from "../use-home-page-journey/tooltip-item.js";
+const $ = () => {
+  const e = C.PUZZLE_ASSIGN_JOURNEY, o = u(null), d = u([]), { setJourney: n, endJourney: i, nextCoachmark: s } = g(), l = r(() => {
+    s(e, !1, 0, !1);
+  }, [e, s]), a = r(() => {
+    document.body.style.overflow = "unset", i(e);
+  }, [i, e]), c = r(() => {
+    if (!(o != null && o.current))
+      return;
+    const f = [
+      {
+        originalElementToHighlightRef: o,
+        elementToHighlight: /* @__PURE__ */ t(
+          h,
+          {
+            $widthX: 2.75,
+            $flexDirection: "row",
+            $background: "WHITE",
+            $justifyContent: "center",
+            $alignItems: "center",
+            children: /* @__PURE__ */ t(y, { $renderAs: "ub2", children: "Home" })
+          }
+        ),
+        type: T.TOOLTIP,
+        indicator: {
+          renderAs: "primary",
+          tooltipXCoOrdinates: 100,
+          arrowSize: 12,
+          arrowXCoOrdinates: -100,
+          position: "bottom",
+          backgroundColor: "GREEN_4",
+          borderColor: "BLACK",
+          arrowColor: "BLACK",
+          tooltipItem: /* @__PURE__ */ t(
+            E,
+            {
+              text: "Puzzle assigned as homework. Discuss it in the next class.",
+              buttonLabel: "Got it",
+              onButtonClick: a
+            }
+          )
+        },
+        isActive: !1
+      }
+    ];
+    n(e, f);
+    const m = setTimeout(() => {
+      clearTimeout(m), document.body.style.overflow = "hidden", l();
+    }, 500);
+    d.current.push(m);
+  }, [a, l, e, n]);
+  return p(
+    () => ({
+      puzzleHomeTabRef: o,
+      startJourney: c
+    }),
+    [c]
+  );
+};
+export {
+  $ as useTeacherPuzzleAssignedJourney
+};
+//# sourceMappingURL=use-teacher-puzzle-assigned-journey.js.map

package/dist/features/journey/hooks/use-puzzles-journey/use-teacher-puzzle-assigned-journey.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-teacher-puzzle-assigned-journey.js","sources":["../../../../../src/features/journey/hooks/use-puzzles-journey/use-teacher-puzzle-assigned-journey.tsx"],"sourcesContent":["import type { IArrowTooltipProps } from '../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { ICoachmarkProps } from '../../use-journey/journey-context-types';\n\nimport { useCallback, useMemo, useRef } from 'react';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport { JOURNEY_ID_TEACHER } from '../../journey-id/journey-id-teacher';\nimport { IndicatorType } from '../../use-journey/constants';\nimport { useJourney } from '../../use-journey/use-journey';\nimport TooltipItem from '../use-home-page-journey/tooltip-item';\n\nconst useTeacherPuzzleAssignedJourney = () => {\n  const journeyId = JOURNEY_ID_TEACHER.PUZZLE_ASSIGN_JOURNEY;\n\n  const puzzleHomeTabRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n  const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n  const { setJourney, endJourney, nextCoachmark } = useJourney();\n\n  const handleNextCoachMark = useCallback(() => {\n    nextCoachmark(journeyId, false, 0, false);\n  }, [journeyId, nextCoachmark]);\n\n  const handleEndJourney = useCallback(() => {\n    document.body.style.overflow = 'unset';\n    endJourney(journeyId);\n  }, [endJourney, journeyId]);\n\n  const startJourney = useCallback(() => {\n    if (!puzzleHomeTabRef?.current) {\n      return;\n    }\n\n    const puzzleAttemptSteps: ICoachmarkProps[] = [\n      {\n        originalElementToHighlightRef: puzzleHomeTabRef,\n        elementToHighlight: (\n          <FlexView\n            $widthX={2.75}\n            $flexDirection=\"row\"\n            $background=\"WHITE\"\n            $justifyContent=\"center\"\n            $alignItems=\"center\"\n          >\n            <Text $renderAs=\"ub2\">Home</Text>\n          </FlexView>\n        ),\n        type: IndicatorType.TOOLTIP,\n        indicator: {\n          renderAs: 'primary',\n          tooltipXCoOrdinates: 100,\n          arrowSize: 12,\n          arrowXCoOrdinates: -100,\n          position: 'bottom',\n          backgroundColor: 'GREEN_4',\n          borderColor: 'BLACK',\n          arrowColor: 'BLACK',\n          tooltipItem: (\n            <TooltipItem\n              text=\"Puzzle assigned as homework. Discuss it in the next class.\"\n              buttonLabel=\"Got it\"\n              onButtonClick={handleEndJourney}\n            />\n          ),\n        } as IArrowTooltipProps,\n        isActive: false,\n      },\n    ];\n\n    setJourney(journeyId, puzzleAttemptSteps);\n\n    const delayBeforeStart = setTimeout(() => {\n      clearTimeout(delayBeforeStart);\n      document.body.style.overflow = 'hidden';\n      handleNextCoachMark();\n    }, 500);\n\n    timerRefs.current.push(delayBeforeStart);\n  }, [handleEndJourney, handleNextCoachMark, journeyId, setJourney]);\n\n  const data = useMemo(\n    () => ({\n      puzzleHomeTabRef,\n      startJourney,\n    }),\n    [startJourney],\n  );\n\n  return data;\n};\n\nexport { useTeacherPuzzleAssignedJourney };\n"],"names":["useTeacherPuzzleAssignedJourney","journeyId","JOURNEY_ID_TEACHER","puzzleHomeTabRef","useRef","timerRefs","setJourney","endJourney","nextCoachmark","useJourney","handleNextCoachMark","useCallback","handleEndJourney","startJourney","puzzleAttemptSteps","jsx","FlexView","Text","IndicatorType","TooltipItem","delayBeforeStart","useMemo"],"mappings":";;;;;;;;AAYA,MAAMA,IAAkC,MAAM;AAC5C,QAAMC,IAAYC,EAAmB,uBAE/BC,IAAmBC,EAAuB,IAAI,GAC9CC,IAAYD,EAAwC,CAAA,CAAE,GAEtD,EAAE,YAAAE,GAAY,YAAAC,GAAY,eAAAC,MAAkBC,EAAW,GAEvDC,IAAsBC,EAAY,MAAM;AAC9B,IAAAH,EAAAP,GAAW,IAAO,GAAG,EAAK;AAAA,EAAA,GACvC,CAACA,GAAWO,CAAa,CAAC,GAEvBI,IAAmBD,EAAY,MAAM;AAChC,aAAA,KAAK,MAAM,WAAW,SAC/BJ,EAAWN,CAAS;AAAA,EAAA,GACnB,CAACM,GAAYN,CAAS,CAAC,GAEpBY,IAAeF,EAAY,MAAM;AACjC,QAAA,EAACR,KAAA,QAAAA,EAAkB;AACrB;AAGF,UAAMW,IAAwC;AAAA,MAC5C;AAAA,QACE,+BAA+BX;AAAA,QAC/B,oBACE,gBAAAY;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT,gBAAe;AAAA,YACf,aAAY;AAAA,YACZ,iBAAgB;AAAA,YAChB,aAAY;AAAA,YAEZ,UAAC,gBAAAD,EAAAE,GAAA,EAAK,WAAU,OAAM,UAAI,QAAA;AAAA,UAAA;AAAA,QAC5B;AAAA,QAEF,MAAMC,EAAc;AAAA,QACpB,WAAW;AAAA,UACT,UAAU;AAAA,UACV,qBAAqB;AAAA,UACrB,WAAW;AAAA,UACX,mBAAmB;AAAA,UACnB,UAAU;AAAA,UACV,iBAAiB;AAAA,UACjB,aAAa;AAAA,UACb,YAAY;AAAA,UACZ,aACE,gBAAAH;AAAA,YAACI;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,aAAY;AAAA,cACZ,eAAeP;AAAA,YAAA;AAAA,UACjB;AAAA,QAEJ;AAAA,QACA,UAAU;AAAA,MACZ;AAAA,IAAA;AAGF,IAAAN,EAAWL,GAAWa,CAAkB;AAElC,UAAAM,IAAmB,WAAW,MAAM;AACxC,mBAAaA,CAAgB,GACpB,SAAA,KAAK,MAAM,WAAW,UACXV;OACnB,GAAG;AAEI,IAAAL,EAAA,QAAQ,KAAKe,CAAgB;AAAA,KACtC,CAACR,GAAkBF,GAAqBT,GAAWK,CAAU,CAAC;AAU1D,SARMe;AAAA,IACX,OAAO;AAAA,MACL,kBAAAlB;AAAA,MACA,cAAAU;AAAA,IAAA;AAAA,IAEF,CAACA,CAAY;AAAA,EAAA;AAIjB;"}

package/dist/features/journey/journey-id/journey-id-student.js

@@ -1,5 +1,5 @@
-var E = /* @__PURE__ */ ((R) => (R.CIRCLE_ACTIVITIES_INTRO_JOURNEY = "CIRCLE_ACTIVITIES_INTRO_JOURNEY", R.CIRCLE_LEADERBOARD_INTRO_JOURNEY = "CIRCLE_LEADERBOARD_INTRO_JOURNEY", R.CIRCLE_POINTS_REWARD_JOURNEY = "CIRCLE_POINTS_REWARD_JOURNEY", R.CIRCLE_STREAK_UPDATE_JOURNEY = "CIRCLE_STREAK_UPDATE_JOURNEY", R.CIRCLE_TUTORIAL_JOURNEY = "CIRCLE_TUTORIAL_JOURNEY", R.CIRCLE_TABLES_INTRO_JOURNEY = "CIRCLE_TABLES_INTRO_JOURNEY", R.CIRCLE_TABLES_INFINTE_JOURNEY = "CIRCLE_TABLES_INFINITE_JOURNEY", R.CIRCLE_LESSONS_K_1_INTRO_JOURNEY = "CIRCLE_LESSONS_K_1_INTRO_JOURNEY", R.CIRCLE_STREAK_REDUCTION_JOURNEY = "CIRCLE_STREAK_REDUCTION_JOURNEY", R.HOMEPAGE_JOURNEY = "HOMEPAGE_JOURNEY", R.CHAPTER_PAGE_JOURNEY = "CHAPTER_PAGE_JOURNEY", R.CHALLENGE_ARENA_JOURNEY = "CHALLENGE_ARENA_JOURNEY", R))(E || {});
+var R = /* @__PURE__ */ ((E) => (E.CIRCLE_ACTIVITIES_INTRO_JOURNEY = "CIRCLE_ACTIVITIES_INTRO_JOURNEY", E.CIRCLE_LEADERBOARD_INTRO_JOURNEY = "CIRCLE_LEADERBOARD_INTRO_JOURNEY", E.CIRCLE_POINTS_REWARD_JOURNEY = "CIRCLE_POINTS_REWARD_JOURNEY", E.CIRCLE_STREAK_UPDATE_JOURNEY = "CIRCLE_STREAK_UPDATE_JOURNEY", E.CIRCLE_TUTORIAL_JOURNEY = "CIRCLE_TUTORIAL_JOURNEY", E.CIRCLE_TABLES_INTRO_JOURNEY = "CIRCLE_TABLES_INTRO_JOURNEY", E.CIRCLE_TABLES_INFINTE_JOURNEY = "CIRCLE_TABLES_INFINITE_JOURNEY", E.CIRCLE_LESSONS_K_1_INTRO_JOURNEY = "CIRCLE_LESSONS_K_1_INTRO_JOURNEY", E.CIRCLE_STREAK_REDUCTION_JOURNEY = "CIRCLE_STREAK_REDUCTION_JOURNEY", E.HOMEPAGE_JOURNEY = "HOMEPAGE_JOURNEY", E.CHAPTER_PAGE_JOURNEY = "CHAPTER_PAGE_JOURNEY", E.PUZZLE_ATTEMPT_JOURNEY = "PUZZLE_ATTEMPT_JOURNEY", E.CHALLENGE_ARENA_JOURNEY = "CHALLENGE_ARENA_JOURNEY", E.PUZZLE_ASSIGNED_JOURNEY = "PUZZLE_ASSIGNED_JOURNEY", E.PUZZLE_DASHBOARD_JOURNEY = "PUZZLE_DASHBOARD_JOURNEY", E))(R || {});
 export {
-  E as JOURNEY_ID_STUDENT
+  R as JOURNEY_ID_STUDENT
 };
 //# sourceMappingURL=journey-id-student.js.map

package/dist/features/journey/journey-id/journey-id-student.js.map

@@ -1 +1 @@
-{"version":3,"file":"journey-id-student.js","sources":["../../../../src/features/journey/journey-id/journey-id-student.ts"],"sourcesContent":["export enum JOURNEY_ID_STUDENT {\n  CIRCLE_ACTIVITIES_INTRO_JOURNEY = 'CIRCLE_ACTIVITIES_INTRO_JOURNEY',\n  CIRCLE_LEADERBOARD_INTRO_JOURNEY = 'CIRCLE_LEADERBOARD_INTRO_JOURNEY',\n  CIRCLE_POINTS_REWARD_JOURNEY = 'CIRCLE_POINTS_REWARD_JOURNEY',\n  CIRCLE_STREAK_UPDATE_JOURNEY = 'CIRCLE_STREAK_UPDATE_JOURNEY',\n  CIRCLE_TUTORIAL_JOURNEY = 'CIRCLE_TUTORIAL_JOURNEY',\n  CIRCLE_TABLES_INTRO_JOURNEY = 'CIRCLE_TABLES_INTRO_JOURNEY',\n  CIRCLE_TABLES_INFINTE_JOURNEY = 'CIRCLE_TABLES_INFINITE_JOURNEY',\n  CIRCLE_LESSONS_K_1_INTRO_JOURNEY = 'CIRCLE_LESSONS_K_1_INTRO_JOURNEY',\n\n  // TODO: Deprecate bottom journeys, they are not actually journeys\n  CIRCLE_STREAK_REDUCTION_JOURNEY = 'CIRCLE_STREAK_REDUCTION_JOURNEY',\n  HOMEPAGE_JOURNEY = 'HOMEPAGE_JOURNEY',\n  CHAPTER_PAGE_JOURNEY = 'CHAPTER_PAGE_JOURNEY',\n  CHALLENGE_ARENA_JOURNEY = 'CHALLENGE_ARENA_JOURNEY',\n}\n"],"names":["JOURNEY_ID_STUDENT"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,kCAAkC,mCAClCA,EAAA,mCAAmC,oCACnCA,EAAA,+BAA+B,gCAC/BA,EAAA,+BAA+B,gCAC/BA,EAAA,0BAA0B,2BAC1BA,EAAA,8BAA8B,+BAC9BA,EAAA,gCAAgC,kCAChCA,EAAA,mCAAmC,oCAGnCA,EAAA,kCAAkC,mCAClCA,EAAA,mBAAmB,oBACnBA,EAAA,uBAAuB,wBACvBA,EAAA,0BAA0B,2BAdhBA,IAAAA,KAAA,CAAA,CAAA;"}
+{"version":3,"file":"journey-id-student.js","sources":["../../../../src/features/journey/journey-id/journey-id-student.ts"],"sourcesContent":["export enum JOURNEY_ID_STUDENT {\n  CIRCLE_ACTIVITIES_INTRO_JOURNEY = 'CIRCLE_ACTIVITIES_INTRO_JOURNEY',\n  CIRCLE_LEADERBOARD_INTRO_JOURNEY = 'CIRCLE_LEADERBOARD_INTRO_JOURNEY',\n  CIRCLE_POINTS_REWARD_JOURNEY = 'CIRCLE_POINTS_REWARD_JOURNEY',\n  CIRCLE_STREAK_UPDATE_JOURNEY = 'CIRCLE_STREAK_UPDATE_JOURNEY',\n  CIRCLE_TUTORIAL_JOURNEY = 'CIRCLE_TUTORIAL_JOURNEY',\n  CIRCLE_TABLES_INTRO_JOURNEY = 'CIRCLE_TABLES_INTRO_JOURNEY',\n  CIRCLE_TABLES_INFINTE_JOURNEY = 'CIRCLE_TABLES_INFINITE_JOURNEY',\n  CIRCLE_LESSONS_K_1_INTRO_JOURNEY = 'CIRCLE_LESSONS_K_1_INTRO_JOURNEY',\n\n  // TODO: Deprecate bottom journeys, they are not actually journeys\n  CIRCLE_STREAK_REDUCTION_JOURNEY = 'CIRCLE_STREAK_REDUCTION_JOURNEY',\n  HOMEPAGE_JOURNEY = 'HOMEPAGE_JOURNEY',\n  CHAPTER_PAGE_JOURNEY = 'CHAPTER_PAGE_JOURNEY',\n  PUZZLE_ATTEMPT_JOURNEY = 'PUZZLE_ATTEMPT_JOURNEY',\n  CHALLENGE_ARENA_JOURNEY = 'CHALLENGE_ARENA_JOURNEY',\n  PUZZLE_ASSIGNED_JOURNEY = 'PUZZLE_ASSIGNED_JOURNEY',\n  PUZZLE_DASHBOARD_JOURNEY = 'PUZZLE_DASHBOARD_JOURNEY',\n}\n"],"names":["JOURNEY_ID_STUDENT"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,kCAAkC,mCAClCA,EAAA,mCAAmC,oCACnCA,EAAA,+BAA+B,gCAC/BA,EAAA,+BAA+B,gCAC/BA,EAAA,0BAA0B,2BAC1BA,EAAA,8BAA8B,+BAC9BA,EAAA,gCAAgC,kCAChCA,EAAA,mCAAmC,oCAGnCA,EAAA,kCAAkC,mCAClCA,EAAA,mBAAmB,oBACnBA,EAAA,uBAAuB,wBACvBA,EAAA,yBAAyB,0BACzBA,EAAA,0BAA0B,2BAC1BA,EAAA,0BAA0B,2BAC1BA,EAAA,2BAA2B,4BAjBjBA,IAAAA,KAAA,CAAA,CAAA;"}

package/dist/features/journey/journey-id/journey-id-teacher.js

@@ -1,5 +1,5 @@
-var A = /* @__PURE__ */ ((E) => (E.HOMEPAGE_JOURNEY = "HOMEPAGE_JOURNEY", E.CHAPTER_PAGE_JOURNEY = "CHAPTER_PAGE_JOURNEY", E.CHALLENGE_ARENA_JOURNEY = "CHALLENGE_ARENA_JOURNEY", E))(A || {});
+var N = /* @__PURE__ */ ((E) => (E.HOMEPAGE_JOURNEY = "HOMEPAGE_JOURNEY", E.CHAPTER_PAGE_JOURNEY = "CHAPTER_PAGE_JOURNEY", E.CHALLENGE_ARENA_JOURNEY = "CHALLENGE_ARENA_JOURNEY", E.PUZZLE_ASSIGN_JOURNEY = "PUZZLE_ASSIGN_JOURNEY", E.PUZZLE_INTRO_JOURNEY = "PUZZLE_INTRO_JOURNEY", E.PUZZLE_REVIEW_JOURNEY = "PUZZLE_REVIEW_JOURNEY", E.PUZZLE_PROGRESS_JOURNEY = "PUZZLE_PROGRESS_JOURNEY", E.PUZZLE_UNASSIGN_JOURNEY = "PUZZLE_UNASSIGN_JOURNEY", E))(N || {});
 export {
-  A as JOURNEY_ID_TEACHER
+  N as JOURNEY_ID_TEACHER
 };
 //# sourceMappingURL=journey-id-teacher.js.map

package/dist/features/journey/journey-id/journey-id-teacher.js.map

@@ -1 +1 @@
-{"version":3,"file":"journey-id-teacher.js","sources":["../../../../src/features/journey/journey-id/journey-id-teacher.ts"],"sourcesContent":["export enum JOURNEY_ID_TEACHER {\n  HOMEPAGE_JOURNEY = 'HOMEPAGE_JOURNEY',\n  CHAPTER_PAGE_JOURNEY = 'CHAPTER_PAGE_JOURNEY',\n  CHALLENGE_ARENA_JOURNEY = 'CHALLENGE_ARENA_JOURNEY',\n}\n"],"names":["JOURNEY_ID_TEACHER"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,mBAAmB,oBACnBA,EAAA,uBAAuB,wBACvBA,EAAA,0BAA0B,2BAHhBA,IAAAA,KAAA,CAAA,CAAA;"}
+{"version":3,"file":"journey-id-teacher.js","sources":["../../../../src/features/journey/journey-id/journey-id-teacher.ts"],"sourcesContent":["export enum JOURNEY_ID_TEACHER {\n  HOMEPAGE_JOURNEY = 'HOMEPAGE_JOURNEY',\n  CHAPTER_PAGE_JOURNEY = 'CHAPTER_PAGE_JOURNEY',\n  CHALLENGE_ARENA_JOURNEY = 'CHALLENGE_ARENA_JOURNEY',\n  PUZZLE_ASSIGN_JOURNEY = 'PUZZLE_ASSIGN_JOURNEY',\n  PUZZLE_INTRO_JOURNEY = 'PUZZLE_INTRO_JOURNEY',\n  PUZZLE_REVIEW_JOURNEY = 'PUZZLE_REVIEW_JOURNEY',\n  PUZZLE_PROGRESS_JOURNEY = 'PUZZLE_PROGRESS_JOURNEY',\n  PUZZLE_UNASSIGN_JOURNEY = 'PUZZLE_UNASSIGN_JOURNEY',\n}\n"],"names":["JOURNEY_ID_TEACHER"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,mBAAmB,oBACnBA,EAAA,uBAAuB,wBACvBA,EAAA,0BAA0B,2BAC1BA,EAAA,wBAAwB,yBACxBA,EAAA,uBAAuB,wBACvBA,EAAA,wBAAwB,yBACxBA,EAAA,0BAA0B,2BAC1BA,EAAA,0BAA0B,2BARhBA,IAAAA,KAAA,CAAA,CAAA;"}

package/dist/features/puzzles/api/puzzle-dashboard.js

@@ -0,0 +1,10 @@
+import { createGetAPI as s } from "@cuemath/rest-api";
+import { BASE_URL_V3 as r } from "../../../constants/api.js";
+const { useGet: a, invalidate: z } = s({
+  getURL: (e, o, { courseStream: t }) => `${r}/users/${e}/course-streams/${t}/puzzles-history/`
+});
+export {
+  z as invalidateGetPuzzles,
+  a as useGetPuzzles
+};
+//# sourceMappingURL=puzzle-dashboard.js.map

package/dist/features/puzzles/api/puzzle-dashboard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"puzzle-dashboard.js","sources":["../../../../src/features/puzzles/api/puzzle-dashboard.ts"],"sourcesContent":["import type { TCourseStream } from '../../milestone/create/milestone-create-types';\nimport type { IPuzzleCardAssignData } from '../puzzle-container/puzzle-container-types';\n\nimport { createGetAPI } from '@cuemath/rest-api';\n\nimport { BASE_URL_V3 } from '../../../constants/api';\n\nconst { useGet: useGetPuzzles, invalidate: invalidateGetPuzzles } = createGetAPI<\n  IPuzzleCardAssignData[],\n  void,\n  { courseStream: TCourseStream }\n>({\n  getURL: (studentId, _, { courseStream }) =>\n    `${BASE_URL_V3}/users/${studentId}/course-streams/${courseStream}/puzzles-history/`,\n});\n\nexport { useGetPuzzles, invalidateGetPuzzles };\n"],"names":["useGetPuzzles","invalidateGetPuzzles","createGetAPI","studentId","_","courseStream","BASE_URL_V3"],"mappings":";;AAOA,MAAM,EAAE,QAAQA,GAAe,YAAYC,EAAA,IAAyBC,EAIlE;AAAA,EACA,QAAQ,CAACC,GAAWC,GAAG,EAAE,cAAAC,EAAA,MACvB,GAAGC,CAAW,UAAUH,CAAS,mBAAmBE,CAAY;AACpE,CAAC;"}

package/dist/features/puzzles/comps/puzzle-card-styled.js

@@ -1,79 +1,34 @@
-import e, { keyframes as a, css as r } from "styled-components";
-import n from "../../ui/layout/flex-view.js";
-import { getPuzzleCardPattern as l } from "../utils/puzzle-pattern.js";
-const m = a`
-  from { transform: translateY(-100%); }
-  to   { transform: translateY(0); }
-`, o = a`
-  from { transform: rotateY(0deg); }
-  to   { transform: rotateY(360deg); }
-`, c = a`
-  from { transform: translateY(0); opacity: 1; }
-  to   { transform: translateY(-100%); opacity: 0; }
-`, d = e(n)`
+import e from "styled-components";
+import r from "../../ui/layout/flex-view.js";
+import i from "../../ui/text/text.js";
+import { getPuzzleCardPattern as p } from "../utils/puzzle-pattern.js";
+const n = e(r)`
   position: relative;
+  cursor: pointer;
 
-  box-shadow: inset 0px 0px 0px 4px ${({ theme: t, $imageHue: i }) => t.colors[`${i}_4`]};
+  box-shadow: inset 0px 0px 0px 4px ${({ theme: o, $imageHue: t }) => o.colors[`${t}_4`]};
 
-  background-image: ${({ $imageHue: t }) => `url(${l(t)})`};
+  background-image: ${({ $imageHue: o }) => `url(${p(o)})`};
   background-size: cover;
 
-  ${({ $animationPhase: t }) => t && r`
-      transform-style: preserve-3d;
-      opacity: 0;
-      visibility: hidden;
-      transform: translateY(-100%);
-    `}
-
-  ${({ $animationPhase: t, theme: i, $imageHue: s }) => {
-  switch (t) {
-    case "movingIn":
-      return r`
-          visibility: visible;
-          opacity: 1;
-          animation: ${m} 0.5s ease-out forwards;
-        `;
-    case "revealing":
-      return r`
-          visibility: visible;
-          opacity: 1;
-          transform: translateY(0); /* Position after moveIn */
-          animation: ${o} 1s ease-in-out forwards;
-        `;
-    case "visible":
-      return r`
-          visibility: visible;
-          opacity: 1;
-          transform: translateY(0) rotateY(360deg);
-          background-color: ${i.colors[`${s}_2`]};
-          transition: background-color 0.2s ease-in;
-        `;
-    case "assigning":
-      return r`
-          visibility: visible;
-          opacity: 1;
-          transform: translateY(0); /* Reset rotation for this animation */
-          animation: ${o} 1s ease-in-out forwards;
-        `;
-    case "assigned":
-      return r`
-          visibility: visible;
-          opacity: 1;
-          transform: translateY(0) rotateY(360deg);
-        `;
-    case "movingOut":
-      return r`
-          visibility: visible;
-          opacity: 1;
-          transform: translateY(0); /* Start from final position */
-          animation: ${c} 0.5s ease-in forwards;
-        `;
-    default:
-      return "";
+  &:hover {
+    outline: 1px solid ${({ theme: o }) => o.colors.BLACK_1};
   }
-}}
+`, x = e(i)`
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: break-spaces;
+`, b = e(r)`
+  position: absolute;
+  top: -10px;
+  right: -10px;
 `;
 export {
-  d as PuzzleWrapper
+  n as PuzzleWrapper,
+  b as StickerWrapper,
+  x as Title
 };
 //# sourceMappingURL=puzzle-card-styled.js.map

package/dist/features/puzzles/comps/puzzle-card-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"puzzle-card-styled.js","sources":["../../../../src/features/puzzles/comps/puzzle-card-styled.tsx"],"sourcesContent":["import type { THueNames } from '../../ui/types';\n\nimport styled, { css, keyframes } from 'styled-components';\n\nimport FlexView from '../../ui/layout/flex-view';\nimport { getPuzzleCardPattern } from '../utils/puzzle-pattern';\n\n// --- Keyframes for each animation step ---\nconst moveInAnim = keyframes`\n  from { transform: translateY(-100%); }\n  to   { transform: translateY(0); }\n`;\n\nconst rotateYAnim = keyframes`\n  from { transform: rotateY(0deg); }\n  to   { transform: rotateY(360deg); }\n`;\n\nconst moveOutAnim = keyframes`\n  from { transform: translateY(0); opacity: 1; }\n  to   { transform: translateY(-100%); opacity: 0; }\n`;\n\nconst PuzzleWrapper = styled(FlexView)<{ $animationPhase?: string; $imageHue: THueNames }>`\n  position: relative;\n\n  box-shadow: inset 0px 0px 0px 4px ${({ theme, $imageHue }) => theme.colors[`${$imageHue}_4`]};\n\n  background-image: ${({ $imageHue }) => `url(${getPuzzleCardPattern($imageHue)})`};\n  background-size: cover;\n\n  ${({ $animationPhase }) =>\n    $animationPhase &&\n    css`\n      transform-style: preserve-3d;\n      opacity: 0;\n      visibility: hidden;\n      transform: translateY(-100%);\n    `}\n\n  ${({ $animationPhase, theme, $imageHue }) => {\n    switch ($animationPhase) {\n      case 'movingIn':\n        return css`\n          visibility: visible;\n          opacity: 1;\n          animation: ${moveInAnim} 0.5s ease-out forwards;\n        `;\n      case 'revealing':\n        return css`\n          visibility: visible;\n          opacity: 1;\n          transform: translateY(0); /* Position after moveIn */\n          animation: ${rotateYAnim} 1s ease-in-out forwards;\n        `;\n      case 'visible':\n        return css`\n          visibility: visible;\n          opacity: 1;\n          transform: translateY(0) rotateY(360deg);\n          background-color: ${theme.colors[`${$imageHue}_2`]};\n          transition: background-color 0.2s ease-in;\n        `;\n      case 'assigning':\n        return css`\n          visibility: visible;\n          opacity: 1;\n          transform: translateY(0); /* Reset rotation for this animation */\n          animation: ${rotateYAnim} 1s ease-in-out forwards;\n        `;\n      case 'assigned':\n        return css`\n          visibility: visible;\n          opacity: 1;\n          transform: translateY(0) rotateY(360deg);\n        `;\n      case 'movingOut':\n        return css`\n          visibility: visible;\n          opacity: 1;\n          transform: translateY(0); /* Start from final position */\n          animation: ${moveOutAnim} 0.5s ease-in forwards;\n        `;\n      default:\n        return '';\n    }\n  }}\n`;\n\nexport { PuzzleWrapper };\n"],"names":["moveInAnim","keyframes","rotateYAnim","moveOutAnim","PuzzleWrapper","styled","FlexView","theme","$imageHue","getPuzzleCardPattern","$animationPhase","css"],"mappings":";;;AAQA,MAAMA,IAAaC;AAAA;AAAA;AAAA,GAKbC,IAAcD;AAAA;AAAA;AAAA,GAKdE,IAAcF;AAAA;AAAA;AAAA,GAKdG,IAAgBC,EAAOC,CAAQ;AAAA;AAAA;AAAA,sCAGC,CAAC,EAAE,OAAAC,GAAO,WAAAC,QAAgBD,EAAM,OAAO,GAAGC,CAAS,IAAI,CAAC;AAAA;AAAA,sBAExE,CAAC,EAAE,WAAAA,EAAU,MAAM,OAAOC,EAAqBD,CAAS,CAAC,GAAG;AAAA;AAAA;AAAA,IAG9E,CAAC,EAAE,iBAAAE,QACHA,KACAC;AAAA;AAAA;AAAA;AAAA;AAAA,KAKC;AAAA;AAAA,IAED,CAAC,EAAE,iBAAAD,GAAiB,OAAAH,GAAO,WAAAC,QAAgB;AAC3C,UAAQE,GAAiB;AAAA,IACvB,KAAK;AACI,aAAAC;AAAA;AAAA;AAAA,uBAGQX,CAAU;AAAA;AAAA,IAE3B,KAAK;AACI,aAAAW;AAAA;AAAA;AAAA;AAAA,uBAIQT,CAAW;AAAA;AAAA,IAE5B,KAAK;AACI,aAAAS;AAAA;AAAA;AAAA;AAAA,8BAIeJ,EAAM,OAAO,GAAGC,CAAS,IAAI,CAAC;AAAA;AAAA;AAAA,IAGtD,KAAK;AACI,aAAAG;AAAA;AAAA;AAAA;AAAA,uBAIQT,CAAW;AAAA;AAAA,IAE5B,KAAK;AACI,aAAAS;AAAA;AAAA;AAAA;AAAA;AAAA,IAKT,KAAK;AACI,aAAAA;AAAA;AAAA;AAAA;AAAA,uBAIQR,CAAW;AAAA;AAAA,IAE5B;AACS,aAAA;AAAA,EACX;AACF,CAAC;AAAA;"}
+{"version":3,"file":"puzzle-card-styled.js","sources":["../../../../src/features/puzzles/comps/puzzle-card-styled.tsx"],"sourcesContent":["import type { THueNames } from '../../ui/types';\n\nimport styled from 'styled-components';\n\nimport FlexView from '../../ui/layout/flex-view';\nimport Text from '../../ui/text/text';\nimport { getPuzzleCardPattern } from '../utils/puzzle-pattern';\n\nconst PuzzleWrapper = styled(FlexView)<{ $animationPhase?: string; $imageHue: THueNames }>`\n  position: relative;\n  cursor: pointer;\n\n  box-shadow: inset 0px 0px 0px 4px ${({ theme, $imageHue }) => theme.colors[`${$imageHue}_4`]};\n\n  background-image: ${({ $imageHue }) => `url(${getPuzzleCardPattern($imageHue)})`};\n  background-size: cover;\n\n  &:hover {\n    outline: 1px solid ${({ theme }) => theme.colors.BLACK_1};\n  }\n`;\n\nconst Title = styled(Text)`\n  display: -webkit-box;\n  -webkit-line-clamp: 3;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: break-spaces;\n`;\n\nconst StickerWrapper = styled(FlexView)`\n  position: absolute;\n  top: -10px;\n  right: -10px;\n`;\n\nexport { PuzzleWrapper, Title, StickerWrapper };\n"],"names":["PuzzleWrapper","styled","FlexView","theme","$imageHue","getPuzzleCardPattern","Title","Text","StickerWrapper"],"mappings":";;;;AAQM,MAAAA,IAAgBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,sCAIC,CAAC,EAAE,OAAAC,GAAO,WAAAC,QAAgBD,EAAM,OAAO,GAAGC,CAAS,IAAI,CAAC;AAAA;AAAA,sBAExE,CAAC,EAAE,WAAAA,EAAU,MAAM,OAAOC,EAAqBD,CAAS,CAAC,GAAG;AAAA;AAAA;AAAA;AAAA,yBAIzD,CAAC,EAAE,OAAAD,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA,GAItDG,IAAQL,EAAOM,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GASnBC,IAAiBP,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;"}

package/dist/features/puzzles/comps/puzzle-card.js

@@ -1,35 +1,77 @@
-import { jsx as h } from "react/jsx-runtime";
-import { memo as p } from "react";
-import { PuzzleWrapper as s } from "./puzzle-card-styled.js";
-const c = p(
+import { jsx as t, jsxs as a } from "react/jsx-runtime";
+import { memo as u, useMemo as z, useCallback as L } from "react";
+import P from "../../ui/buttons/clickable/clickable.js";
+import _ from "../../ui/image/image.js";
+import d from "../../ui/layout/flex-view.js";
+import E from "../../ui/lottie-animation/lottie-animation.js";
+import { PUZZLE_ANALYTICS_EVENTS as S } from "../puzzle-analytics-events.js";
+import { getPuzzleStickerLottie as b } from "../utils/puzzle-feedback-celebration.js";
+import { PuzzleWrapper as y, Title as Z, StickerWrapper as k } from "./puzzle-card-styled.js";
+const x = {
+  autoplay: !1,
+  loop: !1,
+  renderer: "canvas"
+}, X = u(
   ({
-    children: e,
-    imageHue: t,
-    onAnimationEnd: r,
-    animationPhase: o,
-    width: i,
-    widthX: m,
-    height: n,
-    heightX: $,
-    backgroundColor: a
-  }) => /* @__PURE__ */ h(
-    s,
-    {
-      $animationPhase: o,
-      onAnimationEnd: r,
-      $width: i,
-      $height: n,
-      $widthX: m,
-      $heightX: $,
-      $alignItems: "center",
-      $justifyContent: "center",
-      $imageHue: t,
-      $background: a ?? `${t}_6`,
-      children: e
-    }
-  )
+    imageHue: o,
+    imageUrl: s,
+    title: p,
+    height: h = "100%",
+    width: f = "100%",
+    onCardClick: e,
+    userNodeId: i,
+    rewards: r,
+    studentId: n,
+    nodeId: l
+  }) => {
+    const { sticker: c } = (r == null ? void 0 : r[0]) || {}, $ = z(
+      () => ({
+        node_id: l,
+        student_id: n,
+        node_type: "PUZZLE_CARD"
+      }),
+      [l, n]
+    ), m = c ? b(c) : void 0, g = L(() => {
+      i && (e == null || e(i));
+    }, [e, i]);
+    return /* @__PURE__ */ t(
+      P,
+      {
+        label: "",
+        analyticsLabel: S.PUZZLE_VIEWED,
+        analyticsProps: $,
+        onClick: g,
+        children: /* @__PURE__ */ a(
+          y,
+          {
+            $width: f,
+            $height: h,
+            $justifyContent: "center",
+            $alignItems: "center",
+            $imageHue: o,
+            $background: `${o}_2`,
+            children: [
+              /* @__PURE__ */ a(d, { $justifyContent: "center", $alignItems: "center", $flexGap: 12, children: [
+                /* @__PURE__ */ t(_, { src: s ?? "", width: 68, height: 68, withLoader: !1, alt: "Puzzle" }),
+                /* @__PURE__ */ t(Z, { $renderAs: "ab3", $align: "center", $width: "80%", children: p })
+              ] }),
+              m && /* @__PURE__ */ t(k, { $widthX: 2.5, $heightX: 2.5, children: /* @__PURE__ */ t(
+                E,
+                {
+                  width: 40,
+                  height: 40,
+                  src: m,
+                  settings: x
+                }
+              ) })
+            ]
+          }
+        )
+      }
+    );
+  }
 );
 export {
-  c as default
+  X as default
 };
 //# sourceMappingURL=puzzle-card.js.map

package/dist/features/puzzles/comps/puzzle-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"puzzle-card.js","sources":["../../../../src/features/puzzles/comps/puzzle-card.tsx"],"sourcesContent":["import type { IPuzzleCardProps } from './puzzle-card-types';\nimport type { FC } from 'react';\n\nimport { memo } from 'react';\n\nimport * as Styled from './puzzle-card-styled';\n\nconst PuzzleCard: FC<IPuzzleCardProps> = memo(\n  ({\n    children,\n    imageHue,\n    onAnimationEnd,\n    animationPhase,\n    width,\n    widthX,\n    height,\n    heightX,\n    backgroundColor,\n  }) => {\n    return (\n      <Styled.PuzzleWrapper\n        $animationPhase={animationPhase}\n        onAnimationEnd={onAnimationEnd}\n        $width={width}\n        $height={height}\n        $widthX={widthX}\n        $heightX={heightX}\n        $alignItems=\"center\"\n        $justifyContent=\"center\"\n        $imageHue={imageHue}\n        $background={backgroundColor ?? `${imageHue}_6`}\n      >\n        {children}\n      </Styled.PuzzleWrapper>\n    );\n  },\n);\n\nexport default PuzzleCard;\n"],"names":["PuzzleCard","memo","children","imageHue","onAnimationEnd","animationPhase","width","widthX","height","heightX","backgroundColor","jsx","Styled.PuzzleWrapper"],"mappings":";;;AAOA,MAAMA,IAAmCC;AAAA,EACvC,CAAC;AAAA,IACC,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,SAAAC;AAAA,IACA,iBAAAC;AAAA,EAAA,MAGE,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,iBAAiBP;AAAA,MACjB,gBAAAD;AAAA,MACA,QAAQE;AAAA,MACR,SAASE;AAAA,MACT,SAASD;AAAA,MACT,UAAUE;AAAA,MACV,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,WAAWN;AAAA,MACX,aAAaO,KAAmB,GAAGP,CAAQ;AAAA,MAE1C,UAAAD;AAAA,IAAA;AAAA,EAAA;AAIT;"}
+{"version":3,"file":"puzzle-card.js","sources":["../../../../src/features/puzzles/comps/puzzle-card.tsx"],"sourcesContent":["import type { IPuzzleCardProps } from './puzzle-card-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useMemo } from 'react';\n\nimport Clickable from '../../ui/buttons/clickable/clickable';\nimport Image from '../../ui/image/image';\nimport FlexView from '../../ui/layout/flex-view';\nimport LottieAnimation from '../../ui/lottie-animation/lottie-animation';\nimport { PUZZLE_ANALYTICS_EVENTS } from '../puzzle-analytics-events';\nimport { getPuzzleStickerLottie } from '../utils/puzzle-feedback-celebration';\nimport * as Styled from './puzzle-card-styled';\n\nconst puzzleStickerLottieSettings = {\n  autoplay: false,\n  loop: false,\n  renderer: 'canvas',\n};\n\nconst PuzzleCard: FC<IPuzzleCardProps> = memo(\n  ({\n    imageHue,\n    imageUrl,\n    title,\n    height = '100%',\n    width = '100%',\n    onCardClick,\n    userNodeId,\n    rewards,\n    studentId,\n    nodeId,\n  }) => {\n    const { sticker } = rewards?.[0] || {};\n\n    const analyticsProps = useMemo(\n      () => ({\n        node_id: nodeId,\n        student_id: studentId,\n        node_type: 'PUZZLE_CARD',\n      }),\n      [nodeId, studentId],\n    );\n\n    const puzzleStickerLottie = sticker ? getPuzzleStickerLottie(sticker) : undefined;\n\n    const handleCardClick = useCallback(() => {\n      if (userNodeId) {\n        onCardClick?.(userNodeId);\n      }\n    }, [onCardClick, userNodeId]);\n\n    return (\n      <Clickable\n        label=\"\"\n        analyticsLabel={PUZZLE_ANALYTICS_EVENTS.PUZZLE_VIEWED}\n        analyticsProps={analyticsProps}\n        onClick={handleCardClick}\n      >\n        <Styled.PuzzleWrapper\n          $width={width}\n          $height={height}\n          $justifyContent=\"center\"\n          $alignItems=\"center\"\n          $imageHue={imageHue}\n          $background={`${imageHue}_2`}\n        >\n          <FlexView $justifyContent=\"center\" $alignItems=\"center\" $flexGap={12}>\n            <Image src={imageUrl ?? ''} width={68} height={68} withLoader={false} alt=\"Puzzle\" />\n\n            <Styled.Title $renderAs=\"ab3\" $align=\"center\" $width=\"80%\">\n              {title}\n            </Styled.Title>\n          </FlexView>\n\n          {puzzleStickerLottie && (\n            <Styled.StickerWrapper $widthX={2.5} $heightX={2.5}>\n              <LottieAnimation\n                width={40}\n                height={40}\n                src={puzzleStickerLottie}\n                settings={puzzleStickerLottieSettings}\n              />\n            </Styled.StickerWrapper>\n          )}\n        </Styled.PuzzleWrapper>\n      </Clickable>\n    );\n  },\n);\n\nexport default PuzzleCard;\n"],"names":["puzzleStickerLottieSettings","PuzzleCard","memo","imageHue","imageUrl","title","height","width","onCardClick","userNodeId","rewards","studentId","nodeId","sticker","analyticsProps","useMemo","puzzleStickerLottie","getPuzzleStickerLottie","handleCardClick","useCallback","jsx","Clickable","PUZZLE_ANALYTICS_EVENTS","jsxs","Styled.PuzzleWrapper","FlexView","Image","Styled.Title","Styled.StickerWrapper","LottieAnimation"],"mappings":";;;;;;;;;AAaA,MAAMA,IAA8B;AAAA,EAClC,UAAU;AAAA,EACV,MAAM;AAAA,EACN,UAAU;AACZ,GAEMC,IAAmCC;AAAA,EACvC,CAAC;AAAA,IACC,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,QAAAC,IAAS;AAAA,IACT,OAAAC,IAAQ;AAAA,IACR,aAAAC;AAAA,IACA,YAAAC;AAAA,IACA,SAAAC;AAAA,IACA,WAAAC;AAAA,IACA,QAAAC;AAAA,EAAA,MACI;AACJ,UAAM,EAAE,SAAAC,EAAQ,KAAIH,KAAA,gBAAAA,EAAU,OAAM,CAAA,GAE9BI,IAAiBC;AAAA,MACrB,OAAO;AAAA,QACL,SAASH;AAAA,QACT,YAAYD;AAAA,QACZ,WAAW;AAAA,MAAA;AAAA,MAEb,CAACC,GAAQD,CAAS;AAAA,IAAA,GAGdK,IAAsBH,IAAUI,EAAuBJ,CAAO,IAAI,QAElEK,IAAkBC,EAAY,MAAM;AACxC,MAAIV,MACFD,KAAA,QAAAA,EAAcC;AAAA,IAChB,GACC,CAACD,GAAaC,CAAU,CAAC;AAG1B,WAAA,gBAAAW;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,gBAAgBC,EAAwB;AAAA,QACxC,gBAAAR;AAAA,QACA,SAASI;AAAA,QAET,UAAA,gBAAAK;AAAA,UAACC;AAAAA,UAAA;AAAA,YACC,QAAQjB;AAAA,YACR,SAASD;AAAA,YACT,iBAAgB;AAAA,YAChB,aAAY;AAAA,YACZ,WAAWH;AAAA,YACX,aAAa,GAAGA,CAAQ;AAAA,YAExB,UAAA;AAAA,cAAA,gBAAAoB,EAACE,KAAS,iBAAgB,UAAS,aAAY,UAAS,UAAU,IAChE,UAAA;AAAA,gBAAC,gBAAAL,EAAAM,GAAA,EAAM,KAAKtB,KAAY,IAAI,OAAO,IAAI,QAAQ,IAAI,YAAY,IAAO,KAAI,SAAS,CAAA;AAAA,gBAEnF,gBAAAgB,EAACO,GAAA,EAAa,WAAU,OAAM,QAAO,UAAS,QAAO,OAClD,UACHtB,EAAA,CAAA;AAAA,cAAA,GACF;AAAA,cAECW,uBACEY,GAAA,EAAsB,SAAS,KAAK,UAAU,KAC7C,UAAA,gBAAAR;AAAA,gBAACS;AAAA,gBAAA;AAAA,kBACC,OAAO;AAAA,kBACP,QAAQ;AAAA,kBACR,KAAKb;AAAA,kBACL,UAAUhB;AAAA,gBAAA;AAAA,cAAA,GAEd;AAAA,YAAA;AAAA,UAAA;AAAA,QAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;"}

package/dist/features/puzzles/constants/puzzle-container.js

@@ -0,0 +1,8 @@
+const A = {
+  REVEAL: [0, 50],
+  REVEAL_ASSIGNED: [58, 160]
+};
+export {
+  A as PUZZLE_ASSIGN_ANIMATION
+};
+//# sourceMappingURL=puzzle-container.js.map

package/dist/features/puzzles/constants/puzzle-container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"puzzle-container.js","sources":["../../../../src/features/puzzles/constants/puzzle-container.ts"],"sourcesContent":["import type { AnimationSegment } from 'lottie-web';\n\nexport const PUZZLE_ASSIGN_ANIMATION = {\n  REVEAL: [0, 50] as AnimationSegment,\n  REVEAL_ASSIGNED: [58, 160] as AnimationSegment,\n};\n"],"names":["PUZZLE_ASSIGN_ANIMATION"],"mappings":"AAEO,MAAMA,IAA0B;AAAA,EACrC,QAAQ,CAAC,GAAG,EAAE;AAAA,EACd,iBAAiB,CAAC,IAAI,GAAG;AAC3B;"}

package/dist/features/puzzles/puzzle-analytics-events.js

@@ -0,0 +1,11 @@
+import { PLUGINS as z } from "../../node_modules/@cuemath/analytics-v2/dist/constants.js";
+var E = /* @__PURE__ */ ((e) => (e.PUZZLE_ASSIGNED = "puzzle_assigned", e.PUZZLE_VIEWED = "puzzle_viewed", e))(E || {});
+const _ = {
+  puzzle_viewed: [z.MIXPANEL],
+  puzzle_assigned: [z.MIXPANEL]
+};
+export {
+  E as PUZZLE_ANALYTICS_EVENTS,
+  _ as PUZZLE_ANALYTICS_WHITELIST_EVENTS
+};
+//# sourceMappingURL=puzzle-analytics-events.js.map

package/dist/features/puzzles/puzzle-analytics-events.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"puzzle-analytics-events.js","sources":["../../../src/features/puzzles/puzzle-analytics-events.ts"],"sourcesContent":["import { PLUGINS } from '@cuemath/analytics-v2/dist/constants';\n\nexport enum PUZZLE_ANALYTICS_EVENTS {\n  PUZZLE_ASSIGNED = 'puzzle_assigned',\n  PUZZLE_VIEWED = 'puzzle_viewed',\n}\n\nexport const PUZZLE_ANALYTICS_WHITELIST_EVENTS = {\n  [PUZZLE_ANALYTICS_EVENTS.PUZZLE_VIEWED]: [PLUGINS.MIXPANEL],\n  [PUZZLE_ANALYTICS_EVENTS.PUZZLE_ASSIGNED]: [PLUGINS.MIXPANEL],\n};\n"],"names":["PUZZLE_ANALYTICS_EVENTS","PUZZLE_ANALYTICS_WHITELIST_EVENTS","PLUGINS"],"mappings":";AAEY,IAAAA,sBAAAA,OACVA,EAAA,kBAAkB,mBAClBA,EAAA,gBAAgB,iBAFNA,IAAAA,KAAA,CAAA,CAAA;AAKL,MAAMC,IAAoC;AAAA,EAC9C,eAAwC,CAACC,EAAQ,QAAQ;AAAA,EACzD,iBAA0C,CAACA,EAAQ,QAAQ;AAC9D;"}