@cuemath/leap 3.0.10-aa12 → 3.0.10-aa14
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/cue-canvas/cue-canvas.js +44 -43
- package/dist/features/cue-canvas/cue-canvas.js.map +1 -1
- package/dist/features/cue-canvas/hooks/use-canvas-sync-broker.js +50 -46
- package/dist/features/cue-canvas/hooks/use-canvas-sync-broker.js.map +1 -1
- package/dist/features/cue-canvas/sidebar/homework/homework-styled.js +7 -7
- package/dist/features/cue-canvas/sidebar/homework/homework-styled.js.map +1 -1
- package/dist/features/cue-canvas/sidebar/puzzles/puzzles-styled.js +14 -14
- package/dist/features/cue-canvas/sidebar/puzzles/puzzles-styled.js.map +1 -1
- package/dist/features/cue-canvas/sidebar/sidebar.js +26 -30
- package/dist/features/cue-canvas/sidebar/sidebar.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,81 +1,82 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { memo as
|
|
3
|
-
import { CueCanvasCore as
|
|
4
|
-
import { getCanvasConfig as
|
|
5
|
-
import { CueCanvasWrapper as
|
|
6
|
-
import { useCueCanvasActions as
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
const
|
|
1
|
+
import { jsx as V } from "react/jsx-runtime";
|
|
2
|
+
import { memo as j, useRef as x, useCallback as k, useEffect as n } from "react";
|
|
3
|
+
import { CueCanvasCore as A } from "./cue-canvas-core.js";
|
|
4
|
+
import { getCanvasConfig as P, getCanvasSettings as W } from "./cue-canvas-helpers.js";
|
|
5
|
+
import { CueCanvasWrapper as q } from "./cue-cavas-styled.js";
|
|
6
|
+
import { useCueCanvasActions as z } from "./hooks/use-cue-canvas-actions.js";
|
|
7
|
+
import B from "./hooks/use-height-extender.js";
|
|
8
|
+
import F from "./hooks/use-upload-helper.js";
|
|
9
|
+
const G = j(
|
|
10
10
|
({
|
|
11
|
-
canvasId:
|
|
11
|
+
canvasId: i,
|
|
12
12
|
width: u,
|
|
13
|
-
height:
|
|
13
|
+
height: o,
|
|
14
14
|
canRender: C,
|
|
15
15
|
onUpdateHeight: E,
|
|
16
|
-
initialData:
|
|
16
|
+
initialData: a,
|
|
17
17
|
onPublish: p,
|
|
18
|
-
onSubscribe:
|
|
19
|
-
userId:
|
|
20
|
-
appended:
|
|
18
|
+
onSubscribe: l,
|
|
19
|
+
userId: $,
|
|
20
|
+
appended: g,
|
|
21
21
|
canScribble: r,
|
|
22
|
-
userType:
|
|
23
|
-
renderAs:
|
|
22
|
+
userType: s,
|
|
23
|
+
renderAs: e = "canvas"
|
|
24
24
|
}) => {
|
|
25
|
-
const f =
|
|
25
|
+
const f = x(null), { setActiveInstance: c, setActiveTool: w } = z(), H = F({ userId: $, renderAs: e, userType: s }), t = x(null), R = k(
|
|
26
26
|
(m) => {
|
|
27
|
-
|
|
27
|
+
w(m);
|
|
28
28
|
},
|
|
29
|
-
[
|
|
29
|
+
[w]
|
|
30
30
|
);
|
|
31
|
-
return
|
|
31
|
+
return B({
|
|
32
32
|
canvasElementRef: f,
|
|
33
33
|
cueCanvasRef: t,
|
|
34
34
|
canScribble: r
|
|
35
35
|
}), n(() => {
|
|
36
36
|
r && t.current && (t.current.resetViewPort(), c(t.current));
|
|
37
37
|
}, [r, c]), n(() => {
|
|
38
|
-
|
|
39
|
-
}, [
|
|
40
|
-
|
|
41
|
-
}, [
|
|
42
|
-
if (C &&
|
|
43
|
-
const m =
|
|
38
|
+
a && t.current && t.current.update(a);
|
|
39
|
+
}, [a]), n(() => {
|
|
40
|
+
o && t.current && t.current.resetViewPort();
|
|
41
|
+
}, [o, u]), n(() => {
|
|
42
|
+
if (C && g && !t.current) {
|
|
43
|
+
const m = P(u, o, e, s), U = W(e, s), v = new A({
|
|
44
44
|
onPublish: p,
|
|
45
|
-
onSubscribe:
|
|
46
|
-
onUpdateActiveTool:
|
|
45
|
+
onSubscribe: l,
|
|
46
|
+
onUpdateActiveTool: R,
|
|
47
47
|
onUpdateHeight: E,
|
|
48
|
-
uploadImageToS3:
|
|
49
|
-
height:
|
|
50
|
-
userId:
|
|
51
|
-
canvasId:
|
|
52
|
-
userType:
|
|
53
|
-
renderAs:
|
|
48
|
+
uploadImageToS3: H,
|
|
49
|
+
height: o,
|
|
50
|
+
userId: $,
|
|
51
|
+
canvasId: i,
|
|
52
|
+
userType: s,
|
|
53
|
+
renderAs: e
|
|
54
54
|
});
|
|
55
55
|
(async () => {
|
|
56
56
|
await v.create({
|
|
57
57
|
canvasElementRef: f,
|
|
58
58
|
canvasConfig: m,
|
|
59
|
-
canvasSetting:
|
|
60
|
-
initialData:
|
|
59
|
+
canvasSetting: U,
|
|
60
|
+
initialData: a
|
|
61
61
|
}), t.current = v, r && c(v);
|
|
62
62
|
})();
|
|
63
63
|
}
|
|
64
|
-
}, [p,
|
|
64
|
+
}, [p, l, c, C, g]), n(() => () => {
|
|
65
65
|
t.current && (t.current.destroy(), t.current = null);
|
|
66
|
-
}, []), /* @__PURE__ */
|
|
67
|
-
|
|
66
|
+
}, []), /* @__PURE__ */ V(
|
|
67
|
+
q,
|
|
68
68
|
{
|
|
69
|
+
id: e === "whiteboard" ? "canvasContainer" : i,
|
|
69
70
|
ref: f,
|
|
70
71
|
$width: u,
|
|
71
|
-
$height:
|
|
72
|
+
$height: o,
|
|
72
73
|
$canScribble: r,
|
|
73
74
|
$canRender: C,
|
|
74
|
-
$renderAs:
|
|
75
|
+
$renderAs: e
|
|
75
76
|
}
|
|
76
77
|
);
|
|
77
78
|
}
|
|
78
|
-
), X =
|
|
79
|
+
), X = G;
|
|
79
80
|
export {
|
|
80
81
|
X as default
|
|
81
82
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cue-canvas.js","sources":["../../../src/features/cue-canvas/cue-canvas.tsx"],"sourcesContent":["import type { ICueCanvas, TCueCanvasTool } from './types/cue-canvas';\n\nimport { memo, useCallback, useEffect, useRef } from 'react';\n\nimport { CueCanvasCore } from './cue-canvas-core';\nimport { getCanvasConfig, getCanvasSettings } from './cue-canvas-helpers';\nimport { CueCanvasWrapper } from './cue-cavas-styled';\nimport { useCueCanvasActions } from './hooks/use-cue-canvas-actions';\nimport useHeightExtender from './hooks/use-height-extender';\nimport useUploadHelper from './hooks/use-upload-helper';\n\nconst CueCanvas: React.FC<ICueCanvas> = memo(\n ({\n canvasId,\n width,\n height,\n canRender,\n onUpdateHeight,\n initialData,\n onPublish,\n onSubscribe,\n userId,\n appended,\n canScribble,\n userType,\n renderAs = 'canvas',\n }) => {\n const canvasElementRef = useRef<HTMLDivElement>(null);\n const { setActiveInstance: setActiveCueCanvas, setActiveTool } = useCueCanvasActions();\n const uploadImageToS3 = useUploadHelper({ userId, renderAs, userType });\n\n const cueCanvasRef = useRef<CueCanvasCore | null>(null);\n\n const onUpdateActiveTool = useCallback(\n (tool: TCueCanvasTool) => {\n setActiveTool(tool);\n },\n [setActiveTool],\n );\n\n useHeightExtender({\n canvasElementRef,\n cueCanvasRef,\n canScribble,\n });\n\n useEffect(() => {\n if (canScribble && cueCanvasRef.current) {\n cueCanvasRef.current.resetViewPort();\n\n setActiveCueCanvas(cueCanvasRef.current);\n }\n }, [canScribble, setActiveCueCanvas]);\n\n useEffect(() => {\n if (initialData && cueCanvasRef.current) {\n cueCanvasRef.current.update(initialData);\n }\n }, [initialData]);\n\n useEffect(() => {\n if (height && cueCanvasRef.current) {\n cueCanvasRef.current.resetViewPort();\n }\n }, [height, width]);\n\n useEffect(() => {\n if (canRender && appended && !cueCanvasRef.current) {\n const canvasConfig = getCanvasConfig(width, height, renderAs, userType);\n const canvasSetting = getCanvasSettings(renderAs, userType);\n
|
|
1
|
+
{"version":3,"file":"cue-canvas.js","sources":["../../../src/features/cue-canvas/cue-canvas.tsx"],"sourcesContent":["import type { ICueCanvas, TCueCanvasTool } from './types/cue-canvas';\n\nimport { memo, useCallback, useEffect, useRef } from 'react';\n\nimport { CueCanvasCore } from './cue-canvas-core';\nimport { getCanvasConfig, getCanvasSettings } from './cue-canvas-helpers';\nimport { CueCanvasWrapper } from './cue-cavas-styled';\nimport { useCueCanvasActions } from './hooks/use-cue-canvas-actions';\nimport useHeightExtender from './hooks/use-height-extender';\nimport useUploadHelper from './hooks/use-upload-helper';\n\nconst CueCanvas: React.FC<ICueCanvas> = memo(\n ({\n canvasId,\n width,\n height,\n canRender,\n onUpdateHeight,\n initialData,\n onPublish,\n onSubscribe,\n userId,\n appended,\n canScribble,\n userType,\n renderAs = 'canvas',\n }) => {\n const canvasElementRef = useRef<HTMLDivElement>(null);\n const { setActiveInstance: setActiveCueCanvas, setActiveTool } = useCueCanvasActions();\n const uploadImageToS3 = useUploadHelper({ userId, renderAs, userType });\n\n const cueCanvasRef = useRef<CueCanvasCore | null>(null);\n\n const onUpdateActiveTool = useCallback(\n (tool: TCueCanvasTool) => {\n setActiveTool(tool);\n },\n [setActiveTool],\n );\n\n useHeightExtender({\n canvasElementRef,\n cueCanvasRef,\n canScribble,\n });\n\n useEffect(() => {\n if (canScribble && cueCanvasRef.current) {\n cueCanvasRef.current.resetViewPort();\n\n setActiveCueCanvas(cueCanvasRef.current);\n }\n }, [canScribble, setActiveCueCanvas]);\n\n useEffect(() => {\n if (initialData && cueCanvasRef.current) {\n cueCanvasRef.current.update(initialData);\n }\n }, [initialData]);\n\n useEffect(() => {\n if (height && cueCanvasRef.current) {\n cueCanvasRef.current.resetViewPort();\n }\n }, [height, width]);\n\n useEffect(() => {\n if (canRender && appended && !cueCanvasRef.current) {\n const canvasConfig = getCanvasConfig(width, height, renderAs, userType);\n const canvasSetting = getCanvasSettings(renderAs, userType);\n const cueCanvasCore = new CueCanvasCore({\n onPublish,\n onSubscribe,\n onUpdateActiveTool,\n onUpdateHeight,\n uploadImageToS3,\n height,\n userId,\n canvasId,\n userType,\n renderAs,\n });\n\n const createCueCanvas = async () => {\n await cueCanvasCore.create({\n canvasElementRef,\n canvasConfig,\n canvasSetting,\n initialData,\n });\n cueCanvasRef.current = cueCanvasCore;\n\n if (canScribble) {\n setActiveCueCanvas(cueCanvasCore);\n }\n };\n\n createCueCanvas();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [onPublish, onSubscribe, setActiveCueCanvas, canRender, appended]);\n\n useEffect(() => {\n return () => {\n if (cueCanvasRef.current) {\n cueCanvasRef.current.destroy();\n cueCanvasRef.current = null;\n }\n };\n }, []);\n\n return (\n <CueCanvasWrapper\n id={renderAs === 'whiteboard' ? 'canvasContainer' : canvasId}\n ref={canvasElementRef}\n $width={width}\n $height={height}\n $canScribble={canScribble}\n $canRender={canRender}\n $renderAs={renderAs}\n />\n );\n },\n);\n\nexport default CueCanvas;\n"],"names":["CueCanvas","memo","canvasId","width","height","canRender","onUpdateHeight","initialData","onPublish","onSubscribe","userId","appended","canScribble","userType","renderAs","canvasElementRef","useRef","setActiveCueCanvas","setActiveTool","useCueCanvasActions","uploadImageToS3","useUploadHelper","cueCanvasRef","onUpdateActiveTool","useCallback","tool","useHeightExtender","useEffect","canvasConfig","getCanvasConfig","canvasSetting","getCanvasSettings","cueCanvasCore","CueCanvasCore","jsx","CueCanvasWrapper","CueCanvas$1"],"mappings":";;;;;;;;AAWA,MAAMA,IAAkCC;AAAA,EACtC,CAAC;AAAA,IACC,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,QAAAC;AAAA,IACA,WAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,aAAAC;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,EAAA,MACP;AACE,UAAAC,IAAmBC,EAAuB,IAAI,GAC9C,EAAE,mBAAmBC,GAAoB,eAAAC,MAAkBC,EAAoB,GAC/EC,IAAkBC,EAAgB,EAAE,QAAAX,GAAQ,UAAAI,GAAU,UAAAD,GAAU,GAEhES,IAAeN,EAA6B,IAAI,GAEhDO,IAAqBC;AAAA,MACzB,CAACC,MAAyB;AACxB,QAAAP,EAAcO,CAAI;AAAA,MACpB;AAAA,MACA,CAACP,CAAa;AAAA,IAAA;AAGE,WAAAQ,EAAA;AAAA,MAChB,kBAAAX;AAAA,MACA,cAAAO;AAAA,MACA,aAAAV;AAAA,IAAA,CACD,GAEDe,EAAU,MAAM;AACV,MAAAf,KAAeU,EAAa,YAC9BA,EAAa,QAAQ,iBAErBL,EAAmBK,EAAa,OAAO;AAAA,IACzC,GACC,CAACV,GAAaK,CAAkB,CAAC,GAEpCU,EAAU,MAAM;AACV,MAAApB,KAAee,EAAa,WACjBA,EAAA,QAAQ,OAAOf,CAAW;AAAA,IACzC,GACC,CAACA,CAAW,CAAC,GAEhBoB,EAAU,MAAM;AACV,MAAAvB,KAAUkB,EAAa,WACzBA,EAAa,QAAQ;IACvB,GACC,CAAClB,GAAQD,CAAK,CAAC,GAElBwB,EAAU,MAAM;AACd,UAAItB,KAAaM,KAAY,CAACW,EAAa,SAAS;AAClD,cAAMM,IAAeC,EAAgB1B,GAAOC,GAAQU,GAAUD,CAAQ,GAChEiB,IAAgBC,EAAkBjB,GAAUD,CAAQ,GACpDmB,IAAgB,IAAIC,EAAc;AAAA,UACtC,WAAAzB;AAAA,UACA,aAAAC;AAAA,UACA,oBAAAc;AAAA,UACA,gBAAAjB;AAAA,UACA,iBAAAc;AAAA,UACA,QAAAhB;AAAA,UACA,QAAAM;AAAA,UACA,UAAAR;AAAA,UACA,UAAAW;AAAA,UACA,UAAAC;AAAA,QAAA,CACD;AAgBe,SAdQ,YAAY;AAClC,gBAAMkB,EAAc,OAAO;AAAA,YACzB,kBAAAjB;AAAA,YACA,cAAAa;AAAA,YACA,eAAAE;AAAA,YACA,aAAAvB;AAAA,UAAA,CACD,GACDe,EAAa,UAAUU,GAEnBpB,KACFK,EAAmBe,CAAa;AAAA,QAClC;MAIJ;AAAA,IAAA,GAEC,CAACxB,GAAWC,GAAaQ,GAAoBZ,GAAWM,CAAQ,CAAC,GAEpEgB,EAAU,MACD,MAAM;AACX,MAAIL,EAAa,YACfA,EAAa,QAAQ,WACrBA,EAAa,UAAU;AAAA,IACzB,GAED,CAAE,CAAA,GAGH,gBAAAY;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,IAAIrB,MAAa,eAAe,oBAAoBZ;AAAA,QACpD,KAAKa;AAAA,QACL,QAAQZ;AAAA,QACR,SAASC;AAAA,QACT,cAAcQ;AAAA,QACd,YAAYP;AAAA,QACZ,WAAWS;AAAA,MAAA;AAAA,IAAA;AAAA,EAGjB;AACF,GAEAsB,IAAepC;"}
|
|
@@ -1,52 +1,56 @@
|
|
|
1
|
-
import { useMessageBrokerChannel as
|
|
2
|
-
import { useState as
|
|
3
|
-
const
|
|
4
|
-
userId:
|
|
5
|
-
data:
|
|
6
|
-
height:
|
|
7
|
-
responseId:
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
import { useMessageBrokerChannel as q } from "@cuemath/cue-message-broker";
|
|
2
|
+
import { useState as x, useRef as w, useMemo as E, useCallback as h } from "react";
|
|
3
|
+
const p = (r) => ({
|
|
4
|
+
userId: r.userId,
|
|
5
|
+
data: r.data,
|
|
6
|
+
height: r.height,
|
|
7
|
+
responseId: r.responseId,
|
|
8
|
+
gridName: r.gridName,
|
|
9
|
+
dimension: r.dimension
|
|
10
|
+
}), F = (r, g, f, m = "canvas") => {
|
|
11
|
+
const [b, l] = x(
|
|
10
12
|
() => {
|
|
11
13
|
var o, n;
|
|
12
|
-
const
|
|
13
|
-
if (!
|
|
14
|
-
for (const { message:
|
|
15
|
-
const e = (o =
|
|
14
|
+
const c = {};
|
|
15
|
+
if (!f) return c;
|
|
16
|
+
for (const { message: i } of f) {
|
|
17
|
+
const e = (o = i.payload) == null ? void 0 : o.eventPayload, s = e == null ? void 0 : e.responseId;
|
|
16
18
|
if (!(e != null && e.responseId)) continue;
|
|
17
|
-
const t =
|
|
18
|
-
s &&
|
|
19
|
+
const t = p(e);
|
|
20
|
+
s && c[s] ? (n = c[s]) == null || n.push(t) : c[s] = [t];
|
|
19
21
|
}
|
|
20
|
-
return
|
|
22
|
+
return c;
|
|
21
23
|
}
|
|
22
|
-
), u =
|
|
24
|
+
), u = w({}), S = E(
|
|
23
25
|
() => ({
|
|
24
|
-
channelId:
|
|
25
|
-
ttl:
|
|
26
|
-
logger:
|
|
26
|
+
channelId: r,
|
|
27
|
+
ttl: m === "canvas" ? 0 : 24,
|
|
28
|
+
logger: g
|
|
27
29
|
}),
|
|
28
|
-
[
|
|
29
|
-
), C = h((
|
|
30
|
-
u.current = { ...u.current, [
|
|
30
|
+
[r, g, m]
|
|
31
|
+
), C = h((c, o) => {
|
|
32
|
+
u.current = { ...u.current, [c]: o };
|
|
31
33
|
}, []), D = h(
|
|
32
|
-
(
|
|
34
|
+
(c, o) => {
|
|
33
35
|
const n = {};
|
|
34
|
-
|
|
35
|
-
var
|
|
36
|
-
const { payload: e } =
|
|
37
|
-
if (!o &&
|
|
38
|
-
|
|
39
|
-
data:
|
|
40
|
-
height:
|
|
41
|
-
userId:
|
|
42
|
-
responseId: t
|
|
36
|
+
c.forEach((i) => {
|
|
37
|
+
var I;
|
|
38
|
+
const { payload: e } = i.message, { eventPayload: s } = e, t = s == null ? void 0 : s.responseId, R = s == null ? void 0 : s.data, B = s == null ? void 0 : s.userId, j = s == null ? void 0 : s.height, k = u.current[t];
|
|
39
|
+
if (!o && k)
|
|
40
|
+
k({
|
|
41
|
+
data: R,
|
|
42
|
+
height: j,
|
|
43
|
+
userId: B,
|
|
44
|
+
responseId: t,
|
|
45
|
+
gridName: s == null ? void 0 : s.gridName,
|
|
46
|
+
dimension: s == null ? void 0 : s.dimension
|
|
43
47
|
});
|
|
44
48
|
else {
|
|
45
|
-
const
|
|
46
|
-
t && n[t] ? (
|
|
49
|
+
const d = p(s);
|
|
50
|
+
t && n[t] ? (I = n[t]) == null || I.push(d) : n[t] = [d];
|
|
47
51
|
}
|
|
48
|
-
}), Object.keys(n).length > 0 &&
|
|
49
|
-
const e = { ...
|
|
52
|
+
}), Object.keys(n).length > 0 && l((i) => {
|
|
53
|
+
const e = { ...i };
|
|
50
54
|
return Object.keys(n).forEach((s) => {
|
|
51
55
|
var t;
|
|
52
56
|
s && e[s] ? (t = e[s]) == null || t.push(...n[s] ?? []) : e[s] = n[s] ?? [];
|
|
@@ -54,21 +58,21 @@ const d = (c) => ({
|
|
|
54
58
|
});
|
|
55
59
|
},
|
|
56
60
|
[]
|
|
57
|
-
), { publish: M, channelStatus:
|
|
61
|
+
), { publish: M, channelStatus: N, channel: a } = q({
|
|
58
62
|
channelOptions: S,
|
|
59
63
|
consumerFn: D
|
|
60
|
-
}),
|
|
61
|
-
|
|
62
|
-
}, [
|
|
64
|
+
}), O = h(() => {
|
|
65
|
+
a && a.destroyChannel();
|
|
66
|
+
}, [a]);
|
|
63
67
|
return {
|
|
64
68
|
publishStrokes: M,
|
|
65
|
-
channelStatus:
|
|
66
|
-
closeChannel:
|
|
67
|
-
initialStrokesData:
|
|
69
|
+
channelStatus: N,
|
|
70
|
+
closeChannel: O,
|
|
71
|
+
initialStrokesData: b,
|
|
68
72
|
registerCallback: C
|
|
69
73
|
};
|
|
70
|
-
},
|
|
74
|
+
}, $ = F;
|
|
71
75
|
export {
|
|
72
|
-
|
|
76
|
+
$ as default
|
|
73
77
|
};
|
|
74
78
|
//# sourceMappingURL=use-canvas-sync-broker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-canvas-sync-broker.js","sources":["../../../../src/features/cue-canvas/hooks/use-canvas-sync-broker.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"use-canvas-sync-broker.js","sources":["../../../../src/features/cue-canvas/hooks/use-canvas-sync-broker.ts"],"sourcesContent":["import type {\n IActionData,\n IViewport,\n TCueCanvasChangeDataObject,\n TCueCanvasGridName,\n TRenderAs,\n} from '../types/cue-canvas';\n\nimport { useMessageBrokerChannel, type IChannelMessage } from '@cuemath/cue-message-broker';\nimport { useMemo, useCallback, useState, useRef } from 'react';\n\ninterface IMessage {\n eventName: string;\n eventPayload: {\n responseId: string;\n data: TCueCanvasChangeDataObject;\n userId: string;\n height: number;\n gridName?: TCueCanvasGridName;\n dimension?: IViewport;\n };\n}\n\nconst extractStrokeData = (payload: IMessage['eventPayload']): IActionData => ({\n userId: payload.userId,\n data: payload.data,\n height: payload.height,\n responseId: payload.responseId,\n gridName: payload.gridName,\n dimension: payload.dimension,\n});\n\nconst useCanvasSyncBroker = (\n channelId: string,\n logEvent: (type: string, payload?: Record<string, unknown>) => void,\n initialCanvasData?: Array<IChannelMessage>,\n type: TRenderAs = 'canvas',\n) => {\n const [initialStrokesData, setInitialStrokesData] = useState<Record<string, IActionData[]>>(\n () => {\n const map: Record<string, IActionData[]> = {};\n\n if (!initialCanvasData) return map;\n\n for (const { message } of initialCanvasData) {\n const payload = (message.payload as IMessage)?.eventPayload;\n const qrId = payload?.responseId;\n\n if (!payload?.responseId) continue;\n\n const strokeData = extractStrokeData(payload);\n\n if (qrId && map[qrId]) {\n map[qrId]?.push(strokeData);\n } else {\n map[qrId] = [strokeData];\n }\n }\n\n return map;\n },\n );\n const callbacksMapRef = useRef<Record<string, (data: IActionData) => void>>({});\n\n const channelOptions = useMemo(\n () => ({\n channelId,\n ttl: type === 'canvas' ? 0 : 24,\n logger: logEvent,\n }),\n [channelId, logEvent, type],\n );\n\n const registerCallback = useCallback((qrId: string, cb: (data: IActionData) => void) => {\n callbacksMapRef.current = { ...callbacksMapRef.current, [qrId]: cb };\n }, []);\n\n const onMessageReceive = useCallback(\n (messages: Array<IChannelMessage>, initialData?: boolean) => {\n const strokesPerWidgetMap: Record<string, Array<IActionData>> = {};\n\n messages.forEach(message => {\n const { payload } = message.message;\n const { eventPayload } = payload as IMessage;\n const qrId = eventPayload?.responseId as string;\n const strokes = eventPayload?.data;\n const userId = eventPayload?.userId;\n const canvasHeight = eventPayload?.height;\n const widgetOnReceiveCallback = callbacksMapRef.current[qrId];\n\n if (!initialData && widgetOnReceiveCallback) {\n widgetOnReceiveCallback({\n data: strokes,\n height: canvasHeight,\n userId,\n responseId: qrId,\n gridName: eventPayload?.gridName,\n dimension: eventPayload?.dimension,\n });\n } else {\n const strokeData = extractStrokeData(eventPayload);\n\n if (qrId && strokesPerWidgetMap[qrId]) {\n strokesPerWidgetMap[qrId]?.push(strokeData);\n } else {\n strokesPerWidgetMap[qrId] = [strokeData];\n }\n }\n });\n\n if (Object.keys(strokesPerWidgetMap).length > 0) {\n setInitialStrokesData(prevData => {\n const currentData = { ...prevData };\n\n Object.keys(strokesPerWidgetMap).forEach(key => {\n if (key && currentData[key]) {\n currentData[key]?.push(...(strokesPerWidgetMap[key] ?? []));\n } else {\n currentData[key] = strokesPerWidgetMap[key] ?? [];\n }\n });\n\n return currentData;\n });\n }\n },\n [],\n );\n\n const { publish, channelStatus, channel } = useMessageBrokerChannel({\n channelOptions,\n consumerFn: onMessageReceive,\n });\n\n const closeChannel = useCallback(() => {\n if (channel) {\n channel.destroyChannel();\n }\n }, [channel]);\n\n return {\n publishStrokes: publish,\n channelStatus,\n closeChannel,\n initialStrokesData,\n registerCallback,\n };\n};\n\nexport default useCanvasSyncBroker;\n"],"names":["extractStrokeData","payload","useCanvasSyncBroker","channelId","logEvent","initialCanvasData","type","initialStrokesData","setInitialStrokesData","useState","map","message","_a","qrId","strokeData","_b","callbacksMapRef","useRef","channelOptions","useMemo","registerCallback","useCallback","cb","onMessageReceive","messages","initialData","strokesPerWidgetMap","eventPayload","strokes","userId","canvasHeight","widgetOnReceiveCallback","prevData","currentData","key","publish","channelStatus","channel","useMessageBrokerChannel","closeChannel","useCanvasSyncBroker$1"],"mappings":"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"}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import o from "styled-components";
|
|
2
|
-
import
|
|
3
|
-
const
|
|
2
|
+
import t from "../../../ui/layout/flex-view.js";
|
|
3
|
+
const i = o(t)`
|
|
4
4
|
position: absolute;
|
|
5
5
|
top: 38px;
|
|
6
|
-
left: -
|
|
6
|
+
left: -87px; //32px + 32 px for icon +8+8(separator) +7 gutter
|
|
7
7
|
width: 248px;
|
|
8
8
|
height: 438px;
|
|
9
9
|
border-radius: 6px;
|
|
10
10
|
background: #292734;
|
|
11
|
-
box-shadow: 0px 4px 8px ${({ theme:
|
|
11
|
+
box-shadow: 0px 4px 8px ${({ theme: r }) => r.colors.BLACK_T_20};
|
|
12
12
|
overflow-y: auto;
|
|
13
|
-
`,
|
|
13
|
+
`, a = o.img.attrs({ loading: "lazy" })`
|
|
14
14
|
width: 184px;
|
|
15
15
|
height: 128px;
|
|
16
16
|
border-top-left-radius: 8px;
|
|
@@ -19,7 +19,7 @@ const e = o(r)`
|
|
|
19
19
|
border-bottom-right-radius: 0;
|
|
20
20
|
`;
|
|
21
21
|
export {
|
|
22
|
-
|
|
23
|
-
|
|
22
|
+
a as HWImageContainer,
|
|
23
|
+
i as MenuContainer
|
|
24
24
|
};
|
|
25
25
|
//# sourceMappingURL=homework-styled.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"homework-styled.js","sources":["../../../../../src/features/cue-canvas/sidebar/homework/homework-styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\n\nconst MenuContainer = styled(FlexView)`\n position: absolute;\n top: 38px;\n left: -
|
|
1
|
+
{"version":3,"file":"homework-styled.js","sources":["../../../../../src/features/cue-canvas/sidebar/homework/homework-styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\n\nconst MenuContainer = styled(FlexView)`\n position: absolute;\n top: 38px;\n left: -87px; //32px + 32 px for icon +8+8(separator) +7 gutter\n width: 248px;\n height: 438px;\n border-radius: 6px;\n background: #292734;\n box-shadow: 0px 4px 8px ${({ theme }) => theme.colors.BLACK_T_20};\n overflow-y: auto;\n`;\nconst HWImageContainer = styled.img.attrs({ loading: 'lazy' })`\n width: 184px;\n height: 128px;\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n`;\n\nexport { MenuContainer, HWImageContainer };\n"],"names":["MenuContainer","styled","FlexView","theme","HWImageContainer"],"mappings":";;AAIM,MAAAA,IAAgBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAQT,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA;AAAA,GAG5DC,IAAmBH,EAAO,IAAI,MAAM,EAAE,SAAS,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import r from "styled-components";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
const
|
|
2
|
+
import e from "../../../ui/layout/flex-view.js";
|
|
3
|
+
import t from "../../../ui/text/text.js";
|
|
4
|
+
const l = r(e)`
|
|
5
5
|
position: absolute;
|
|
6
6
|
top: 38px;
|
|
7
|
-
left: -
|
|
7
|
+
left: -47px; //32px for icon + 8 sep+ 7 padding
|
|
8
8
|
width: 650px;
|
|
9
9
|
height: 438px;
|
|
10
10
|
border-radius: 6px;
|
|
@@ -19,21 +19,21 @@ const s = r(t)`
|
|
|
19
19
|
margin: 16px;
|
|
20
20
|
background-color: black;
|
|
21
21
|
cursor: pointer;
|
|
22
|
-
`,
|
|
22
|
+
`, p = r.div`
|
|
23
23
|
color: white;
|
|
24
24
|
cursor: pointer;
|
|
25
25
|
width: 150px;
|
|
26
26
|
overflow: hidden;
|
|
27
27
|
white-space: nowrap;
|
|
28
28
|
text-overflow: ellipsis;
|
|
29
|
-
`,
|
|
29
|
+
`, a = r.div`
|
|
30
30
|
width: 336px;
|
|
31
31
|
height: 300px;
|
|
32
32
|
display: flex;
|
|
33
33
|
justify-content: center;
|
|
34
34
|
align-items: center;
|
|
35
35
|
color: ${({ theme: o }) => o.colors.GREY_4};
|
|
36
|
-
`, b = r(
|
|
36
|
+
`, b = r(e)`
|
|
37
37
|
max-height: 300px;
|
|
38
38
|
width: 100%;
|
|
39
39
|
overflow-y: auto;
|
|
@@ -46,13 +46,13 @@ const s = r(t)`
|
|
|
46
46
|
border-radius: 6px;
|
|
47
47
|
background: ${({ theme: o }) => o.colors.REAL_BLACK_60};
|
|
48
48
|
}
|
|
49
|
-
`, n = r(
|
|
49
|
+
`, n = r(e)`
|
|
50
50
|
background: #292734;
|
|
51
51
|
|
|
52
52
|
& > div {
|
|
53
53
|
width: calc(100% - 32px);
|
|
54
54
|
}
|
|
55
|
-
`, x = r(
|
|
55
|
+
`, x = r(e)`
|
|
56
56
|
overflow-y: auto;
|
|
57
57
|
&::-webkit-scrollbar {
|
|
58
58
|
border-radius: 6px;
|
|
@@ -63,7 +63,7 @@ const s = r(t)`
|
|
|
63
63
|
border-radius: 6px;
|
|
64
64
|
background: ${({ theme: o }) => o.colors.REAL_BLACK_60};
|
|
65
65
|
}
|
|
66
|
-
`, h = r(
|
|
66
|
+
`, h = r(e)`
|
|
67
67
|
border-right: 1px solid ${({ theme: o }) => o.colors.GREY_4};
|
|
68
68
|
height: 385px;
|
|
69
69
|
overflow-y: auto;
|
|
@@ -76,7 +76,7 @@ const s = r(t)`
|
|
|
76
76
|
border-radius: 6px;
|
|
77
77
|
background: ${({ theme: o }) => o.colors.REAL_BLACK_60};
|
|
78
78
|
}
|
|
79
|
-
`, u = r(
|
|
79
|
+
`, u = r(t)`
|
|
80
80
|
width: 130px;
|
|
81
81
|
white-space: nowrap;
|
|
82
82
|
text-overflow: ellipsis;
|
|
@@ -85,11 +85,11 @@ const s = r(t)`
|
|
|
85
85
|
export {
|
|
86
86
|
b as ActivitiesList,
|
|
87
87
|
d as ActivityImage,
|
|
88
|
-
|
|
88
|
+
p as ActivityTitle,
|
|
89
89
|
x as CheckboxWrapper,
|
|
90
|
-
|
|
90
|
+
a as EmptyStateContainer,
|
|
91
91
|
h as FilterSidebar,
|
|
92
|
-
|
|
92
|
+
l as MenuContainer,
|
|
93
93
|
n as SearchHeaderWrapper,
|
|
94
94
|
u as SelectedGrades
|
|
95
95
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"puzzles-styled.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/puzzles-styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\n\nconst MenuContainer = styled(FlexView)`\n position: absolute;\n top: 38px;\n left: -
|
|
1
|
+
{"version":3,"file":"puzzles-styled.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/puzzles-styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\n\nconst MenuContainer = styled(FlexView)`\n position: absolute;\n top: 38px;\n left: -47px; //32px for icon + 8 sep+ 7 padding\n width: 650px;\n height: 438px;\n border-radius: 6px;\n background: #292734;\n box-shadow: 0px 4px 8px ${({ theme }) => theme.colors.BLACK_T_20};\n`;\n\nconst ActivityImage = styled.img`\n position: relative;\n width: 160px;\n height: 120px;\n border: 1px solid white;\n border-radius: 8px;\n margin: 16px;\n background-color: black;\n cursor: pointer;\n`;\n\nconst ActivityTitle = styled.div`\n color: white;\n cursor: pointer;\n width: 150px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n`;\n\nconst EmptyStateContainer = styled.div`\n width: 336px;\n height: 300px;\n display: flex;\n justify-content: center;\n align-items: center;\n color: ${({ theme }) => theme.colors.GREY_4};\n`;\n\nconst ActivitiesList = styled(FlexView)`\n max-height: 300px;\n width: 100%;\n overflow-y: auto;\n &::-webkit-scrollbar {\n border-radius: 6px;\n background-color: ${({ theme }) => theme.colors.WHITE};\n }\n\n &::-webkit-scrollbar-thumb {\n border-radius: 6px;\n background: ${({ theme }) => theme.colors.REAL_BLACK_60};\n }\n`;\n\nconst SearchHeaderWrapper = styled(FlexView)<{ $noBorder?: boolean }>`\n background: #292734;\n\n & > div {\n width: calc(100% - 32px);\n }\n`;\n\nconst CheckboxWrapper = styled(FlexView)`\n overflow-y: auto;\n &::-webkit-scrollbar {\n border-radius: 6px;\n background-color: ${({ theme }) => theme.colors.WHITE};\n }\n\n &::-webkit-scrollbar-thumb {\n border-radius: 6px;\n background: ${({ theme }) => theme.colors.REAL_BLACK_60};\n }\n`;\n\nconst FilterSidebar = styled(FlexView)`\n border-right: 1px solid ${({ theme }) => theme.colors.GREY_4};\n height: 385px;\n overflow-y: auto;\n &::-webkit-scrollbar {\n border-radius: 6px;\n background-color: ${({ theme }) => theme.colors.WHITE};\n }\n\n &::-webkit-scrollbar-thumb {\n border-radius: 6px;\n background: ${({ theme }) => theme.colors.REAL_BLACK_60};\n }\n`;\n\nconst SelectedGrades = styled(Text)`\n width: 130px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n`;\n\nexport {\n MenuContainer,\n ActivityImage,\n ActivityTitle,\n EmptyStateContainer,\n ActivitiesList,\n SearchHeaderWrapper,\n CheckboxWrapper,\n FilterSidebar,\n SelectedGrades,\n};\n"],"names":["MenuContainer","styled","FlexView","theme","ActivityImage","ActivityTitle","EmptyStateContainer","ActivitiesList","SearchHeaderWrapper","CheckboxWrapper","FilterSidebar","SelectedGrades","Text"],"mappings":";;;AAKM,MAAAA,IAAgBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAQT,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA,GAG5DC,IAAgBH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWvBI,IAAgBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GASvBK,IAAsBL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAMxB,CAAC,EAAE,OAAAE,EAAA,MAAYA,EAAM,OAAO,MAAM;AAAA,GAGvCI,IAAiBN,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMd,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKvC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,aAAa;AAAA;AAAA,GAIrDK,IAAsBP,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQrCO,IAAkBR,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,wBAIf,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKvC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,aAAa;AAAA;AAAA,GAIrDO,IAAgBT,EAAOC,CAAQ;AAAA,4BACT,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,wBAKtC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKvC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,aAAa;AAAA;AAAA,GAIrDQ,IAAiBV,EAAOW,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;"}
|
|
@@ -1,33 +1,29 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { memo as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
]
|
|
27
|
-
}
|
|
28
|
-
);
|
|
29
|
-
}, v = a(p);
|
|
1
|
+
import { jsx as e, jsxs as n } from "react/jsx-runtime";
|
|
2
|
+
import { memo as p, useState as d, useMemo as f } from "react";
|
|
3
|
+
import s from "../../ui/layout/flex-view.js";
|
|
4
|
+
import o from "../../ui/separator/separator.js";
|
|
5
|
+
import c from "./homework/homework.js";
|
|
6
|
+
import u from "./puzzles/puzzles.js";
|
|
7
|
+
import { SideBarContainer as l } from "./sidebar-styled.js";
|
|
8
|
+
import x from "./tiles/tile.js";
|
|
9
|
+
const w = ({ grade: m, hwRequests: i }) => {
|
|
10
|
+
const [r, t] = d(), a = f(() => r === "tile" ? "300px" : r === "homework" ? "248px" : r === "puzzle" ? "650px" : "auto", [r]);
|
|
11
|
+
return /* @__PURE__ */ e(l, { $activeSidebar: r, $width: a, children: /* @__PURE__ */ n(s, { $flexDirection: "row", children: [
|
|
12
|
+
/* @__PURE__ */ e(x, { activeSidebar: r, setActiveSidebar: t }),
|
|
13
|
+
/* @__PURE__ */ e(o, { width: 8 }),
|
|
14
|
+
/* @__PURE__ */ e(u, { grade: m, activeSidebar: r, setActiveSidebar: t }),
|
|
15
|
+
/* @__PURE__ */ e(o, { width: 8 }),
|
|
16
|
+
i && /* @__PURE__ */ e(
|
|
17
|
+
c,
|
|
18
|
+
{
|
|
19
|
+
activeSidebar: r,
|
|
20
|
+
setActiveSidebar: t,
|
|
21
|
+
hwRequests: i
|
|
22
|
+
}
|
|
23
|
+
)
|
|
24
|
+
] }) });
|
|
25
|
+
}, B = p(w);
|
|
30
26
|
export {
|
|
31
|
-
|
|
27
|
+
B as default
|
|
32
28
|
};
|
|
33
29
|
//# sourceMappingURL=sidebar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidebar.js","sources":["../../../../src/features/cue-canvas/sidebar/sidebar.tsx"],"sourcesContent":["import type { IHomeWorkHelpRequestModelWithStudentName } from './homework/homework-types';\nimport type { TActiveSidebar } from './puzzles/puzzles-type';\nimport type { FC } from 'react';\n\nimport { memo, useState } from 'react';\n\nimport Homework from './homework/homework';\nimport Puzzles from './puzzles/puzzles';\nimport { SideBarContainer } from './sidebar-styled';\nimport TileBar from './tiles/tile';\n\ninterface ISidebar {\n grade?: string;\n hwRequests?: IHomeWorkHelpRequestModelWithStudentName[];\n}\n\nconst Sidebar: FC<ISidebar> = ({ grade, hwRequests }) => {\n const [activeSidebar, setActiveSidebar] = useState<TActiveSidebar | undefined>();\n\n return (\n
|
|
1
|
+
{"version":3,"file":"sidebar.js","sources":["../../../../src/features/cue-canvas/sidebar/sidebar.tsx"],"sourcesContent":["import type { IHomeWorkHelpRequestModelWithStudentName } from './homework/homework-types';\nimport type { TActiveSidebar } from './puzzles/puzzles-type';\nimport type { FC } from 'react';\n\nimport { memo, useMemo, useState } from 'react';\n\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport Homework from './homework/homework';\nimport Puzzles from './puzzles/puzzles';\nimport { SideBarContainer } from './sidebar-styled';\nimport TileBar from './tiles/tile';\n\ninterface ISidebar {\n grade?: string;\n hwRequests?: IHomeWorkHelpRequestModelWithStudentName[];\n}\n\nconst Sidebar: FC<ISidebar> = ({ grade, hwRequests }) => {\n const [activeSidebar, setActiveSidebar] = useState<TActiveSidebar | undefined>();\n\n const width = useMemo(() => {\n if (activeSidebar === 'tile') {\n return '300px';\n }\n\n if (activeSidebar === 'homework') {\n return '248px';\n }\n\n if (activeSidebar === 'puzzle') {\n return '650px';\n }\n\n return 'auto';\n }, [activeSidebar]);\n\n return (\n <SideBarContainer $activeSidebar={activeSidebar} $width={width}>\n <FlexView $flexDirection=\"row\">\n <TileBar activeSidebar={activeSidebar} setActiveSidebar={setActiveSidebar} />\n <Separator width={8} />\n <Puzzles grade={grade} activeSidebar={activeSidebar} setActiveSidebar={setActiveSidebar} />\n <Separator width={8} />\n\n {hwRequests && (\n <Homework\n activeSidebar={activeSidebar}\n setActiveSidebar={setActiveSidebar}\n hwRequests={hwRequests}\n />\n )}\n </FlexView>\n </SideBarContainer>\n );\n};\n\nexport default memo(Sidebar);\n"],"names":["Sidebar","grade","hwRequests","activeSidebar","setActiveSidebar","useState","width","useMemo","jsx","SideBarContainer","jsxs","FlexView","TileBar","Separator","Puzzles","Homework","sidebar","memo"],"mappings":";;;;;;;;AAkBA,MAAMA,IAAwB,CAAC,EAAE,OAAAC,GAAO,YAAAC,QAAiB;AACvD,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAqC,GAEzEC,IAAQC,EAAQ,MAChBJ,MAAkB,SACb,UAGLA,MAAkB,aACb,UAGLA,MAAkB,WACb,UAGF,QACN,CAACA,CAAa,CAAC;AAGhB,SAAA,gBAAAK,EAACC,KAAiB,gBAAgBN,GAAe,QAAQG,GACvD,UAAA,gBAAAI,EAACC,GAAS,EAAA,gBAAe,OACvB,UAAA;AAAA,IAAC,gBAAAH,EAAAI,GAAA,EAAQ,eAAAT,GAA8B,kBAAAC,EAAoC,CAAA;AAAA,IAC3E,gBAAAI,EAACK,GAAU,EAAA,OAAO,EAAG,CAAA;AAAA,IACpB,gBAAAL,EAAAM,GAAA,EAAQ,OAAAb,GAAc,eAAAE,GAA8B,kBAAAC,EAAoC,CAAA;AAAA,IACzF,gBAAAI,EAACK,GAAU,EAAA,OAAO,EAAG,CAAA;AAAA,IAEpBX,KACC,gBAAAM;AAAA,MAACO;AAAA,MAAA;AAAA,QACC,eAAAZ;AAAA,QACA,kBAAAC;AAAA,QACA,YAAAF;AAAA,MAAA;AAAA,IACF;AAAA,EAAA,EAEJ,CAAA,EACF,CAAA;AAEJ,GAEec,IAAAC,EAAKjB,CAAO;"}
|