@cuemath/leap 3.0.3-as6 → 3.0.4-hg1
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.
- package/dist/features/chapters-v2/comps/node-card/node-menu-options/node-menu-option.js +17 -15
- package/dist/features/chapters-v2/comps/node-card/node-menu-options/node-menu-option.js.map +1 -1
- package/dist/features/chapters-v2/comps/node-card/node-menu-options/node-menu-options.js +4 -4
- package/dist/features/chapters-v2/comps/node-card/node-menu-options/node-menu-options.js.map +1 -1
- package/dist/features/chapters-v2/comps/node-card/teacher-actions/teacher-actions.js +98 -112
- package/dist/features/chapters-v2/comps/node-card/teacher-actions/teacher-actions.js.map +1 -1
- package/dist/features/chapters-v2/constants/node-constants.js +1 -2
- package/dist/features/chapters-v2/constants/node-constants.js.map +1 -1
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js +107 -100
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js.map +1 -1
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js +96 -93
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js.map +1 -1
- package/dist/features/circle-games/games/tutorial/tutorial-styled.js +1 -1
- package/dist/features/circle-games/games/tutorial/tutorial-styled.js.map +1 -1
- package/dist/features/homework/card-menu-option.js +28 -0
- package/dist/features/homework/card-menu-option.js.map +1 -0
- package/dist/features/homework/card-menu-options.js +12 -12
- package/dist/features/homework/card-menu-options.js.map +1 -1
- package/dist/features/homework/homework-card.js +74 -82
- package/dist/features/homework/homework-card.js.map +1 -1
- package/dist/features/homework/styles.js +30 -30
- package/dist/features/homework/styles.js.map +1 -1
- package/dist/features/journey/comps/coachmark/coachmark.js +20 -19
- package/dist/features/journey/comps/coachmark/coachmark.js.map +1 -1
- package/dist/features/journey/use-journey/constants.js +2 -4
- package/dist/features/journey/use-journey/constants.js.map +1 -1
- package/dist/features/journey/use-journey/journey-styled.js +5 -6
- package/dist/features/journey/use-journey/journey-styled.js.map +1 -1
- package/dist/features/milestone/milestone-list-container/milestone-list-container.js +68 -68
- package/dist/features/milestone/milestone-list-container/milestone-list-container.js.map +1 -1
- package/dist/features/ui/constants/z-index.js +2 -1
- package/dist/features/ui/constants/z-index.js.map +1 -1
- package/dist/features/ui/lottie-animation/lottie-animation.js +26 -21
- package/dist/features/ui/lottie-animation/lottie-animation.js.map +1 -1
- package/dist/features/ui/theme/device.js +5 -0
- package/dist/features/ui/theme/device.js.map +1 -0
- package/dist/features/ui/theme/get-theme.js +21 -19
- package/dist/features/ui/theme/get-theme.js.map +1 -1
- package/dist/index.d.ts +6 -0
- package/package.json +2 -3
@@ -1,47 +1,47 @@
|
|
1
|
-
import { jsxs as
|
2
|
-
import { memo as
|
3
|
-
import
|
4
|
-
import
|
5
|
-
import
|
6
|
-
import
|
1
|
+
import { jsxs as O, jsx as r } from "react/jsx-runtime";
|
2
|
+
import { memo as Z, useRef as T, useCallback as w, useMemo as Q } from "react";
|
3
|
+
import x from "../../assets/line-icons/icons/eye2.js";
|
4
|
+
import U from "../../assets/line-icons/icons/more-vertical.js";
|
5
|
+
import D from "../../assets/line-icons/icons/redo.js";
|
6
|
+
import W from "../ui/arrow-tooltip/arrow-tooltip.js";
|
7
7
|
import N from "../ui/buttons/clickable/clickable.js";
|
8
|
-
import
|
8
|
+
import H from "../ui/hooks/use-context-menu-click-handler.js";
|
9
9
|
import ee from "../ui/layout/flex-view.js";
|
10
|
-
import
|
10
|
+
import A from "./card-menu-options.js";
|
11
11
|
import re from "./homework-card-view.js";
|
12
12
|
import { CardContainer as te, MenuWrapper as ie, CardKebabMenuWrapper as ne, BlurContainer as oe, BlurFlexView as ce, StyledMinus2Icon as se } from "./styles.js";
|
13
|
-
import { getCardAnalyticProps as
|
14
|
-
const
|
13
|
+
import { getCardAnalyticProps as le } from "./utils.js";
|
14
|
+
const ae = ({
|
15
15
|
// callbacks
|
16
16
|
nodeData: e,
|
17
17
|
onNodeAttempt: b,
|
18
|
-
onNodeReattempt:
|
18
|
+
onNodeReattempt: u,
|
19
19
|
onNodeReview: n,
|
20
20
|
onNodeUnassign: m,
|
21
21
|
onNodeView: C,
|
22
|
-
header:
|
22
|
+
header: X,
|
23
23
|
isInQueue: E,
|
24
|
-
renderAs:
|
25
|
-
shouldOpenOnRight:
|
24
|
+
renderAs: I,
|
25
|
+
shouldOpenOnRight: j,
|
26
26
|
studentId: v,
|
27
|
-
subHeader:
|
27
|
+
subHeader: F,
|
28
28
|
userMilestoneId: t,
|
29
29
|
userType: g
|
30
30
|
}) => {
|
31
|
-
const i =
|
31
|
+
const i = I === "homework", {
|
32
32
|
node_type: k,
|
33
|
-
state:
|
34
|
-
permissions:
|
33
|
+
state: L,
|
34
|
+
permissions: P,
|
35
35
|
user_node_id: o,
|
36
|
-
user_milestone_id:
|
36
|
+
user_milestone_id: l,
|
37
37
|
homework_id: c
|
38
|
-
} = e, y =
|
38
|
+
} = e, y = T(null), $ = T(null), { menuVisible: R, onMenuClick: B } = H(y), { menuVisible: z, onMenuClick: V } = H($), {
|
39
39
|
can_start: h,
|
40
40
|
can_resume: f,
|
41
41
|
can_review: s,
|
42
|
-
can_unassign:
|
43
|
-
can_reset:
|
44
|
-
} =
|
42
|
+
can_unassign: K,
|
43
|
+
can_reset: Y
|
44
|
+
} = P, a = g === "STUDENT", d = w(() => {
|
45
45
|
if (s) {
|
46
46
|
if (typeof n != "function")
|
47
47
|
throw new Error("onReview must be a function");
|
@@ -50,7 +50,7 @@ const le = ({
|
|
50
50
|
n(e, t);
|
51
51
|
return;
|
52
52
|
}
|
53
|
-
}, [s, n, o, e, t]),
|
53
|
+
}, [s, n, o, e, t]), q = w(() => {
|
54
54
|
if (h || f) {
|
55
55
|
if (typeof b != "function")
|
56
56
|
throw new Error("onNodeAttempt must be a function");
|
@@ -61,12 +61,12 @@ const le = ({
|
|
61
61
|
V();
|
62
62
|
return;
|
63
63
|
}
|
64
|
-
|
64
|
+
d();
|
65
65
|
}, [
|
66
66
|
h,
|
67
67
|
f,
|
68
68
|
i,
|
69
|
-
|
69
|
+
d,
|
70
70
|
b,
|
71
71
|
e,
|
72
72
|
c,
|
@@ -77,100 +77,92 @@ const le = ({
|
|
77
77
|
throw new Error("onNodeReview must be a function");
|
78
78
|
if (!o)
|
79
79
|
throw new Error("user node id must be present to review the sheet");
|
80
|
-
n(e, t ||
|
80
|
+
n(e, t || l, c);
|
81
81
|
return;
|
82
82
|
}
|
83
83
|
if (typeof C != "function")
|
84
84
|
throw new Error("onNodeView must be a function");
|
85
|
-
C(e, t ||
|
85
|
+
C(e, t || l);
|
86
86
|
}, [
|
87
87
|
s,
|
88
88
|
C,
|
89
89
|
e,
|
90
90
|
t,
|
91
|
-
|
91
|
+
l,
|
92
92
|
n,
|
93
93
|
o,
|
94
94
|
c
|
95
|
-
]),
|
96
|
-
(
|
97
|
-
switch (
|
95
|
+
]), p = w(
|
96
|
+
(M) => {
|
97
|
+
switch (M) {
|
98
98
|
case "teacher-card-view":
|
99
99
|
_();
|
100
100
|
return;
|
101
101
|
case "student-card-view":
|
102
|
-
|
102
|
+
d();
|
103
103
|
return;
|
104
104
|
case "teacher-card-unassign":
|
105
105
|
m == null || m(e, t);
|
106
106
|
return;
|
107
107
|
case "student-card-reattempt":
|
108
|
-
|
109
|
-
d == null || d(e, t);
|
108
|
+
u == null || u(e, t);
|
110
109
|
return;
|
111
110
|
default:
|
112
|
-
throw new Error(`No callback function for ${
|
111
|
+
throw new Error(`No callback function for ${M}`);
|
113
112
|
}
|
114
113
|
},
|
115
114
|
[
|
116
115
|
e,
|
117
|
-
|
116
|
+
u,
|
118
117
|
m,
|
119
|
-
|
118
|
+
d,
|
120
119
|
_,
|
121
120
|
t
|
122
121
|
]
|
123
|
-
),
|
122
|
+
), G = [
|
124
123
|
{
|
125
124
|
id: "teacher-card-view",
|
126
125
|
label: s ? "Review" : "View",
|
127
|
-
icon:
|
126
|
+
icon: x,
|
128
127
|
disabled: !1,
|
129
|
-
onClick:
|
128
|
+
onClick: p
|
130
129
|
},
|
131
130
|
{
|
132
131
|
id: "teacher-card-unassign",
|
133
132
|
label: "Unassign",
|
134
133
|
icon: se,
|
135
|
-
disabled: i ? k === "MASTERY" : !
|
136
|
-
onClick:
|
137
|
-
},
|
138
|
-
{
|
139
|
-
id: "teacher-card-redo",
|
140
|
-
label: "Redo",
|
141
|
-
icon: H,
|
142
|
-
disabled: !S,
|
143
|
-
onClick: u
|
134
|
+
disabled: i ? k === "MASTERY" : !K,
|
135
|
+
onClick: p
|
144
136
|
}
|
145
|
-
],
|
137
|
+
], J = [
|
146
138
|
{
|
147
139
|
id: "student-card-view",
|
148
140
|
label: "Review",
|
149
|
-
icon:
|
141
|
+
icon: x,
|
150
142
|
disabled: !s,
|
151
|
-
onClick:
|
143
|
+
onClick: p
|
152
144
|
},
|
153
145
|
{
|
154
146
|
id: "student-card-reattempt",
|
155
147
|
label: "Reattempt",
|
156
|
-
icon:
|
157
|
-
disabled: !
|
158
|
-
onClick:
|
148
|
+
icon: D,
|
149
|
+
disabled: !Y,
|
150
|
+
onClick: p
|
159
151
|
}
|
160
|
-
],
|
161
|
-
() =>
|
152
|
+
], S = Q(
|
153
|
+
() => le({
|
162
154
|
canResume: f,
|
163
155
|
canStart: h,
|
164
156
|
homeworkId: c,
|
165
157
|
isHomeWork: i,
|
166
|
-
isStudent:
|
167
|
-
milestoneId:
|
158
|
+
isStudent: a,
|
159
|
+
milestoneId: l,
|
168
160
|
nodeType: k,
|
169
161
|
studentId: v,
|
170
162
|
userNodeId: o
|
171
163
|
}),
|
172
164
|
[
|
173
|
-
|
165
|
+
a,
|
174
166
|
i,
|
175
167
|
v,
|
176
168
|
k,
|
@@ -178,75 +170,75 @@ const le = ({
|
|
178
170
|
f,
|
179
171
|
c,
|
180
172
|
o,
|
181
|
-
|
173
|
+
l
|
182
174
|
]
|
183
175
|
);
|
184
|
-
return /* @__PURE__ */
|
176
|
+
return /* @__PURE__ */ O(te, { $position: "relative", $width: "fit-content", children: [
|
185
177
|
/* @__PURE__ */ r(
|
186
178
|
N,
|
187
179
|
{
|
188
|
-
onClick:
|
180
|
+
onClick: a ? q : _,
|
189
181
|
label: "homework-card",
|
190
|
-
analyticsLabel:
|
191
|
-
analyticsProps:
|
182
|
+
analyticsLabel: S.analyticsLabel,
|
183
|
+
analyticsProps: S.analyticsProps,
|
192
184
|
children: /* @__PURE__ */ r(
|
193
185
|
re,
|
194
186
|
{
|
195
|
-
header:
|
187
|
+
header: X,
|
196
188
|
isInQueue: E,
|
197
189
|
nodeData: e,
|
198
190
|
studentContainerRef: $,
|
199
|
-
subHeader:
|
191
|
+
subHeader: F,
|
200
192
|
userType: g
|
201
193
|
}
|
202
194
|
)
|
203
195
|
}
|
204
196
|
),
|
205
|
-
|
206
|
-
|
197
|
+
a && !i && /* @__PURE__ */ r(
|
198
|
+
A,
|
207
199
|
{
|
208
200
|
$width: 200,
|
209
|
-
options:
|
201
|
+
options: J,
|
210
202
|
triggerRef: $,
|
211
|
-
visible:
|
203
|
+
visible: z,
|
212
204
|
shouldOpenOnRight: !1
|
213
205
|
}
|
214
206
|
),
|
215
|
-
!
|
207
|
+
!a && /* @__PURE__ */ O(ie, { $position: "absolute", $width: "fit-content", $borderRadiusX: 2, children: [
|
216
208
|
/* @__PURE__ */ r(
|
217
|
-
|
209
|
+
W,
|
218
210
|
{
|
219
211
|
renderAs: "primary",
|
220
212
|
tooltipItem: "Review",
|
221
213
|
position: "bottom",
|
222
214
|
zIndex: 6,
|
223
215
|
parentWidth: "100%",
|
224
|
-
hidden: R ||
|
216
|
+
hidden: R || L !== "WAIT_FOR_REVIEW" && i,
|
225
217
|
children: /* @__PURE__ */ r(
|
226
218
|
ne,
|
227
219
|
{
|
228
220
|
$alignItems: "center",
|
229
221
|
$justifyContent: "center",
|
230
222
|
ref: y,
|
231
|
-
onClick:
|
232
|
-
children: /* @__PURE__ */ r(
|
223
|
+
onClick: B,
|
224
|
+
children: /* @__PURE__ */ r(U, { width: 16, height: 16 })
|
233
225
|
}
|
234
226
|
)
|
235
227
|
}
|
236
228
|
),
|
237
229
|
/* @__PURE__ */ r(
|
238
|
-
|
230
|
+
A,
|
239
231
|
{
|
240
|
-
options:
|
232
|
+
options: G,
|
241
233
|
triggerRef: y,
|
242
234
|
visible: R,
|
243
|
-
shouldOpenOnRight:
|
235
|
+
shouldOpenOnRight: j
|
244
236
|
}
|
245
237
|
)
|
246
238
|
] }),
|
247
|
-
E && /* @__PURE__ */ r(oe, { $background: "WHITE_5", children: /* @__PURE__ */ r(ce, { $heightX: 1, $widthX: 6, children: /* @__PURE__ */ r(
|
239
|
+
E && /* @__PURE__ */ r(oe, { $background: "WHITE_5", children: /* @__PURE__ */ r(ce, { $heightX: 1, $widthX: 6, children: /* @__PURE__ */ r(W, { renderAs: "primary", tooltipItem: "Not visible to student", position: "bottom", children: /* @__PURE__ */ r(ee, { $heightX: 1, $widthX: 6 }) }) }) })
|
248
240
|
] });
|
249
|
-
}, Ee =
|
241
|
+
}, Ee = Z(ae);
|
250
242
|
export {
|
251
243
|
Ee as default
|
252
244
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"homework-card.js","sources":["../../../src/features/homework/homework-card.tsx"],"sourcesContent":["import type {\n INodeCardCallbacks,\n INodeDataProps,\n} from '../chapters-v2/comps/node-card/node-card-types';\nimport type { TUserTypes } from '../ui/types';\n\nimport { memo, useCallback, useMemo, useRef } from 'react';\n\nimport Eye2Icon from '../../assets/line-icons/icons/eye2';\nimport MoreVerticalIcon from '../../assets/line-icons/icons/more-vertical';\nimport RedoIcon from '../../assets/line-icons/icons/redo';\nimport ArrowTooltip from '../ui/arrow-tooltip/arrow-tooltip';\nimport Clickable from '../ui/buttons/clickable/clickable';\nimport useContextMenuClickHandler from '../ui/hooks/use-context-menu-click-handler';\nimport FlexView from '../ui/layout/flex-view';\nimport CardMenuOptions from './card-menu-options';\nimport HomeworkView from './homework-card-view';\nimport * as Styled from './styles';\nimport { getCardAnalyticProps } from './utils';\n\ninterface IHomeworkCardProps extends INodeCardCallbacks {\n header: string;\n nodeData: INodeDataProps;\n subHeader: string;\n userType: TUserTypes;\n studentId: string;\n userMilestoneId?: string;\n renderAs: 'homework' | 'milestone';\n shouldOpenOnRight: boolean;\n isInQueue?: boolean;\n}\n\nconst HomeworkCard = ({\n // callbacks\n nodeData,\n onNodeAttempt,\n onNodeReattempt,\n onNodeReview,\n onNodeUnassign,\n onNodeView,\n\n header,\n isInQueue,\n renderAs,\n shouldOpenOnRight,\n studentId,\n subHeader,\n userMilestoneId,\n userType,\n}: IHomeworkCardProps) => {\n const isHomeWork = renderAs === 'homework';\n const {\n node_type: nodeType,\n state,\n permissions,\n user_node_id: userNodeId,\n user_milestone_id: milestoneId,\n homework_id: homeworkId,\n } = nodeData;\n\n const teacherContainerRef = useRef<HTMLDivElement>(null);\n const studentContainerRef = useRef<HTMLDivElement>(null);\n const { menuVisible: teacherMenuVisible, onMenuClick: onTeacherMenuClick } =\n useContextMenuClickHandler(teacherContainerRef);\n const { menuVisible: studentMenuVisible, onMenuClick: onStudentMenuClick } =\n useContextMenuClickHandler(studentContainerRef);\n\n const {\n can_start: canStart,\n can_resume: canResume,\n can_review: canReview,\n can_unassign: canUnassign,\n can_reset: canReset,\n } = permissions;\n const isStudent = userType === 'STUDENT';\n\n const onStudentViewSheet = useCallback(() => {\n if (canReview) {\n if (typeof onNodeReview !== 'function') {\n throw new Error('onReview must be a function');\n }\n\n if (!userNodeId) {\n throw new Error('user node id must be present to review the sheet');\n }\n onNodeReview(nodeData, userMilestoneId);\n\n return;\n }\n }, [canReview, onNodeReview, userNodeId, nodeData, userMilestoneId]);\n\n const onStudentCardClick = useCallback(() => {\n if (canStart || canResume) {\n if (typeof onNodeAttempt !== 'function') {\n throw new Error('onNodeAttempt must be a function');\n }\n\n onNodeAttempt(nodeData, homeworkId);\n\n return;\n }\n\n if (!isHomeWork) {\n onStudentMenuClick();\n\n return;\n }\n onStudentViewSheet();\n }, [\n canStart,\n canResume,\n isHomeWork,\n onStudentViewSheet,\n onNodeAttempt,\n nodeData,\n homeworkId,\n onStudentMenuClick,\n ]);\n\n const onTeacherCardClick = useCallback(() => {\n if (canReview) {\n if (typeof onNodeReview !== 'function') {\n throw new Error('onNodeReview must be a function');\n }\n\n if (!userNodeId) {\n throw new Error('user node id must be present to review the sheet');\n }\n onNodeReview(nodeData, userMilestoneId || milestoneId, homeworkId);\n\n return;\n }\n\n if (typeof onNodeView !== 'function') {\n throw new Error('onNodeView must be a function');\n }\n\n onNodeView(nodeData, userMilestoneId || milestoneId);\n }, [\n canReview,\n onNodeView,\n nodeData,\n userMilestoneId,\n milestoneId,\n onNodeReview,\n userNodeId,\n homeworkId,\n ]);\n\n const handleOnMenuOptionClick = useCallback(\n (optionId: string) => {\n switch (optionId) {\n case 'teacher-card-view':\n onTeacherCardClick();\n\n return;\n case 'student-card-view':\n onStudentViewSheet();\n\n return;\n case 'teacher-card-unassign':\n onNodeUnassign?.(nodeData, userMilestoneId);\n\n return;\n case 'student-card-reattempt':\n case 'teacher-card-redo':\n onNodeReattempt?.(nodeData, userMilestoneId);\n\n return;\n\n default:\n throw new Error(`No callback function for ${optionId}`);\n }\n },\n [\n nodeData,\n onNodeReattempt,\n onNodeUnassign,\n onStudentViewSheet,\n onTeacherCardClick,\n userMilestoneId,\n ],\n );\n\n const teacherOptions = [\n {\n id: 'teacher-card-view',\n label: canReview ? 'Review' : 'View',\n icon: Eye2Icon,\n disabled: false,\n onClick: handleOnMenuOptionClick,\n },\n {\n id: 'teacher-card-unassign',\n label: 'Unassign',\n icon: Styled.StyledMinus2Icon,\n disabled: isHomeWork ? nodeType === 'MASTERY' : !canUnassign,\n onClick: handleOnMenuOptionClick,\n },\n {\n id: 'teacher-card-redo',\n label: 'Redo',\n icon: RedoIcon,\n disabled: !canReset,\n onClick: handleOnMenuOptionClick,\n },\n ];\n\n const studentOptions = [\n {\n id: 'student-card-view',\n label: 'Review',\n icon: Eye2Icon,\n disabled: !canReview,\n onClick: handleOnMenuOptionClick,\n },\n {\n id: 'student-card-reattempt',\n label: 'Reattempt',\n icon: RedoIcon,\n disabled: !canReset,\n onClick: handleOnMenuOptionClick,\n },\n ];\n\n const analyticsLabel = useMemo(\n () =>\n getCardAnalyticProps({\n canResume,\n canStart,\n homeworkId,\n isHomeWork,\n isStudent,\n milestoneId,\n nodeType,\n studentId,\n userNodeId,\n }),\n [\n isStudent,\n isHomeWork,\n studentId,\n nodeType,\n canStart,\n canResume,\n homeworkId,\n userNodeId,\n milestoneId,\n ],\n );\n\n return (\n <Styled.CardContainer $position=\"relative\" $width=\"fit-content\">\n <Clickable\n onClick={isStudent ? onStudentCardClick : onTeacherCardClick}\n label=\"homework-card\"\n analyticsLabel={analyticsLabel.analyticsLabel}\n analyticsProps={analyticsLabel.analyticsProps}\n >\n <HomeworkView\n header={header}\n isInQueue={isInQueue}\n nodeData={nodeData}\n studentContainerRef={studentContainerRef}\n subHeader={subHeader}\n userType={userType}\n />\n </Clickable>\n {isStudent && !isHomeWork && (\n <CardMenuOptions\n $width={200}\n options={studentOptions}\n triggerRef={studentContainerRef}\n visible={studentMenuVisible}\n shouldOpenOnRight={false}\n />\n )}\n {!isStudent && (\n <Styled.MenuWrapper $position=\"absolute\" $width=\"fit-content\" $borderRadiusX={2}>\n <ArrowTooltip\n renderAs=\"primary\"\n tooltipItem=\"Review\"\n position=\"bottom\"\n zIndex={6}\n parentWidth=\"100%\"\n hidden={teacherMenuVisible || (state !== 'WAIT_FOR_REVIEW' && isHomeWork)}\n >\n <Styled.CardKebabMenuWrapper\n $alignItems=\"center\"\n $justifyContent=\"center\"\n ref={teacherContainerRef}\n onClick={onTeacherMenuClick}\n >\n <MoreVerticalIcon width={16} height={16} />\n </Styled.CardKebabMenuWrapper>\n </ArrowTooltip>\n <CardMenuOptions\n options={teacherOptions}\n triggerRef={teacherContainerRef}\n visible={teacherMenuVisible}\n shouldOpenOnRight={shouldOpenOnRight}\n />\n </Styled.MenuWrapper>\n )}\n {isInQueue && (\n <Styled.BlurContainer $background=\"WHITE_5\">\n <Styled.BlurFlexView $heightX={1} $widthX={6}>\n <ArrowTooltip renderAs=\"primary\" tooltipItem=\"Not visible to student\" position=\"bottom\">\n <FlexView $heightX={1} $widthX={6} />\n </ArrowTooltip>\n </Styled.BlurFlexView>\n </Styled.BlurContainer>\n )}\n </Styled.CardContainer>\n );\n};\n\nexport default memo(HomeworkCard);\n"],"names":["HomeworkCard","nodeData","onNodeAttempt","onNodeReattempt","onNodeReview","onNodeUnassign","onNodeView","header","isInQueue","renderAs","shouldOpenOnRight","studentId","subHeader","userMilestoneId","userType","isHomeWork","nodeType","state","permissions","userNodeId","milestoneId","homeworkId","teacherContainerRef","useRef","studentContainerRef","teacherMenuVisible","onTeacherMenuClick","useContextMenuClickHandler","studentMenuVisible","onStudentMenuClick","canStart","canResume","canReview","canUnassign","canReset","isStudent","onStudentViewSheet","useCallback","onStudentCardClick","onTeacherCardClick","handleOnMenuOptionClick","optionId","teacherOptions","Eye2Icon","Styled.StyledMinus2Icon","RedoIcon","studentOptions","analyticsLabel","useMemo","getCardAnalyticProps","Styled.CardContainer","jsx","Clickable","HomeworkView","CardMenuOptions","jsxs","Styled.MenuWrapper","ArrowTooltip","Styled.CardKebabMenuWrapper","MoreVerticalIcon","Styled.BlurContainer","Styled.BlurFlexView","FlexView","HomeworkCard$1","memo"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"homework-card.js","sources":["../../../src/features/homework/homework-card.tsx"],"sourcesContent":["import type {\n INodeCardCallbacks,\n INodeDataProps,\n} from '../chapters-v2/comps/node-card/node-card-types';\nimport type { TUserTypes } from '../ui/types';\n\nimport { memo, useCallback, useMemo, useRef } from 'react';\n\nimport Eye2Icon from '../../assets/line-icons/icons/eye2';\nimport MoreVerticalIcon from '../../assets/line-icons/icons/more-vertical';\nimport RedoIcon from '../../assets/line-icons/icons/redo';\nimport ArrowTooltip from '../ui/arrow-tooltip/arrow-tooltip';\nimport Clickable from '../ui/buttons/clickable/clickable';\nimport useContextMenuClickHandler from '../ui/hooks/use-context-menu-click-handler';\nimport FlexView from '../ui/layout/flex-view';\nimport CardMenuOptions from './card-menu-options';\nimport HomeworkView from './homework-card-view';\nimport * as Styled from './styles';\nimport { getCardAnalyticProps } from './utils';\n\ninterface IHomeworkCardProps extends INodeCardCallbacks {\n header: string;\n nodeData: INodeDataProps;\n subHeader: string;\n userType: TUserTypes;\n studentId: string;\n userMilestoneId?: string;\n renderAs: 'homework' | 'milestone';\n shouldOpenOnRight: boolean;\n isInQueue?: boolean;\n}\n\nconst HomeworkCard = ({\n // callbacks\n nodeData,\n onNodeAttempt,\n onNodeReattempt,\n onNodeReview,\n onNodeUnassign,\n onNodeView,\n\n header,\n isInQueue,\n renderAs,\n shouldOpenOnRight,\n studentId,\n subHeader,\n userMilestoneId,\n userType,\n}: IHomeworkCardProps) => {\n const isHomeWork = renderAs === 'homework';\n const {\n node_type: nodeType,\n state,\n permissions,\n user_node_id: userNodeId,\n user_milestone_id: milestoneId,\n homework_id: homeworkId,\n } = nodeData;\n\n const teacherContainerRef = useRef<HTMLDivElement>(null);\n const studentContainerRef = useRef<HTMLDivElement>(null);\n const { menuVisible: teacherMenuVisible, onMenuClick: onTeacherMenuClick } =\n useContextMenuClickHandler(teacherContainerRef);\n const { menuVisible: studentMenuVisible, onMenuClick: onStudentMenuClick } =\n useContextMenuClickHandler(studentContainerRef);\n\n const {\n can_start: canStart,\n can_resume: canResume,\n can_review: canReview,\n can_unassign: canUnassign,\n can_reset: canReset,\n } = permissions;\n const isStudent = userType === 'STUDENT';\n\n const onStudentViewSheet = useCallback(() => {\n if (canReview) {\n if (typeof onNodeReview !== 'function') {\n throw new Error('onReview must be a function');\n }\n\n if (!userNodeId) {\n throw new Error('user node id must be present to review the sheet');\n }\n onNodeReview(nodeData, userMilestoneId);\n\n return;\n }\n }, [canReview, onNodeReview, userNodeId, nodeData, userMilestoneId]);\n\n const onStudentCardClick = useCallback(() => {\n if (canStart || canResume) {\n if (typeof onNodeAttempt !== 'function') {\n throw new Error('onNodeAttempt must be a function');\n }\n\n onNodeAttempt(nodeData, homeworkId);\n\n return;\n }\n\n if (!isHomeWork) {\n onStudentMenuClick();\n\n return;\n }\n onStudentViewSheet();\n }, [\n canStart,\n canResume,\n isHomeWork,\n onStudentViewSheet,\n onNodeAttempt,\n nodeData,\n homeworkId,\n onStudentMenuClick,\n ]);\n\n const onTeacherCardClick = useCallback(() => {\n if (canReview) {\n if (typeof onNodeReview !== 'function') {\n throw new Error('onNodeReview must be a function');\n }\n\n if (!userNodeId) {\n throw new Error('user node id must be present to review the sheet');\n }\n onNodeReview(nodeData, userMilestoneId || milestoneId, homeworkId);\n\n return;\n }\n\n if (typeof onNodeView !== 'function') {\n throw new Error('onNodeView must be a function');\n }\n\n onNodeView(nodeData, userMilestoneId || milestoneId);\n }, [\n canReview,\n onNodeView,\n nodeData,\n userMilestoneId,\n milestoneId,\n onNodeReview,\n userNodeId,\n homeworkId,\n ]);\n\n const handleOnMenuOptionClick = useCallback(\n (optionId: string) => {\n switch (optionId) {\n case 'teacher-card-view':\n onTeacherCardClick();\n\n return;\n case 'student-card-view':\n onStudentViewSheet();\n\n return;\n case 'teacher-card-unassign':\n onNodeUnassign?.(nodeData, userMilestoneId);\n\n return;\n case 'student-card-reattempt':\n onNodeReattempt?.(nodeData, userMilestoneId);\n\n return;\n default:\n throw new Error(`No callback function for ${optionId}`);\n }\n },\n [\n nodeData,\n onNodeReattempt,\n onNodeUnassign,\n onStudentViewSheet,\n onTeacherCardClick,\n userMilestoneId,\n ],\n );\n\n const teacherOptions = [\n {\n id: 'teacher-card-view',\n label: canReview ? 'Review' : 'View',\n icon: Eye2Icon,\n disabled: false,\n onClick: handleOnMenuOptionClick,\n },\n {\n id: 'teacher-card-unassign',\n label: 'Unassign',\n icon: Styled.StyledMinus2Icon,\n disabled: isHomeWork ? nodeType === 'MASTERY' : !canUnassign,\n onClick: handleOnMenuOptionClick,\n },\n ];\n\n const studentOptions = [\n {\n id: 'student-card-view',\n label: 'Review',\n icon: Eye2Icon,\n disabled: !canReview,\n onClick: handleOnMenuOptionClick,\n },\n {\n id: 'student-card-reattempt',\n label: 'Reattempt',\n icon: RedoIcon,\n disabled: !canReset,\n onClick: handleOnMenuOptionClick,\n },\n ];\n\n const analyticsLabel = useMemo(\n () =>\n getCardAnalyticProps({\n canResume,\n canStart,\n homeworkId,\n isHomeWork,\n isStudent,\n milestoneId,\n nodeType,\n studentId,\n userNodeId,\n }),\n [\n isStudent,\n isHomeWork,\n studentId,\n nodeType,\n canStart,\n canResume,\n homeworkId,\n userNodeId,\n milestoneId,\n ],\n );\n\n return (\n <Styled.CardContainer $position=\"relative\" $width=\"fit-content\">\n <Clickable\n onClick={isStudent ? onStudentCardClick : onTeacherCardClick}\n label=\"homework-card\"\n analyticsLabel={analyticsLabel.analyticsLabel}\n analyticsProps={analyticsLabel.analyticsProps}\n >\n <HomeworkView\n header={header}\n isInQueue={isInQueue}\n nodeData={nodeData}\n studentContainerRef={studentContainerRef}\n subHeader={subHeader}\n userType={userType}\n />\n </Clickable>\n {isStudent && !isHomeWork && (\n <CardMenuOptions\n $width={200}\n options={studentOptions}\n triggerRef={studentContainerRef}\n visible={studentMenuVisible}\n shouldOpenOnRight={false}\n />\n )}\n {!isStudent && (\n <Styled.MenuWrapper $position=\"absolute\" $width=\"fit-content\" $borderRadiusX={2}>\n <ArrowTooltip\n renderAs=\"primary\"\n tooltipItem=\"Review\"\n position=\"bottom\"\n zIndex={6}\n parentWidth=\"100%\"\n hidden={teacherMenuVisible || (state !== 'WAIT_FOR_REVIEW' && isHomeWork)}\n >\n <Styled.CardKebabMenuWrapper\n $alignItems=\"center\"\n $justifyContent=\"center\"\n ref={teacherContainerRef}\n onClick={onTeacherMenuClick}\n >\n <MoreVerticalIcon width={16} height={16} />\n </Styled.CardKebabMenuWrapper>\n </ArrowTooltip>\n <CardMenuOptions\n options={teacherOptions}\n triggerRef={teacherContainerRef}\n visible={teacherMenuVisible}\n shouldOpenOnRight={shouldOpenOnRight}\n />\n </Styled.MenuWrapper>\n )}\n {isInQueue && (\n <Styled.BlurContainer $background=\"WHITE_5\">\n <Styled.BlurFlexView $heightX={1} $widthX={6}>\n <ArrowTooltip renderAs=\"primary\" tooltipItem=\"Not visible to student\" position=\"bottom\">\n <FlexView $heightX={1} $widthX={6} />\n </ArrowTooltip>\n </Styled.BlurFlexView>\n </Styled.BlurContainer>\n )}\n </Styled.CardContainer>\n );\n};\n\nexport default memo(HomeworkCard);\n"],"names":["HomeworkCard","nodeData","onNodeAttempt","onNodeReattempt","onNodeReview","onNodeUnassign","onNodeView","header","isInQueue","renderAs","shouldOpenOnRight","studentId","subHeader","userMilestoneId","userType","isHomeWork","nodeType","state","permissions","userNodeId","milestoneId","homeworkId","teacherContainerRef","useRef","studentContainerRef","teacherMenuVisible","onTeacherMenuClick","useContextMenuClickHandler","studentMenuVisible","onStudentMenuClick","canStart","canResume","canReview","canUnassign","canReset","isStudent","onStudentViewSheet","useCallback","onStudentCardClick","onTeacherCardClick","handleOnMenuOptionClick","optionId","teacherOptions","Eye2Icon","Styled.StyledMinus2Icon","studentOptions","RedoIcon","analyticsLabel","useMemo","getCardAnalyticProps","Styled.CardContainer","jsx","Clickable","HomeworkView","CardMenuOptions","jsxs","Styled.MenuWrapper","ArrowTooltip","Styled.CardKebabMenuWrapper","MoreVerticalIcon","Styled.BlurContainer","Styled.BlurFlexView","FlexView","HomeworkCard$1","memo"],"mappings":"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"}
|
@@ -1,8 +1,8 @@
|
|
1
1
|
import r from "styled-components";
|
2
2
|
import n from "../../assets/line-icons/icons/minus2.js";
|
3
|
-
import
|
3
|
+
import t from "../ui/layout/flex-view.js";
|
4
4
|
import i from "../ui/text/text.js";
|
5
|
-
const
|
5
|
+
const l = r(t)(({ theme: o }) => `
|
6
6
|
cursor: pointer;
|
7
7
|
width: 24px;
|
8
8
|
height: 24px;
|
@@ -18,9 +18,9 @@ const c = r(e)(({ theme: o }) => `
|
|
18
18
|
-webkit-box-orient: vertical;
|
19
19
|
overflow: hidden;
|
20
20
|
text-overflow: ellipsis;
|
21
|
-
`,
|
21
|
+
`, x = r(t)(({
|
22
22
|
$shouldopenonright: o,
|
23
|
-
$visible:
|
23
|
+
$visible: e
|
24
24
|
}) => `
|
25
25
|
cursor: pointer;
|
26
26
|
position: absolute;
|
@@ -28,37 +28,37 @@ const c = r(e)(({ theme: o }) => `
|
|
28
28
|
top: calc(100% + 4px);
|
29
29
|
right: ${o ? 0 : "auto"};
|
30
30
|
transform-origin: top;
|
31
|
-
transform: scaleY(${
|
32
|
-
opacity: ${
|
31
|
+
transform: scaleY(${e ? 1 : 0});
|
32
|
+
opacity: ${e ? 1 : 0};
|
33
33
|
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
34
34
|
box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.4);
|
35
35
|
z-index: 10;
|
36
|
-
`),
|
36
|
+
`), u = r(t)`
|
37
37
|
border: 1px solid ${({ theme: o }) => o.colors.BLACK_T_15};
|
38
38
|
&:hover {
|
39
39
|
border: 1px solid ${({ theme: o }) => o.colors.BLACK};
|
40
40
|
border-top-width: 2px;
|
41
41
|
}
|
42
|
-
`, b = r(
|
42
|
+
`, b = r(t)(({ $bgImage: o }) => o ? `
|
43
43
|
background-image: url(${o});
|
44
44
|
background-repeat: no-repeat;
|
45
45
|
background-size: cover;
|
46
46
|
background-position: center;
|
47
47
|
overflow: hidden;
|
48
|
-
` : "overflow: hidden;"), h = r(
|
48
|
+
` : "overflow: hidden;"), h = r(t)`
|
49
49
|
display: flex;
|
50
50
|
align-items: center;
|
51
51
|
justify-content: center;
|
52
|
-
`, w = r(
|
52
|
+
`, w = r(t)`
|
53
53
|
position: absolute;
|
54
54
|
right: -18px;
|
55
55
|
top: -4px;
|
56
56
|
`, f = r.img(({ theme: o }) => {
|
57
|
-
const { gutter:
|
57
|
+
const { gutter: e } = o.layout;
|
58
58
|
return `
|
59
59
|
border: 1px solid ${o.colors.BLACK_T_15};
|
60
|
-
width: ${
|
61
|
-
height: ${
|
60
|
+
width: ${e * 4}px;
|
61
|
+
height: ${e * 4}px;
|
62
62
|
border-radius: 50%;
|
63
63
|
`;
|
64
64
|
}), g = r(n)`
|
@@ -73,41 +73,39 @@ const c = r(e)(({ theme: o }) => `
|
|
73
73
|
text-overflow: ellipsis;
|
74
74
|
white-space: break-spaces;
|
75
75
|
`;
|
76
|
-
r(
|
77
|
-
r(
|
76
|
+
r(t)``;
|
77
|
+
const k = r(t)(({
|
78
78
|
theme: o,
|
79
|
-
$disabled:
|
79
|
+
$disabled: e
|
80
80
|
}) => `
|
81
|
-
cursor: ${
|
81
|
+
cursor: ${e ? "not-allowed" : "pointer"};
|
82
82
|
|
83
83
|
&:hover {
|
84
|
-
background: ${
|
84
|
+
background: ${e ? "transparent" : o.colors.BLACK};
|
85
85
|
};
|
86
86
|
|
87
87
|
path {
|
88
88
|
fill: ${o.colors.WHITE_1};
|
89
89
|
}
|
90
|
-
`)
|
91
|
-
r(i)`
|
90
|
+
`), v = r(i)`
|
92
91
|
white-space: nowrap;
|
93
92
|
overflow: hidden;
|
94
93
|
text-overflow: ellipsis;
|
95
|
-
|
96
|
-
const k = r(e)`
|
94
|
+
`, C = r(t)`
|
97
95
|
position: absolute;
|
98
96
|
z-index: 6;
|
99
97
|
top: calc(100% - 36px);
|
100
98
|
right: 12px;
|
101
99
|
transform-origin: top;
|
102
100
|
transform: scaleY(1);
|
103
|
-
`,
|
101
|
+
`, $ = r(t)`
|
104
102
|
position: absolute;
|
105
103
|
top: 0;
|
106
104
|
left: 0;
|
107
105
|
width: 100%;
|
108
106
|
height: 100%;
|
109
107
|
opacity: 0.5;
|
110
|
-
`,
|
108
|
+
`, y = r(t)`
|
111
109
|
position: absolute;
|
112
110
|
right: 42px;
|
113
111
|
top: 24px;
|
@@ -115,15 +113,17 @@ const k = r(e)`
|
|
115
113
|
export {
|
116
114
|
f as BannerImage,
|
117
115
|
w as BannerImageWrapper,
|
118
|
-
|
119
|
-
|
120
|
-
|
121
|
-
|
122
|
-
|
116
|
+
$ as BlurContainer,
|
117
|
+
y as BlurFlexView,
|
118
|
+
u as CardContainer,
|
119
|
+
l as CardKebabMenuWrapper,
|
120
|
+
x as CardMenuOptionsWrapper,
|
121
|
+
k as CardOptionWrapper,
|
123
122
|
b as CardWrapper,
|
124
123
|
m as HeaderText,
|
125
124
|
h as IconWrapper,
|
126
|
-
|
125
|
+
C as MenuWrapper,
|
126
|
+
v as OptionText,
|
127
127
|
g as StyledMinus2Icon,
|
128
128
|
d as SubHeaderText
|
129
129
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"styles.js","sources":["../../../src/features/homework/styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport Minus2Icon from '../../assets/line-icons/icons/minus2';\nimport FlexView from '../ui/layout/flex-view';\nimport Text from '../ui/text/text';\n\ninterface ICardWrapperProps {\n $bgImage: string;\n}\ninterface ICardOptionsMenuWrapperProps {\n $visible: boolean;\n $shouldopenonright: boolean;\n}\n\nexport const CardKebabMenuWrapper = styled(FlexView)(({ theme }) => {\n return `\n cursor: pointer;\n width: 24px;\n height: 24px;\n \n \n &:hover {\n border-radius: 50%;\n background: ${theme.colors.WHITE_5}; \n }\n `;\n});\n\nexport const SubHeaderText = styled(Text)`\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const CardMenuOptionsWrapper = styled(FlexView)<ICardOptionsMenuWrapperProps>(({\n $shouldopenonright,\n $visible,\n}) => {\n return `\n cursor: pointer;\n position: absolute;\n z-index: 6;\n top: calc(100% + 4px);\n right: ${$shouldopenonright ? 0 : 'auto'};\n transform-origin: top;\n transform: scaleY(${$visible ? 1 : 0});\n opacity: ${$visible ? 1 : 0};\n transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;\n box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.4);\n z-index: 10;\n `;\n});\n\nexport const CardContainer = styled(FlexView)`\n border: 1px solid ${({ theme }) => theme.colors.BLACK_T_15};\n &:hover {\n border: 1px solid ${({ theme }) => theme.colors.BLACK};\n border-top-width: 2px;\n }\n`;\n\nexport const CardWrapper = styled(FlexView)<ICardWrapperProps>(({ $bgImage }) => {\n if ($bgImage) {\n return `\n background-image: url(${$bgImage});\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n overflow: hidden;\n `;\n }\n\n return 'overflow: hidden;';\n});\n\nexport const IconWrapper = styled(FlexView)`\n display: flex;\n align-items: center;\n justify-content: center;\n`;\n\nexport const BannerImageWrapper = styled(FlexView)`\n position: absolute;\n right: -18px;\n top: -4px;\n`;\n\nexport const BannerImage = styled.img(({ theme }) => {\n const { gutter } = theme.layout;\n\n return `\n border: 1px solid ${theme.colors.BLACK_T_15};\n width: ${gutter * 4}px;\n height: ${gutter * 4}px;\n border-radius: 50%;\n `;\n});\n\nexport const StyledMinus2Icon = styled(Minus2Icon)`\n path {\n stroke: ${({ theme }) => theme.colors.WHITE};\n }\n`;\n\nexport const HeaderText = styled(Text)`\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: break-spaces;\n`;\n\ninterface ICardOptionWrapperProps {\n $disabled?: boolean;\n}\ninterface ICardOptionsProps {\n $top: number;\n $left: number;\n}\n\nexport const CardOptions = styled(FlexView)<ICardOptionsProps>``;\n\nexport const CardOptionWrapper = styled(FlexView)<ICardOptionWrapperProps>(({\n theme,\n $disabled,\n}) => {\n return `\n cursor: ${$disabled ? 'not-allowed' : 'pointer'};\n \n &:hover {\n background: ${$disabled ? 'transparent' : theme.colors.BLACK};\n };\n \n path {\n fill: ${theme.colors.WHITE_1};\n }\n `;\n});\n\nexport const OptionText = styled(Text)`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const MenuWrapper = styled(FlexView)`\n position: absolute;\n z-index: 6;\n top: calc(100% - 36px);\n right: 12px;\n transform-origin: top;\n transform: scaleY(1);\n`;\n\nexport const BlurContainer = styled(FlexView)`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0.5;\n`;\n\nexport const BlurFlexView = styled(FlexView)`\n position: absolute;\n right: 42px;\n top: 24px;\n`;\n"],"names":["CardKebabMenuWrapper","styled","FlexView","theme","SubHeaderText","Text","CardMenuOptionsWrapper","$shouldopenonright","$visible","CardContainer","CardWrapper","$bgImage","IconWrapper","BannerImageWrapper","BannerImage","gutter","StyledMinus2Icon","Minus2Icon","HeaderText","$disabled","MenuWrapper","BlurContainer","BlurFlexView"],"mappings":";;;;AAcO,MAAMA,IAAuBC,EAAOC,CAAQ,EAAE,CAAC,EAAE,OAAAC,QAC/C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAQWA,EAAM,OAAO,OAAO;AAAA;AAAA,GAGvC,GAEYC,IAAgBH,EAAOI,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQ3BC,IAAyBL,EAAOC,CAAQ,EAAgC,CAAC;AAAA,EACpF,oBAAAK;AAAA,EACA,UAAAC;AACF,MACS;AAAA;AAAA;AAAA;AAAA;AAAA,aAKID,IAAqB,IAAI,MAAM;AAAA;AAAA,wBAEpBC,IAAW,IAAI,CAAC;AAAA,eACzBA,IAAW,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA,GAK9B,GAEYC,IAAgBR,EAAOC,CAAQ;AAAA,sBACtB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA;AAAA,wBAEpC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA,GAK5CO,IAAcT,EAAOC,CAAQ,EAAqB,CAAC,EAAE,UAAAS,QAC5DA,IACK;AAAA,8BACmBA,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,QAQ7B,mBACR,GAEYC,IAAcX,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,GAM7BW,IAAqBZ,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,GAMpCY,IAAcb,EAAO,IAAI,CAAC,EAAE,OAAAE,QAAY;AAC7C,QAAA,EAAE,QAAAY,EAAO,IAAIZ,EAAM;AAElB,SAAA;AAAA,wBACeA,EAAM,OAAO,UAAU;AAAA,aAClCY,IAAS,CAAC;AAAA,cACTA,IAAS,CAAC;AAAA;AAAA;AAGxB,CAAC,GAEYC,IAAmBf,EAAOgB,CAAU;AAAA;AAAA,cAEnC,CAAC,EAAE,OAAAd,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA,GAIlCe,IAAajB,EAAOI,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBVJ,EAAOC,CAAQ;
|
1
|
+
{"version":3,"file":"styles.js","sources":["../../../src/features/homework/styles.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport Minus2Icon from '../../assets/line-icons/icons/minus2';\nimport FlexView from '../ui/layout/flex-view';\nimport Text from '../ui/text/text';\n\ninterface ICardWrapperProps {\n $bgImage: string;\n}\ninterface ICardOptionsMenuWrapperProps {\n $visible: boolean;\n $shouldopenonright: boolean;\n}\n\nexport const CardKebabMenuWrapper = styled(FlexView)(({ theme }) => {\n return `\n cursor: pointer;\n width: 24px;\n height: 24px;\n \n \n &:hover {\n border-radius: 50%;\n background: ${theme.colors.WHITE_5}; \n }\n `;\n});\n\nexport const SubHeaderText = styled(Text)`\n display: -webkit-box;\n -webkit-line-clamp: 1;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const CardMenuOptionsWrapper = styled(FlexView)<ICardOptionsMenuWrapperProps>(({\n $shouldopenonright,\n $visible,\n}) => {\n return `\n cursor: pointer;\n position: absolute;\n z-index: 6;\n top: calc(100% + 4px);\n right: ${$shouldopenonright ? 0 : 'auto'};\n transform-origin: top;\n transform: scaleY(${$visible ? 1 : 0});\n opacity: ${$visible ? 1 : 0};\n transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;\n box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.4);\n z-index: 10;\n `;\n});\n\nexport const CardContainer = styled(FlexView)`\n border: 1px solid ${({ theme }) => theme.colors.BLACK_T_15};\n &:hover {\n border: 1px solid ${({ theme }) => theme.colors.BLACK};\n border-top-width: 2px;\n }\n`;\n\nexport const CardWrapper = styled(FlexView)<ICardWrapperProps>(({ $bgImage }) => {\n if ($bgImage) {\n return `\n background-image: url(${$bgImage});\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n overflow: hidden;\n `;\n }\n\n return 'overflow: hidden;';\n});\n\nexport const IconWrapper = styled(FlexView)`\n display: flex;\n align-items: center;\n justify-content: center;\n`;\n\nexport const BannerImageWrapper = styled(FlexView)`\n position: absolute;\n right: -18px;\n top: -4px;\n`;\n\nexport const BannerImage = styled.img(({ theme }) => {\n const { gutter } = theme.layout;\n\n return `\n border: 1px solid ${theme.colors.BLACK_T_15};\n width: ${gutter * 4}px;\n height: ${gutter * 4}px;\n border-radius: 50%;\n `;\n});\n\nexport const StyledMinus2Icon = styled(Minus2Icon)`\n path {\n stroke: ${({ theme }) => theme.colors.WHITE};\n }\n`;\n\nexport const HeaderText = styled(Text)`\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: break-spaces;\n`;\n\ninterface ICardOptionWrapperProps {\n $disabled?: boolean;\n}\ninterface ICardOptionsProps {\n $top: number;\n $left: number;\n}\n\nexport const CardOptions = styled(FlexView)<ICardOptionsProps>``;\n\nexport const CardOptionWrapper = styled(FlexView)<ICardOptionWrapperProps>(({\n theme,\n $disabled,\n}) => {\n return `\n cursor: ${$disabled ? 'not-allowed' : 'pointer'};\n \n &:hover {\n background: ${$disabled ? 'transparent' : theme.colors.BLACK};\n };\n \n path {\n fill: ${theme.colors.WHITE_1};\n }\n `;\n});\n\nexport const OptionText = styled(Text)`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\nexport const MenuWrapper = styled(FlexView)`\n position: absolute;\n z-index: 6;\n top: calc(100% - 36px);\n right: 12px;\n transform-origin: top;\n transform: scaleY(1);\n`;\n\nexport const BlurContainer = styled(FlexView)`\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n opacity: 0.5;\n`;\n\nexport const BlurFlexView = styled(FlexView)`\n position: absolute;\n right: 42px;\n top: 24px;\n`;\n"],"names":["CardKebabMenuWrapper","styled","FlexView","theme","SubHeaderText","Text","CardMenuOptionsWrapper","$shouldopenonright","$visible","CardContainer","CardWrapper","$bgImage","IconWrapper","BannerImageWrapper","BannerImage","gutter","StyledMinus2Icon","Minus2Icon","HeaderText","CardOptionWrapper","$disabled","OptionText","MenuWrapper","BlurContainer","BlurFlexView"],"mappings":";;;;AAcO,MAAMA,IAAuBC,EAAOC,CAAQ,EAAE,CAAC,EAAE,OAAAC,QAC/C;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAQWA,EAAM,OAAO,OAAO;AAAA;AAAA,GAGvC,GAEYC,IAAgBH,EAAOI,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQ3BC,IAAyBL,EAAOC,CAAQ,EAAgC,CAAC;AAAA,EACpF,oBAAAK;AAAA,EACA,UAAAC;AACF,MACS;AAAA;AAAA;AAAA;AAAA;AAAA,aAKID,IAAqB,IAAI,MAAM;AAAA;AAAA,wBAEpBC,IAAW,IAAI,CAAC;AAAA,eACzBA,IAAW,IAAI,CAAC;AAAA;AAAA;AAAA;AAAA,GAK9B,GAEYC,IAAgBR,EAAOC,CAAQ;AAAA,sBACtB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA;AAAA,wBAEpC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA,GAK5CO,IAAcT,EAAOC,CAAQ,EAAqB,CAAC,EAAE,UAAAS,QAC5DA,IACK;AAAA,8BACmBA,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,QAQ7B,mBACR,GAEYC,IAAcX,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,GAM7BW,IAAqBZ,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,GAMpCY,IAAcb,EAAO,IAAI,CAAC,EAAE,OAAAE,QAAY;AAC7C,QAAA,EAAE,QAAAY,EAAO,IAAIZ,EAAM;AAElB,SAAA;AAAA,wBACeA,EAAM,OAAO,UAAU;AAAA,aAClCY,IAAS,CAAC;AAAA,cACTA,IAAS,CAAC;AAAA;AAAA;AAGxB,CAAC,GAEYC,IAAmBf,EAAOgB,CAAU;AAAA;AAAA,cAEnC,CAAC,EAAE,OAAAd,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA,GAIlCe,IAAajB,EAAOI,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiBVJ,EAAOC,CAAQ;AAEnC,MAAMiB,IAAoBlB,EAAOC,CAAQ,EAA2B,CAAC;AAAA,EAC1E,OAAAC;AAAA,EACA,WAAAiB;AACF,MACS;AAAA,cACKA,IAAY,gBAAgB,SAAS;AAAA;AAAA;AAAA,oBAG/BA,IAAY,gBAAgBjB,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA,cAIpDA,EAAM,OAAO,OAAO;AAAA;AAAA,GAGjC,GAEYkB,IAAapB,EAAOI,CAAI;AAAA;AAAA;AAAA;AAAA,GAMxBiB,IAAcrB,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAS7BqB,IAAgBtB,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAS/BsB,IAAevB,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;"}
|
@@ -1,21 +1,22 @@
|
|
1
|
-
import { jsx as e, jsxs as
|
1
|
+
import { jsx as e, jsxs as f, Fragment as T } from "react/jsx-runtime";
|
2
2
|
import { useMemo as d } from "react";
|
3
|
-
import
|
4
|
-
import
|
5
|
-
import {
|
6
|
-
import {
|
7
|
-
import {
|
8
|
-
|
9
|
-
|
3
|
+
import h from "../../../ui/arrow-tooltip/arrow-tooltip.js";
|
4
|
+
import y from "../../../ui/nudge/nudge.js";
|
5
|
+
import { getTheme as O } from "../../../ui/theme/get-theme.js";
|
6
|
+
import { IndicatorType as p } from "../../use-journey/constants.js";
|
7
|
+
import { CoachmarkBody as P, ClonedElementWrapper as u } from "./coachmark-styled.js";
|
8
|
+
import { toolTipGetXCoordinates as $ } from "./coachmark-utils.js";
|
9
|
+
const Y = ({ coachmark: t }) => {
|
10
|
+
const i = t.originalElementToHighlightRef.current, { top: r = 0, left: n = 0, height: C = 0, width: b = 0 } = (i == null ? void 0 : i.getBoundingClientRect()) || {}, { zIndex: I, device: c } = O(), m = c === "mobile", s = I.JOURNEY_OVERLAY, l = d(() => () => i ? window.getComputedStyle(i).position === "absolute" : !1, [i]), g = d(() => {
|
10
11
|
const o = t.indicator;
|
11
12
|
return {
|
12
|
-
width: 264,
|
13
|
+
width: m ? 246 : 264,
|
13
14
|
// Can be over ridden
|
14
|
-
tooltipXCoOrdinates:
|
15
|
+
tooltipXCoOrdinates: $(o.position) + (o.tooltipXCoOrdinates ?? 0),
|
15
16
|
// For absolutely positioned elements
|
16
|
-
zIndex:
|
17
|
+
zIndex: s + 1,
|
17
18
|
...o,
|
18
|
-
tooltipItem: /* @__PURE__ */ e(
|
19
|
+
tooltipItem: /* @__PURE__ */ e(P, { children: o.tooltipItem }),
|
19
20
|
alwaysVisible: !0,
|
20
21
|
renderAs: "primary",
|
21
22
|
// Deprecate this
|
@@ -25,7 +26,7 @@ const H = ({ coachmark: t }) => {
|
|
25
26
|
type: p.TOOLTIP,
|
26
27
|
isAnimated: !0
|
27
28
|
};
|
28
|
-
}, [t.indicator]),
|
29
|
+
}, [s, t.indicator, m]), w = d(() => {
|
29
30
|
const o = t.indicator;
|
30
31
|
return {
|
31
32
|
...o,
|
@@ -33,12 +34,12 @@ const H = ({ coachmark: t }) => {
|
|
33
34
|
nudgePointerY: r + (o.nudgePointerY ?? 0)
|
34
35
|
};
|
35
36
|
}, [t.indicator, n, r]);
|
36
|
-
return !i || !t.isActive ? null : t.type === p.TOOLTIP ? l() ? /* @__PURE__ */
|
37
|
+
return !i || !t.isActive ? null : t.type === p.TOOLTIP ? l() ? /* @__PURE__ */ f(T, { children: [
|
37
38
|
t.elementToHighlight,
|
38
|
-
/* @__PURE__ */ e(
|
39
|
-
] }) : /* @__PURE__ */ e(
|
39
|
+
/* @__PURE__ */ e(u, { $position: "absolute", $top: r, $left: n, children: /* @__PURE__ */ e(h, { ...g, children: /* @__PURE__ */ e("div", { style: { height: C, width: b } }) }) })
|
40
|
+
] }) : /* @__PURE__ */ e(u, { $position: "absolute", $top: r, $left: n, children: /* @__PURE__ */ e(h, { ...g, children: t.elementToHighlight }) }) : t.type === p.NUDGE ? /* @__PURE__ */ f(T, { children: [
|
40
41
|
/* @__PURE__ */ e(
|
41
|
-
|
42
|
+
u,
|
42
43
|
{
|
43
44
|
$top: l() ? 0 : r,
|
44
45
|
$left: l() ? 0 : n,
|
@@ -46,10 +47,10 @@ const H = ({ coachmark: t }) => {
|
|
46
47
|
children: t.elementToHighlight
|
47
48
|
}
|
48
49
|
),
|
49
|
-
/* @__PURE__ */ e(
|
50
|
+
/* @__PURE__ */ e(y, { zIndex: s + 1, ...w })
|
50
51
|
] }) : null;
|
51
52
|
};
|
52
53
|
export {
|
53
|
-
|
54
|
+
Y as Coachmark
|
54
55
|
};
|
55
56
|
//# sourceMappingURL=coachmark.js.map
|