@cuemath/leap 3.0.10-aa11 → 3.0.10-aa13
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 +58 -56
- package/dist/features/cue-canvas/cue-canvas.js.map +1 -1
- package/dist/features/cue-canvas/hooks/use-canvas-sync-broker.js +43 -43
- package/dist/features/cue-canvas/hooks/use-canvas-sync-broker.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/package.json +1 -1
@@ -1,81 +1,83 @@
|
|
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 a } 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:
|
12
|
-
width:
|
13
|
-
height:
|
14
|
-
canRender:
|
11
|
+
canvasId: i,
|
12
|
+
width: f,
|
13
|
+
height: o,
|
14
|
+
canRender: m,
|
15
15
|
onUpdateHeight: E,
|
16
16
|
initialData: s,
|
17
17
|
onPublish: p,
|
18
|
-
onSubscribe:
|
19
|
-
userId:
|
20
|
-
appended:
|
21
|
-
canScribble:
|
22
|
-
userType:
|
23
|
-
renderAs:
|
18
|
+
onSubscribe: l,
|
19
|
+
userId: $,
|
20
|
+
appended: g,
|
21
|
+
canScribble: n,
|
22
|
+
userType: c,
|
23
|
+
renderAs: e = "canvas"
|
24
24
|
}) => {
|
25
|
-
const
|
26
|
-
(
|
27
|
-
|
25
|
+
const u = x(null), { setActiveInstance: C, setActiveTool: w } = z(), H = F({ userId: $, renderAs: e, userType: c }), t = x(null), R = k(
|
26
|
+
(r) => {
|
27
|
+
w(r);
|
28
28
|
},
|
29
|
-
[
|
29
|
+
[w]
|
30
30
|
);
|
31
|
-
return
|
32
|
-
canvasElementRef:
|
31
|
+
return B({
|
32
|
+
canvasElementRef: u,
|
33
33
|
cueCanvasRef: t,
|
34
|
-
canScribble:
|
35
|
-
}),
|
36
|
-
|
37
|
-
}, [
|
34
|
+
canScribble: n
|
35
|
+
}), a(() => {
|
36
|
+
n && t.current && (t.current.resetViewPort(), C(t.current));
|
37
|
+
}, [n, C]), a(() => {
|
38
38
|
s && t.current && t.current.update(s);
|
39
|
-
}, [s]),
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
39
|
+
}, [s]), a(() => {
|
40
|
+
var r;
|
41
|
+
o && t.current && ((r = u.current) == null || r.focus(), t.current.resetViewPort());
|
42
|
+
}, [o, f]), a(() => {
|
43
|
+
if (m && g && !t.current) {
|
44
|
+
const r = P(f, o, e, c), U = W(e, c), v = new A({
|
44
45
|
onPublish: p,
|
45
|
-
onSubscribe:
|
46
|
-
onUpdateActiveTool:
|
46
|
+
onSubscribe: l,
|
47
|
+
onUpdateActiveTool: R,
|
47
48
|
onUpdateHeight: E,
|
48
|
-
uploadImageToS3:
|
49
|
-
height:
|
50
|
-
userId:
|
51
|
-
canvasId:
|
52
|
-
userType:
|
53
|
-
renderAs:
|
49
|
+
uploadImageToS3: H,
|
50
|
+
height: o,
|
51
|
+
userId: $,
|
52
|
+
canvasId: i,
|
53
|
+
userType: c,
|
54
|
+
renderAs: e
|
54
55
|
});
|
55
56
|
(async () => {
|
56
57
|
await v.create({
|
57
|
-
canvasElementRef:
|
58
|
-
canvasConfig:
|
59
|
-
canvasSetting:
|
58
|
+
canvasElementRef: u,
|
59
|
+
canvasConfig: r,
|
60
|
+
canvasSetting: U,
|
60
61
|
initialData: s
|
61
|
-
}), t.current = v,
|
62
|
+
}), t.current = v, n && C(v);
|
62
63
|
})();
|
63
64
|
}
|
64
|
-
}, [p,
|
65
|
+
}, [p, l, C, m, g]), a(() => () => {
|
65
66
|
t.current && (t.current.destroy(), t.current = null);
|
66
|
-
}, []), /* @__PURE__ */
|
67
|
-
|
67
|
+
}, []), /* @__PURE__ */ V(
|
68
|
+
q,
|
68
69
|
{
|
69
|
-
|
70
|
-
|
71
|
-
$
|
72
|
-
$
|
73
|
-
$
|
74
|
-
$
|
70
|
+
id: e === "whiteboard" ? "canvasContainer" : i,
|
71
|
+
ref: u,
|
72
|
+
$width: f,
|
73
|
+
$height: o,
|
74
|
+
$canScribble: n,
|
75
|
+
$canRender: m,
|
76
|
+
$renderAs: e
|
75
77
|
}
|
76
78
|
);
|
77
79
|
}
|
78
|
-
), X =
|
80
|
+
), X = G;
|
79
81
|
export {
|
80
82
|
X as default
|
81
83
|
};
|
@@ -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\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 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
|
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 canvasElementRef.current?.focus();\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\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","_a","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,aACzBM,IAAAb,EAAiB,YAAjB,QAAAa,EAA0B,SAC1BN,EAAa,QAAQ;IACvB,GACC,CAAClB,GAAQD,CAAK,CAAC,GAElBwB,EAAU,MAAM;AACd,UAAItB,KAAaM,KAAY,CAACW,EAAa,SAAS;AAClD,cAAMO,IAAeC,EAAgB3B,GAAOC,GAAQU,GAAUD,CAAQ,GAChEkB,IAAgBC,EAAkBlB,GAAUD,CAAQ,GAEpDoB,IAAgB,IAAIC,EAAc;AAAA,UACtC,WAAA1B;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,gBAAMmB,EAAc,OAAO;AAAA,YACzB,kBAAAlB;AAAA,YACA,cAAAc;AAAA,YACA,eAAAE;AAAA,YACA,aAAAxB;AAAA,UAAA,CACD,GACDe,EAAa,UAAUW,GAEnBrB,KACFK,EAAmBgB,CAAa;AAAA,QAClC;MAIJ;AAAA,IAAA,GAEC,CAACzB,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,gBAAAa;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,IAAItB,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,GAEAuB,IAAerC;"}
|
@@ -1,74 +1,74 @@
|
|
1
|
-
import { useMessageBrokerChannel as
|
2
|
-
import { useState as
|
3
|
-
const
|
1
|
+
import { useMessageBrokerChannel as x } from "@cuemath/cue-message-broker";
|
2
|
+
import { useState as w, useRef as E, useMemo as F, useCallback as h } from "react";
|
3
|
+
const d = (c) => ({
|
4
4
|
userId: c.userId,
|
5
5
|
data: c.data,
|
6
6
|
height: c.height,
|
7
7
|
responseId: c.responseId
|
8
|
-
}),
|
9
|
-
const [
|
8
|
+
}), H = (c, f, g, l = "canvas") => {
|
9
|
+
const [m, b] = w(
|
10
10
|
() => {
|
11
|
-
var o,
|
12
|
-
const
|
13
|
-
if (!g) return
|
11
|
+
var o, n;
|
12
|
+
const r = {};
|
13
|
+
if (!g) return r;
|
14
14
|
for (const { message: a } of g) {
|
15
15
|
const e = (o = a.payload) == null ? void 0 : o.eventPayload, s = e == null ? void 0 : e.responseId;
|
16
16
|
if (!(e != null && e.responseId)) continue;
|
17
|
-
const t =
|
18
|
-
s &&
|
17
|
+
const t = d(e);
|
18
|
+
s && r[s] ? (n = r[s]) == null || n.push(t) : r[s] = [t];
|
19
19
|
}
|
20
|
-
return
|
20
|
+
return r;
|
21
21
|
}
|
22
|
-
), u =
|
22
|
+
), u = E({}), S = F(
|
23
23
|
() => ({
|
24
24
|
channelId: c,
|
25
|
-
ttl: 0,
|
25
|
+
ttl: l === "canvas" ? 0 : 24,
|
26
26
|
logger: f
|
27
27
|
}),
|
28
|
-
[c, f]
|
29
|
-
),
|
30
|
-
u.current = { ...u.current, [
|
31
|
-
}, []),
|
32
|
-
(
|
33
|
-
const
|
34
|
-
|
35
|
-
var
|
36
|
-
const { payload: e } = a.message, { eventPayload: s } = e, t = s == null ? void 0 : s.responseId,
|
37
|
-
if (!o &&
|
38
|
-
|
39
|
-
data:
|
40
|
-
height:
|
41
|
-
userId:
|
28
|
+
[c, f, l]
|
29
|
+
), C = h((r, o) => {
|
30
|
+
u.current = { ...u.current, [r]: o };
|
31
|
+
}, []), D = h(
|
32
|
+
(r, o) => {
|
33
|
+
const n = {};
|
34
|
+
r.forEach((a) => {
|
35
|
+
var k;
|
36
|
+
const { payload: e } = a.message, { eventPayload: s } = e, t = s == null ? void 0 : s.responseId, B = s == null ? void 0 : s.data, j = s == null ? void 0 : s.userId, q = s == null ? void 0 : s.height, p = u.current[t];
|
37
|
+
if (!o && p)
|
38
|
+
p({
|
39
|
+
data: B,
|
40
|
+
height: q,
|
41
|
+
userId: j,
|
42
42
|
responseId: t
|
43
43
|
});
|
44
44
|
else {
|
45
|
-
const
|
46
|
-
t &&
|
45
|
+
const I = d(s);
|
46
|
+
t && n[t] ? (k = n[t]) == null || k.push(I) : n[t] = [I];
|
47
47
|
}
|
48
|
-
}), Object.keys(
|
48
|
+
}), Object.keys(n).length > 0 && b((a) => {
|
49
49
|
const e = { ...a };
|
50
|
-
return Object.keys(
|
50
|
+
return Object.keys(n).forEach((s) => {
|
51
51
|
var t;
|
52
|
-
s && e[s] ? (t = e[s]) == null || t.push(...
|
52
|
+
s && e[s] ? (t = e[s]) == null || t.push(...n[s] ?? []) : e[s] = n[s] ?? [];
|
53
53
|
}), e;
|
54
54
|
});
|
55
55
|
},
|
56
56
|
[]
|
57
|
-
), { publish:
|
58
|
-
channelOptions:
|
59
|
-
consumerFn:
|
60
|
-
}),
|
57
|
+
), { publish: M, channelStatus: O, channel: i } = x({
|
58
|
+
channelOptions: S,
|
59
|
+
consumerFn: D
|
60
|
+
}), R = h(() => {
|
61
61
|
i && i.destroyChannel();
|
62
62
|
}, [i]);
|
63
63
|
return {
|
64
|
-
publishStrokes:
|
65
|
-
channelStatus:
|
66
|
-
closeChannel:
|
67
|
-
initialStrokesData:
|
68
|
-
registerCallback:
|
64
|
+
publishStrokes: M,
|
65
|
+
channelStatus: O,
|
66
|
+
closeChannel: R,
|
67
|
+
initialStrokesData: m,
|
68
|
+
registerCallback: C
|
69
69
|
};
|
70
|
-
},
|
70
|
+
}, z = H;
|
71
71
|
export {
|
72
|
-
|
72
|
+
z as default
|
73
73
|
};
|
74
74
|
//# 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 { IActionData, TCueCanvasChangeDataObject } 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 };\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});\n\nconst useCanvasSyncBroker = (\n channelId: string,\n logEvent: (type: string, payload?: Record<string, unknown>) => void,\n initialCanvasData?: Array<IChannelMessage>,\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: 0,\n logger: logEvent,\n }),\n [channelId, logEvent],\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 });\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","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":";;AAeA,MAAMA,IAAoB,CAACC,OAAoD;AAAA,EAC7E,QAAQA,EAAQ;AAAA,EAChB,MAAMA,EAAQ;AAAA,EACd,QAAQA,EAAQ;AAAA,EAChB,YAAYA,EAAQ;AACtB,IAEMC,IAAsB,CAC1BC,GACAC,GACAC,
|
1
|
+
{"version":3,"file":"use-canvas-sync-broker.js","sources":["../../../../src/features/cue-canvas/hooks/use-canvas-sync-broker.ts"],"sourcesContent":["import type { IActionData, TCueCanvasChangeDataObject, TRenderAs } 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 };\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});\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 });\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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"}
|
package/dist/index.d.ts
CHANGED
@@ -5353,7 +5353,7 @@ export declare const UpIcon: React.FC<React.SVGProps<SVGSVGElement>>;
|
|
5353
5353
|
|
5354
5354
|
export declare const useAutoPlayPermission: () => IAutoPlayPermissionContextType;
|
5355
5355
|
|
5356
|
-
export declare const useCanvasSyncBroker: (channelId: string, logEvent: (type: string, payload?: Record<string, unknown>) => void, initialCanvasData?: Array<IChannelMessage
|
5356
|
+
export declare const useCanvasSyncBroker: (channelId: string, logEvent: (type: string, payload?: Record<string, unknown>) => void, initialCanvasData?: Array<IChannelMessage>, type?: TRenderAs_2) => {
|
5357
5357
|
publishStrokes: ((message: unknown) => boolean) | undefined;
|
5358
5358
|
channelStatus: ChannelStatus | undefined;
|
5359
5359
|
closeChannel: () => void;
|