@cuemath/leap 3.0.10-aa1 → 3.0.10-aa11

package/dist/features/cue-canvas/bottombar/homework-controls.js

@@ -1,58 +1,73 @@
-import { jsxs as p, jsx as a } from "react/jsx-runtime";
-import { memo as u, useCallback as s } from "react";
-import h from "../../../assets/line-icons/icons/check.js";
-import C from "../../../assets/line-icons/icons/share.js";
-import m from "../../ui/buttons/button/button.js";
-import w from "../../ui/layout/flex-view.js";
-import b from "../../ui/separator/separator.js";
-import { dataURIToBlob as k } from "../cue-canvas-helpers.js";
-import { useCueCanvasActions as g } from "../hooks/use-cue-canvas-actions.js";
-const I = (c) => {
-  const { width: l, onMarkAsResolved: r, onSendImageToChat: t } = c, { homeworkId: o, activeInstance: e } = g(), i = s(async () => {
-    if (!e) return;
-    const n = await (e == null ? void 0 : e.getCanvasAsImage());
-    return n ? k(n) : void 0;
-  }, [e]), d = s(async () => {
-    const n = await i();
-    !o || !t || !n || t == null || t(o, n);
-  }, [i, o, t]), f = s(() => {
-    !o || !r || r == null || r(o);
-  }, [o, r]);
-  return o ? /* @__PURE__ */ p(
-    w,
+import { jsx as n, jsxs as g } from "react/jsx-runtime";
+import { memo as b, useState as w, useCallback as i } from "react";
+import k from "../../../assets/line-icons/icons/check.js";
+import y from "../../../assets/line-icons/icons/share.js";
+import f from "../../ui/buttons/button/button.js";
+import p from "../../ui/layout/flex-view.js";
+import I from "../../ui/separator/separator.js";
+import B from "../../ui/text/text.js";
+import { dataURIToBlob as x } from "../cue-canvas-helpers.js";
+import { useCueCanvasActions as A } from "../hooks/use-cue-canvas-actions.js";
+const S = (h) => {
+  const { width: c, onSendImageToChat: t, onMarkAsResolved: s } = h, { homeworkId: o, activeInstance: r, setHomeworkId: l } = A(), [m, u] = w(!1), a = i(() => {
+    r == null || r.clearCanvas(), l(void 0), u(!1);
+  }, [r, l]), d = i(async () => {
+    if (!r) return;
+    const e = await (r == null ? void 0 : r.getCanvasAsImage());
+    return e ? [x(e)] : void 0;
+  }, [r]), $ = i(async () => {
+    const e = await d();
+    !o || !t || !e || t == null || t(o, e, a);
+  }, [d, o, t, a]), C = i(() => {
+    o && (u(!0), s == null || s(o, a));
+  }, [o, s, a]);
+  return o ? m ? /* @__PURE__ */ n(
+    p,
+    {
+      $gapX: 1,
+      $gutterX: 0.5,
+      $alignItems: "center",
+      $justifyContent: "center",
+      $width: c,
+      $background: "YELLOW_1",
+      children: /* @__PURE__ */ n(B, { $renderAs: "body3", $color: "BLACK", children: "Resolving...." })
+    }
+  ) : /* @__PURE__ */ g(
+    p,
     {
       $flexDirection: "row",
       $gapX: 1,
       $gutterX: 0.5,
       $alignItems: "center",
       $justifyContent: "center",
-      $width: l,
+      $width: c,
       $background: "YELLOW_1",
       children: [
-        /* @__PURE__ */ a(
-          m,
+        /* @__PURE__ */ n(
+          f,
           {
             label: "Mark as reolved",
-            onClick: f,
+            onClick: C,
             renderAs: "primary",
-            Icon: h
+            Icon: k,
+            busy: m
           }
         ),
-        /* @__PURE__ */ a(b, { width: 16 }),
-        /* @__PURE__ */ a(
-          m,
+        /* @__PURE__ */ n(I, { width: 16 }),
+        /* @__PURE__ */ n(
+          f,
           {
             label: "Send CueBoard image to chat",
-            onClick: d,
+            onClick: $,
             renderAs: "primary",
-            Icon: C
+            Icon: y
           }
         )
       ]
     }
   ) : null;
-}, D = u(I);
+}, _ = b(S);
 export {
-  D as default
+  _ as default
 };
 //# sourceMappingURL=homework-controls.js.map

package/dist/features/cue-canvas/bottombar/homework-controls.js.map

@@ -1 +1 @@
-{"version":3,"file":"homework-controls.js","sources":["../../../../src/features/cue-canvas/bottombar/homework-controls.tsx"],"sourcesContent":["import type { IHomeWorkControllerProps } from './bottombar-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback } from 'react';\n\nimport CheckIcon from '../../../assets/line-icons/icons/check';\nimport ShareIcon from '../../../assets/line-icons/icons/share';\nimport Button from '../../ui/buttons/button/button';\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport { dataURIToBlob } from '../cue-canvas-helpers';\nimport { useCueCanvasActions } from '../hooks/use-cue-canvas-actions';\n\nconst HomeworkController: FC<IHomeWorkControllerProps> = props => {\n  const { width, onMarkAsResolved, onSendImageToChat } = props;\n  const { homeworkId, activeInstance } = useCueCanvasActions();\n\n  const getBoardSnapshot = useCallback(async () => {\n    if (!activeInstance) return;\n\n    const snapshot = await activeInstance?.getCanvasAsImage();\n\n    if (!snapshot) {\n      return;\n    }\n\n    const blobdata = dataURIToBlob(snapshot);\n\n    return blobdata;\n  }, [activeInstance]);\n\n  const handleSendImageToChat = useCallback(async () => {\n    const snapshot = await getBoardSnapshot();\n\n    if (!homeworkId || !onSendImageToChat || !snapshot) return;\n\n    onSendImageToChat?.(homeworkId, snapshot);\n  }, [getBoardSnapshot, homeworkId, onSendImageToChat]);\n\n  const handleMarkAsResolved = useCallback(() => {\n    if (!homeworkId || !onMarkAsResolved) return;\n    onMarkAsResolved?.(homeworkId);\n  }, [homeworkId, onMarkAsResolved]);\n\n  if (!homeworkId) return null;\n\n  return (\n    <FlexView\n      $flexDirection=\"row\"\n      $gapX={1}\n      $gutterX={0.5}\n      $alignItems=\"center\"\n      $justifyContent=\"center\"\n      $width={width}\n      $background=\"YELLOW_1\"\n    >\n      <Button\n        label=\"Mark as reolved\"\n        onClick={handleMarkAsResolved}\n        renderAs={'primary'}\n        Icon={CheckIcon}\n      />\n      <Separator width={16} />\n      <Button\n        label=\"Send CueBoard image to chat\"\n        onClick={handleSendImageToChat}\n        renderAs={'primary'}\n        Icon={ShareIcon}\n      />\n    </FlexView>\n  );\n};\n\nexport default memo(HomeworkController);\n"],"names":["HomeworkController","props","width","onMarkAsResolved","onSendImageToChat","homeworkId","activeInstance","useCueCanvasActions","getBoardSnapshot","useCallback","snapshot","dataURIToBlob","handleSendImageToChat","handleMarkAsResolved","jsxs","FlexView","jsx","Button","CheckIcon","Separator","ShareIcon","homeworkControls","memo"],"mappings":";;;;;;;;;AAaA,MAAMA,IAAmD,CAASC,MAAA;AAChE,QAAM,EAAE,OAAAC,GAAO,kBAAAC,GAAkB,mBAAAC,EAAA,IAAsBH,GACjD,EAAE,YAAAI,GAAY,gBAAAC,EAAe,IAAIC,EAAoB,GAErDC,IAAmBC,EAAY,YAAY;AAC/C,QAAI,CAACH,EAAgB;AAEf,UAAAI,IAAW,OAAMJ,KAAA,gBAAAA,EAAgB;AAEvC,WAAKI,IAIYC,EAAcD,CAAQ,IAHrC;AAAA,EAKK,GACN,CAACJ,CAAc,CAAC,GAEbM,IAAwBH,EAAY,YAAY;AAC9C,UAAAC,IAAW,MAAMF;AAEvB,IAAI,CAACH,KAAc,CAACD,KAAqB,CAACM,KAE1CN,KAAA,QAAAA,EAAoBC,GAAYK;AAAA,EAC/B,GAAA,CAACF,GAAkBH,GAAYD,CAAiB,CAAC,GAE9CS,IAAuBJ,EAAY,MAAM;AACzC,IAAA,CAACJ,KAAc,CAACF,KACpBA,KAAA,QAAAA,EAAmBE;AAAA,EAAU,GAC5B,CAACA,GAAYF,CAAgB,CAAC;AAE7B,SAACE,IAGH,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,gBAAe;AAAA,MACf,OAAO;AAAA,MACP,UAAU;AAAA,MACV,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,QAAQb;AAAA,MACR,aAAY;AAAA,MAEZ,UAAA;AAAA,QAAA,gBAAAc;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,SAASJ;AAAA,YACT,UAAU;AAAA,YACV,MAAMK;AAAA,UAAA;AAAA,QACR;AAAA,QACA,gBAAAF,EAACG,GAAU,EAAA,OAAO,GAAI,CAAA;AAAA,QACtB,gBAAAH;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,SAASL;AAAA,YACT,UAAU;AAAA,YACV,MAAMQ;AAAA,UAAA;AAAA,QACR;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,IAxBoB;AA2B1B,GAEeC,IAAAC,EAAKtB,CAAkB;"}
+{"version":3,"file":"homework-controls.js","sources":["../../../../src/features/cue-canvas/bottombar/homework-controls.tsx"],"sourcesContent":["import type { IHomeWorkControllerProps } from './bottombar-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useState } from 'react';\n\nimport CheckIcon from '../../../assets/line-icons/icons/check';\nimport ShareIcon from '../../../assets/line-icons/icons/share';\nimport Button from '../../ui/buttons/button/button';\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport Text from '../../ui/text/text';\nimport { dataURIToBlob } from '../cue-canvas-helpers';\nimport { useCueCanvasActions } from '../hooks/use-cue-canvas-actions';\n\nconst HomeworkController: FC<IHomeWorkControllerProps> = props => {\n  const { width, onSendImageToChat, onMarkAsResolved } = props;\n  const { homeworkId, activeInstance, setHomeworkId } = useCueCanvasActions();\n  const [isBusy, setIsBusy] = useState(false);\n\n  const onSuccess = useCallback(() => {\n    activeInstance?.clearCanvas();\n    setHomeworkId(undefined);\n    setIsBusy(false);\n  }, [activeInstance, setHomeworkId]);\n\n  const getBoardSnapshot = useCallback(async () => {\n    if (!activeInstance) return;\n\n    const snapshot = await activeInstance?.getCanvasAsImage();\n\n    if (!snapshot) {\n      return;\n    }\n\n    const blobdata = dataURIToBlob(snapshot);\n\n    return [blobdata];\n  }, [activeInstance]);\n\n  const handleSendImageToChat = useCallback(async () => {\n    const snapshot = await getBoardSnapshot();\n\n    if (!homeworkId || !onSendImageToChat || !snapshot) return;\n\n    onSendImageToChat?.(homeworkId, snapshot, onSuccess);\n  }, [getBoardSnapshot, homeworkId, onSendImageToChat, onSuccess]);\n\n  const handleMarkAsResolved = useCallback(() => {\n    if (!homeworkId) return;\n    setIsBusy(true);\n    onMarkAsResolved?.(homeworkId, onSuccess);\n  }, [homeworkId, onMarkAsResolved, onSuccess]);\n\n  if (!homeworkId) return null;\n\n  if (isBusy) {\n    return (\n      <FlexView\n        $gapX={1}\n        $gutterX={0.5}\n        $alignItems=\"center\"\n        $justifyContent=\"center\"\n        $width={width}\n        $background=\"YELLOW_1\"\n      >\n        <Text $renderAs=\"body3\" $color=\"BLACK\">\n          Resolving....\n        </Text>\n      </FlexView>\n    );\n  }\n\n  return (\n    <FlexView\n      $flexDirection=\"row\"\n      $gapX={1}\n      $gutterX={0.5}\n      $alignItems=\"center\"\n      $justifyContent=\"center\"\n      $width={width}\n      $background=\"YELLOW_1\"\n    >\n      <Button\n        label=\"Mark as reolved\"\n        onClick={handleMarkAsResolved}\n        renderAs={'primary'}\n        Icon={CheckIcon}\n        busy={isBusy}\n      />\n      <Separator width={16} />\n      <Button\n        label=\"Send CueBoard image to chat\"\n        onClick={handleSendImageToChat}\n        renderAs={'primary'}\n        Icon={ShareIcon}\n      />\n    </FlexView>\n  );\n};\n\nexport default memo(HomeworkController);\n"],"names":["HomeworkController","props","width","onSendImageToChat","onMarkAsResolved","homeworkId","activeInstance","setHomeworkId","useCueCanvasActions","isBusy","setIsBusy","useState","onSuccess","useCallback","getBoardSnapshot","snapshot","dataURIToBlob","handleSendImageToChat","handleMarkAsResolved","jsx","FlexView","Text","jsxs","Button","CheckIcon","Separator","ShareIcon","homeworkControls","memo"],"mappings":";;;;;;;;;;AAcA,MAAMA,IAAmD,CAASC,MAAA;AAChE,QAAM,EAAE,OAAAC,GAAO,mBAAAC,GAAmB,kBAAAC,EAAA,IAAqBH,GACjD,EAAE,YAAAI,GAAY,gBAAAC,GAAgB,eAAAC,MAAkBC,EAAoB,GACpE,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK,GAEpCC,IAAYC,EAAY,MAAM;AAClC,IAAAP,KAAA,QAAAA,EAAgB,eAChBC,EAAc,MAAS,GACvBG,EAAU,EAAK;AAAA,EAAA,GACd,CAACJ,GAAgBC,CAAa,CAAC,GAE5BO,IAAmBD,EAAY,YAAY;AAC/C,QAAI,CAACP,EAAgB;AAEf,UAAAS,IAAW,OAAMT,KAAA,gBAAAA,EAAgB;AAEvC,WAAKS,IAME,CAFUC,EAAcD,CAAQ,CAEvB,IALd;AAAA,EAKc,GACf,CAACT,CAAc,CAAC,GAEbW,IAAwBJ,EAAY,YAAY;AAC9C,UAAAE,IAAW,MAAMD;AAEvB,IAAI,CAACT,KAAc,CAACF,KAAqB,CAACY,KAEtBZ,KAAA,QAAAA,EAAAE,GAAYU,GAAUH;AAAA,KACzC,CAACE,GAAkBT,GAAYF,GAAmBS,CAAS,CAAC,GAEzDM,IAAuBL,EAAY,MAAM;AAC7C,IAAKR,MACLK,EAAU,EAAI,GACdN,KAAA,QAAAA,EAAmBC,GAAYO;AAAA,EAC9B,GAAA,CAACP,GAAYD,GAAkBQ,CAAS,CAAC;AAExC,SAACP,IAEDI,IAEA,gBAAAU;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,MACP,UAAU;AAAA,MACV,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,QAAQlB;AAAA,MACR,aAAY;AAAA,MAEZ,4BAACmB,GAAK,EAAA,WAAU,SAAQ,QAAO,SAAQ,UAEvC,iBAAA;AAAA,IAAA;AAAA,EAAA,IAMJ,gBAAAC;AAAA,IAACF;AAAA,IAAA;AAAA,MACC,gBAAe;AAAA,MACf,OAAO;AAAA,MACP,UAAU;AAAA,MACV,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,QAAQlB;AAAA,MACR,aAAY;AAAA,MAEZ,UAAA;AAAA,QAAA,gBAAAiB;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,SAASL;AAAA,YACT,UAAU;AAAA,YACV,MAAMM;AAAA,YACN,MAAMf;AAAA,UAAA;AAAA,QACR;AAAA,QACA,gBAAAU,EAACM,GAAU,EAAA,OAAO,GAAI,CAAA;AAAA,QACtB,gBAAAN;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,SAASN;AAAA,YACT,UAAU;AAAA,YACV,MAAMS;AAAA,UAAA;AAAA,QACR;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,IA1CoB;AA6C1B,GAEeC,IAAAC,EAAK5B,CAAkB;"}

package/dist/features/cue-canvas/cue-canvas-core.js

@@ -8,9 +8,9 @@ class b {
     onPublish: t,
     onSubscribe: e,
     onUpdateActiveTool: a,
-    onUpdateHeight: n,
-    uploadImageToS3: i,
-    height: o,
+    onUpdateHeight: i,
+    uploadImageToS3: o,
+    height: n,
     userId: h,
     canvasId: l,
     userType: c,
@@ -81,9 +81,6 @@ class b {
       const e = document.createElement("a");
       e.href = t, e.download = `canvas-drawing-${Date.now()}.png`, e.click();
     });
-    s(this, "uploadFileToCanvas", async (t) => new Promise((e, a) => {
-      this.uploadImageToS3 ? e(this.uploadImageToS3(t)) : a(new Error("Upload function not provided"));
-    }));
     s(this, "onViewPortChange", (t) => {
       if (!this.publish) return;
       const e = t;
@@ -97,21 +94,22 @@ class b {
       const e = this.polycanvas.getViewport(), a = {
         name: "image",
         href: t,
-        x: e.x + 88,
-        y: e.y + 88
-      }, n = this.polycanvas.add({
+        x: e.x + 24,
+        y: e.y + 24,
+        width: 500
+      }, i = this.polycanvas.add({
         ...a
       });
       this.publishToChannel({
-        [n]: [void 0, { ...a, status: "locked" }]
+        [i]: [void 0, { ...a, status: "locked" }]
       });
     });
     s(this, "onSelectImage", async (t) => {
-      var i;
-      const e = t.target, a = (i = e.files) == null ? void 0 : i[0];
+      var o;
+      const e = t.target, a = (o = e.files) == null ? void 0 : o[0];
       if (!a || !this.polycanvas || !this.uploadImageToS3) return;
-      const n = await this.uploadImageToS3(a);
-      this.addImageToCanvas(n), e.value = "";
+      const i = await this.uploadImageToS3(a);
+      console.log("===imageUrl", i), i !== "error" && (this.addImageToCanvas(i), e.value = "");
     });
     s(this, "updateCanvasConfig", (t, e, a) => {
       this.polycanvas && (t > this.height && this.updateHeight(t), e && this.polycanvas.setViewport(e.x, e.y, e.zoom), a && this.polycanvas.setOptions({
@@ -120,9 +118,9 @@ class b {
     });
     s(this, "updateCanvas", ({ data: t, userId: e }) => {
       const a = this.userType === "TEACHER" || e === this.userId;
-      Object.entries(t).forEach(([n, i]) => {
-        var o, h, l;
-        !i[0] && i[1] ? (o = this.polycanvas) == null || o.add({ ...i[1], cannotEdit: !a }, n) : i[0] && !i[1] ? (h = this.polycanvas) == null || h.delete(n) : i[0] && i[1] && ((l = this.polycanvas) == null || l.update(n, { ...i[1] }));
+      Object.entries(t).forEach(([i, o]) => {
+        var n, h, l;
+        !o[0] && o[1] ? (n = this.polycanvas) == null || n.add({ ...o[1], cannotEdit: !a }, i) : o[0] && !o[1] ? (h = this.polycanvas) == null || h.delete(i) : o[0] && o[1] && ((l = this.polycanvas) == null || l.update(i, { ...o[1] }));
       });
     });
     s(this, "toggleTiles", (t) => {
@@ -138,26 +136,26 @@ class b {
       }), this.publishToChannel({}, t));
     });
     s(this, "lockSelectedTiles", () => {
-      var a, n;
-      const { tiles: t } = ((a = this.polycanvas) == null ? void 0 : a.serialize()) || {}, e = ((n = this.polycanvas) == null ? void 0 : n.getSelection()) || [];
+      var a, i;
+      const { tiles: t } = ((a = this.polycanvas) == null ? void 0 : a.serialize()) || {}, e = ((i = this.polycanvas) == null ? void 0 : i.getSelection()) || [];
       if (e.length > 0 && t) {
-        const i = {};
-        e.forEach((o) => {
+        const o = {};
+        e.forEach((n) => {
           var l, c, p;
-          if (!((l = t[o]) != null && l.name)) return;
-          const h = { ...t[o], status: "locked" };
-          (c = this.polycanvas) == null || c.update(o, h), (p = t[o]) != null && p.name && (i[o] = [t[o], h]);
-        }), this.publishToChannel(i);
+          if (!((l = t[n]) != null && l.name)) return;
+          const h = { ...t[n], status: "locked" };
+          (c = this.polycanvas) == null || c.update(n, h), (p = t[n]) != null && p.name && (o[n] = [t[n], h]);
+        }), this.publishToChannel(o);
       }
     });
     s(this, "unlockAllTiles", () => {
       if (!this.polycanvas) return;
       const { tiles: t } = this.polycanvas.serialize(), e = {};
-      t && Object.entries(t).length > 0 && (Object.entries(t).forEach(([a, n]) => {
-        var o;
-        if (n.status !== "locked") return;
-        const i = { ...n, status: void 0 };
-        (o = this.polycanvas) == null || o.update(a, i), e[a] = [n, i];
+      t && Object.entries(t).length > 0 && (Object.entries(t).forEach(([a, i]) => {
+        var n;
+        if (i.status !== "locked") return;
+        const o = { ...i, status: void 0 };
+        (n = this.polycanvas) == null || n.update(a, o), e[a] = [i, o];
       }), this.publishToChannel(e));
     });
     s(this, "replaceCanvas", (t) => {
@@ -165,10 +163,10 @@ class b {
       const { data: e, gridName: a } = t;
       this.polycanvas.clear(), a && this.polycanvas.setOptions({
         grid: a
-      }), Object.entries(e).forEach(([n, i]) => {
-        var o;
-        if (!i[0] && i[1]) {
-          (o = this.polycanvas) == null || o.add({ ...i[1] }, n);
+      }), Object.entries(e).forEach(([i, o]) => {
+        var n;
+        if (!o[0] && o[1]) {
+          (n = this.polycanvas) == null || n.add({ ...o[1] }, i);
           return;
         }
       }), this.publishToChannel(e, a);
@@ -228,8 +226,8 @@ class b {
      */
     s(this, "update", (t) => {
       if (Array.isArray(t)) {
-        const e = t.map((o) => o.height).filter(Boolean), a = Math.max(...e), n = t.map((o) => o.dimension).filter(Boolean)[t.length - 1], i = t.map((o) => o.gridName).filter(Boolean)[t.length - 1];
-        this.updateCanvasConfig(a, n, i), t.forEach((o) => this.updateCanvas(o));
+        const e = t.map((n) => n.height).filter(Boolean), a = Math.max(...e), i = t.map((n) => n.dimension).filter(Boolean)[t.length - 1], o = t.map((n) => n.gridName).filter(Boolean)[t.length - 1];
+        this.updateCanvasConfig(a, i, o), t.forEach((n) => this.updateCanvas(n));
       } else
         this.updateCanvasConfig(t.height, t.dimension, t == null ? void 0 : t.gridName), this.updateCanvas(t);
     });
@@ -243,9 +241,9 @@ class b {
     s(this, "destroy", () => {
       this.polycanvas && (this.polycanvas.off("change", this.onChange), this.polycanvas.destroy(), this.debouncedViewportChange.cancel(), this.renderAs === "whiteboard" && this.userType === "TEACHER" && this.polycanvas.off("viewport", this.debouncedViewportChange), this.polycanvas = void 0, this.fileInput && this.fileInput.parentNode && (this.fileInput.parentNode.removeChild(this.fileInput), this.fileInput = null));
     });
-    this.onUpdateHeight = n, this.onUpdateActiveTool = a, this.height = o, this.uploadImageToS3 = i, this.userId = h, this.canvasId = l, this.publish = t, this.userType = c, this.renderAs = p, this.debouncedViewportChange = v(this.onViewPortChange, 300), e == null || e(this.canvasId, this.update);
+    this.onUpdateHeight = i, this.onUpdateActiveTool = a, this.height = n, this.uploadImageToS3 = o, this.userId = h, this.canvasId = l, this.publish = t, this.userType = c, this.renderAs = p, this.debouncedViewportChange = v(this.onViewPortChange, 300), e == null || e(this.canvasId, this.update);
   }
-  async create({ canvasElementRef: t, canvasConfig: e, canvasSetting: a, initialData: n }) {
+  async create({ canvasElementRef: t, canvasConfig: e, canvasSetting: a, initialData: i }) {
     if (!t.current)
       throw new Error("PolyCanvas: Div Element Not found for canvas");
     this.polycanvas = await window.Polypad.create(t.current, {
@@ -253,8 +251,8 @@ class b {
         options: e
       },
       ...a,
-      imageUpload: this.renderAs === "whiteboard" && this.userType === "TEACHER" ? this.uploadFileToCanvas : void 0
-    }), this.renderAs === "whiteboard" && this.userType === "TEACHER" && (this.polycanvas.toggleSidebar(!1), g(t), this.polycanvas.on("viewport", this.debouncedViewportChange)), f(t), this.polycanvas.on("change", this.onChange), n && this.update(n);
+      imageUpload: this.renderAs === "whiteboard" && this.userType === "TEACHER" && this.uploadImageToS3 ? this.uploadImageToS3 : void 0
+    }), this.renderAs === "whiteboard" && this.userType === "TEACHER" && (this.polycanvas.toggleSidebar(!1), g(t), this.polycanvas.on("viewport", this.debouncedViewportChange)), f(t), this.polycanvas.on("change", this.onChange), i && this.update(i);
   }
 }
 export {

package/dist/features/cue-canvas/cue-canvas-core.js.map

@@ -1 +1 @@
-{"version":3,"file":"cue-canvas-core.js","sources":["../../../src/features/cue-canvas/cue-canvas-core.ts"],"sourcesContent":["import type { TUserTypes } from '../ui/types';\nimport type {\n  IActionData,\n  IViewport,\n  TCueCanvasChangeData,\n  TCueCanvasGridName,\n  TCueCanvasTool,\n  TPublish,\n  TRenderAs,\n  TCueCanvasChangeDataObject,\n  IReplaceCanvas,\n  ICueCanvasCoreProps,\n} from './types/cue-canvas';\nimport type { ICreateOptions } from './types/cue-canvas';\nimport type { IPolypad, IPolyPadInstance } from './types/polypad';\n\nimport debounce from 'lodash.debounce';\n\nimport {\n  checkTextOrEquationTool,\n  getReverseMap,\n  getToolAndSubtool,\n  removeMask,\n  removeTileButton,\n} from './cue-canvas-helpers';\n\ndeclare global {\n  interface Window {\n    Polypad: IPolypad;\n  }\n}\n\n/**\n * The CueCanvasCore class manages the canvas state and tool synchronization.\n * When text or equations are added, Polypad automatically switches to 'move' tool.\n * onUpdateActiveTool ensures the UI reflects this automatic tool change.\n */\n\nexport class CueCanvasCore {\n  private polycanvas: IPolyPadInstance | undefined;\n  private publish?: TPublish;\n  private height: number;\n  private onUpdateActiveTool: (tool: TCueCanvasTool) => void;\n  private onUpdateHeight?: (height: number) => void;\n  private userId: string;\n  private canvasId: string;\n  private userType: TUserTypes;\n  private renderAs: TRenderAs;\n  private fileInput: HTMLInputElement | null = null;\n  private debouncedViewportChange: ReturnType<typeof debounce>;\n  private uploadImageToS3?: (file: File) => string;\n\n  constructor({\n    onPublish,\n    onSubscribe,\n    onUpdateActiveTool,\n    onUpdateHeight,\n    uploadImageToS3,\n    height,\n    userId,\n    canvasId,\n    userType,\n    renderAs,\n  }: ICueCanvasCoreProps) {\n    this.onUpdateHeight = onUpdateHeight;\n    this.onUpdateActiveTool = onUpdateActiveTool;\n    this.height = height;\n    this.uploadImageToS3 = uploadImageToS3;\n    this.userId = userId;\n    this.canvasId = canvasId;\n    this.publish = onPublish;\n    this.userType = userType;\n    this.renderAs = renderAs;\n    this.debouncedViewportChange = debounce(this.onViewPortChange, 300);\n    onSubscribe?.(this.canvasId, this.update);\n  }\n\n  async create({ canvasElementRef, canvasConfig, canvasSetting, initialData }: ICreateOptions) {\n    if (!canvasElementRef.current) {\n      throw new Error('PolyCanvas: Div Element Not found for canvas');\n    }\n    this.polycanvas = await window.Polypad.create(canvasElementRef.current, {\n      initial: {\n        options: canvasConfig,\n      },\n      ...canvasSetting,\n      imageUpload:\n        this.renderAs === 'whiteboard' && this.userType === 'TEACHER'\n          ? this.uploadFileToCanvas\n          : undefined,\n    });\n\n    if (this.renderAs === 'whiteboard' && this.userType === 'TEACHER') {\n      this.polycanvas.toggleSidebar(false);\n\n      removeTileButton(canvasElementRef);\n      this.polycanvas.on('viewport', this.debouncedViewportChange);\n    }\n\n    removeMask(canvasElementRef);\n    this.polycanvas.on('change', this.onChange);\n    if (initialData) {\n      this.update(initialData);\n    }\n  }\n\n  private publishToChannel = (\n    payload: TCueCanvasChangeDataObject,\n    gridName?: TCueCanvasGridName,\n    dimension?: IViewport,\n  ) => {\n    if (!this.publish) return;\n\n    this.publish({\n      eventName: 'cue_canvas_changed',\n      eventPayload: {\n        data: payload,\n        height: this.height,\n        userId: this.userId,\n        responseId: this.canvasId,\n        gridName,\n        dimension,\n      },\n    });\n  };\n\n  private onChange = (e: unknown) => {\n    const data = e as TCueCanvasChangeData;\n    const payload = Object.fromEntries(data.entries());\n\n    if (checkTextOrEquationTool(payload)) {\n      this.onUpdateActiveTool('move');\n    }\n\n    this.publishToChannel(payload);\n  };\n\n  private undo = () => {\n    if (!this.polycanvas) {\n      return;\n    }\n\n    const data = this.polycanvas.undo() as TCueCanvasChangeData;\n\n    if (!data) {\n      return;\n    }\n\n    const undoData = getReverseMap(data);\n\n    this.onChange(undoData);\n  };\n\n  private redo = () => {\n    if (!this.polycanvas) {\n      return;\n    }\n\n    const data = this.polycanvas.redo() as TCueCanvasChangeData;\n\n    if (!data) {\n      return;\n    }\n\n    this.onChange(data);\n  };\n\n  private clearCanvas = () => {\n    if (this.polycanvas) {\n      this.polycanvas.clear();\n    }\n  };\n\n  private zoomIn = () => {\n    if (!this.polycanvas) return;\n\n    const viewPort = this.polycanvas.getViewport();\n\n    this.polycanvas.setViewport(viewPort.x, viewPort.y, viewPort.zoom * 1.1);\n  };\n\n  private zoomOut = () => {\n    if (!this.polycanvas) return;\n\n    const viewPort = this.polycanvas.getViewport();\n\n    this.polycanvas.setViewport(viewPort.x, viewPort.y, viewPort.zoom * 0.9);\n  };\n\n  getCanvasAsImage = async () => {\n    if (!this.polycanvas) return;\n\n    const image = await this.polycanvas.image(3000, 3000, 'png');\n\n    return image;\n  };\n\n  private downloadCanvasAsImage = async () => {\n    if (!this.polycanvas) return;\n\n    const image = await this.polycanvas.image(3000, 3000, 'png');\n\n    if (!image) return;\n\n    const downloadLink = document.createElement('a');\n\n    downloadLink.href = image;\n    downloadLink.download = `canvas-drawing-${Date.now()}.png`;\n    downloadLink.click();\n  };\n\n  private uploadFileToCanvas = async (file: File): Promise<string> => {\n    return new Promise((resolve, reject) => {\n      this.uploadImageToS3\n        ? resolve(this.uploadImageToS3(file))\n        : reject(new Error('Upload function not provided'));\n    });\n  };\n\n  private onViewPortChange = (e: IViewport): void => {\n    if (!this.publish) return;\n\n    const data = e as IViewport;\n\n    this.publishToChannel({}, undefined, data);\n  };\n\n  private openFileUpload = (): void => {\n    if (!this.fileInput) {\n      this.fileInput = document.createElement('input');\n      this.fileInput.type = 'file';\n      this.fileInput.accept = 'image/*';\n      this.fileInput.style.display = 'none';\n      this.fileInput.onchange = this.onSelectImage;\n      document.body.appendChild(this.fileInput);\n    }\n\n    this.fileInput.click();\n  };\n\n  addImageToCanvas = (imageUrl: string): void => {\n    if (!this.polycanvas) return;\n\n    const viewPort = this.polycanvas.getViewport();\n    const imgJson = {\n      name: 'image',\n      href: imageUrl,\n      x: viewPort.x + 88,\n      y: viewPort.y + 88,\n    };\n\n    const key = this.polycanvas.add({\n      ...imgJson,\n    });\n\n    this.publishToChannel({\n      [key]: [undefined, { ...imgJson, status: 'locked' }],\n    });\n  };\n\n  private onSelectImage = async (event: Event): Promise<void> => {\n    const target = event.target as HTMLInputElement;\n    const file = target.files?.[0];\n\n    if (!file || !this.polycanvas || !this.uploadImageToS3) return;\n\n    const imageUrl = await this.uploadImageToS3(file);\n\n    this.addImageToCanvas(imageUrl);\n\n    target.value = '';\n  };\n\n  private updateCanvasConfig = (\n    height: number,\n    dimension: IViewport | undefined,\n    gridName: TCueCanvasGridName | undefined,\n  ) => {\n    if (!this.polycanvas) return;\n\n    if (height > this.height) {\n      this.updateHeight(height);\n    }\n\n    if (dimension) {\n      this.polycanvas.setViewport(dimension.x, dimension.y, dimension.zoom);\n    }\n\n    if (gridName) {\n      this.polycanvas.setOptions({\n        grid: gridName,\n      });\n    }\n  };\n\n  private updateCanvas = ({ data, userId }: IActionData) => {\n    const canEditStroke = this.userType === 'TEACHER' || userId === this.userId;\n\n    Object.entries(data).forEach(([key, value]) => {\n      if (!value[0] && value[1]) {\n        this.polycanvas?.add({ ...value[1], cannotEdit: !canEditStroke }, key);\n      } else if (value[0] && !value[1]) {\n        this.polycanvas?.delete(key);\n      } else if (value[0] && value[1]) {\n        this.polycanvas?.update(key, { ...value[1] });\n      }\n    });\n  };\n\n  toggleTiles = (val: boolean) => {\n    this.polycanvas?.toggleSidebar(val);\n  };\n\n  resetViewPort = () => {\n    if (this.polycanvas) {\n      this.polycanvas.resetViewport();\n    }\n  };\n\n  changeGrid = (gridName: TCueCanvasGridName) => {\n    if (!this.polycanvas) return;\n\n    this.polycanvas.setOptions({\n      grid: gridName,\n    });\n\n    this.publishToChannel({}, gridName);\n  };\n\n  lockSelectedTiles = () => {\n    const { tiles: allTiles } = this.polycanvas?.serialize() || {};\n    const selectedItems = this.polycanvas?.getSelection() || [];\n\n    if (selectedItems.length > 0 && allTiles) {\n      const lockedTiles: TCueCanvasChangeDataObject = {};\n\n      selectedItems.forEach(key => {\n        if (!allTiles[key]?.name) return;\n\n        const updatedJson = { ...allTiles[key], status: 'locked' as const };\n\n        this.polycanvas?.update(key, updatedJson);\n        if (allTiles[key]?.name) lockedTiles[key] = [allTiles[key], updatedJson];\n      });\n\n      this.publishToChannel(lockedTiles);\n    }\n  };\n\n  unlockAllTiles = () => {\n    if (!this.polycanvas) return;\n\n    const { tiles: allTiles } = this.polycanvas.serialize();\n    const unlockedTiles: TCueCanvasChangeDataObject = {};\n\n    if (allTiles && Object.entries(allTiles).length > 0) {\n      Object.entries(allTiles).forEach(([key, item]) => {\n        if (item.status !== 'locked') return;\n\n        const updatedJson = { ...item, status: undefined };\n\n        this.polycanvas?.update(key, updatedJson);\n        unlockedTiles[key] = [item, updatedJson];\n      });\n\n      this.publishToChannel(unlockedTiles);\n    }\n  };\n\n  replaceCanvas = (data: IReplaceCanvas) => {\n    if (!this.polycanvas) return;\n\n    const { data: canvasData, gridName } = data;\n\n    this.polycanvas.clear();\n\n    if (gridName) {\n      this.polycanvas.setOptions({\n        grid: gridName,\n      });\n    }\n\n    Object.entries(canvasData).forEach(([key, value]) => {\n      if (!value[0] && value[1]) {\n        this.polycanvas?.add({ ...value[1] }, key);\n\n        return;\n      }\n    });\n\n    this.publishToChannel(canvasData, gridName);\n  };\n\n  setTool = (tool: TCueCanvasTool) => {\n    if (this.polycanvas) {\n      const [currTool, currSubTool] = getToolAndSubtool(tool);\n\n      switch (currTool) {\n        case 'clearAll':\n          this.clearCanvas();\n          break;\n        case 'home':\n          this.resetViewPort();\n          break;\n        case 'undo':\n          this.undo();\n          break;\n        case 'redo':\n          this.redo();\n          break;\n        case 'lock':\n          this.lockSelectedTiles();\n          break;\n        case 'unlock':\n          this.unlockAllTiles();\n          break;\n        case 'zoomIn':\n          this.zoomIn();\n          break;\n        case 'zoomOut':\n          this.zoomOut();\n          break;\n        case 'upload':\n          this.openFileUpload();\n          break;\n        case 'download':\n          this.downloadCanvasAsImage();\n          break;\n        case 'grid':\n          break;\n        default:\n          this.polycanvas.setTool(currTool, currSubTool);\n      }\n    }\n  };\n\n  /**\n   * The `update` method is called in two cases:\n   * 1. When receiving initial data to update the canvas content.\n   * 2. When receiving strokes from other peers to update the canvas content.\n   * Each item can contain multiple actions, which are applied to the canvas.\n   *\n   * The method checks if the payload is an array or a single object.\n   * If it's an array, it iterates over each item and updates the canvas accordingly.\n   * If it's a single object, it directly updates the canvas.\n   *\n   * Additionally, if the payload contains a height greater than the current height of the canvas, the `updateHeight` method is called to update the canvas height.\n   */\n  update = (payload: IActionData | IActionData[]) => {\n    if (Array.isArray(payload)) {\n      const heights = payload.map(data => data.height).filter(Boolean);\n      const maxHeight = Math.max(...heights);\n      const lastDimension = payload.map(data => data.dimension).filter(Boolean)[payload.length - 1];\n      const lastGrid = payload.map(data => data.gridName).filter(Boolean)[payload.length - 1];\n\n      this.updateCanvasConfig(maxHeight, lastDimension, lastGrid);\n      payload.forEach(item => this.updateCanvas(item));\n    } else {\n      this.updateCanvasConfig(payload.height, payload.dimension, payload?.gridName);\n      this.updateCanvas(payload);\n    }\n  };\n\n  setColor = (color: string) => {\n    if (this.polycanvas) {\n      this.polycanvas.setColor(color);\n    }\n  };\n\n  updateHeight = (height: number) => {\n    this.height = height;\n    this.onUpdateHeight?.(height);\n  };\n\n  destroy = () => {\n    if (this.polycanvas) {\n      this.polycanvas.off('change', this.onChange);\n      this.polycanvas.destroy();\n      this.debouncedViewportChange.cancel();\n\n      if (this.renderAs === 'whiteboard' && this.userType === 'TEACHER') {\n        this.polycanvas.off('viewport', this.debouncedViewportChange);\n      }\n      this.polycanvas = undefined;\n\n      if (this.fileInput && this.fileInput.parentNode) {\n        this.fileInput.parentNode.removeChild(this.fileInput);\n        this.fileInput = null;\n      }\n    }\n  };\n}\n"],"names":["CueCanvasCore","onPublish","onSubscribe","onUpdateActiveTool","onUpdateHeight","uploadImageToS3","height","userId","canvasId","userType","renderAs","__publicField","payload","gridName","dimension","e","checkTextOrEquationTool","data","undoData","getReverseMap","viewPort","image","downloadLink","file","resolve","reject","imageUrl","imgJson","key","event","target","_a","canEditStroke","value","_b","_c","val","allTiles","selectedItems","lockedTiles","updatedJson","unlockedTiles","item","canvasData","tool","currTool","currSubTool","getToolAndSubtool","heights","maxHeight","lastDimension","lastGrid","color","debounce","canvasElementRef","canvasConfig","canvasSetting","initialData","removeTileButton","removeMask"],"mappings":"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"}
+{"version":3,"file":"cue-canvas-core.js","sources":["../../../src/features/cue-canvas/cue-canvas-core.ts"],"sourcesContent":["import type { TUserTypes } from '../ui/types';\nimport type {\n  IActionData,\n  IViewport,\n  TCueCanvasChangeData,\n  TCueCanvasGridName,\n  TCueCanvasTool,\n  TPublish,\n  TRenderAs,\n  TCueCanvasChangeDataObject,\n  IReplaceCanvas,\n  ICueCanvasCoreProps,\n} from './types/cue-canvas';\nimport type { ICreateOptions } from './types/cue-canvas';\nimport type { IPolypad, IPolyPadInstance } from './types/polypad';\n\nimport debounce from 'lodash.debounce';\n\nimport {\n  checkTextOrEquationTool,\n  getReverseMap,\n  getToolAndSubtool,\n  removeMask,\n  removeTileButton,\n} from './cue-canvas-helpers';\n\ndeclare global {\n  interface Window {\n    Polypad: IPolypad;\n  }\n}\n\n/**\n * The CueCanvasCore class manages the canvas state and tool synchronization.\n * When text or equations are added, Polypad automatically switches to 'move' tool.\n * onUpdateActiveTool ensures the UI reflects this automatic tool change.\n */\n\nexport class CueCanvasCore {\n  private polycanvas: IPolyPadInstance | undefined;\n  private publish?: TPublish;\n  private height: number;\n  private onUpdateActiveTool: (tool: TCueCanvasTool) => void;\n  private onUpdateHeight?: (height: number) => void;\n  private userId: string;\n  private canvasId: string;\n  private userType: TUserTypes;\n  private renderAs: TRenderAs;\n  private fileInput: HTMLInputElement | null = null;\n  private debouncedViewportChange: ReturnType<typeof debounce>;\n  private uploadImageToS3?: (file: File) => Promise<string>;\n\n  constructor({\n    onPublish,\n    onSubscribe,\n    onUpdateActiveTool,\n    onUpdateHeight,\n    uploadImageToS3,\n    height,\n    userId,\n    canvasId,\n    userType,\n    renderAs,\n  }: ICueCanvasCoreProps) {\n    this.onUpdateHeight = onUpdateHeight;\n    this.onUpdateActiveTool = onUpdateActiveTool;\n    this.height = height;\n    this.uploadImageToS3 = uploadImageToS3;\n    this.userId = userId;\n    this.canvasId = canvasId;\n    this.publish = onPublish;\n    this.userType = userType;\n    this.renderAs = renderAs;\n    this.debouncedViewportChange = debounce(this.onViewPortChange, 300);\n    onSubscribe?.(this.canvasId, this.update);\n  }\n\n  async create({ canvasElementRef, canvasConfig, canvasSetting, initialData }: ICreateOptions) {\n    if (!canvasElementRef.current) {\n      throw new Error('PolyCanvas: Div Element Not found for canvas');\n    }\n    this.polycanvas = await window.Polypad.create(canvasElementRef.current, {\n      initial: {\n        options: canvasConfig,\n      },\n      ...canvasSetting,\n      imageUpload:\n        this.renderAs === 'whiteboard' && this.userType === 'TEACHER' && this.uploadImageToS3\n          ? this.uploadImageToS3\n          : undefined,\n    });\n\n    if (this.renderAs === 'whiteboard' && this.userType === 'TEACHER') {\n      this.polycanvas.toggleSidebar(false);\n\n      removeTileButton(canvasElementRef);\n      this.polycanvas.on('viewport', this.debouncedViewportChange);\n    }\n\n    removeMask(canvasElementRef);\n    this.polycanvas.on('change', this.onChange);\n    if (initialData) {\n      this.update(initialData);\n    }\n  }\n\n  private publishToChannel = (\n    payload: TCueCanvasChangeDataObject,\n    gridName?: TCueCanvasGridName,\n    dimension?: IViewport,\n  ) => {\n    if (!this.publish) return;\n\n    this.publish({\n      eventName: 'cue_canvas_changed',\n      eventPayload: {\n        data: payload,\n        height: this.height,\n        userId: this.userId,\n        responseId: this.canvasId,\n        gridName,\n        dimension,\n      },\n    });\n  };\n\n  private onChange = (e: unknown) => {\n    const data = e as TCueCanvasChangeData;\n    const payload = Object.fromEntries(data.entries());\n\n    if (checkTextOrEquationTool(payload)) {\n      this.onUpdateActiveTool('move');\n    }\n\n    this.publishToChannel(payload);\n  };\n\n  private undo = () => {\n    if (!this.polycanvas) {\n      return;\n    }\n\n    const data = this.polycanvas.undo() as TCueCanvasChangeData;\n\n    if (!data) {\n      return;\n    }\n\n    const undoData = getReverseMap(data);\n\n    this.onChange(undoData);\n  };\n\n  private redo = () => {\n    if (!this.polycanvas) {\n      return;\n    }\n\n    const data = this.polycanvas.redo() as TCueCanvasChangeData;\n\n    if (!data) {\n      return;\n    }\n\n    this.onChange(data);\n  };\n\n  clearCanvas = () => {\n    if (this.polycanvas) {\n      this.polycanvas.clear();\n    }\n  };\n\n  private zoomIn = () => {\n    if (!this.polycanvas) return;\n\n    const viewPort = this.polycanvas.getViewport();\n\n    this.polycanvas.setViewport(viewPort.x, viewPort.y, viewPort.zoom * 1.1);\n  };\n\n  private zoomOut = () => {\n    if (!this.polycanvas) return;\n\n    const viewPort = this.polycanvas.getViewport();\n\n    this.polycanvas.setViewport(viewPort.x, viewPort.y, viewPort.zoom * 0.9);\n  };\n\n  getCanvasAsImage = async () => {\n    if (!this.polycanvas) return;\n\n    const image = await this.polycanvas.image(3000, 3000, 'png');\n\n    return image;\n  };\n\n  private downloadCanvasAsImage = async () => {\n    if (!this.polycanvas) return;\n\n    const image = await this.polycanvas.image(3000, 3000, 'png');\n\n    if (!image) return;\n\n    const downloadLink = document.createElement('a');\n\n    downloadLink.href = image;\n    downloadLink.download = `canvas-drawing-${Date.now()}.png`;\n    downloadLink.click();\n  };\n\n  private onViewPortChange = (e: IViewport): void => {\n    if (!this.publish) return;\n\n    const data = e as IViewport;\n\n    this.publishToChannel({}, undefined, data);\n  };\n\n  private openFileUpload = (): void => {\n    if (!this.fileInput) {\n      this.fileInput = document.createElement('input');\n      this.fileInput.type = 'file';\n      this.fileInput.accept = 'image/*';\n      this.fileInput.style.display = 'none';\n      this.fileInput.onchange = this.onSelectImage;\n      document.body.appendChild(this.fileInput);\n    }\n\n    this.fileInput.click();\n  };\n\n  addImageToCanvas = (imageUrl: string): void => {\n    if (!this.polycanvas) return;\n\n    const viewPort = this.polycanvas.getViewport();\n    const imgJson = {\n      name: 'image',\n      href: imageUrl,\n      x: viewPort.x + 24,\n      y: viewPort.y + 24,\n      width: 500,\n    };\n\n    const key = this.polycanvas.add({\n      ...imgJson,\n    });\n\n    this.publishToChannel({\n      [key]: [undefined, { ...imgJson, status: 'locked' }],\n    });\n  };\n\n  private onSelectImage = async (event: Event): Promise<void> => {\n    const target = event.target as HTMLInputElement;\n    const file = target.files?.[0];\n\n    if (!file || !this.polycanvas || !this.uploadImageToS3) return;\n\n    const imageUrl = await this.uploadImageToS3(file);\n\n    console.log('===imageUrl', imageUrl);\n\n    if (imageUrl === 'error') {\n      return;\n    }\n\n    this.addImageToCanvas(imageUrl);\n\n    target.value = '';\n  };\n\n  private updateCanvasConfig = (\n    height: number,\n    dimension: IViewport | undefined,\n    gridName: TCueCanvasGridName | undefined,\n  ) => {\n    if (!this.polycanvas) return;\n\n    if (height > this.height) {\n      this.updateHeight(height);\n    }\n\n    if (dimension) {\n      this.polycanvas.setViewport(dimension.x, dimension.y, dimension.zoom);\n    }\n\n    if (gridName) {\n      this.polycanvas.setOptions({\n        grid: gridName,\n      });\n    }\n  };\n\n  private updateCanvas = ({ data, userId }: IActionData) => {\n    const canEditStroke = this.userType === 'TEACHER' || userId === this.userId;\n\n    Object.entries(data).forEach(([key, value]) => {\n      if (!value[0] && value[1]) {\n        this.polycanvas?.add({ ...value[1], cannotEdit: !canEditStroke }, key);\n      } else if (value[0] && !value[1]) {\n        this.polycanvas?.delete(key);\n      } else if (value[0] && value[1]) {\n        this.polycanvas?.update(key, { ...value[1] });\n      }\n    });\n  };\n\n  toggleTiles = (val: boolean) => {\n    this.polycanvas?.toggleSidebar(val);\n  };\n\n  resetViewPort = () => {\n    if (this.polycanvas) {\n      this.polycanvas.resetViewport();\n    }\n  };\n\n  changeGrid = (gridName: TCueCanvasGridName) => {\n    if (!this.polycanvas) return;\n\n    this.polycanvas.setOptions({\n      grid: gridName,\n    });\n\n    this.publishToChannel({}, gridName);\n  };\n\n  lockSelectedTiles = () => {\n    const { tiles: allTiles } = this.polycanvas?.serialize() || {};\n    const selectedItems = this.polycanvas?.getSelection() || [];\n\n    if (selectedItems.length > 0 && allTiles) {\n      const lockedTiles: TCueCanvasChangeDataObject = {};\n\n      selectedItems.forEach(key => {\n        if (!allTiles[key]?.name) return;\n\n        const updatedJson = { ...allTiles[key], status: 'locked' as const };\n\n        this.polycanvas?.update(key, updatedJson);\n        if (allTiles[key]?.name) lockedTiles[key] = [allTiles[key], updatedJson];\n      });\n\n      this.publishToChannel(lockedTiles);\n    }\n  };\n\n  unlockAllTiles = () => {\n    if (!this.polycanvas) return;\n\n    const { tiles: allTiles } = this.polycanvas.serialize();\n    const unlockedTiles: TCueCanvasChangeDataObject = {};\n\n    if (allTiles && Object.entries(allTiles).length > 0) {\n      Object.entries(allTiles).forEach(([key, item]) => {\n        if (item.status !== 'locked') return;\n\n        const updatedJson = { ...item, status: undefined };\n\n        this.polycanvas?.update(key, updatedJson);\n        unlockedTiles[key] = [item, updatedJson];\n      });\n\n      this.publishToChannel(unlockedTiles);\n    }\n  };\n\n  replaceCanvas = (data: IReplaceCanvas) => {\n    if (!this.polycanvas) return;\n\n    const { data: canvasData, gridName } = data;\n\n    this.polycanvas.clear();\n\n    if (gridName) {\n      this.polycanvas.setOptions({\n        grid: gridName,\n      });\n    }\n\n    Object.entries(canvasData).forEach(([key, value]) => {\n      if (!value[0] && value[1]) {\n        this.polycanvas?.add({ ...value[1] }, key);\n\n        return;\n      }\n    });\n\n    this.publishToChannel(canvasData, gridName);\n  };\n\n  setTool = (tool: TCueCanvasTool) => {\n    if (this.polycanvas) {\n      const [currTool, currSubTool] = getToolAndSubtool(tool);\n\n      switch (currTool) {\n        case 'clearAll':\n          this.clearCanvas();\n          break;\n        case 'home':\n          this.resetViewPort();\n          break;\n        case 'undo':\n          this.undo();\n          break;\n        case 'redo':\n          this.redo();\n          break;\n        case 'lock':\n          this.lockSelectedTiles();\n          break;\n        case 'unlock':\n          this.unlockAllTiles();\n          break;\n        case 'zoomIn':\n          this.zoomIn();\n          break;\n        case 'zoomOut':\n          this.zoomOut();\n          break;\n        case 'upload':\n          this.openFileUpload();\n          break;\n        case 'download':\n          this.downloadCanvasAsImage();\n          break;\n        case 'grid':\n          break;\n        default:\n          this.polycanvas.setTool(currTool, currSubTool);\n      }\n    }\n  };\n\n  /**\n   * The `update` method is called in two cases:\n   * 1. When receiving initial data to update the canvas content.\n   * 2. When receiving strokes from other peers to update the canvas content.\n   * Each item can contain multiple actions, which are applied to the canvas.\n   *\n   * The method checks if the payload is an array or a single object.\n   * If it's an array, it iterates over each item and updates the canvas accordingly.\n   * If it's a single object, it directly updates the canvas.\n   *\n   * Additionally, if the payload contains a height greater than the current height of the canvas, the `updateHeight` method is called to update the canvas height.\n   */\n  update = (payload: IActionData | IActionData[]) => {\n    if (Array.isArray(payload)) {\n      const heights = payload.map(data => data.height).filter(Boolean);\n      const maxHeight = Math.max(...heights);\n      const lastDimension = payload.map(data => data.dimension).filter(Boolean)[payload.length - 1];\n      const lastGrid = payload.map(data => data.gridName).filter(Boolean)[payload.length - 1];\n\n      this.updateCanvasConfig(maxHeight, lastDimension, lastGrid);\n      payload.forEach(item => this.updateCanvas(item));\n    } else {\n      this.updateCanvasConfig(payload.height, payload.dimension, payload?.gridName);\n      this.updateCanvas(payload);\n    }\n  };\n\n  setColor = (color: string) => {\n    if (this.polycanvas) {\n      this.polycanvas.setColor(color);\n    }\n  };\n\n  updateHeight = (height: number) => {\n    this.height = height;\n    this.onUpdateHeight?.(height);\n  };\n\n  destroy = () => {\n    if (this.polycanvas) {\n      this.polycanvas.off('change', this.onChange);\n      this.polycanvas.destroy();\n      this.debouncedViewportChange.cancel();\n\n      if (this.renderAs === 'whiteboard' && this.userType === 'TEACHER') {\n        this.polycanvas.off('viewport', this.debouncedViewportChange);\n      }\n      this.polycanvas = undefined;\n\n      if (this.fileInput && this.fileInput.parentNode) {\n        this.fileInput.parentNode.removeChild(this.fileInput);\n        this.fileInput = null;\n      }\n    }\n  };\n}\n"],"names":["CueCanvasCore","onPublish","onSubscribe","onUpdateActiveTool","onUpdateHeight","uploadImageToS3","height","userId","canvasId","userType","renderAs","__publicField","payload","gridName","dimension","e","checkTextOrEquationTool","data","undoData","getReverseMap","viewPort","image","downloadLink","imageUrl","imgJson","key","event","target","file","_a","canEditStroke","value","_b","_c","val","allTiles","selectedItems","lockedTiles","updatedJson","unlockedTiles","item","canvasData","tool","currTool","currSubTool","getToolAndSubtool","heights","maxHeight","lastDimension","lastGrid","color","debounce","canvasElementRef","canvasConfig","canvasSetting","initialData","removeTileButton","removeMask"],"mappings":"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"}

package/dist/features/cue-canvas/cue-canvas-helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"cue-canvas-helpers.js","sources":["../../../src/features/cue-canvas/cue-canvas-helpers.ts"],"sourcesContent":["import type { TUserTypes } from '../ui/types';\nimport type {\n  TCueCanvasColors,\n  TCueCanvasChangeData,\n  TCueCanvasTool,\n  TCueCanvasToolOption,\n  TDrawingData,\n  TRenderAs,\n  TCueCanvasGridName,\n  TCueCanvasChangeDataObject,\n} from './types/cue-canvas';\nimport type { IPolypadCreateOptions, IPolypadOptions } from './types/polypad';\n\nexport const GRID_NAMES: TCueCanvasGridName[] = [\n  'none',\n  'square2-grid',\n  'square-checked',\n  'square-dots',\n  'tri-dots',\n  'tri2-dots',\n  'square-grid',\n  'tri-grid',\n  'tri2-grid',\n];\n\nexport const STATELESS_TOOLS = new Set<TCueCanvasTool>([\n  'undo',\n  'redo',\n  'clearAll',\n  'home',\n  'lock',\n  'unlock',\n  'zoomIn',\n  'zoomOut',\n  'upload',\n  'download',\n]);\n\nexport const removeMask = (canvasElementRef: React.RefObject<HTMLDivElement>) => {\n  const shadowRoot = canvasElementRef.current?.shadowRoot;\n\n  if (shadowRoot) {\n    const xPolypad = shadowRoot.querySelectorAll('x-polypad');\n\n    if (xPolypad[0]) {\n      const svgCanvas = xPolypad[0].querySelector('svg.canvas');\n      const maskPath = svgCanvas?.querySelector('path.mask');\n\n      maskPath?.setAttribute('stroke', 'transparent');\n      maskPath?.setAttribute('fill', 'transparent');\n      maskPath?.removeAttribute('style');\n    }\n  }\n\n  return undefined;\n};\n\nexport const removeTileButton = (canvasElementRef: React.RefObject<HTMLDivElement>) => {\n  const shadowRoot = canvasElementRef.current?.shadowRoot;\n  const sidebar = shadowRoot?.querySelector('x-pp-sidebar') as HTMLElement;\n  const tabsHeader = sidebar?.getElementsByClassName('tabs-header');\n  const tabsBody = sidebar?.getElementsByClassName('tabs-body');\n\n  sidebar?.setAttribute('style', 'display: none;');\n  sidebar?.setAttribute('style', 'height: 30px;');\n\n  if (tabsHeader && tabsHeader.length > 0) {\n    const firstTabHeader = tabsHeader[0] as HTMLElement;\n\n    firstTabHeader.style.display = 'none';\n  }\n\n  if (tabsBody && tabsBody.length > 0) {\n    const firstTabBody = tabsBody[0] as HTMLElement;\n\n    firstTabBody.style.top = '48px';\n  }\n  sidebar?.setAttribute('style', 'display: block;');\n};\n\nexport const getCanvasConfig = (\n  width: number,\n  height: number,\n  renderAs: TRenderAs,\n  userType: TUserTypes,\n): IPolypadOptions => {\n  return renderAs === 'canvas'\n    ? {\n        canvas: 'notebook',\n        canvasX: width,\n        canvasY: height,\n        noPinchPan: true,\n        grid: 'none',\n        background: 'transparent',\n        noSnapping: true,\n      }\n    : {\n        canvas: 'infinite',\n        canvasX: width,\n        canvasY: height,\n        grid: 'none',\n        noPinchPan: userType === 'STUDENT',\n        noDeleting: userType === 'STUDENT',\n        noCopyPaste: userType === 'STUDENT',\n        noMusic: true,\n        noAudio: true,\n      };\n};\n\nexport const getCanvasSettings = (\n  renderAs: TRenderAs,\n  userType: TUserTypes,\n): IPolypadCreateOptions => {\n  return renderAs === 'canvas'\n    ? {\n        sidebarTiles: false,\n        sidebarSettings: false,\n        settings: false,\n        toolbar: false,\n        canvasMargin: 0,\n      }\n    : {\n        sidebarTiles: userType === 'TEACHER',\n        sidebarSettings: false,\n        settings: false,\n        toolbar: false,\n      };\n};\n\nexport const getReverseAction = (action: TDrawingData[]) => [action[1], action[0]];\n\nexport const getReverseMap = (data: TCueCanvasChangeData) => {\n  const newData = new Map<string, TDrawingData[]>();\n\n  data.forEach((value, key) => {\n    newData.set(key, getReverseAction(value));\n  });\n\n  return newData;\n};\n\nexport const getToolAndSubtool = (\n  tool: TCueCanvasTool,\n): [\n  Exclude<TCueCanvasTool, 'marker' | 'highlighter' | 'ruler' | 'equation'>,\n  TCueCanvasToolOption | undefined,\n] => {\n  switch (tool) {\n    case 'pen':\n      return ['pen', 'pen'];\n    case 'marker':\n      return ['pen', 'marker'];\n    case 'highlighter':\n      return ['pen', 'highlighter'];\n    case 'ruler':\n      return ['pen', 'ruler'];\n    case 'equation':\n      return ['text', 'equation'];\n    default:\n      return [tool, undefined];\n  }\n};\n\nconst TEACHER_WHITEBOARD_TOOLS: TCueCanvasTool[] = [\n  'pen',\n  'ruler',\n  'marker',\n  'highlighter',\n  'eraser',\n  'move',\n  'pan',\n  'clearAll',\n  'text',\n  'equation',\n  'grid',\n  'home',\n  'undo',\n  'redo',\n  'lock',\n  'unlock',\n  'zoomIn',\n  'zoomOut',\n  'upload',\n  'download',\n];\n\nconst STUDENT_WHITEBOARD_TOOLS: TCueCanvasTool[] = [\n  'pen',\n  'ruler',\n  'marker',\n  'highlighter',\n  'move',\n  'text',\n  'undo',\n  'redo',\n  'download',\n];\n\nconst TEACHER_DEFAULT_TOOLS: TCueCanvasTool[] = [\n  'pen',\n  'ruler',\n  'marker',\n  'highlighter',\n  'eraser',\n  'move',\n  'undo',\n  'redo',\n];\n\nconst STUDENT_DEFAULT_TOOLS: TCueCanvasTool[] = ['pen', 'ruler', 'eraser', 'move', 'undo', 'redo'];\n\nexport const getUserTools = (userType: TUserTypes, renderAs: TRenderAs): TCueCanvasTool[] => {\n  if (renderAs === 'whiteboard') {\n    return userType === 'TEACHER' ? TEACHER_WHITEBOARD_TOOLS : STUDENT_WHITEBOARD_TOOLS;\n  }\n\n  return userType === 'TEACHER' ? TEACHER_DEFAULT_TOOLS : STUDENT_DEFAULT_TOOLS;\n};\n\nexport const getColorsForUser = (userType: TUserTypes) => {\n  return userType === 'TEACHER'\n    ? (['CANVAS_RED', 'CANVAS_YELLOW', 'CANVAS_GREEN'] as TCueCanvasColors[])\n    : (['CANVAS_BLUE', 'CANVAS_PURPLE', 'CANVAS_PINK'] as TCueCanvasColors[]);\n};\n\nexport const getIsWritingTool = (penTool: string) => {\n  return ['pen', 'ruler', 'marker', 'highlighter'].includes(penTool);\n};\n\nexport const checkTextOrEquationTool = (payload: TCueCanvasChangeDataObject) => {\n  return Object.values(payload).some(value => {\n    if (\n      !value[0] &&\n      value[1] &&\n      'name' in value[1] &&\n      (value[1].name === 'text' || value[1].name === 'equation')\n    ) {\n      return true;\n    }\n\n    return false;\n  });\n};\n\nexport const dataURIToBlob = (dataURI: string): Blob => {\n  const parts = dataURI.split(',');\n  const metadata = parts[0] ?? '';\n  const base64Data = parts[1] ?? '';\n\n  const isBase64 = metadata.includes('base64');\n  const byteString = isBase64 ? atob(base64Data) : decodeURIComponent(base64Data);\n\n  const mimeTypeMatch = metadata.match(/:(.*?);/);\n  const mimeType = mimeTypeMatch ? mimeTypeMatch[1] : 'application/octet-stream';\n\n  const byteArray = new Uint8Array(byteString.length);\n\n  for (let i = 0; i < byteString.length; i++) {\n    byteArray[i] = byteString.charCodeAt(i);\n  }\n\n  return new Blob([byteArray], { type: mimeType });\n};\n"],"names":["GRID_NAMES","STATELESS_TOOLS","removeMask","canvasElementRef","_a","shadowRoot","xPolypad","svgCanvas","maskPath","removeTileButton","sidebar","tabsHeader","tabsBody","firstTabHeader","firstTabBody","getCanvasConfig","width","height","renderAs","userType","getCanvasSettings","getReverseAction","action","getReverseMap","data","newData","value","key","getToolAndSubtool","tool","TEACHER_WHITEBOARD_TOOLS","STUDENT_WHITEBOARD_TOOLS","TEACHER_DEFAULT_TOOLS","STUDENT_DEFAULT_TOOLS","getUserTools","getColorsForUser","getIsWritingTool","penTool","checkTextOrEquationTool","payload","dataURIToBlob","dataURI","parts","metadata","base64Data","byteString","mimeTypeMatch","mimeType","byteArray","i"],"mappings":"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"}
+{"version":3,"file":"cue-canvas-helpers.js","sources":["../../../src/features/cue-canvas/cue-canvas-helpers.ts"],"sourcesContent":["import type { TUserTypes } from '../ui/types';\nimport type {\n  TCueCanvasColors,\n  TCueCanvasChangeData,\n  TCueCanvasTool,\n  TCueCanvasToolOption,\n  TDrawingData,\n  TRenderAs,\n  TCueCanvasGridName,\n  TCueCanvasChangeDataObject,\n} from './types/cue-canvas';\nimport type { IPolypadCreateOptions, IPolypadOptions } from './types/polypad';\n\nexport const GRID_NAMES: TCueCanvasGridName[] = [\n  'none',\n  'square2-grid',\n  'square-checked',\n  'square-dots',\n  'tri-dots',\n  'tri2-dots',\n  'square-grid',\n  'tri-grid',\n  'tri2-grid',\n];\n\nexport const STATELESS_TOOLS = new Set<TCueCanvasTool>([\n  'undo',\n  'redo',\n  'clearAll',\n  'home',\n  'lock',\n  'unlock',\n  'zoomIn',\n  'zoomOut',\n  'upload',\n  'download',\n]);\n\nexport const removeMask = (canvasElementRef: React.RefObject<HTMLDivElement>) => {\n  const shadowRoot = canvasElementRef.current?.shadowRoot;\n\n  if (shadowRoot) {\n    const xPolypad = shadowRoot.querySelectorAll('x-polypad');\n\n    if (xPolypad[0]) {\n      const svgCanvas = xPolypad[0].querySelector('svg.canvas');\n      const maskPath = svgCanvas?.querySelector('path.mask');\n\n      maskPath?.setAttribute('stroke', 'transparent');\n      maskPath?.setAttribute('fill', 'transparent');\n      maskPath?.removeAttribute('style');\n    }\n  }\n\n  return undefined;\n};\n\nexport const removeTileButton = (canvasElementRef: React.RefObject<HTMLDivElement>) => {\n  const shadowRoot = canvasElementRef.current?.shadowRoot;\n  const sidebar = shadowRoot?.querySelector('x-pp-sidebar') as HTMLElement;\n  const tabsHeader = sidebar?.getElementsByClassName('tabs-header');\n  const tabsBody = sidebar?.getElementsByClassName('tabs-body');\n\n  sidebar?.setAttribute('style', 'display: none;');\n  sidebar?.setAttribute('style', 'height: 30px;');\n\n  if (tabsHeader && tabsHeader.length > 0) {\n    const firstTabHeader = tabsHeader[0] as HTMLElement;\n\n    firstTabHeader.style.display = 'none';\n  }\n\n  if (tabsBody && tabsBody.length > 0) {\n    const firstTabBody = tabsBody[0] as HTMLElement;\n\n    firstTabBody.style.top = '48px';\n  }\n  sidebar?.setAttribute('style', 'display: block;');\n};\n\nexport const getCanvasConfig = (\n  width: number,\n  height: number,\n  renderAs: TRenderAs,\n  userType: TUserTypes,\n): IPolypadOptions => {\n  return renderAs === 'canvas'\n    ? {\n        canvas: 'notebook',\n        canvasX: width,\n        canvasY: height,\n        noPinchPan: true,\n        grid: 'none',\n        background: 'transparent',\n        noSnapping: true,\n      }\n    : {\n        canvas: 'infinite',\n        canvasX: width,\n        canvasY: height,\n        grid: 'none',\n        noPinchPan: userType === 'STUDENT',\n        noDeleting: userType === 'STUDENT',\n        noCopyPaste: userType === 'STUDENT',\n        noMusic: true,\n        noAudio: true,\n      };\n};\n\nexport const getCanvasSettings = (\n  renderAs: TRenderAs,\n  userType: TUserTypes,\n): IPolypadCreateOptions => {\n  return renderAs === 'canvas'\n    ? {\n        sidebarTiles: false,\n        sidebarSettings: false,\n        settings: false,\n        toolbar: false,\n        canvasMargin: 0,\n      }\n    : {\n        sidebarTiles: userType === 'TEACHER',\n        sidebarSettings: false,\n        settings: false,\n        toolbar: false,\n      };\n};\n\nexport const getReverseAction = (action: TDrawingData[]) => [action[1], action[0]];\n\nexport const getReverseMap = (data: TCueCanvasChangeData) => {\n  const newData = new Map<string, TDrawingData[]>();\n\n  data.forEach((value, key) => {\n    newData.set(key, getReverseAction(value));\n  });\n\n  return newData;\n};\n\nexport const getToolAndSubtool = (\n  tool: TCueCanvasTool,\n): [\n  Exclude<TCueCanvasTool, 'marker' | 'highlighter' | 'ruler' | 'equation'>,\n  TCueCanvasToolOption | undefined,\n] => {\n  switch (tool) {\n    case 'pen':\n      return ['pen', 'pen'];\n    case 'marker':\n      return ['pen', 'marker'];\n    case 'highlighter':\n      return ['pen', 'highlighter'];\n    case 'ruler':\n      return ['pen', 'ruler'];\n    case 'equation':\n      return ['text', 'equation'];\n    default:\n      return [tool, undefined];\n  }\n};\n\nconst TEACHER_WHITEBOARD_TOOLS: TCueCanvasTool[] = [\n  'pen',\n  'ruler',\n  'marker',\n  'highlighter',\n  'eraser',\n  'move',\n  'pan',\n  'clearAll',\n  'text',\n  'equation',\n  'grid',\n  'home',\n  'undo',\n  'redo',\n  'lock',\n  'unlock',\n  'zoomIn',\n  'zoomOut',\n  'upload',\n  'download',\n];\n\nconst STUDENT_WHITEBOARD_TOOLS: TCueCanvasTool[] = [\n  'pen',\n  'ruler',\n  'marker',\n  'highlighter',\n  'move',\n  'text',\n  'undo',\n  'redo',\n  'download',\n];\n\nconst TEACHER_DEFAULT_TOOLS: TCueCanvasTool[] = [\n  'pen',\n  'ruler',\n  'marker',\n  'highlighter',\n  'eraser',\n  'move',\n  'undo',\n  'redo',\n];\n\nconst STUDENT_DEFAULT_TOOLS: TCueCanvasTool[] = ['pen', 'ruler', 'eraser', 'move', 'undo', 'redo'];\n\nexport const getUserTools = (userType: TUserTypes, renderAs: TRenderAs): TCueCanvasTool[] => {\n  if (renderAs === 'whiteboard') {\n    return userType === 'TEACHER' ? TEACHER_WHITEBOARD_TOOLS : STUDENT_WHITEBOARD_TOOLS;\n  }\n\n  return userType === 'TEACHER' ? TEACHER_DEFAULT_TOOLS : STUDENT_DEFAULT_TOOLS;\n};\n\nexport const getColorsForUser = (userType: TUserTypes) => {\n  return userType === 'TEACHER'\n    ? (['CANVAS_RED', 'CANVAS_YELLOW', 'CANVAS_GREEN'] as TCueCanvasColors[])\n    : (['CANVAS_BLUE', 'CANVAS_PURPLE', 'CANVAS_PINK'] as TCueCanvasColors[]);\n};\n\nexport const getIsWritingTool = (penTool: string) => {\n  return ['pen', 'ruler', 'marker', 'highlighter'].includes(penTool);\n};\n\nexport const checkTextOrEquationTool = (payload: TCueCanvasChangeDataObject) => {\n  return Object.values(payload).some(value => {\n    if (\n      !value[0] &&\n      value[1] &&\n      'name' in value[1] &&\n      (value[1].name === 'text' || value[1].name === 'equation')\n    ) {\n      return true;\n    }\n\n    return false;\n  });\n};\n\nexport const dataURIToBlob = (dataURI: string): Blob => {\n  const parts = dataURI.split(',');\n  const metadata = parts[0] ?? '';\n  const base64Data = parts[1] ?? '';\n\n  const isBase64 = metadata.includes('base64');\n  const byteString = isBase64 ? atob(base64Data) : decodeURIComponent(base64Data);\n\n  const mimeTypeMatch = metadata.match(/:(.*?);/);\n  const mimeType = mimeTypeMatch ? mimeTypeMatch[1] : 'application/octet-stream';\n\n  const byteArray = new Uint8Array(byteString.length);\n\n  for (let i = 0; i < byteString.length; i++) {\n    byteArray[i] = byteString.charCodeAt(i);\n  }\n\n  return new Blob([byteArray], { type: mimeType });\n};\n\nexport const jsonToBlob = (json: unknown) => {\n  const data = JSON.stringify(json);\n\n  return new Blob([data], {\n    type: 'application/json',\n  });\n};\n"],"names":["GRID_NAMES","STATELESS_TOOLS","removeMask","canvasElementRef","_a","shadowRoot","xPolypad","svgCanvas","maskPath","removeTileButton","sidebar","tabsHeader","tabsBody","firstTabHeader","firstTabBody","getCanvasConfig","width","height","renderAs","userType","getCanvasSettings","getReverseAction","action","getReverseMap","data","newData","value","key","getToolAndSubtool","tool","TEACHER_WHITEBOARD_TOOLS","STUDENT_WHITEBOARD_TOOLS","TEACHER_DEFAULT_TOOLS","STUDENT_DEFAULT_TOOLS","getUserTools","getColorsForUser","getIsWritingTool","penTool","checkTextOrEquationTool","payload","dataURIToBlob","dataURI","parts","metadata","base64Data","byteString","mimeTypeMatch","mimeType","byteArray","i"],"mappings":"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"}

package/dist/features/cue-canvas/cue-canvas.js

@@ -1,81 +1,82 @@
-import { jsx as z } from "react/jsx-runtime";
-import { memo as I, useRef as w, useCallback as $, useEffect as r } from "react";
-import { CueCanvasCore as R } from "./cue-canvas-core.js";
-import { getCanvasConfig as U, getCanvasSettings as V } from "./cue-canvas-helpers.js";
-import { CueCanvasWrapper as q } from "./cue-cavas-styled.js";
-import { useCueCanvasActions as H } from "./hooks/use-cue-canvas-actions.js";
-import P from "./hooks/use-height-extender.js";
-const T = I(
+import { jsx as U } from "react/jsx-runtime";
+import { memo as V, useRef as w, useCallback as j, useEffect as n } from "react";
+import { CueCanvasCore as k } from "./cue-canvas-core.js";
+import { getCanvasConfig as I, getCanvasSettings as P } from "./cue-canvas-helpers.js";
+import { CueCanvasWrapper as W } from "./cue-cavas-styled.js";
+import { useCueCanvasActions as q } from "./hooks/use-cue-canvas-actions.js";
+import z from "./hooks/use-height-extender.js";
+import B from "./hooks/use-upload-helper.js";
+const F = V(
   ({
-    canvasId: d,
+    canvasId: x,
     width: u,
-    height: t,
+    height: e,
     canRender: C,
-    onUpdateHeight: j,
+    onUpdateHeight: E,
     initialData: s,
     onPublish: p,
     onSubscribe: i,
-    userId: x,
-    appended: l,
-    canScribble: o,
-    userType: m,
-    renderAs: a = "canvas"
+    userId: l,
+    appended: $,
+    canScribble: r,
+    userType: a,
+    renderAs: o = "canvas"
   }) => {
-    const f = w(null), { setActiveInstance: c, setActiveTool: g } = H(), e = w(null), A = $(
-      (n) => {
-        g(n);
+    const f = w(null), { setActiveInstance: c, setActiveTool: g } = q(), A = B({ userId: l, renderAs: o, userType: a }), t = w(null), H = j(
+      (m) => {
+        g(m);
       },
       [g]
-    ), E = $((n) => (console.log("Uploading image to S3:", n), "https://wmznlejcfq.s3-ap-southeast-1.amazonaws.com/media/homework-help/testing/2076b5ac-2765-4d65-906a-71817b468d58.jpg"), []);
-    return P({
+    );
+    return z({
       canvasElementRef: f,
-      cueCanvasRef: e,
-      canScribble: o
-    }), r(() => {
-      o && e.current && (e.current.resetViewPort(), c(e.current));
-    }, [o, c]), r(() => {
-      s && e.current && e.current.update(s);
-    }, [s]), r(() => {
-      t && e.current && e.current.resetViewPort();
-    }, [t, u]), r(() => {
-      if (C && l && !e.current) {
-        const n = U(u, t, a, m), k = V(a, m), v = new R({
+      cueCanvasRef: t,
+      canScribble: r
+    }), n(() => {
+      r && t.current && (t.current.resetViewPort(), c(t.current));
+    }, [r, c]), n(() => {
+      s && t.current && t.current.update(s);
+    }, [s]), n(() => {
+      e && t.current && t.current.resetViewPort();
+    }, [e, u]), n(() => {
+      if (C && $ && !t.current) {
+        const m = I(u, e, o, a), R = P(o, a), v = new k({
           onPublish: p,
           onSubscribe: i,
-          onUpdateActiveTool: A,
-          onUpdateHeight: j,
-          uploadImageToS3: E,
-          height: t,
-          userId: x,
-          canvasId: d,
-          userType: m,
-          renderAs: a
+          onUpdateActiveTool: H,
+          onUpdateHeight: E,
+          uploadImageToS3: A,
+          height: e,
+          userId: l,
+          canvasId: x,
+          userType: a,
+          renderAs: o
         });
         (async () => {
           await v.create({
             canvasElementRef: f,
-            canvasConfig: n,
-            canvasSetting: k,
+            canvasConfig: m,
+            canvasSetting: R,
             initialData: s
-          }), e.current = v, o && c(v);
+          }), t.current = v, r && c(v);
         })();
       }
-    }, [p, i, c, C, l]), r(() => () => {
-      e.current && (e.current.destroy(), e.current = null);
-    }, []), /* @__PURE__ */ z(
-      q,
+    }, [p, i, c, C, $]), n(() => () => {
+      t.current && (t.current.destroy(), t.current = null);
+    }, []), /* @__PURE__ */ U(
+      W,
       {
         ref: f,
         $width: u,
-        $height: t,
-        $canScribble: o,
+        $height: e,
+        $canScribble: r,
         $canRender: C,
-        $renderAs: a
+        $renderAs: o
       }
     );
   }
-), M = T;
+), X = F;
 export {
-  M as default
+  X as default
 };
 //# sourceMappingURL=cue-canvas.js.map

package/dist/features/cue-canvas/cue-canvas.js.map

@@ -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';\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\n    const cueCanvasRef = useRef<CueCanvasCore | null>(null);\n\n    const onUpdateActiveTool = useCallback(\n      (tool: TCueCanvasTool) => {\n        setActiveTool(tool);\n      },\n      [setActiveTool],\n    );\n\n    const uploadImageToS3 = useCallback((file: File) => {\n      // Todo @ayushsinghal1998: Update this once upload api is ready\n\n      // eslint-disable-next-line no-console\n      console.log('Uploading image to S3:', file);\n\n      return 'https://wmznlejcfq.s3-ap-southeast-1.amazonaws.com/media/homework-help/testing/2076b5ac-2765-4d65-906a-71817b468d58.jpg';\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        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","cueCanvasRef","onUpdateActiveTool","useCallback","tool","uploadImageToS3","file","useHeightExtender","useEffect","canvasConfig","getCanvasConfig","canvasSetting","getCanvasSettings","cueCanvasCore","CueCanvasCore","jsx","CueCanvasWrapper","CueCanvas$1"],"mappings":";;;;;;;AAUA,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,GAE/EC,IAAeJ,EAA6B,IAAI,GAEhDK,IAAqBC;AAAA,MACzB,CAACC,MAAyB;AACxB,QAAAL,EAAcK,CAAI;AAAA,MACpB;AAAA,MACA,CAACL,CAAa;AAAA,IAAA,GAGVM,IAAkBF,EAAY,CAACG,OAI3B,QAAA,IAAI,0BAA0BA,CAAI,GAEnC,4HACN,CAAE,CAAA;AAEa,WAAAC,EAAA;AAAA,MAChB,kBAAAX;AAAA,MACA,cAAAK;AAAA,MACA,aAAAR;AAAA,IAAA,CACD,GAEDe,EAAU,MAAM;AACV,MAAAf,KAAeQ,EAAa,YAC9BA,EAAa,QAAQ,iBAErBH,EAAmBG,EAAa,OAAO;AAAA,IACzC,GACC,CAACR,GAAaK,CAAkB,CAAC,GAEpCU,EAAU,MAAM;AACV,MAAApB,KAAea,EAAa,WACjBA,EAAA,QAAQ,OAAOb,CAAW;AAAA,IACzC,GACC,CAACA,CAAW,CAAC,GAEhBoB,EAAU,MAAM;AACV,MAAAvB,KAAUgB,EAAa,WACzBA,EAAa,QAAQ;IACvB,GACC,CAAChB,GAAQD,CAAK,CAAC,GAElBwB,EAAU,MAAM;AACd,UAAItB,KAAaM,KAAY,CAACS,EAAa,SAAS;AAClD,cAAMQ,IAAeC,EAAgB1B,GAAOC,GAAQU,GAAUD,CAAQ,GAChEiB,IAAgBC,EAAkBjB,GAAUD,CAAQ,GACpDmB,IAAgB,IAAIC,EAAc;AAAA,UACtC,WAAAzB;AAAA,UACA,aAAAC;AAAA,UACA,oBAAAY;AAAA,UACA,gBAAAf;AAAA,UACA,iBAAAkB;AAAA,UACA,QAAApB;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,GACDa,EAAa,UAAUY,GAEnBpB,KACFK,EAAmBe,CAAa;AAAA,QAClC;MAIJ;AAAA,IAAA,GAEC,CAACxB,GAAWC,GAAaQ,GAAoBZ,GAAWM,CAAQ,CAAC,GAEpEgB,EAAU,MACD,MAAM;AACX,MAAIP,EAAa,YACfA,EAAa,QAAQ,WACrBA,EAAa,UAAU;AAAA,IACzB,GAED,CAAE,CAAA,GAGH,gBAAAc;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,KAAKpB;AAAA,QACL,QAAQZ;AAAA,QACR,SAASC;AAAA,QACT,cAAcQ;AAAA,QACd,YAAYP;AAAA,QACZ,WAAWS;AAAA,MAAA;AAAA,IAAA;AAAA,EAGjB;AACF,GAEAsB,IAAepC;"}
+{"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;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,GAEpDmB,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,KAAKpB;AAAA,QACL,QAAQZ;AAAA,QACR,SAASC;AAAA,QACT,cAAcQ;AAAA,QACd,YAAYP;AAAA,QACZ,WAAWS;AAAA,MAAA;AAAA,IAAA;AAAA,EAGjB;AACF,GAEAsB,IAAepC;"}

package/dist/features/cue-canvas/hooks/use-upload-helper.js

@@ -0,0 +1,23 @@
+import { useRef as d, useCallback as c } from "react";
+import m from "../../worksheet/worksheet/hooks/use-s3-helper.js";
+const p = { type: "cuemath_whiteboard" }, h = (a) => {
+  const { userId: o, renderAs: u, userType: s } = a, l = d(), r = m({
+    studentId: o,
+    query: p,
+    enabled: u === "whiteboard" && s === "TEACHER"
+  }), t = c(
+    async (n) => {
+      const e = await r({
+        fileKey: "media/cuemath-whiteboard/",
+        images: [{ file: n, url: "" }]
+      });
+      return e && e.length > 0 ? e[0] ?? "error" : "error";
+    },
+    [r]
+  );
+  return l.current = t, t;
+};
+export {
+  h as default
+};
+//# sourceMappingURL=use-upload-helper.js.map

package/dist/features/cue-canvas/hooks/use-upload-helper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-upload-helper.js","sources":["../../../../src/features/cue-canvas/hooks/use-upload-helper.ts"],"sourcesContent":["import type { TUserTypes } from '../../ui/types';\nimport type { TRenderAs } from '../types/cue-canvas';\n\nimport { useCallback } from 'react';\nimport { useRef } from 'react';\n\nimport useS3ImageUploadHelper from '../../worksheet/worksheet/hooks/use-s3-helper';\n\ninterface IUseUploadHelper {\n  userId: string;\n  renderAs: TRenderAs;\n  userType: TUserTypes;\n}\nconst QUERY = { type: 'cuemath_whiteboard' };\n\nconst useUploadHelper = (props: IUseUploadHelper) => {\n  const { userId, renderAs, userType } = props;\n  const uploadImageRef = useRef<(file: File) => Promise<string>>();\n  const uploadImages = useS3ImageUploadHelper({\n    studentId: userId,\n    query: QUERY,\n    enabled: renderAs === 'whiteboard' && userType === 'TEACHER',\n  });\n\n  const uploadImageToS3 = useCallback(\n    async (file: File) => {\n      const urls = await uploadImages({\n        fileKey: `media/cuemath-whiteboard/`,\n        images: [{ file: file, url: '' }],\n      });\n\n      if (urls && urls.length > 0) {\n        const url = urls[0] ?? 'error';\n\n        return url;\n      }\n\n      return 'error';\n    },\n    [uploadImages],\n  );\n\n  uploadImageRef.current = uploadImageToS3;\n\n  return uploadImageToS3;\n};\n\nexport default useUploadHelper;\n"],"names":["QUERY","useUploadHelper","props","userId","renderAs","userType","uploadImageRef","useRef","uploadImages","useS3ImageUploadHelper","uploadImageToS3","useCallback","file","urls"],"mappings":";;AAaA,MAAMA,IAAQ,EAAE,MAAM,wBAEhBC,IAAkB,CAACC,MAA4B;AACnD,QAAM,EAAE,QAAAC,GAAQ,UAAAC,GAAU,UAAAC,EAAA,IAAaH,GACjCI,IAAiBC,KACjBC,IAAeC,EAAuB;AAAA,IAC1C,WAAWN;AAAA,IACX,OAAOH;AAAA,IACP,SAASI,MAAa,gBAAgBC,MAAa;AAAA,EAAA,CACpD,GAEKK,IAAkBC;AAAA,IACtB,OAAOC,MAAe;AACd,YAAAC,IAAO,MAAML,EAAa;AAAA,QAC9B,SAAS;AAAA,QACT,QAAQ,CAAC,EAAE,MAAAI,GAAY,KAAK,IAAI;AAAA,MAAA,CACjC;AAEG,aAAAC,KAAQA,EAAK,SAAS,IACZA,EAAK,CAAC,KAAK,UAKlB;AAAA,IACT;AAAA,IACA,CAACL,CAAY;AAAA,EAAA;AAGf,SAAAF,EAAe,UAAUI,GAElBA;AACT;"}

package/dist/features/cue-canvas/sidebar/homework/homework-menu.js

@@ -1,12 +1,12 @@
-import { jsx as e, jsxs as o } from "react/jsx-runtime";
-import { memo as m } from "react";
-import s from "../../../../assets/line-icons/icons/cross.js";
-import $ from "../../../ui/buttons/clickable/clickable.js";
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+import { memo as l } from "react";
+import m from "../../../../assets/line-icons/icons/cross.js";
+import s from "../../../ui/buttons/clickable/clickable.js";
 import r from "../../../ui/layout/flex-view.js";
-import n from "../../../ui/text/text.js";
-import p from "./homework-request.js";
+import i from "../../../ui/text/text.js";
+import $ from "./homework-request.js";
 import { MenuContainer as d } from "./homework-styled.js";
-const a = ({ onSelect: t, hwRequests: c, studentName: l }) => /* @__PURE__ */ e(d, { children: /* @__PURE__ */ e(r, { children: /* @__PURE__ */ o(
+const a = ({ onSelect: n, hwRequests: c }) => /* @__PURE__ */ e(d, { children: /* @__PURE__ */ e(r, { children: /* @__PURE__ */ t(
   r,
   {
     $flexDirection: "row",
@@ -16,18 +16,18 @@ const a = ({ onSelect: t, hwRequests: c, studentName: l }) => /* @__PURE__ */ e(
     $gutterX: 0.5,
     $gapX: 0.5,
     children: [
-      /* @__PURE__ */ o(r, { $flexDirection: "row", $gapX: 0.5, children: [
-        /* @__PURE__ */ o(r, { $width: "184px", $gutterX: 1, children: [
-          /* @__PURE__ */ e(n, { $color: "WHITE", $renderAs: "eyebrow2", children: "HOMEWORK" }),
-          /* @__PURE__ */ e(n, { $color: "WHITE", $renderAs: "eyebrow2", children: "HELP REQUESTS" })
+      /* @__PURE__ */ t(r, { $flexDirection: "row", $gapX: 0.5, children: [
+        /* @__PURE__ */ t(r, { $width: "184px", $gutterX: 1, children: [
+          /* @__PURE__ */ e(i, { $color: "WHITE", $renderAs: "eyebrow2", children: "HOMEWORK" }),
+          /* @__PURE__ */ e(i, { $color: "WHITE", $renderAs: "eyebrow2", children: "HELP REQUESTS" })
         ] }),
-        /* @__PURE__ */ e($, { onClick: t, label: "close activities menu", children: /* @__PURE__ */ e(s, { color: "WHITE" }) })
+        /* @__PURE__ */ e(s, { onClick: n, label: "close activities menu", children: /* @__PURE__ */ e(m, { color: "WHITE" }) })
       ] }),
-      c.map((i) => /* @__PURE__ */ e(r, { $gutterX: 0.25, $gapX: 0.5, children: /* @__PURE__ */ e(p, { hwRequest: i, onSelect: t, studentName: l }) }, i.created_on_ts))
+      c.map((o) => /* @__PURE__ */ e(r, { $gutterX: 0.25, $gapX: 0.5, children: /* @__PURE__ */ e($, { hwRequest: o, onSelect: n, studentName: o.student_name }) }, o.created_on_ts))
     ]
   }
-) }) }), E = m(a);
+) }) }), w = l(a);
 export {
-  E as default
+  w as default
 };
 //# sourceMappingURL=homework-menu.js.map

package/dist/features/cue-canvas/sidebar/homework/homework-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"homework-menu.js","sources":["../../../../../src/features/cue-canvas/sidebar/homework/homework-menu.tsx"],"sourcesContent":["import type { IHomeWorkMenuProps } from './homework-types';\n\nimport { memo } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport HWRequest from './homework-request';\nimport * as Styled from './homework-styled';\n\nconst HomeWorkMenu: React.FC<IHomeWorkMenuProps> = ({ onSelect, hwRequests, studentName }) => {\n  return (\n    <Styled.MenuContainer>\n      <FlexView>\n        <FlexView\n          $flexDirection=\"row\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $flexWrap\n          $gutterX={0.5}\n          $gapX={0.5}\n        >\n          <FlexView $flexDirection=\"row\" $gapX={0.5}>\n            <FlexView $width={'184px'} $gutterX={1}>\n              <Text $color=\"WHITE\" $renderAs=\"eyebrow2\">\n                HOMEWORK\n              </Text>\n              <Text $color=\"WHITE\" $renderAs=\"eyebrow2\">\n                HELP REQUESTS\n              </Text>\n            </FlexView>\n            <Clickable onClick={onSelect} label=\"close activities menu\">\n              <CrossIcon color=\"WHITE\" />\n            </Clickable>\n          </FlexView>\n\n          {hwRequests.map(item => (\n            <FlexView $gutterX={0.25} $gapX={0.5} key={item.created_on_ts}>\n              <HWRequest hwRequest={item} onSelect={onSelect} studentName={studentName} />\n            </FlexView>\n          ))}\n        </FlexView>\n      </FlexView>\n    </Styled.MenuContainer>\n  );\n};\n\nexport default memo(HomeWorkMenu);\n"],"names":["HomeWorkMenu","onSelect","hwRequests","studentName","jsx","Styled.MenuContainer","FlexView","jsxs","Text","Clickable","CrossIcon","item","HWRequest","HomeWorkMenu$1","memo"],"mappings":";;;;;;;;AAWA,MAAMA,IAA6C,CAAC,EAAE,UAAAC,GAAU,YAAAC,GAAY,aAAAC,QAEvE,gBAAAC,EAAAC,GAAA,EACC,4BAACC,GACC,EAAA,UAAA,gBAAAC;AAAA,EAACD;AAAA,EAAA;AAAA,IACC,gBAAe;AAAA,IACf,aAAY;AAAA,IACZ,iBAAgB;AAAA,IAChB,WAAS;AAAA,IACT,UAAU;AAAA,IACV,OAAO;AAAA,IAEP,UAAA;AAAA,MAAA,gBAAAC,EAACD,GAAS,EAAA,gBAAe,OAAM,OAAO,KACpC,UAAA;AAAA,QAAA,gBAAAC,EAACD,GAAS,EAAA,QAAQ,SAAS,UAAU,GACnC,UAAA;AAAA,UAAA,gBAAAF,EAACI,GAAK,EAAA,QAAO,SAAQ,WAAU,YAAW,UAE1C,YAAA;AAAA,4BACCA,GAAK,EAAA,QAAO,SAAQ,WAAU,YAAW,UAE1C,iBAAA;AAAA,QAAA,GACF;AAAA,QACA,gBAAAJ,EAACK,GAAU,EAAA,SAASR,GAAU,OAAM,yBAClC,UAAC,gBAAAG,EAAAM,GAAA,EAAU,OAAM,QAAA,CAAQ,EAC3B,CAAA;AAAA,MAAA,GACF;AAAA,MAECR,EAAW,IAAI,CAAAS,wBACbL,GAAS,EAAA,UAAU,MAAM,OAAO,KAC/B,UAAC,gBAAAF,EAAAQ,GAAA,EAAU,WAAWD,GAAM,UAAAV,GAAoB,aAAAE,GAA0B,EADjC,GAAAQ,EAAK,aAEhD,CACD;AAAA,IAAA;AAAA,EAAA;AAAA,EAEL,CAAA,EACF,CAAA,GAIWE,IAAAC,EAAKd,CAAY;"}
+{"version":3,"file":"homework-menu.js","sources":["../../../../../src/features/cue-canvas/sidebar/homework/homework-menu.tsx"],"sourcesContent":["import type { IHomeWorkMenuProps } from './homework-types';\n\nimport { memo } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport HWRequest from './homework-request';\nimport * as Styled from './homework-styled';\n\nconst HomeWorkMenu: React.FC<IHomeWorkMenuProps> = ({ onSelect, hwRequests }) => {\n  return (\n    <Styled.MenuContainer>\n      <FlexView>\n        <FlexView\n          $flexDirection=\"row\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $flexWrap\n          $gutterX={0.5}\n          $gapX={0.5}\n        >\n          <FlexView $flexDirection=\"row\" $gapX={0.5}>\n            <FlexView $width={'184px'} $gutterX={1}>\n              <Text $color=\"WHITE\" $renderAs=\"eyebrow2\">\n                HOMEWORK\n              </Text>\n              <Text $color=\"WHITE\" $renderAs=\"eyebrow2\">\n                HELP REQUESTS\n              </Text>\n            </FlexView>\n            <Clickable onClick={onSelect} label=\"close activities menu\">\n              <CrossIcon color=\"WHITE\" />\n            </Clickable>\n          </FlexView>\n\n          {hwRequests.map(item => (\n            <FlexView $gutterX={0.25} $gapX={0.5} key={item.created_on_ts}>\n              <HWRequest hwRequest={item} onSelect={onSelect} studentName={item.student_name} />\n            </FlexView>\n          ))}\n        </FlexView>\n      </FlexView>\n    </Styled.MenuContainer>\n  );\n};\n\nexport default memo(HomeWorkMenu);\n"],"names":["HomeWorkMenu","onSelect","hwRequests","jsx","Styled.MenuContainer","FlexView","jsxs","Text","Clickable","CrossIcon","item","HWRequest","HomeWorkMenu$1","memo"],"mappings":";;;;;;;;AAWA,MAAMA,IAA6C,CAAC,EAAE,UAAAC,GAAU,YAAAC,QAE3D,gBAAAC,EAAAC,GAAA,EACC,4BAACC,GACC,EAAA,UAAA,gBAAAC;AAAA,EAACD;AAAA,EAAA;AAAA,IACC,gBAAe;AAAA,IACf,aAAY;AAAA,IACZ,iBAAgB;AAAA,IAChB,WAAS;AAAA,IACT,UAAU;AAAA,IACV,OAAO;AAAA,IAEP,UAAA;AAAA,MAAA,gBAAAC,EAACD,GAAS,EAAA,gBAAe,OAAM,OAAO,KACpC,UAAA;AAAA,QAAA,gBAAAC,EAACD,GAAS,EAAA,QAAQ,SAAS,UAAU,GACnC,UAAA;AAAA,UAAA,gBAAAF,EAACI,GAAK,EAAA,QAAO,SAAQ,WAAU,YAAW,UAE1C,YAAA;AAAA,4BACCA,GAAK,EAAA,QAAO,SAAQ,WAAU,YAAW,UAE1C,iBAAA;AAAA,QAAA,GACF;AAAA,QACA,gBAAAJ,EAACK,GAAU,EAAA,SAASP,GAAU,OAAM,yBAClC,UAAC,gBAAAE,EAAAM,GAAA,EAAU,OAAM,QAAA,CAAQ,EAC3B,CAAA;AAAA,MAAA,GACF;AAAA,MAECP,EAAW,IAAI,CACdQ,MAAA,gBAAAP,EAACE,KAAS,UAAU,MAAM,OAAO,KAC/B,UAAA,gBAAAF,EAACQ,KAAU,WAAWD,GAAM,UAAAT,GAAoB,aAAaS,EAAK,cAAc,EADvC,GAAAA,EAAK,aAEhD,CACD;AAAA,IAAA;AAAA,EAAA;AAAA,EAEL,CAAA,EACF,CAAA,GAIWE,IAAAC,EAAKb,CAAY;"}

package/dist/features/cue-canvas/sidebar/homework/homework-request.js

@@ -25,8 +25,8 @@ const D = (u) => {
             {
               name: "text",
               html: n,
-              x: 879.323630603094,
-              y: 75.07325572085722,
+              x: 500,
+              y: 75,
               rot: 0
             }
           ]
@@ -39,15 +39,16 @@ const D = (u) => {
           {
             name: "image",
             href: R,
-            x: 48.30546944572333,
-            y: 72.56813201988393,
-            rot: 0
+            x: 48,
+            y: 72,
+            rot: 0,
+            width: 400
           }
         ];
       }), t == null || t.replaceCanvas(i);
     }
     r(), m(s);
-  }, [t, n, s, e, r, m]), { date: I, month: w } = E(f), b = `${c.ordinal(I)} ${c.titleCase((a = T(w)) == null ? void 0 : a.toLowerCase())}`;
+  }, [t, n, s, e, r, m]), { date: w, month: I } = E(f), b = `${c.ordinal(w)} ${c.titleCase((a = T(I)) == null ? void 0 : a.toLowerCase())}`;
   return /* @__PURE__ */ o(W, { label: "HW Request Item", onClick: g, children: /* @__PURE__ */ q(_, { $alignItems: "center", $justifyContent: "center", $borderRadius: 8, $background: "WHITE", children: [
     /* @__PURE__ */ o(v, { src: e[0], alt: "Homework Request" }),
     /* @__PURE__ */ o(d, { $renderAs: "body3", color: "WHITE", children: p }),

package/dist/features/cue-canvas/sidebar/homework/homework-request.js.map

@@ -1 +1 @@
-{"version":3,"file":"homework-request.js","sources":["../../../../../src/features/cue-canvas/sidebar/homework/homework-request.tsx"],"sourcesContent":["import type { IReplaceCanvas } from '../../types/cue-canvas';\nimport type { IHomeWorkRequestProps } from './homework-types';\n\nimport { ordinal, titleCase } from 'humanize-plus';\nimport { memo, useCallback } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport { useCueCanvasActions } from '../../hooks/use-cue-canvas-actions';\nimport { getDateInInputFormat, getMonthNameforNumber } from './helper';\nimport * as Styled from './homework-styled';\n\nconst HomeWorkRequest: React.FC<IHomeWorkRequestProps> = props => {\n  const { hwRequest, onSelect, studentName } = props;\n  const {\n    problem_description: hwRequestDesc,\n    problem_image_urls: hwRequestImages,\n    created_on_ts: createdOnTs,\n    homework_id: hwRequestId,\n  } = hwRequest;\n  const { setHomeworkId, activeInstance } = useCueCanvasActions();\n\n  const onSelectHwRequest = useCallback(() => {\n    const textId = uuidv4();\n\n    if (hwRequestImages && hwRequestImages.length > 0) {\n      const actionData: IReplaceCanvas = {\n        data: {\n          [textId]: [\n            undefined,\n            {\n              name: 'text',\n              html: hwRequestDesc,\n              x: 879.323630603094,\n              y: 75.07325572085722,\n              rot: 0,\n            },\n          ],\n        },\n      };\n\n      hwRequestImages.forEach(image => {\n        const imgId = uuidv4();\n        const imageUrl = image + `?${Date.now()}`;\n\n        actionData.data[imgId] = [\n          undefined,\n          {\n            name: 'image',\n            href: imageUrl,\n            x: 48.30546944572333,\n            y: 72.56813201988393,\n            rot: 0,\n          },\n        ];\n      });\n\n      activeInstance?.replaceCanvas(actionData);\n    }\n    // const url = new URL(window.location.href);\n    // url.searchParams.set('homeworkId', hwRequestId);\n    // console.log('url', url);\n    // window.history.replaceState({}, '', url.toString());\n    onSelect();\n    setHomeworkId(hwRequestId);\n  }, [activeInstance, hwRequestDesc, hwRequestId, hwRequestImages, onSelect, setHomeworkId]);\n\n  const { date, month } = getDateInInputFormat(createdOnTs);\n\n  const dateString = `${ordinal(date)} ${titleCase(getMonthNameforNumber(month)?.toLowerCase())}`;\n\n  return (\n    <Clickable label=\"HW Request Item\" onClick={onSelectHwRequest}>\n      <FlexView $alignItems=\"center\" $justifyContent=\"center\" $borderRadius={8} $background=\"WHITE\">\n        <Styled.HWImageContainer src={hwRequestImages[0]} alt=\"Homework Request\" />\n        <Text $renderAs=\"body3\" color=\"WHITE\">\n          {studentName}\n        </Text>\n        <Text $renderAs=\"body3\" color=\"WHITE\">\n          {dateString}\n        </Text>\n      </FlexView>\n    </Clickable>\n  );\n};\n\nexport default memo(HomeWorkRequest);\n"],"names":["HomeWorkRequest","props","hwRequest","onSelect","studentName","hwRequestDesc","hwRequestImages","createdOnTs","hwRequestId","setHomeworkId","activeInstance","useCueCanvasActions","onSelectHwRequest","useCallback","textId","uuidv4","actionData","image","imgId","imageUrl","date","month","getDateInInputFormat","dateString","ordinal","titleCase","_a","getMonthNameforNumber","jsx","Clickable","jsxs","FlexView","Styled.HWImageContainer","Text","HWRequest","memo"],"mappings":";;;;;;;;;;AAcA,MAAMA,IAAmD,CAASC,MAAA;;AAChE,QAAM,EAAE,WAAAC,GAAW,UAAAC,GAAU,aAAAC,EAAA,IAAgBH,GACvC;AAAA,IACJ,qBAAqBI;AAAA,IACrB,oBAAoBC;AAAA,IACpB,eAAeC;AAAA,IACf,aAAaC;AAAA,EACX,IAAAN,GACE,EAAE,eAAAO,GAAe,gBAAAC,EAAe,IAAIC,EAAoB,GAExDC,IAAoBC,EAAY,MAAM;AAC1C,UAAMC,IAASC;AAEX,QAAAT,KAAmBA,EAAgB,SAAS,GAAG;AACjD,YAAMU,IAA6B;AAAA,QACjC,MAAM;AAAA,UACJ,CAACF,CAAM,GAAG;AAAA,YACR;AAAA,YACA;AAAA,cACE,MAAM;AAAA,cACN,MAAMT;AAAA,cACN,GAAG;AAAA,cACH,GAAG;AAAA,cACH,KAAK;AAAA,YACP;AAAA,UACF;AAAA,QACF;AAAA,MAAA;AAGF,MAAAC,EAAgB,QAAQ,CAASW,MAAA;AAC/B,cAAMC,IAAQH,KACRI,IAAWF,IAAQ,IAAI,KAAK,IAAK,CAAA;AAE5B,QAAAD,EAAA,KAAKE,CAAK,IAAI;AAAA,UACvB;AAAA,UACA;AAAA,YACE,MAAM;AAAA,YACN,MAAMC;AAAA,YACN,GAAG;AAAA,YACH,GAAG;AAAA,YACH,KAAK;AAAA,UACP;AAAA,QAAA;AAAA,MACF,CACD,GAEDT,KAAA,QAAAA,EAAgB,cAAcM;AAAA,IAChC;AAKS,IAAAb,KACTM,EAAcD,CAAW;AAAA,EAAA,GACxB,CAACE,GAAgBL,GAAeG,GAAaF,GAAiBH,GAAUM,CAAa,CAAC,GAEnF,EAAE,MAAAW,GAAM,OAAAC,EAAM,IAAIC,EAAqBf,CAAW,GAElDgB,IAAa,GAAGC,UAAQJ,CAAI,CAAC,IAAIK,aAAUC,IAAAC,EAAsBN,CAAK,MAA3B,gBAAAK,EAA8B,aAAa,CAAC;AAE7F,SACG,gBAAAE,EAAAC,GAAA,EAAU,OAAM,mBAAkB,SAASjB,GAC1C,UAAA,gBAAAkB,EAACC,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAAS,eAAe,GAAG,aAAY,SACpF,UAAA;AAAA,IAAC,gBAAAH,EAAAI,GAAA,EAAwB,KAAK1B,EAAgB,CAAC,GAAG,KAAI,oBAAmB;AAAA,sBACxE2B,GAAK,EAAA,WAAU,SAAQ,OAAM,SAC3B,UACH7B,GAAA;AAAA,sBACC6B,GAAK,EAAA,WAAU,SAAQ,OAAM,SAC3B,UACHV,GAAA;AAAA,EAAA,EACF,CAAA,EACF,CAAA;AAEJ,GAEeW,IAAAC,EAAKnC,CAAe;"}
+{"version":3,"file":"homework-request.js","sources":["../../../../../src/features/cue-canvas/sidebar/homework/homework-request.tsx"],"sourcesContent":["import type { IReplaceCanvas } from '../../types/cue-canvas';\nimport type { IHomeWorkRequestProps } from './homework-types';\n\nimport { ordinal, titleCase } from 'humanize-plus';\nimport { memo, useCallback } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport { useCueCanvasActions } from '../../hooks/use-cue-canvas-actions';\nimport { getDateInInputFormat, getMonthNameforNumber } from './helper';\nimport * as Styled from './homework-styled';\n\nconst HomeWorkRequest: React.FC<IHomeWorkRequestProps> = props => {\n  const { hwRequest, onSelect, studentName } = props;\n  const {\n    problem_description: hwRequestDesc,\n    problem_image_urls: hwRequestImages,\n    created_on_ts: createdOnTs,\n    homework_id: hwRequestId,\n  } = hwRequest;\n  const { setHomeworkId, activeInstance } = useCueCanvasActions();\n\n  const onSelectHwRequest = useCallback(() => {\n    const textId = uuidv4();\n\n    if (hwRequestImages && hwRequestImages.length > 0) {\n      const actionData: IReplaceCanvas = {\n        data: {\n          [textId]: [\n            undefined,\n            {\n              name: 'text',\n              html: hwRequestDesc,\n              x: 500,\n              y: 75,\n              rot: 0,\n            },\n          ],\n        },\n      };\n\n      hwRequestImages.forEach(image => {\n        const imgId = uuidv4();\n        const imageUrl = image + `?${Date.now()}`;\n\n        actionData.data[imgId] = [\n          undefined,\n          {\n            name: 'image',\n            href: imageUrl,\n            x: 48,\n            y: 72,\n            rot: 0,\n            width: 400,\n          },\n        ];\n      });\n\n      activeInstance?.replaceCanvas(actionData);\n    }\n    // const url = new URL(window.location.href);\n    // url.searchParams.set('homeworkId', hwRequestId);\n    // console.log('url', url);\n    // window.history.replaceState({}, '', url.toString());\n    onSelect();\n    setHomeworkId(hwRequestId);\n  }, [activeInstance, hwRequestDesc, hwRequestId, hwRequestImages, onSelect, setHomeworkId]);\n\n  const { date, month } = getDateInInputFormat(createdOnTs);\n\n  const dateString = `${ordinal(date)} ${titleCase(getMonthNameforNumber(month)?.toLowerCase())}`;\n\n  return (\n    <Clickable label=\"HW Request Item\" onClick={onSelectHwRequest}>\n      <FlexView $alignItems=\"center\" $justifyContent=\"center\" $borderRadius={8} $background=\"WHITE\">\n        <Styled.HWImageContainer src={hwRequestImages[0]} alt=\"Homework Request\" />\n        <Text $renderAs=\"body3\" color=\"WHITE\">\n          {studentName}\n        </Text>\n        <Text $renderAs=\"body3\" color=\"WHITE\">\n          {dateString}\n        </Text>\n      </FlexView>\n    </Clickable>\n  );\n};\n\nexport default memo(HomeWorkRequest);\n"],"names":["HomeWorkRequest","props","hwRequest","onSelect","studentName","hwRequestDesc","hwRequestImages","createdOnTs","hwRequestId","setHomeworkId","activeInstance","useCueCanvasActions","onSelectHwRequest","useCallback","textId","uuidv4","actionData","image","imgId","imageUrl","date","month","getDateInInputFormat","dateString","ordinal","titleCase","_a","getMonthNameforNumber","jsx","Clickable","jsxs","FlexView","Styled.HWImageContainer","Text","HWRequest","memo"],"mappings":";;;;;;;;;;AAcA,MAAMA,IAAmD,CAASC,MAAA;;AAChE,QAAM,EAAE,WAAAC,GAAW,UAAAC,GAAU,aAAAC,EAAA,IAAgBH,GACvC;AAAA,IACJ,qBAAqBI;AAAA,IACrB,oBAAoBC;AAAA,IACpB,eAAeC;AAAA,IACf,aAAaC;AAAA,EACX,IAAAN,GACE,EAAE,eAAAO,GAAe,gBAAAC,EAAe,IAAIC,EAAoB,GAExDC,IAAoBC,EAAY,MAAM;AAC1C,UAAMC,IAASC;AAEX,QAAAT,KAAmBA,EAAgB,SAAS,GAAG;AACjD,YAAMU,IAA6B;AAAA,QACjC,MAAM;AAAA,UACJ,CAACF,CAAM,GAAG;AAAA,YACR;AAAA,YACA;AAAA,cACE,MAAM;AAAA,cACN,MAAMT;AAAA,cACN,GAAG;AAAA,cACH,GAAG;AAAA,cACH,KAAK;AAAA,YACP;AAAA,UACF;AAAA,QACF;AAAA,MAAA;AAGF,MAAAC,EAAgB,QAAQ,CAASW,MAAA;AAC/B,cAAMC,IAAQH,KACRI,IAAWF,IAAQ,IAAI,KAAK,IAAK,CAAA;AAE5B,QAAAD,EAAA,KAAKE,CAAK,IAAI;AAAA,UACvB;AAAA,UACA;AAAA,YACE,MAAM;AAAA,YACN,MAAMC;AAAA,YACN,GAAG;AAAA,YACH,GAAG;AAAA,YACH,KAAK;AAAA,YACL,OAAO;AAAA,UACT;AAAA,QAAA;AAAA,MACF,CACD,GAEDT,KAAA,QAAAA,EAAgB,cAAcM;AAAA,IAChC;AAKS,IAAAb,KACTM,EAAcD,CAAW;AAAA,EAAA,GACxB,CAACE,GAAgBL,GAAeG,GAAaF,GAAiBH,GAAUM,CAAa,CAAC,GAEnF,EAAE,MAAAW,GAAM,OAAAC,EAAM,IAAIC,EAAqBf,CAAW,GAElDgB,IAAa,GAAGC,UAAQJ,CAAI,CAAC,IAAIK,aAAUC,IAAAC,EAAsBN,CAAK,MAA3B,gBAAAK,EAA8B,aAAa,CAAC;AAE7F,SACG,gBAAAE,EAAAC,GAAA,EAAU,OAAM,mBAAkB,SAASjB,GAC1C,UAAA,gBAAAkB,EAACC,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAAS,eAAe,GAAG,aAAY,SACpF,UAAA;AAAA,IAAC,gBAAAH,EAAAI,GAAA,EAAwB,KAAK1B,EAAgB,CAAC,GAAG,KAAI,oBAAmB;AAAA,sBACxE2B,GAAK,EAAA,WAAU,SAAQ,OAAM,SAC3B,UACH7B,GAAA;AAAA,sBACC6B,GAAK,EAAA,WAAU,SAAQ,OAAM,SAC3B,UACHV,GAAA;AAAA,EAAA,EACF,CAAA,EACF,CAAA;AAEJ,GAEeW,IAAAC,EAAKnC,CAAe;"}

package/dist/features/cue-canvas/sidebar/homework/homework-styled.js

@@ -1,6 +1,6 @@
 import o from "styled-components";
-import t from "../../../ui/layout/flex-view.js";
-const i = o(t)`
+import r from "../../../ui/layout/flex-view.js";
+const e = o(r)`
   position: absolute;
   top: 38px;
   left: -79px; //32px + 32 px  for icon +4 + 4 gutter + 7 padding
@@ -8,9 +8,9 @@ const i = o(t)`
   height: 438px;
   border-radius: 6px;
   background: #292734;
-  box-shadow: 0px 4px 8px ${({ theme: r }) => r.colors.BLACK_T_20};
+  box-shadow: 0px 4px 8px ${({ theme: t }) => t.colors.BLACK_T_20};
   overflow-y: auto;
-`, d = o.img`
+`, d = o.img.attrs({ loading: "lazy" })`
   width: 184px;
   height: 128px;
   border-top-left-radius: 8px;
@@ -20,6 +20,6 @@ const i = o(t)`
 `;
 export {
   d as HWImageContainer,
-  i as MenuContainer
+  e as MenuContainer
 };
 //# sourceMappingURL=homework-styled.js.map

package/dist/features/cue-canvas/sidebar/homework/homework-styled.js.map

@@ -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: -79px; //32px + 32 px  for icon +4 + 4 gutter + 7 padding\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`\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;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"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: -79px; //32px + 32 px  for icon +4 + 4 gutter + 7 padding\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;"}

package/dist/features/cue-canvas/sidebar/homework/homework.js

@@ -1,32 +1,32 @@
-import { jsxs as k, jsx as r } from "react/jsx-runtime";
-import { memo as d, useRef as p, useCallback as c, useEffect as C } from "react";
-import w from "../../../../assets/line-icons/icons/hw.js";
-import v from "../../../ui/buttons/clickable/clickable.js";
-import b from "../../../ui/hooks/use-context-menu-click-handler.js";
-import H from "../../../ui/layout/flex-view.js";
-import { StyledWrapper as W } from "../../cue-cavas-styled.js";
-import { useCueCanvasActions as x } from "../../hooks/use-cue-canvas-actions.js";
-import M from "./homework-menu.js";
-const R = (a) => {
-  const { activeSidebar: e, setActiveSidebar: o, hwRequests: f, studentName: u } = a, { activeInstance: t } = x(), l = p(null), h = c(
+import { jsxs as u, jsx as r } from "react/jsx-runtime";
+import { memo as k, useRef as d, useCallback as c, useEffect as p } from "react";
+import C from "../../../../assets/line-icons/icons/hw.js";
+import w from "../../../ui/buttons/clickable/clickable.js";
+import v from "../../../ui/hooks/use-context-menu-click-handler.js";
+import b from "../../../ui/layout/flex-view.js";
+import { StyledWrapper as H } from "../../cue-cavas-styled.js";
+import { useCueCanvasActions as W } from "../../hooks/use-cue-canvas-actions.js";
+import x from "./homework-menu.js";
+const M = (a) => {
+  const { activeSidebar: e, setActiveSidebar: o, hwRequests: f } = a, { activeInstance: t } = W(), n = d(null), h = c(
     () => o((s) => s === "homework" ? void 0 : s),
     [o]
-  ), { menuVisible: n, onMenuClick: i } = b(
-    l,
+  ), { menuVisible: l, onMenuClick: i } = v(
+    n,
     void 0,
     !0,
     h
   ), m = c(() => {
     e === "tile" && (t == null || t.toggleTiles(!1)), o(e === "homework" ? void 0 : "homework"), i();
   }, [e, t, i, o]);
-  return C(() => {
-    e === "tile" && n && i();
-  }, [e, n, i]), /* @__PURE__ */ k(H, { $position: "relative", ref: l, children: [
-    /* @__PURE__ */ r(v, { onClick: m, label: "homework help", children: /* @__PURE__ */ r(W, { $active: e === "homework", children: /* @__PURE__ */ r(w, { width: 20, height: 20, fill: e === "homework" ? "WHITE" : "BLACK" }) }) }),
-    n && /* @__PURE__ */ r(M, { onSelect: m, hwRequests: f, studentName: u })
+  return p(() => {
+    e === "tile" && l && i();
+  }, [e, l, i]), /* @__PURE__ */ u(b, { $position: "relative", ref: n, children: [
+    /* @__PURE__ */ r(w, { onClick: m, label: "homework help", children: /* @__PURE__ */ r(H, { $active: e === "homework", children: /* @__PURE__ */ r(C, { width: 20, height: 20, fill: e === "homework" ? "WHITE" : "BLACK" }) }) }),
+    l && /* @__PURE__ */ r(x, { onSelect: m, hwRequests: f })
   ] });
-}, $ = d(R);
+}, V = k(M);
 export {
-  $ as default
+  V as default
 };
 //# sourceMappingURL=homework.js.map

package/dist/features/cue-canvas/sidebar/homework/homework.js.map

@@ -1 +1 @@
-{"version":3,"file":"homework.js","sources":["../../../../../src/features/cue-canvas/sidebar/homework/homework.tsx"],"sourcesContent":["import type { IHomeWorkRequestsContainerProps } from './homework-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useEffect, useRef } from 'react';\n\nimport HWIcon from '../../../../assets/line-icons/icons/hw';\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 { StyledWrapper } from '../../cue-cavas-styled';\nimport { useCueCanvasActions } from '../../hooks/use-cue-canvas-actions';\nimport HomeWorkMenu from './homework-menu';\n\nconst HomeWorkRequestsContainer: FC<IHomeWorkRequestsContainerProps> = props => {\n  const { activeSidebar, setActiveSidebar, hwRequests, studentName } = props;\n  const { activeInstance: cueCanvas } = useCueCanvasActions();\n  const homeWorkMenuRef = useRef(null);\n\n  const handleMenuClose = useCallback(\n    () => setActiveSidebar(prev => (prev === 'homework' ? undefined : prev)),\n    [setActiveSidebar],\n  );\n  const { menuVisible, onMenuClick } = useContextMenuClickHandler(\n    homeWorkMenuRef,\n    undefined,\n    true,\n    handleMenuClose,\n  );\n\n  const handleClick = useCallback(() => {\n    if (activeSidebar === 'tile') {\n      cueCanvas?.toggleTiles(false);\n    }\n    setActiveSidebar(activeSidebar === 'homework' ? undefined : 'homework');\n    onMenuClick();\n  }, [activeSidebar, cueCanvas, onMenuClick, setActiveSidebar]);\n\n  useEffect(() => {\n    if (activeSidebar === 'tile' && menuVisible) {\n      onMenuClick();\n    }\n  }, [activeSidebar, menuVisible, onMenuClick]);\n\n  return (\n    <FlexView $position=\"relative\" ref={homeWorkMenuRef}>\n      <Clickable onClick={handleClick} label=\"homework help\">\n        <StyledWrapper $active={activeSidebar === 'homework'}>\n          <HWIcon width={20} height={20} fill={activeSidebar === 'homework' ? 'WHITE' : 'BLACK'} />\n        </StyledWrapper>\n      </Clickable>\n      {menuVisible && (\n        <HomeWorkMenu onSelect={handleClick} hwRequests={hwRequests} studentName={studentName} />\n      )}\n    </FlexView>\n  );\n};\n\nexport default memo(HomeWorkRequestsContainer);\n"],"names":["HomeWorkRequestsContainer","props","activeSidebar","setActiveSidebar","hwRequests","studentName","cueCanvas","useCueCanvasActions","homeWorkMenuRef","useRef","handleMenuClose","useCallback","prev","menuVisible","onMenuClick","useContextMenuClickHandler","handleClick","useEffect","jsxs","FlexView","jsx","Clickable","StyledWrapper","HWIcon","HomeWorkMenu","Homework","memo"],"mappings":";;;;;;;;;AAaA,MAAMA,IAAiE,CAASC,MAAA;AAC9E,QAAM,EAAE,eAAAC,GAAe,kBAAAC,GAAkB,YAAAC,GAAY,aAAAC,MAAgBJ,GAC/D,EAAE,gBAAgBK,EAAU,IAAIC,EAAoB,GACpDC,IAAkBC,EAAO,IAAI,GAE7BC,IAAkBC;AAAA,IACtB,MAAMR,EAAiB,CAAAS,MAASA,MAAS,aAAa,SAAYA,CAAK;AAAA,IACvE,CAACT,CAAgB;AAAA,EAAA,GAEb,EAAE,aAAAU,GAAa,aAAAC,EAAA,IAAgBC;AAAA,IACnCP;AAAA,IACA;AAAA,IACA;AAAA,IACAE;AAAA,EAAA,GAGIM,IAAcL,EAAY,MAAM;AACpC,IAAIT,MAAkB,WACpBI,KAAA,QAAAA,EAAW,YAAY,MAERH,EAAAD,MAAkB,aAAa,SAAY,UAAU,GAC1DY;KACX,CAACZ,GAAeI,GAAWQ,GAAaX,CAAgB,CAAC;AAE5D,SAAAc,EAAU,MAAM;AACV,IAAAf,MAAkB,UAAUW,KAClBC;EAEb,GAAA,CAACZ,GAAeW,GAAaC,CAAW,CAAC,GAGzC,gBAAAI,EAAAC,GAAA,EAAS,WAAU,YAAW,KAAKX,GAClC,UAAA;AAAA,IAAC,gBAAAY,EAAAC,GAAA,EAAU,SAASL,GAAa,OAAM,iBACrC,UAAC,gBAAAI,EAAAE,GAAA,EAAc,SAASpB,MAAkB,YACxC,UAAA,gBAAAkB,EAACG,KAAO,OAAO,IAAI,QAAQ,IAAI,MAAMrB,MAAkB,aAAa,UAAU,QAAS,CAAA,EAAA,CACzF,EACF,CAAA;AAAA,IACCW,KACE,gBAAAO,EAAAI,GAAA,EAAa,UAAUR,GAAa,YAAAZ,GAAwB,aAAAC,GAA0B;AAAA,EAE3F,EAAA,CAAA;AAEJ,GAEeoB,IAAAC,EAAK1B,CAAyB;"}
+{"version":3,"file":"homework.js","sources":["../../../../../src/features/cue-canvas/sidebar/homework/homework.tsx"],"sourcesContent":["import type { IHomeWorkRequestsContainerProps } from './homework-types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useEffect, useRef } from 'react';\n\nimport HWIcon from '../../../../assets/line-icons/icons/hw';\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 { StyledWrapper } from '../../cue-cavas-styled';\nimport { useCueCanvasActions } from '../../hooks/use-cue-canvas-actions';\nimport HomeWorkMenu from './homework-menu';\n\nconst HomeWorkRequestsContainer: FC<IHomeWorkRequestsContainerProps> = props => {\n  const { activeSidebar, setActiveSidebar, hwRequests } = props;\n  const { activeInstance: cueCanvas } = useCueCanvasActions();\n  const homeWorkMenuRef = useRef(null);\n\n  const handleMenuClose = useCallback(\n    () => setActiveSidebar(prev => (prev === 'homework' ? undefined : prev)),\n    [setActiveSidebar],\n  );\n  const { menuVisible, onMenuClick } = useContextMenuClickHandler(\n    homeWorkMenuRef,\n    undefined,\n    true,\n    handleMenuClose,\n  );\n\n  const handleClick = useCallback(() => {\n    if (activeSidebar === 'tile') {\n      cueCanvas?.toggleTiles(false);\n    }\n    setActiveSidebar(activeSidebar === 'homework' ? undefined : 'homework');\n    onMenuClick();\n  }, [activeSidebar, cueCanvas, onMenuClick, setActiveSidebar]);\n\n  useEffect(() => {\n    if (activeSidebar === 'tile' && menuVisible) {\n      onMenuClick();\n    }\n  }, [activeSidebar, menuVisible, onMenuClick]);\n\n  return (\n    <FlexView $position=\"relative\" ref={homeWorkMenuRef}>\n      <Clickable onClick={handleClick} label=\"homework help\">\n        <StyledWrapper $active={activeSidebar === 'homework'}>\n          <HWIcon width={20} height={20} fill={activeSidebar === 'homework' ? 'WHITE' : 'BLACK'} />\n        </StyledWrapper>\n      </Clickable>\n      {menuVisible && <HomeWorkMenu onSelect={handleClick} hwRequests={hwRequests} />}\n    </FlexView>\n  );\n};\n\nexport default memo(HomeWorkRequestsContainer);\n"],"names":["HomeWorkRequestsContainer","props","activeSidebar","setActiveSidebar","hwRequests","cueCanvas","useCueCanvasActions","homeWorkMenuRef","useRef","handleMenuClose","useCallback","prev","menuVisible","onMenuClick","useContextMenuClickHandler","handleClick","useEffect","jsxs","FlexView","jsx","Clickable","StyledWrapper","HWIcon","HomeWorkMenu","Homework","memo"],"mappings":";;;;;;;;;AAaA,MAAMA,IAAiE,CAASC,MAAA;AAC9E,QAAM,EAAE,eAAAC,GAAe,kBAAAC,GAAkB,YAAAC,EAAA,IAAeH,GAClD,EAAE,gBAAgBI,EAAU,IAAIC,EAAoB,GACpDC,IAAkBC,EAAO,IAAI,GAE7BC,IAAkBC;AAAA,IACtB,MAAMP,EAAiB,CAAAQ,MAASA,MAAS,aAAa,SAAYA,CAAK;AAAA,IACvE,CAACR,CAAgB;AAAA,EAAA,GAEb,EAAE,aAAAS,GAAa,aAAAC,EAAA,IAAgBC;AAAA,IACnCP;AAAA,IACA;AAAA,IACA;AAAA,IACAE;AAAA,EAAA,GAGIM,IAAcL,EAAY,MAAM;AACpC,IAAIR,MAAkB,WACpBG,KAAA,QAAAA,EAAW,YAAY,MAERF,EAAAD,MAAkB,aAAa,SAAY,UAAU,GAC1DW;KACX,CAACX,GAAeG,GAAWQ,GAAaV,CAAgB,CAAC;AAE5D,SAAAa,EAAU,MAAM;AACV,IAAAd,MAAkB,UAAUU,KAClBC;EAEb,GAAA,CAACX,GAAeU,GAAaC,CAAW,CAAC,GAGzC,gBAAAI,EAAAC,GAAA,EAAS,WAAU,YAAW,KAAKX,GAClC,UAAA;AAAA,IAAC,gBAAAY,EAAAC,GAAA,EAAU,SAASL,GAAa,OAAM,iBACrC,UAAC,gBAAAI,EAAAE,GAAA,EAAc,SAASnB,MAAkB,YACxC,UAAA,gBAAAiB,EAACG,KAAO,OAAO,IAAI,QAAQ,IAAI,MAAMpB,MAAkB,aAAa,UAAU,QAAS,CAAA,EAAA,CACzF,EACF,CAAA;AAAA,IACCU,KAAe,gBAAAO,EAACI,GAAa,EAAA,UAAUR,GAAa,YAAAX,GAAwB;AAAA,EAC/E,EAAA,CAAA;AAEJ,GAEeoB,IAAAC,EAAKzB,CAAyB;"}

package/dist/features/cue-canvas/sidebar/sidebar.js

@@ -1,34 +1,33 @@
-import { jsxs as a, jsx as e } from "react/jsx-runtime";
-import { memo as s, useState as f } from "react";
-import n from "./homework/homework.js";
-import c from "./puzzles/puzzles.js";
-import { SideBarContainer as d } from "./sidebar-styled.js";
-import p from "./tiles/tile.js";
-const l = ({ grade: i, hwRequests: o, studentName: m }) => {
-  const [r, t] = f();
-  return /* @__PURE__ */ a(
-    d,
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { memo as a, useState as s } from "react";
+import f from "./homework/homework.js";
+import n from "./puzzles/puzzles.js";
+import { SideBarContainer as c } from "./sidebar-styled.js";
+import d from "./tiles/tile.js";
+const p = ({ grade: i, hwRequests: o }) => {
+  const [r, t] = s();
+  return /* @__PURE__ */ m(
+    c,
     {
       $activeSidebar: r,
       $flexDirection: "row",
       $justifyContent: "flex-start",
       children: [
-        /* @__PURE__ */ e(p, { activeSidebar: r, setActiveSidebar: t }),
-        /* @__PURE__ */ e(c, { grade: i, activeSidebar: r, setActiveSidebar: t }),
+        /* @__PURE__ */ e(d, { activeSidebar: r, setActiveSidebar: t }),
+        /* @__PURE__ */ e(n, { grade: i, activeSidebar: r, setActiveSidebar: t }),
         o && /* @__PURE__ */ e(
-          n,
+          f,
           {
             activeSidebar: r,
             setActiveSidebar: t,
-            hwRequests: o,
-            studentName: m
+            hwRequests: o
           }
         )
       ]
     }
   );
-}, $ = s(l);
+}, v = a(p);
 export {
-  $ as default
+  v as default
 };
 //# sourceMappingURL=sidebar.js.map

package/dist/features/cue-canvas/sidebar/sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar.js","sources":["../../../../src/features/cue-canvas/sidebar/sidebar.tsx"],"sourcesContent":["import type { IHomeWorkHelpRequestModel } 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?: IHomeWorkHelpRequestModel[];\n  studentName?: string;\n}\n\nconst Sidebar: FC<ISidebar> = ({ grade, hwRequests, studentName }) => {\n  const [activeSidebar, setActiveSidebar] = useState<TActiveSidebar | undefined>();\n\n  return (\n    <SideBarContainer\n      $activeSidebar={activeSidebar}\n      $flexDirection=\"row\"\n      $justifyContent=\"flex-start\"\n    >\n      <TileBar activeSidebar={activeSidebar} setActiveSidebar={setActiveSidebar} />\n      <Puzzles grade={grade} activeSidebar={activeSidebar} setActiveSidebar={setActiveSidebar} />\n      {hwRequests && (\n        <Homework\n          activeSidebar={activeSidebar}\n          setActiveSidebar={setActiveSidebar}\n          hwRequests={hwRequests}\n          studentName={studentName}\n        />\n      )}\n    </SideBarContainer>\n  );\n};\n\nexport default memo(Sidebar);\n"],"names":["Sidebar","grade","hwRequests","studentName","activeSidebar","setActiveSidebar","useState","jsxs","SideBarContainer","jsx","TileBar","Puzzles","Homework","sidebar","memo"],"mappings":";;;;;;AAiBA,MAAMA,IAAwB,CAAC,EAAE,OAAAC,GAAO,YAAAC,GAAY,aAAAC,QAAkB;AACpE,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAqC;AAG7E,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,gBAAgBJ;AAAA,MAChB,gBAAe;AAAA,MACf,iBAAgB;AAAA,MAEhB,UAAA;AAAA,QAAC,gBAAAK,EAAAC,GAAA,EAAQ,eAAAN,GAA8B,kBAAAC,EAAoC,CAAA;AAAA,QAC1E,gBAAAI,EAAAE,GAAA,EAAQ,OAAAV,GAAc,eAAAG,GAA8B,kBAAAC,EAAoC,CAAA;AAAA,QACxFH,KACC,gBAAAO;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,eAAAR;AAAA,YACA,kBAAAC;AAAA,YACA,YAAAH;AAAA,YACA,aAAAC;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR,GAEeU,IAAAC,EAAKd,CAAO;"}
+{"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    <SideBarContainer\n      $activeSidebar={activeSidebar}\n      $flexDirection=\"row\"\n      $justifyContent=\"flex-start\"\n    >\n      <TileBar activeSidebar={activeSidebar} setActiveSidebar={setActiveSidebar} />\n      <Puzzles grade={grade} activeSidebar={activeSidebar} setActiveSidebar={setActiveSidebar} />\n      {hwRequests && (\n        <Homework\n          activeSidebar={activeSidebar}\n          setActiveSidebar={setActiveSidebar}\n          hwRequests={hwRequests}\n        />\n      )}\n    </SideBarContainer>\n  );\n};\n\nexport default memo(Sidebar);\n"],"names":["Sidebar","grade","hwRequests","activeSidebar","setActiveSidebar","useState","jsxs","SideBarContainer","jsx","TileBar","Puzzles","Homework","sidebar","memo"],"mappings":";;;;;;AAgBA,MAAMA,IAAwB,CAAC,EAAE,OAAAC,GAAO,YAAAC,QAAiB;AACvD,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAqC;AAG7E,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,gBAAgBJ;AAAA,MAChB,gBAAe;AAAA,MACf,iBAAgB;AAAA,MAEhB,UAAA;AAAA,QAAC,gBAAAK,EAAAC,GAAA,EAAQ,eAAAN,GAA8B,kBAAAC,EAAoC,CAAA;AAAA,QAC1E,gBAAAI,EAAAE,GAAA,EAAQ,OAAAT,GAAc,eAAAE,GAA8B,kBAAAC,EAAoC,CAAA;AAAA,QACxFF,KACC,gBAAAM;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,eAAAR;AAAA,YACA,kBAAAC;AAAA,YACA,YAAAF;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR,GAEeU,IAAAC,EAAKb,CAAO;"}

package/dist/features/worksheet/worksheet/hooks/use-s3-helper.js

@@ -1,33 +1,36 @@
-import { useEffect as g, useCallback as w } from "react";
-import { useAwsSignedKey as S } from "../api/subjective-review.js";
-import h from "../../../../node_modules/uuid/dist/esm-browser/v4.js";
-const A = (c) => {
-  const { studentId: t, query: o } = c, { data: a, get: s } = S();
-  return g(() => {
-    s(t, o);
-  }, [o, s, t]), w(
-    async ({ images: d, onSuccess: i, onError: l, fileKey: u, fileName: m }) => {
+import { useRef as h, useEffect as f, useCallback as k } from "react";
+import { useAwsSignedKey as I } from "../api/subjective-review.js";
+import S from "../../../../node_modules/uuid/dist/esm-browser/v4.js";
+const C = (y) => {
+  const { studentId: t, query: o, enabled: r = !0 } = y, { data: s, get: d } = I(), c = h(s);
+  return f(() => {
+    c.current = s;
+  }, [s]), f(() => {
+    r && t && d(t, o);
+  }, [o, d, t, r]), k(
+    async ({ images: g, onSuccess: n, onError: p, fileKey: w, fileName: K }) => {
+      const a = c.current;
       if (!a) return;
-      const r = `https://${a.bucketName}.s3.amazonaws.com/`;
+      const i = `https://${a.bucketName}.s3.amazonaws.com/`;
       try {
-        const n = d.map(async (f) => {
-          const e = new FormData(), p = `${u}${m ?? h()}`;
-          if (e.append("key", p), e.append("AWSAccessKeyId", a.awsKey), e.append("acl", "public-read"), e.append("success_action_redirect", ""), e.append("policy", a.policy), e.append("signature", a.signature), e.append("Content-Type", "image/jpeg"), e.append("file", f.file), !(await fetch(r, {
+        const l = g.map(async (b) => {
+          const e = new FormData(), m = `${w}${K ?? S()}`;
+          if (e.append("key", m), e.append("AWSAccessKeyId", a.awsKey), e.append("acl", "public-read"), e.append("success_action_redirect", ""), e.append("policy", a.policy), e.append("signature", a.signature), e.append("Content-Type", "image/jpeg"), e.append("file", b.file), !(await fetch(i, {
             method: "POST",
             body: e
           })).ok)
             throw new Error("Upload failed");
-          return `${r}${p}`;
-        }), y = await Promise.all(n);
-        i(y);
+          return `${i}${m}`;
+        }), u = await Promise.all(l);
+        return n == null || n(u), u;
       } catch {
-        l();
+        p == null || p();
       }
     },
-    [a]
+    []
   );
 };
 export {
-  A as default
+  C as default
 };
 //# sourceMappingURL=use-s3-helper.js.map

package/dist/features/worksheet/worksheet/hooks/use-s3-helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-s3-helper.js","sources":["../../../../../src/features/worksheet/worksheet/hooks/use-s3-helper.ts"],"sourcesContent":["import type { IFile } from '../worksheet-question/subjective-review';\n\nimport { useCallback, useEffect } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { useAwsSignedKey } from '../api/subjective-review';\n\ninterface IUseS3helper {\n  (params: {\n    studentId: string;\n    query: {\n      type: string;\n    };\n  }): (props: IUploadImageProps) => void;\n}\n\ninterface IUploadImageProps {\n  images: IFile[];\n  onSuccess: (urls: string[]) => void;\n  onError: () => void;\n  fileKey: string;\n  fileName?: string;\n}\n\nconst useS3ImageUploadHelper: IUseS3helper = props => {\n  const { studentId, query } = props;\n  const { data: awsSignedKey, get: getAwsSignedKey } = useAwsSignedKey();\n\n  useEffect(() => {\n    getAwsSignedKey(studentId, query);\n  }, [query, getAwsSignedKey, studentId]);\n\n  const uploadImagesToS3 = useCallback(\n    async ({ images, onSuccess, onError, fileKey, fileName }: IUploadImageProps) => {\n      if (!awsSignedKey) return;\n\n      const url = `https://${awsSignedKey.bucketName}.s3.amazonaws.com/`;\n\n      try {\n        const uploadPromises = images.map(async (item: { file: string | Blob }) => {\n          const formData = new FormData();\n          const key = `${fileKey}${fileName ?? uuidv4()}`;\n\n          formData.append('key', key);\n          formData.append('AWSAccessKeyId', awsSignedKey.awsKey);\n          formData.append('acl', 'public-read');\n          formData.append('success_action_redirect', '');\n          formData.append('policy', awsSignedKey.policy);\n          formData.append('signature', awsSignedKey.signature);\n          formData.append('Content-Type', 'image/jpeg');\n          formData.append('file', item.file);\n\n          const res = await fetch(url, {\n            method: 'POST',\n            body: formData,\n          });\n\n          if (!res.ok) {\n            throw new Error('Upload failed');\n          }\n\n          return `${url}${key}`;\n        });\n\n        const uploadedUrls = await Promise.all(uploadPromises);\n\n        onSuccess(uploadedUrls);\n      } catch (error) {\n        onError();\n      }\n    },\n    [awsSignedKey],\n  );\n\n  return uploadImagesToS3;\n};\n\nexport default useS3ImageUploadHelper;\n"],"names":["useS3ImageUploadHelper","props","studentId","query","awsSignedKey","getAwsSignedKey","useAwsSignedKey","useEffect","useCallback","images","onSuccess","onError","fileKey","fileName","url","uploadPromises","item","formData","key","uuidv4","uploadedUrls"],"mappings":";;;AAwBA,MAAMA,IAAuC,CAASC,MAAA;AAC9C,QAAA,EAAE,WAAAC,GAAW,OAAAC,EAAU,IAAAF,GACvB,EAAE,MAAMG,GAAc,KAAKC,EAAA,IAAoBC;AAErD,SAAAC,EAAU,MAAM;AACd,IAAAF,EAAgBH,GAAWC,CAAK;AAAA,EAC/B,GAAA,CAACA,GAAOE,GAAiBH,CAAS,CAAC,GAEbM;AAAA,IACvB,OAAO,EAAE,QAAAC,GAAQ,WAAAC,GAAW,SAAAC,GAAS,SAAAC,GAAS,UAAAC,QAAkC;AAC9E,UAAI,CAACT,EAAc;AAEb,YAAAU,IAAM,WAAWV,EAAa,UAAU;AAE1C,UAAA;AACF,cAAMW,IAAiBN,EAAO,IAAI,OAAOO,MAAkC;AACnE,gBAAAC,IAAW,IAAI,YACfC,IAAM,GAAGN,CAAO,GAAGC,KAAYM,EAAQ,CAAA;AAgBzC,cAdKF,EAAA,OAAO,OAAOC,CAAG,GACjBD,EAAA,OAAO,kBAAkBb,EAAa,MAAM,GAC5Ca,EAAA,OAAO,OAAO,aAAa,GAC3BA,EAAA,OAAO,2BAA2B,EAAE,GACpCA,EAAA,OAAO,UAAUb,EAAa,MAAM,GACpCa,EAAA,OAAO,aAAab,EAAa,SAAS,GAC1Ca,EAAA,OAAO,gBAAgB,YAAY,GACnCA,EAAA,OAAO,QAAQD,EAAK,IAAI,GAO7B,EALQ,MAAM,MAAMF,GAAK;AAAA,YAC3B,QAAQ;AAAA,YACR,MAAMG;AAAA,UAAA,CACP,GAEQ;AACD,kBAAA,IAAI,MAAM,eAAe;AAG1B,iBAAA,GAAGH,CAAG,GAAGI,CAAG;AAAA,QAAA,CACpB,GAEKE,IAAe,MAAM,QAAQ,IAAIL,CAAc;AAErD,QAAAL,EAAUU,CAAY;AAAA,cACR;AACN,QAAAT;MACV;AAAA,IACF;AAAA,IACA,CAACP,CAAY;AAAA,EAAA;AAIjB;"}
+{"version":3,"file":"use-s3-helper.js","sources":["../../../../../src/features/worksheet/worksheet/hooks/use-s3-helper.ts"],"sourcesContent":["import type { IFile } from '../worksheet-question/subjective-review';\n\nimport { useCallback, useEffect, useRef } from 'react';\nimport { v4 as uuidv4 } from 'uuid';\n\nimport { useAwsSignedKey } from '../api/subjective-review';\n\ninterface IUseS3helperProps {\n  studentId: string;\n  query: {\n    type: string;\n  };\n  enabled?: boolean;\n}\n\ninterface IUploadImageProps {\n  images: IFile[];\n  onSuccess?: (urls: string[]) => void;\n  onError?: () => void;\n  fileKey: string;\n  fileName?: string;\n}\n\nconst useS3ImageUploadHelper = (props: IUseS3helperProps) => {\n  const { studentId, query, enabled = true } = props;\n  const { data, get: getAwsSignedKey } = useAwsSignedKey();\n  const awsSignedKeyRef = useRef(data);\n\n  useEffect(() => {\n    awsSignedKeyRef.current = data;\n  }, [data]);\n\n  useEffect(() => {\n    if (enabled && studentId) {\n      getAwsSignedKey(studentId, query);\n    }\n  }, [query, getAwsSignedKey, studentId, enabled]);\n\n  const uploadImagesToS3 = useCallback(\n    async ({ images, onSuccess, onError, fileKey, fileName }: IUploadImageProps) => {\n      const awsSignedKey = awsSignedKeyRef.current;\n\n      if (!awsSignedKey) return;\n\n      const url = `https://${awsSignedKey.bucketName}.s3.amazonaws.com/`;\n\n      try {\n        const uploadPromises = images.map(async (item: { file: string | Blob }) => {\n          const formData = new FormData();\n          const key = `${fileKey}${fileName ?? uuidv4()}`;\n\n          formData.append('key', key);\n          formData.append('AWSAccessKeyId', awsSignedKey.awsKey);\n          formData.append('acl', 'public-read');\n          formData.append('success_action_redirect', '');\n          formData.append('policy', awsSignedKey.policy);\n          formData.append('signature', awsSignedKey.signature);\n          formData.append('Content-Type', 'image/jpeg');\n          formData.append('file', item.file);\n\n          const res = await fetch(url, {\n            method: 'POST',\n            body: formData,\n          });\n\n          if (!res.ok) {\n            throw new Error('Upload failed');\n          }\n\n          return `${url}${key}`;\n        });\n\n        const uploadedUrls = await Promise.all(uploadPromises);\n\n        onSuccess?.(uploadedUrls);\n\n        return uploadedUrls;\n      } catch (error) {\n        onError?.();\n      }\n    },\n    [],\n  );\n\n  return uploadImagesToS3;\n};\n\nexport default useS3ImageUploadHelper;\n"],"names":["useS3ImageUploadHelper","props","studentId","query","enabled","data","getAwsSignedKey","useAwsSignedKey","awsSignedKeyRef","useRef","useEffect","useCallback","images","onSuccess","onError","fileKey","fileName","awsSignedKey","url","uploadPromises","item","formData","key","uuidv4","uploadedUrls"],"mappings":";;;AAuBM,MAAAA,IAAyB,CAACC,MAA6B;AAC3D,QAAM,EAAE,WAAAC,GAAW,OAAAC,GAAO,SAAAC,IAAU,OAASH,GACvC,EAAE,MAAAI,GAAM,KAAKC,MAAoBC,EAAgB,GACjDC,IAAkBC,EAAOJ,CAAI;AAEnC,SAAAK,EAAU,MAAM;AACd,IAAAF,EAAgB,UAAUH;AAAA,EAAA,GACzB,CAACA,CAAI,CAAC,GAETK,EAAU,MAAM;AACd,IAAIN,KAAWF,KACbI,EAAgBJ,GAAWC,CAAK;AAAA,KAEjC,CAACA,GAAOG,GAAiBJ,GAAWE,CAAO,CAAC,GAEtBO;AAAA,IACvB,OAAO,EAAE,QAAAC,GAAQ,WAAAC,GAAW,SAAAC,GAAS,SAAAC,GAAS,UAAAC,QAAkC;AAC9E,YAAMC,IAAeT,EAAgB;AAErC,UAAI,CAACS,EAAc;AAEb,YAAAC,IAAM,WAAWD,EAAa,UAAU;AAE1C,UAAA;AACF,cAAME,IAAiBP,EAAO,IAAI,OAAOQ,MAAkC;AACnE,gBAAAC,IAAW,IAAI,YACfC,IAAM,GAAGP,CAAO,GAAGC,KAAYO,EAAQ,CAAA;AAgBzC,cAdKF,EAAA,OAAO,OAAOC,CAAG,GACjBD,EAAA,OAAO,kBAAkBJ,EAAa,MAAM,GAC5CI,EAAA,OAAO,OAAO,aAAa,GAC3BA,EAAA,OAAO,2BAA2B,EAAE,GACpCA,EAAA,OAAO,UAAUJ,EAAa,MAAM,GACpCI,EAAA,OAAO,aAAaJ,EAAa,SAAS,GAC1CI,EAAA,OAAO,gBAAgB,YAAY,GACnCA,EAAA,OAAO,QAAQD,EAAK,IAAI,GAO7B,EALQ,MAAM,MAAMF,GAAK;AAAA,YAC3B,QAAQ;AAAA,YACR,MAAMG;AAAA,UAAA,CACP,GAEQ;AACD,kBAAA,IAAI,MAAM,eAAe;AAG1B,iBAAA,GAAGH,CAAG,GAAGI,CAAG;AAAA,QAAA,CACpB,GAEKE,IAAe,MAAM,QAAQ,IAAIL,CAAc;AAErD,eAAAN,KAAA,QAAAA,EAAYW,IAELA;AAAA,cACO;AACJ,QAAAV,KAAA,QAAAA;AAAA,MACZ;AAAA,IACF;AAAA,IACA,CAAC;AAAA,EAAA;AAIL;"}

package/dist/index.d.ts

@@ -1363,11 +1363,11 @@ export declare interface IHomepageStartJourneyProps {
 declare interface IHomeWorkControllerProps {
     width: number;
     hwRequests?: IHomeWorkHelpRequestModel[];
-    onMarkAsResolved?: (homeworkId: string) => void;
-    onSendImageToChat?: (homeworkId: string, snapshot: Blob) => void;
+    onMarkAsResolved?: (homeworkId: string, onSuccess: () => void) => void;
+    onSendImageToChat?: (homeworkId: string, snapshot: Blob[], onSuccess: () => void) => void;
 }
 
-declare interface IHomeWorkHelpRequestModel {
+export declare interface IHomeWorkHelpRequestModel {
     channel_id: string;
     created_on_ts: number;
     homework_id: string;
@@ -1380,6 +1380,10 @@ declare interface IHomeWorkHelpRequestModel {
     teacher_id: string;
 }
 
+declare interface IHomeWorkHelpRequestModelWithStudentName extends IHomeWorkHelpRequestModel {
+    student_name: string;
+}
+
 declare interface IIconButtonProps extends Omit<IButtonProps, 'label' | 'shape' | 'widthX' | 'width' | 'iconPosition' | 'alignSelf' | 'analyticsLabel' | 'renderAs'>, Required<Pick<IClickableAnalyticsProps, 'analyticsLabel'>> {
     Icon: React.FC<React.SVGProps<SVGSVGElement>>;
     customBgColor?: TColorNames;
@@ -2819,8 +2823,7 @@ declare interface ISheetsListProps extends ISheetItemCallbackProps {
 
 declare interface ISidebar {
     grade?: string;
-    hwRequests?: IHomeWorkHelpRequestModel[];
-    studentName?: string;
+    hwRequests?: IHomeWorkHelpRequestModelWithStudentName[];
 }
 
 export declare interface ISignUpProps {
@@ -3149,6 +3152,7 @@ declare interface ITile {
         toTileId: string;
     }[];
     html?: string;
+    width?: number | string;
 }
 
 declare interface ITimeLeftTimelineProps {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cuemath/leap",
-  "version": "3.0.10-aa1",
+  "version": "3.0.10-aa11",
   "type": "module",
   "files": [
     "dist"