@cuemath/leap 3.2.9-pzd-0.2 → 3.2.9-pzd-0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -5,8 +5,8 @@ import O from "../../ui/lottie-animation/lottie-animation.js";
|
|
5
5
|
import { usePostPuzzleToAssign as U } from "../api/puzzle-assign.js";
|
6
6
|
import { PUZZLE_ASSIGN_ANIMATION as c } from "../constants/puzzle-container.js";
|
7
7
|
import { getPuzzleCardLottie as v } from "../utils/puzzle-pattern.js";
|
8
|
-
import { PuzzleContainer as
|
9
|
-
import
|
8
|
+
import { PuzzleContainer as C, PuzzleAssignedWrapper as y, PuzzleContentWrapper as D } from "./puzzle-container-styled.js";
|
9
|
+
import L from "./puzzle-container-view.js";
|
10
10
|
const G = {
|
11
11
|
loop: !1,
|
12
12
|
renderer: "svg",
|
@@ -16,7 +16,7 @@ const G = {
|
|
16
16
|
triggerReveal: l = !1,
|
17
17
|
onFullyHidden: r,
|
18
18
|
onPuzzleClick: f,
|
19
|
-
puzzleData:
|
19
|
+
puzzleData: _,
|
20
20
|
courseStream: z,
|
21
21
|
studentId: p
|
22
22
|
}) => {
|
@@ -27,13 +27,13 @@ const G = {
|
|
27
27
|
title: d,
|
28
28
|
id: P,
|
29
29
|
node_id: A
|
30
|
-
} =
|
30
|
+
} = _, [E, a] = T(s), o = Z(null), S = u(() => v(i), [i]), $ = u(
|
31
31
|
() => ({
|
32
32
|
node_id: A,
|
33
33
|
node_type: "PUZZLE_CARD"
|
34
34
|
}),
|
35
35
|
[A]
|
36
|
-
), { post: h, isProcessing:
|
36
|
+
), { post: h, isProcessing: I } = U({
|
37
37
|
onComplete: (e) => {
|
38
38
|
var t;
|
39
39
|
e ? a(!0) : ((t = o.current) == null || t.playSegments(c.REVEAL_ASSIGNED, !1), a(!1));
|
@@ -43,7 +43,7 @@ const G = {
|
|
43
43
|
var e, t;
|
44
44
|
s || (l ? (e = o.current) == null || e.playSegments(c.REVEAL, !0) : ((t = o.current) == null || t.stop(), a(!1)));
|
45
45
|
}, [s, l]);
|
46
|
-
const
|
46
|
+
const w = m(() => {
|
47
47
|
s || h(
|
48
48
|
{
|
49
49
|
puzzle_id: P
|
@@ -53,7 +53,7 @@ const G = {
|
|
53
53
|
courseStream: z
|
54
54
|
}
|
55
55
|
);
|
56
|
-
}, [z, s, h, P, p]),
|
56
|
+
}, [z, s, h, P, p]), R = m(() => {
|
57
57
|
f();
|
58
58
|
}, [f]), b = m(() => {
|
59
59
|
var e;
|
@@ -68,28 +68,19 @@ const G = {
|
|
68
68
|
}),
|
69
69
|
[r]
|
70
70
|
);
|
71
|
-
return l ? s ? /* @__PURE__ */ n(
|
71
|
+
return l ? s ? /* @__PURE__ */ n(C, { $justifyContent: "center", children: /* @__PURE__ */ n(
|
72
72
|
y,
|
73
73
|
{
|
74
74
|
$imageHue: i,
|
75
75
|
$background: `${i}_2`,
|
76
76
|
$widthX: 15.9375,
|
77
|
-
children: /* @__PURE__ */ n(
|
78
|
-
E,
|
79
|
-
{
|
80
|
-
imageUrl: g,
|
81
|
-
title: d,
|
82
|
-
handleOnPuzzleClick: L,
|
83
|
-
handleAssign: C,
|
84
|
-
assigned: !0
|
85
|
-
}
|
86
|
-
)
|
77
|
+
children: /* @__PURE__ */ n(L, { imageUrl: g, title: d, assigned: !0 })
|
87
78
|
}
|
88
|
-
) }) : /* @__PURE__ */ n(
|
79
|
+
) }) : /* @__PURE__ */ n(C, { children: /* @__PURE__ */ V(k, { $heightX: 26, children: [
|
89
80
|
/* @__PURE__ */ n(
|
90
81
|
O,
|
91
82
|
{
|
92
|
-
src:
|
83
|
+
src: S,
|
93
84
|
ref: o,
|
94
85
|
settings: G,
|
95
86
|
onRender: b,
|
@@ -97,15 +88,15 @@ const G = {
|
|
97
88
|
animateOnIntersect: !0
|
98
89
|
}
|
99
90
|
),
|
100
|
-
/* @__PURE__ */ n(D, { $visible:
|
101
|
-
|
91
|
+
/* @__PURE__ */ n(D, { $visible: E, $position: "absolute", children: /* @__PURE__ */ n(
|
92
|
+
L,
|
102
93
|
{
|
103
94
|
imageUrl: g,
|
104
95
|
title: d,
|
105
|
-
handleOnPuzzleClick:
|
106
|
-
handleAssign:
|
107
|
-
assigning:
|
108
|
-
analyticsProps:
|
96
|
+
handleOnPuzzleClick: R,
|
97
|
+
handleAssign: w,
|
98
|
+
assigning: I,
|
99
|
+
analyticsProps: $
|
109
100
|
}
|
110
101
|
) })
|
111
102
|
] }) }) : null;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"puzzle-container.js","sources":["../../../../src/features/puzzles/puzzle-container/puzzle-container.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../ui/lottie-animation/types';\nimport type { IPuzzleCardContainerProps } from './puzzle-container-types';\nimport type { AnimationEventName, BMEnterFrameEvent } from 'lottie-web';\nimport type { FC } from 'react';\n\nimport { useState, useCallback, useEffect, useRef, memo, useMemo } from 'react';\n\nimport FlexView from '../../ui/layout/flex-view';\nimport LottieAnimation from '../../ui/lottie-animation/lottie-animation';\nimport { usePostPuzzleToAssign } from '../api/puzzle-assign';\nimport { PUZZLE_ASSIGN_ANIMATION } from '../constants/puzzle-container';\nimport { getPuzzleCardLottie } from '../utils/puzzle-pattern';\nimport * as Styled from './puzzle-container-styled';\nimport PuzzleAssigned from './puzzle-container-view';\n\nconst modeRevealAnimationSettings = {\n loop: false,\n renderer: 'svg',\n autoPlay: false,\n};\n\nconst PuzzleCardContainer: FC<IPuzzleCardContainerProps> = memo(\n ({\n triggerReveal = false,\n onFullyHidden,\n onPuzzleClick,\n puzzleData,\n courseStream,\n studentId,\n }) => {\n const {\n image_hue: imageHue,\n image_url: imageUrl,\n assigned: externalAssigned,\n title,\n id: puzzleId,\n node_id: nodeId,\n } = puzzleData;\n\n const [showPuzzleInfo, setShowPuzzleInfo] = useState(externalAssigned);\n\n const assignLottieRef = useRef<ILottieAnimationRef | null>(null);\n const puzzleLottieSrc = useMemo(() => getPuzzleCardLottie(imageHue), [imageHue]);\n\n const analyticsProps = useMemo(\n () => ({\n node_id: nodeId,\n node_type: 'PUZZLE_CARD',\n }),\n [nodeId],\n );\n\n const { post: postPuzzleToAssign, isProcessing } = usePostPuzzleToAssign({\n onComplete: (error: string | null) => {\n if (error) {\n // Handle error (e.g., show a notification)\n setShowPuzzleInfo(true);\n } else {\n assignLottieRef.current?.playSegments(PUZZLE_ASSIGN_ANIMATION.REVEAL_ASSIGNED, false);\n\n setShowPuzzleInfo(false);\n }\n },\n });\n\n useEffect(() => {\n if (!externalAssigned) {\n if (triggerReveal) {\n assignLottieRef.current?.playSegments(PUZZLE_ASSIGN_ANIMATION.REVEAL, true);\n } else {\n assignLottieRef.current?.stop();\n setShowPuzzleInfo(false);\n }\n }\n }, [externalAssigned, triggerReveal]);\n\n const handleAssign = useCallback(() => {\n if (externalAssigned) return;\n\n postPuzzleToAssign(\n {\n puzzle_id: puzzleId,\n },\n {\n studentId,\n courseStream,\n },\n );\n }, [courseStream, externalAssigned, postPuzzleToAssign, puzzleId, studentId]);\n\n const handleOnPuzzleClick = useCallback(() => {\n onPuzzleClick();\n }, [onPuzzleClick]);\n\n const showPuzzleLottie = useCallback(() => {\n assignLottieRef.current?.playSegments(PUZZLE_ASSIGN_ANIMATION.REVEAL, true);\n }, []);\n\n const onAnimationFinish = useMemo(\n () => ({\n name: 'enterFrame' as AnimationEventName,\n callback: (event: BMEnterFrameEvent) => {\n const { currentTime } = event;\n\n if (currentTime === 49) {\n setShowPuzzleInfo(true);\n }\n\n if (currentTime === 101) {\n onFullyHidden?.();\n }\n },\n }),\n [onFullyHidden],\n );\n\n if (!triggerReveal) {\n return null;\n }\n\n if (externalAssigned) {\n return (\n <Styled.PuzzleContainer $justifyContent=\"center\">\n <Styled.PuzzleAssignedWrapper\n $imageHue={imageHue}\n $background={`${imageHue}_2`}\n $widthX={15.9375}\n >\n <PuzzleAssigned
|
1
|
+
{"version":3,"file":"puzzle-container.js","sources":["../../../../src/features/puzzles/puzzle-container/puzzle-container.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../ui/lottie-animation/types';\nimport type { IPuzzleCardContainerProps } from './puzzle-container-types';\nimport type { AnimationEventName, BMEnterFrameEvent } from 'lottie-web';\nimport type { FC } from 'react';\n\nimport { useState, useCallback, useEffect, useRef, memo, useMemo } from 'react';\n\nimport FlexView from '../../ui/layout/flex-view';\nimport LottieAnimation from '../../ui/lottie-animation/lottie-animation';\nimport { usePostPuzzleToAssign } from '../api/puzzle-assign';\nimport { PUZZLE_ASSIGN_ANIMATION } from '../constants/puzzle-container';\nimport { getPuzzleCardLottie } from '../utils/puzzle-pattern';\nimport * as Styled from './puzzle-container-styled';\nimport PuzzleAssigned from './puzzle-container-view';\n\nconst modeRevealAnimationSettings = {\n loop: false,\n renderer: 'svg',\n autoPlay: false,\n};\n\nconst PuzzleCardContainer: FC<IPuzzleCardContainerProps> = memo(\n ({\n triggerReveal = false,\n onFullyHidden,\n onPuzzleClick,\n puzzleData,\n courseStream,\n studentId,\n }) => {\n const {\n image_hue: imageHue,\n image_url: imageUrl,\n assigned: externalAssigned,\n title,\n id: puzzleId,\n node_id: nodeId,\n } = puzzleData;\n\n const [showPuzzleInfo, setShowPuzzleInfo] = useState(externalAssigned);\n\n const assignLottieRef = useRef<ILottieAnimationRef | null>(null);\n const puzzleLottieSrc = useMemo(() => getPuzzleCardLottie(imageHue), [imageHue]);\n\n const analyticsProps = useMemo(\n () => ({\n node_id: nodeId,\n node_type: 'PUZZLE_CARD',\n }),\n [nodeId],\n );\n\n const { post: postPuzzleToAssign, isProcessing } = usePostPuzzleToAssign({\n onComplete: (error: string | null) => {\n if (error) {\n // Handle error (e.g., show a notification)\n setShowPuzzleInfo(true);\n } else {\n assignLottieRef.current?.playSegments(PUZZLE_ASSIGN_ANIMATION.REVEAL_ASSIGNED, false);\n\n setShowPuzzleInfo(false);\n }\n },\n });\n\n useEffect(() => {\n if (!externalAssigned) {\n if (triggerReveal) {\n assignLottieRef.current?.playSegments(PUZZLE_ASSIGN_ANIMATION.REVEAL, true);\n } else {\n assignLottieRef.current?.stop();\n setShowPuzzleInfo(false);\n }\n }\n }, [externalAssigned, triggerReveal]);\n\n const handleAssign = useCallback(() => {\n if (externalAssigned) return;\n\n postPuzzleToAssign(\n {\n puzzle_id: puzzleId,\n },\n {\n studentId,\n courseStream,\n },\n );\n }, [courseStream, externalAssigned, postPuzzleToAssign, puzzleId, studentId]);\n\n const handleOnPuzzleClick = useCallback(() => {\n onPuzzleClick();\n }, [onPuzzleClick]);\n\n const showPuzzleLottie = useCallback(() => {\n assignLottieRef.current?.playSegments(PUZZLE_ASSIGN_ANIMATION.REVEAL, true);\n }, []);\n\n const onAnimationFinish = useMemo(\n () => ({\n name: 'enterFrame' as AnimationEventName,\n callback: (event: BMEnterFrameEvent) => {\n const { currentTime } = event;\n\n if (currentTime === 49) {\n setShowPuzzleInfo(true);\n }\n\n if (currentTime === 101) {\n onFullyHidden?.();\n }\n },\n }),\n [onFullyHidden],\n );\n\n if (!triggerReveal) {\n return null;\n }\n\n if (externalAssigned) {\n return (\n <Styled.PuzzleContainer $justifyContent=\"center\">\n <Styled.PuzzleAssignedWrapper\n $imageHue={imageHue}\n $background={`${imageHue}_2`}\n $widthX={15.9375}\n >\n <PuzzleAssigned imageUrl={imageUrl} title={title} assigned />\n </Styled.PuzzleAssignedWrapper>\n </Styled.PuzzleContainer>\n );\n }\n\n return (\n <Styled.PuzzleContainer>\n <FlexView $heightX={26}>\n <LottieAnimation\n src={puzzleLottieSrc}\n ref={assignLottieRef}\n settings={modeRevealAnimationSettings}\n onRender={showPuzzleLottie}\n eventListener={onAnimationFinish}\n animateOnIntersect\n />\n\n <Styled.PuzzleContentWrapper $visible={showPuzzleInfo} $position=\"absolute\">\n <PuzzleAssigned\n imageUrl={imageUrl}\n title={title}\n handleOnPuzzleClick={handleOnPuzzleClick}\n handleAssign={handleAssign}\n assigning={isProcessing}\n analyticsProps={analyticsProps}\n />\n </Styled.PuzzleContentWrapper>\n </FlexView>\n </Styled.PuzzleContainer>\n );\n },\n);\n\nexport default PuzzleCardContainer;\n"],"names":["modeRevealAnimationSettings","PuzzleCardContainer","memo","triggerReveal","onFullyHidden","onPuzzleClick","puzzleData","courseStream","studentId","imageHue","imageUrl","externalAssigned","title","puzzleId","nodeId","showPuzzleInfo","setShowPuzzleInfo","useState","assignLottieRef","useRef","puzzleLottieSrc","useMemo","getPuzzleCardLottie","analyticsProps","postPuzzleToAssign","isProcessing","usePostPuzzleToAssign","error","_a","PUZZLE_ASSIGN_ANIMATION","useEffect","_b","handleAssign","useCallback","handleOnPuzzleClick","showPuzzleLottie","onAnimationFinish","event","currentTime","jsx","Styled.PuzzleContainer","Styled.PuzzleAssignedWrapper","PuzzleAssigned","jsxs","FlexView","LottieAnimation","Styled.PuzzleContentWrapper","PuzzleCardContainer$1"],"mappings":"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"}
|