@cuemath/leap 3.1.17-aa0 → 3.1.17-hg2

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 useIsLearnosityLoaded from '../worksheet/learnosity-preloader/use-is-learnosity-loaded';\nimport { CueCanvasCore } from './cue-canvas-core';\nimport { getCanvasConfig, getCanvasSettings } from './cue-canvas-helpers';\nimport { CueCanvasWrapper } from './cue-cavas-styled';\nimport useConfigUpdater from './hooks/use-config-updater';\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    canvasConfig,\n    updateCanvasConfig,\n  }) => {\n    const canvasElementRef = useRef<HTMLDivElement>(null);\n    const { setActiveInstance: setActiveCueCanvas, setActiveTool } = useCueCanvasActions();\n    const uploadImageToS3 = useUploadHelper({ userId, renderAs, userType });\n    const { scriptStatus } = useIsLearnosityLoaded(); // This hook checks if the Polypad script is loaded + (additional scripts)\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    useConfigUpdater(canvasConfig, renderAs);\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 && scriptStatus === 'loaded') {\n        const canvasCreateConfig = 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          updateCanvasConfig,\n        });\n\n        const createCueCanvas = async () => {\n          await cueCanvasCore.create({\n            canvasElementRef,\n            canvasConfig: canvasCreateConfig,\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, scriptStatus]);\n\n    useEffect(() => {\n      return () => {\n        if (cueCanvasRef.current) {\n          cueCanvasRef.current.destroy();\n          cueCanvasRef.current = null;\n        }\n      };\n    }, []);\n\n    return (\n      <CueCanvasWrapper\n        id={renderAs === 'whiteboard' ? 'canvasContainer' : canvasId}\n        ref={canvasElementRef}\n        $width={width}\n        $height={height}\n        $canScribble={canScribble}\n        $canRender={canRender}\n        $renderAs={renderAs}\n      />\n    );\n  },\n);\n\nexport default CueCanvas;\n"],"names":["CueCanvas","memo","canvasId","width","height","canRender","onUpdateHeight","initialData","onPublish","onSubscribe","userId","appended","canScribble","userType","renderAs","canvasConfig","updateCanvasConfig","canvasElementRef","useRef","setActiveCueCanvas","setActiveTool","useCueCanvasActions","uploadImageToS3","useUploadHelper","scriptStatus","useIsLearnosityLoaded","cueCanvasRef","onUpdateActiveTool","useCallback","tool","useHeightExtender","useConfigUpdater","useEffect","canvasCreateConfig","getCanvasConfig","canvasSetting","getCanvasSettings","cueCanvasCore","CueCanvasCore","jsx","CueCanvasWrapper","CueCanvas$1"],"mappings":";;;;;;;;;;AAaA,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,IACX,cAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,MACI;AACE,UAAAC,IAAmBC,EAAuB,IAAI,GAC9C,EAAE,mBAAmBC,GAAoB,eAAAC,MAAkBC,EAAoB,GAC/EC,IAAkBC,EAAgB,EAAE,QAAAb,GAAQ,UAAAI,GAAU,UAAAD,GAAU,GAChE,EAAE,cAAAW,MAAiBC,KAEnBC,IAAeR,EAA6B,IAAI,GAEhDS,IAAqBC;AAAA,MACzB,CAACC,MAAyB;AACxB,QAAAT,EAAcS,CAAI;AAAA,MACpB;AAAA,MACA,CAACT,CAAa;AAAA,IAAA;AAGE,WAAAU,EAAA;AAAA,MAChB,kBAAAb;AAAA,MACA,cAAAS;AAAA,MACA,aAAAd;AAAA,IAAA,CACD,GACDmB,EAAiBhB,GAAcD,CAAQ,GAEvCkB,EAAU,MAAM;AACV,MAAApB,KAAec,EAAa,YAC9BA,EAAa,QAAQ,iBAErBP,EAAmBO,EAAa,OAAO;AAAA,IACzC,GACC,CAACd,GAAaO,CAAkB,CAAC,GAEpCa,EAAU,MAAM;AACV,MAAAzB,KAAemB,EAAa,WACjBA,EAAA,QAAQ,OAAOnB,CAAW;AAAA,IACzC,GACC,CAACA,CAAW,CAAC,GAEhByB,EAAU,MAAM;AACV,MAAA5B,KAAUsB,EAAa,WACzBA,EAAa,QAAQ;IACvB,GACC,CAACtB,GAAQD,CAAK,CAAC,GAElB6B,EAAU,MAAM;AACd,UAAI3B,KAAaM,KAAY,CAACe,EAAa,WAAWF,MAAiB,UAAU;AAC/E,cAAMS,IAAqBC,EAAgB/B,GAAOC,GAAQU,GAAUD,CAAQ,GACtEsB,IAAgBC,EAAkBtB,GAAUD,CAAQ,GACpDwB,IAAgB,IAAIC,EAAc;AAAA,UACtC,WAAA9B;AAAA,UACA,aAAAC;AAAA,UACA,oBAAAkB;AAAA,UACA,gBAAArB;AAAA,UACA,iBAAAgB;AAAA,UACA,QAAAlB;AAAA,UACA,QAAAM;AAAA,UACA,UAAAR;AAAA,UACA,UAAAW;AAAA,UACA,UAAAC;AAAA,UACA,oBAAAE;AAAA,QAAA,CACD;AAgBe,SAdQ,YAAY;AAClC,gBAAMqB,EAAc,OAAO;AAAA,YACzB,kBAAApB;AAAA,YACA,cAAcgB;AAAA,YACd,eAAAE;AAAA,YACA,aAAA5B;AAAA,UAAA,CACD,GACDmB,EAAa,UAAUW,GAEnBzB,KACFO,EAAmBkB,CAAa;AAAA,QAClC;MAIJ;AAAA,IAAA,GAEC,CAAC7B,GAAWC,GAAaU,GAAoBd,GAAWM,GAAUa,CAAY,CAAC,GAElFQ,EAAU,MACD,MAAM;AACX,MAAIN,EAAa,YACfA,EAAa,QAAQ,WACrBA,EAAa,UAAU;AAAA,IACzB,GAED,CAAE,CAAA,GAGH,gBAAAa;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,IAAI1B,MAAa,eAAe,oBAAoBZ;AAAA,QACpD,KAAKe;AAAA,QACL,QAAQd;AAAA,QACR,SAASC;AAAA,QACT,cAAcQ;AAAA,QACd,YAAYP;AAAA,QACZ,WAAWS;AAAA,MAAA;AAAA,IAAA;AAAA,EAGjB;AACF,GAEA2B,IAAezC;"}
+{"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 useIsLearnosityLoaded from '../worksheet/learnosity-preloader/use-is-learnosity-loaded';\nimport { CueCanvasCore } from './cue-canvas-core';\nimport { getCanvasConfig, getCanvasSettings } from './cue-canvas-helpers';\nimport { CueCanvasWrapper } from './cue-cavas-styled';\nimport useConfigUpdater from './hooks/use-config-updater';\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    canvasConfig,\n    updateCanvasConfig,\n  }) => {\n    const canvasElementRef = useRef<HTMLDivElement>(null);\n    const { setActiveInstance: setActiveCueCanvas, setActiveTool } = useCueCanvasActions();\n    const uploadImageToS3 = useUploadHelper({ userId, renderAs, userType });\n    const { scriptStatus } = useIsLearnosityLoaded(); // This hook checks if the Polypad script is loaded + (additional scripts)\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    useConfigUpdater(canvasConfig, renderAs);\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 && scriptStatus === 'loaded') {\n        const canvasCreateConfig = 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          updateCanvasConfig,\n        });\n\n        const createCueCanvas = async () => {\n          await cueCanvasCore.create({\n            canvasElementRef,\n            canvasConfig: canvasCreateConfig,\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, scriptStatus]);\n\n    useEffect(() => {\n      return () => {\n        if (cueCanvasRef.current) {\n          cueCanvasRef.current.destroy();\n          cueCanvasRef.current = null;\n        }\n      };\n    }, []);\n\n    return (\n      <CueCanvasWrapper\n        id={renderAs === 'whiteboard' ? 'canvasContainer' : canvasId}\n        ref={canvasElementRef}\n        $width={width}\n        $height={height}\n        $canScribble={canScribble}\n        $canRender={canRender}\n        $renderAs={renderAs}\n      />\n    );\n  },\n);\n\nexport default CueCanvas;\n"],"names":["CueCanvas","memo","canvasId","width","height","canRender","onUpdateHeight","initialData","onPublish","onSubscribe","userId","appended","canScribble","userType","renderAs","canvasConfig","updateCanvasConfig","canvasElementRef","useRef","setActiveCueCanvas","setActiveTool","useCueCanvasActions","uploadImageToS3","useUploadHelper","scriptStatus","useIsLearnosityLoaded","cueCanvasRef","onUpdateActiveTool","useCallback","tool","useHeightExtender","useConfigUpdater","useEffect","canvasCreateConfig","getCanvasConfig","canvasSetting","getCanvasSettings","cueCanvasCore","CueCanvasCore","jsx","CueCanvasWrapper"],"mappings":";;;;;;;;;;AAaA,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,IACX,cAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,MACI;AACE,UAAAC,IAAmBC,EAAuB,IAAI,GAC9C,EAAE,mBAAmBC,GAAoB,eAAAC,EAAA,IAAkBC,EAAoB,GAC/EC,IAAkBC,EAAgB,EAAE,QAAAb,GAAQ,UAAAI,GAAU,UAAAD,GAAU,GAChE,EAAE,cAAAW,EAAa,IAAIC,EAAsB,GAEzCC,IAAeR,EAA6B,IAAI,GAEhDS,IAAqBC;AAAA,MACzB,CAACC,MAAyB;AACxB,QAAAT,EAAcS,CAAI;AAAA,MACpB;AAAA,MACA,CAACT,CAAa;AAAA,IAChB;AAEkB,WAAAU,EAAA;AAAA,MAChB,kBAAAb;AAAA,MACA,cAAAS;AAAA,MACA,aAAAd;AAAA,IAAA,CACD,GACDmB,EAAiBhB,GAAcD,CAAQ,GAEvCkB,EAAU,MAAM;AACV,MAAApB,KAAec,EAAa,YAC9BA,EAAa,QAAQ,cAAc,GAEnCP,EAAmBO,EAAa,OAAO;AAAA,IACzC,GACC,CAACd,GAAaO,CAAkB,CAAC,GAEpCa,EAAU,MAAM;AACV,MAAAzB,KAAemB,EAAa,WACjBA,EAAA,QAAQ,OAAOnB,CAAW;AAAA,IACzC,GACC,CAACA,CAAW,CAAC,GAEhByB,EAAU,MAAM;AACV,MAAA5B,KAAUsB,EAAa,WACzBA,EAAa,QAAQ,cAAc;AAAA,IACrC,GACC,CAACtB,GAAQD,CAAK,CAAC,GAElB6B,EAAU,MAAM;AACd,UAAI3B,KAAaM,KAAY,CAACe,EAAa,WAAWF,MAAiB,UAAU;AAC/E,cAAMS,IAAqBC,EAAgB/B,GAAOC,GAAQU,GAAUD,CAAQ,GACtEsB,IAAgBC,EAAkBtB,GAAUD,CAAQ,GACpDwB,IAAgB,IAAIC,EAAc;AAAA,UACtC,WAAA9B;AAAA,UACA,aAAAC;AAAA,UACA,oBAAAkB;AAAA,UACA,gBAAArB;AAAA,UACA,iBAAAgB;AAAA,UACA,QAAAlB;AAAA,UACA,QAAAM;AAAA,UACA,UAAAR;AAAA,UACA,UAAAW;AAAA,UACA,UAAAC;AAAA,UACA,oBAAAE;AAAA,QAAA,CACD;AAgBe,SAdQ,YAAY;AAClC,gBAAMqB,EAAc,OAAO;AAAA,YACzB,kBAAApB;AAAA,YACA,cAAcgB;AAAA,YACd,eAAAE;AAAA,YACA,aAAA5B;AAAA,UAAA,CACD,GACDmB,EAAa,UAAUW,GAEnBzB,KACFO,EAAmBkB,CAAa;AAAA,QAEpC,GAEgB;AAAA,MAAA;AAAA,IAClB,GAEC,CAAC7B,GAAWC,GAAaU,GAAoBd,GAAWM,GAAUa,CAAY,CAAC,GAElFQ,EAAU,MACD,MAAM;AACX,MAAIN,EAAa,YACfA,EAAa,QAAQ,QAAQ,GAC7BA,EAAa,UAAU;AAAA,IAE3B,GACC,EAAE,GAGH,gBAAAa;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,IAAI1B,MAAa,eAAe,oBAAoBZ;AAAA,QACpD,KAAKe;AAAA,QACL,QAAQd;AAAA,QACR,SAASC;AAAA,QACT,cAAcQ;AAAA,QACd,YAAYP;AAAA,QACZ,WAAWS;AAAA,MAAA;AAAA,IACb;AAAA,EAAA;AAGN;"}

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

@@ -1 +1 @@
-{"version":3,"file":"cue-cavas-styled.js","sources":["../../../src/features/cue-canvas/cue-cavas-styled.tsx"],"sourcesContent":["import type { ICueCanvasWrapper, TCueCanvasColors } from './types/cue-canvas';\n\nimport styled, { css } from 'styled-components';\n\nimport TickIcon from '../../assets/line-icons/icons/check';\nimport DownIcon from '../../assets/line-icons/icons/down';\nimport HighlighterIcon from '../../assets/line-icons/icons/highlighter';\nimport LockIcon from '../../assets/line-icons/icons/lock';\nimport PencilIcon from '../../assets/line-icons/icons/pencil';\nimport RulerIcon from '../../assets/line-icons/icons/ruler';\nimport SketchIcon from '../../assets/line-icons/icons/sketch';\nimport UndoIcon from '../../assets/line-icons/icons/undo';\nimport UnlockIcon from '../../assets/line-icons/icons/unlock';\nimport FlexView from '../ui/layout/flex-view';\nimport { CANVAS_COLORS } from './constants/constants';\n\ninterface IToolProps {\n  $active: boolean;\n  $activeColor: TCueCanvasColors;\n  $shouldAnimate: boolean;\n}\nexport const HWWrapper = styled(FlexView)`\n  border: 2px solid;\n`;\n\nexport const StyledPencilIcon = styled(PencilIcon)<IToolProps>(({\n  theme,\n  $active,\n  $activeColor,\n  $shouldAnimate,\n}) => {\n  const { colors } = theme;\n  const color = $active ? CANVAS_COLORS[$activeColor] : colors.REAL_BLACK_50;\n\n  return css`\n    position: relative;\n    transition: top 0.3s ease-in-out;\n    top: ${$active && $shouldAnimate ? '0px' : '8px'};\n    cursor: ${$active ? 'auto' : 'pointer'};\n    .pencil-dark-shade {\n      fill: ${$active ? color : colors.GREY_3};\n    }\n\n    .pencil-light-shade {\n      fill: ${$active ? color : colors.GREY_2};\n      opacity: ${$active ? 0.3 : 1};\n    }\n\n    ${!$active &&\n    css`\n      &:hover {\n        .pencil-dark-shade {\n          fill: ${colors.GREY_4};\n        }\n        .pencil-light-shade {\n          fill: ${colors.GREY_2};\n        }\n      }\n    `}\n  `;\n});\n\nexport const StyledRulerIcon = styled(RulerIcon)<IToolProps>(({\n  theme,\n  $active,\n  $activeColor,\n  $shouldAnimate,\n}) => {\n  const { colors } = theme;\n  const color = $active ? CANVAS_COLORS[$activeColor] : colors.REAL_BLACK_50;\n\n  return css`\n    cursor: ${$active ? 'auto' : 'pointer'};\n    position: relative;\n    transition: top 0.3s ease-in-out;\n    top: ${$active && $shouldAnimate ? '0px' : '8px'};\n\n    .ruler-rect-color {\n      fill: ${$active ? color : colors.GREY_3};\n    }\n\n    .ruler-stripe-base {\n      fill: ${$active ? color : colors.GREY_2};\n      opacity: ${$active ? 0.2 : 1};\n    }\n\n    .ruler-small-stripe {\n      fill: ${colors.REAL_BLACK};\n    }\n\n    ${!$active &&\n    css`\n      &:hover {\n        .ruler-rect-color {\n          fill: ${colors.GREY_4};\n        }\n        .ruler-stripe-base {\n          fill: ${colors.GREY_3};\n        }\n      }\n    `}\n  `;\n});\n\nexport const StyledHighlighterWrapper = styled(HighlighterIcon)<IToolProps>(({\n  $active,\n  theme,\n  $activeColor,\n  $shouldAnimate,\n}) => {\n  const { colors } = theme;\n  const color = $active ? CANVAS_COLORS[$activeColor] : colors.REAL_BLACK_50;\n\n  return css`\n    cursor: ${$active ? 'auto' : 'pointer'};\n    position: relative;\n    transition: top 0.3s ease-in-out;\n    top: ${$active && $shouldAnimate ? '0px' : '8px'};\n    ${!$active &&\n    css`\n      &:hover {\n        .highlighter-tip {\n          fill: ${theme.colors.BLACK};\n        }\n\n        .highlighter-stripe {\n          fill: ${theme.colors.BLACK_50};\n        }\n\n        .highlighter-light-body {\n          fill: ${theme.colors.BLACK_10};\n        }\n      }\n    `}\n\n    ${$active &&\n    css`\n      .highlighter-tip {\n        fill: ${color};\n      }\n\n      .highlighter-stripe {\n        fill: ${color};\n        opacity: 0.6;\n      }\n\n      .highlighter-light-body {\n        fill: ${color};\n        opacity: 0.2;\n      }\n    `}\n  `;\n});\n\nexport const StyledSketchWrapper = styled(SketchIcon)<IToolProps>(({\n  $active,\n  theme,\n  $activeColor,\n  $shouldAnimate,\n}) => {\n  const { colors } = theme;\n  const color = $active ? CANVAS_COLORS[$activeColor] : colors.REAL_BLACK_50;\n\n  return css`\n    cursor: ${$active ? 'auto' : 'pointer'};\n    position: relative;\n    transition: top 0.3s ease-in-out;\n    top: ${$active && $shouldAnimate ? '0px' : '8px'};\n\n    ${!$active &&\n    css`\n      &:hover {\n        .pen-tip {\n          fill: ${theme.colors.BLACK};\n        }\n\n        .pen-dark-shade {\n          fill: ${theme.colors.BLACK_50};\n        }\n\n        .pen-light-shade {\n          fill: ${theme.colors.BLACK_10};\n        }\n      }\n    `}\n\n    ${$active &&\n    css`\n      cursor: ${$active ? 'auto' : 'pointer'};\n      .pen-tip {\n        fill: ${color};\n      }\n\n      .pen-dark-shade {\n        fill: ${color};\n        opacity: 0.6;\n      }\n\n      .pen-light-shade {\n        fill: ${color};\n        opacity: 0.4;\n      }\n    `}\n  `;\n});\n\nexport const StyledLockIcon = styled(LockIcon)`\n  width: 20px;\n  height: 20px;\n`;\n\nexport const StyledUnlockIcon = styled(UnlockIcon)`\n  width: 20px;\n  height: 20px;\n`;\n\nexport const StyledWrapper = styled(FlexView)<Omit<IToolProps, '$activeColor' | '$shouldAnimate'>>(\n  ({ theme, $active }) => {\n    const { colors } = theme;\n\n    return css`\n      cursor: ${$active ? 'auto' : 'pointer'};\n      width: 32px;\n      height: 32px;\n      justify-content: center;\n      align-items: center;\n      border: 1px solid ${colors.WHITE};\n      border-radius: 50%;\n      transition: all 100ms ease-in-out;\n      border: 1px solid ${colors.GREY_1};\n\n      ${!$active &&\n      css`\n        &:hover {\n          border: 1px solid ${colors.REAL_BLACK};\n        }\n      `}\n\n      ${$active &&\n      css`\n        cursor: auto;\n        background: ${colors.BLACK};\n        .tile-icon {\n          fill: ${colors.BLACK};\n        }\n        svg {\n          path,\n          rect,\n          circle {\n            stroke: ${colors.WHITE};\n          }\n          .hover-eraser {\n            stroke: none;\n            fill: ${colors.WHITE};\n          }\n        }\n      `}\n    `;\n  },\n);\n\nexport const StyledCheckIcon = styled(TickIcon)`\n  path {\n    stroke: ${'white'};\n  }\n`;\n\nexport const RedoIcon = styled(UndoIcon)`\n  transform: scaleX(-1);\n`;\n\nexport const PaletteWrapper = styled(FlexView)<{ $top: number }>`\n  position: absolute;\n  top: ${({ $top }) => $top}px;\n  transition:\n    opacity 0.5s ease,\n    transform 0.5s ease;\n`;\n\nexport const CueCanvasWrapper = styled(FlexView)<ICueCanvasWrapper>(\n  ({ $canScribble, $canRender, $renderAs }) => `\n  display: ${$canRender ? 'block' : 'none'};\n  opacity: ${$canScribble ? 1 : 0.5};\n  pointer-events: ${$canScribble ? 'auto' : 'none'};\n\n  ${\n    $renderAs === 'canvas' &&\n    $canScribble &&\n    `\n    background-image: radial-gradient(rgb(43 43 43 / 8%) 2px, transparent 10%);\n    background-position:0 0,32px 32px;\n    background-size: 30px 32px;\n    `\n  }\n  \n`,\n);\n\nexport const ColorPicker = styled(FlexView)<{ $color: TCueCanvasColors }>(\n  ({ $color }) => `\nbackground: ${CANVAS_COLORS[$color]};\n`,\n);\n\nexport const StyledDownIcon = styled(DownIcon)<{ $isAnimating: boolean }>`\n  pointer-events: none;\n  transition: transform 0.5s ease;\n  transform: ${({ $isAnimating }) => ($isAnimating ? 'rotate(180deg)' : 'rotate(0deg)')};\n`;\n\nexport const PenIconWrapper = styled(FlexView)`\n  overflow: hidden;\n  border-right: 1px solid ${({ theme }) => theme.colors.GREY_1};\n`;\n\nexport const MenuWrapper = styled(FlexView)`\n  position: absolute;\n  padding: 8px 8px 0 8px;\n  overflow: hidden;\n  bottom: 58px;\n  border-top-left-radius: 8px;\n  border-top-right-radius: 8px;\n  transition:\n    opacity 0.5s ease,\n    transform 0.5s ease;\n\n  :hover {\n    cursor: pointer;\n  }\n`;\n"],"names":["HWWrapper","styled","FlexView","StyledPencilIcon","PencilIcon","theme","$active","$activeColor","$shouldAnimate","colors","color","CANVAS_COLORS","css","StyledRulerIcon","RulerIcon","StyledHighlighterWrapper","HighlighterIcon","StyledSketchWrapper","SketchIcon","StyledLockIcon","LockIcon","StyledUnlockIcon","UnlockIcon","StyledWrapper","StyledCheckIcon","TickIcon","RedoIcon","UndoIcon","PaletteWrapper","$top","CueCanvasWrapper","$canScribble","$canRender","$renderAs","ColorPicker","$color","StyledDownIcon","DownIcon","$isAnimating","PenIconWrapper","MenuWrapper"],"mappings":"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"}
+{"version":3,"file":"cue-cavas-styled.js","sources":["../../../src/features/cue-canvas/cue-cavas-styled.tsx"],"sourcesContent":["import type { ICueCanvasWrapper, TCueCanvasColors } from './types/cue-canvas';\n\nimport styled, { css } from 'styled-components';\n\nimport TickIcon from '../../assets/line-icons/icons/check';\nimport DownIcon from '../../assets/line-icons/icons/down';\nimport HighlighterIcon from '../../assets/line-icons/icons/highlighter';\nimport LockIcon from '../../assets/line-icons/icons/lock';\nimport PencilIcon from '../../assets/line-icons/icons/pencil';\nimport RulerIcon from '../../assets/line-icons/icons/ruler';\nimport SketchIcon from '../../assets/line-icons/icons/sketch';\nimport UndoIcon from '../../assets/line-icons/icons/undo';\nimport UnlockIcon from '../../assets/line-icons/icons/unlock';\nimport FlexView from '../ui/layout/flex-view';\nimport { CANVAS_COLORS } from './constants/constants';\n\ninterface IToolProps {\n  $active: boolean;\n  $activeColor: TCueCanvasColors;\n  $shouldAnimate: boolean;\n}\nexport const HWWrapper = styled(FlexView)`\n  border: 2px solid;\n`;\n\nexport const StyledPencilIcon = styled(PencilIcon)<IToolProps>(({\n  theme,\n  $active,\n  $activeColor,\n  $shouldAnimate,\n}) => {\n  const { colors } = theme;\n  const color = $active ? CANVAS_COLORS[$activeColor] : colors.REAL_BLACK_50;\n\n  return css`\n    position: relative;\n    transition: top 0.3s ease-in-out;\n    top: ${$active && $shouldAnimate ? '0px' : '8px'};\n    cursor: ${$active ? 'auto' : 'pointer'};\n    .pencil-dark-shade {\n      fill: ${$active ? color : colors.GREY_3};\n    }\n\n    .pencil-light-shade {\n      fill: ${$active ? color : colors.GREY_2};\n      opacity: ${$active ? 0.3 : 1};\n    }\n\n    ${!$active &&\n    css`\n      &:hover {\n        .pencil-dark-shade {\n          fill: ${colors.GREY_4};\n        }\n        .pencil-light-shade {\n          fill: ${colors.GREY_2};\n        }\n      }\n    `}\n  `;\n});\n\nexport const StyledRulerIcon = styled(RulerIcon)<IToolProps>(({\n  theme,\n  $active,\n  $activeColor,\n  $shouldAnimate,\n}) => {\n  const { colors } = theme;\n  const color = $active ? CANVAS_COLORS[$activeColor] : colors.REAL_BLACK_50;\n\n  return css`\n    cursor: ${$active ? 'auto' : 'pointer'};\n    position: relative;\n    transition: top 0.3s ease-in-out;\n    top: ${$active && $shouldAnimate ? '0px' : '8px'};\n\n    .ruler-rect-color {\n      fill: ${$active ? color : colors.GREY_3};\n    }\n\n    .ruler-stripe-base {\n      fill: ${$active ? color : colors.GREY_2};\n      opacity: ${$active ? 0.2 : 1};\n    }\n\n    .ruler-small-stripe {\n      fill: ${colors.REAL_BLACK};\n    }\n\n    ${!$active &&\n    css`\n      &:hover {\n        .ruler-rect-color {\n          fill: ${colors.GREY_4};\n        }\n        .ruler-stripe-base {\n          fill: ${colors.GREY_3};\n        }\n      }\n    `}\n  `;\n});\n\nexport const StyledHighlighterWrapper = styled(HighlighterIcon)<IToolProps>(({\n  $active,\n  theme,\n  $activeColor,\n  $shouldAnimate,\n}) => {\n  const { colors } = theme;\n  const color = $active ? CANVAS_COLORS[$activeColor] : colors.REAL_BLACK_50;\n\n  return css`\n    cursor: ${$active ? 'auto' : 'pointer'};\n    position: relative;\n    transition: top 0.3s ease-in-out;\n    top: ${$active && $shouldAnimate ? '0px' : '8px'};\n    ${!$active &&\n    css`\n      &:hover {\n        .highlighter-tip {\n          fill: ${theme.colors.BLACK};\n        }\n\n        .highlighter-stripe {\n          fill: ${theme.colors.BLACK_50};\n        }\n\n        .highlighter-light-body {\n          fill: ${theme.colors.BLACK_10};\n        }\n      }\n    `}\n\n    ${$active &&\n    css`\n      .highlighter-tip {\n        fill: ${color};\n      }\n\n      .highlighter-stripe {\n        fill: ${color};\n        opacity: 0.6;\n      }\n\n      .highlighter-light-body {\n        fill: ${color};\n        opacity: 0.2;\n      }\n    `}\n  `;\n});\n\nexport const StyledSketchWrapper = styled(SketchIcon)<IToolProps>(({\n  $active,\n  theme,\n  $activeColor,\n  $shouldAnimate,\n}) => {\n  const { colors } = theme;\n  const color = $active ? CANVAS_COLORS[$activeColor] : colors.REAL_BLACK_50;\n\n  return css`\n    cursor: ${$active ? 'auto' : 'pointer'};\n    position: relative;\n    transition: top 0.3s ease-in-out;\n    top: ${$active && $shouldAnimate ? '0px' : '8px'};\n\n    ${!$active &&\n    css`\n      &:hover {\n        .pen-tip {\n          fill: ${theme.colors.BLACK};\n        }\n\n        .pen-dark-shade {\n          fill: ${theme.colors.BLACK_50};\n        }\n\n        .pen-light-shade {\n          fill: ${theme.colors.BLACK_10};\n        }\n      }\n    `}\n\n    ${$active &&\n    css`\n      cursor: ${$active ? 'auto' : 'pointer'};\n      .pen-tip {\n        fill: ${color};\n      }\n\n      .pen-dark-shade {\n        fill: ${color};\n        opacity: 0.6;\n      }\n\n      .pen-light-shade {\n        fill: ${color};\n        opacity: 0.4;\n      }\n    `}\n  `;\n});\n\nexport const StyledLockIcon = styled(LockIcon)`\n  width: 20px;\n  height: 20px;\n`;\n\nexport const StyledUnlockIcon = styled(UnlockIcon)`\n  width: 20px;\n  height: 20px;\n`;\n\nexport const StyledWrapper = styled(FlexView)<Omit<IToolProps, '$activeColor' | '$shouldAnimate'>>(\n  ({ theme, $active }) => {\n    const { colors } = theme;\n\n    return css`\n      cursor: ${$active ? 'auto' : 'pointer'};\n      width: 32px;\n      height: 32px;\n      justify-content: center;\n      align-items: center;\n      border: 1px solid ${colors.WHITE};\n      border-radius: 50%;\n      transition: all 100ms ease-in-out;\n      border: 1px solid ${colors.GREY_1};\n\n      ${!$active &&\n      css`\n        &:hover {\n          border: 1px solid ${colors.REAL_BLACK};\n        }\n      `}\n\n      ${$active &&\n      css`\n        cursor: auto;\n        background: ${colors.BLACK};\n        .tile-icon {\n          fill: ${colors.BLACK};\n        }\n        svg {\n          path,\n          rect,\n          circle {\n            stroke: ${colors.WHITE};\n          }\n          .hover-eraser {\n            stroke: none;\n            fill: ${colors.WHITE};\n          }\n        }\n      `}\n    `;\n  },\n);\n\nexport const StyledCheckIcon = styled(TickIcon)`\n  path {\n    stroke: ${'white'};\n  }\n`;\n\nexport const RedoIcon = styled(UndoIcon)`\n  transform: scaleX(-1);\n`;\n\nexport const PaletteWrapper = styled(FlexView)<{ $top: number }>`\n  position: absolute;\n  top: ${({ $top }) => $top}px;\n  transition:\n    opacity 0.5s ease,\n    transform 0.5s ease;\n`;\n\nexport const CueCanvasWrapper = styled(FlexView)<ICueCanvasWrapper>(\n  ({ $canScribble, $canRender, $renderAs }) => `\n  display: ${$canRender ? 'block' : 'none'};\n  opacity: ${$canScribble ? 1 : 0.5};\n  pointer-events: ${$canScribble ? 'auto' : 'none'};\n\n  ${\n    $renderAs === 'canvas' &&\n    $canScribble &&\n    `\n    background-image: radial-gradient(rgb(43 43 43 / 8%) 2px, transparent 10%);\n    background-position:0 0,32px 32px;\n    background-size: 30px 32px;\n    `\n  }\n  \n`,\n);\n\nexport const ColorPicker = styled(FlexView)<{ $color: TCueCanvasColors }>(\n  ({ $color }) => `\nbackground: ${CANVAS_COLORS[$color]};\n`,\n);\n\nexport const StyledDownIcon = styled(DownIcon)<{ $isAnimating: boolean }>`\n  pointer-events: none;\n  transition: transform 0.5s ease;\n  transform: ${({ $isAnimating }) => ($isAnimating ? 'rotate(180deg)' : 'rotate(0deg)')};\n`;\n\nexport const PenIconWrapper = styled(FlexView)`\n  overflow: hidden;\n  border-right: 1px solid ${({ theme }) => theme.colors.GREY_1};\n`;\n\nexport const MenuWrapper = styled(FlexView)`\n  position: absolute;\n  padding: 8px 8px 0 8px;\n  overflow: hidden;\n  bottom: 58px;\n  border-top-left-radius: 8px;\n  border-top-right-radius: 8px;\n  transition:\n    opacity 0.5s ease,\n    transform 0.5s ease;\n\n  :hover {\n    cursor: pointer;\n  }\n`;\n"],"names":["HWWrapper","styled","FlexView","StyledPencilIcon","PencilIcon","theme","$active","$activeColor","$shouldAnimate","colors","color","CANVAS_COLORS","css","StyledRulerIcon","RulerIcon","StyledHighlighterWrapper","HighlighterIcon","StyledSketchWrapper","SketchIcon","StyledLockIcon","LockIcon","StyledUnlockIcon","UnlockIcon","StyledWrapper","StyledCheckIcon","TickIcon","RedoIcon","UndoIcon","PaletteWrapper","$top","CueCanvasWrapper","$canScribble","$canRender","$renderAs","ColorPicker","$color","StyledDownIcon","DownIcon","$isAnimating","PenIconWrapper","MenuWrapper"],"mappings":"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"}

package/dist/features/cue-canvas/hooks/use-canvas-sync-broker.js

@@ -1,11 +1,11 @@
 import { useMessageBrokerChannel as E } from "@cuemath/cue-message-broker";
 import { useState as F, useRef as H, useMemo as W, useCallback as f } from "react";
-const I = (c) => ({
+const k = (c) => ({
   userId: c.userId,
   data: c.data,
   height: c.height,
   responseId: c.responseId
-}), $ = (c, l, d, u = "canvas") => {
+}), G = (c, l, d, i = "canvas") => {
   const [m, b] = F(
     () => {
       var o, n;
@@ -14,36 +14,36 @@ const I = (c) => ({
       for (const { message: a } of d) {
         const e = (o = a.payload) == null ? void 0 : o.eventPayload, s = e == null ? void 0 : e.responseId;
         if (!(e != null && e.responseId)) continue;
-        const t = I(e);
+        const t = k(e);
         s && r[s] ? (n = r[s]) == null || n.push(t) : r[s] = [t];
       }
       return r;
     }
-  ), i = H({}), C = W(
+  ), u = H({}), C = W(
     () => ({
       channelId: c,
-      ttl: u === "canvas" ? 0 : 24,
+      ttl: i === "canvas" ? 0 : 24,
       logger: l
     }),
-    [c, l, u]
-  ), S = f((r, o) => {
-    i.current = { ...i.current, [r]: o };
-  }, []), M = f(
+    [c, l, i]
+  ), M = f((r, o) => {
+    u.current = { ...u.current, [r]: o };
+  }, []), S = f(
     (r, o) => {
       const n = {};
       r.forEach((a) => {
-        var k;
-        const { payload: e } = a.message, { eventPayload: s } = e, t = s == null ? void 0 : s.responseId, j = s == null ? void 0 : s.data, w = s == null ? void 0 : s.userId, x = s == null ? void 0 : s.height, g = i.current[t];
+        var p;
+        const { payload: e } = a.message, { eventPayload: s } = e, t = s == null ? void 0 : s.responseId, w = s == null ? void 0 : s.data, x = s == null ? void 0 : s.userId, B = s == null ? void 0 : s.height, g = u.current[t];
         if (!o && g)
           g({
-            data: j,
-            height: x,
-            userId: w,
+            data: w,
+            height: B,
+            userId: x,
             responseId: t
           });
         else {
-          const p = I(s);
-          t && n[t] ? (k = n[t]) == null || k.push(p) : n[t] = [p];
+          const I = k(s);
+          t && n[t] ? (p = n[t]) == null || p.push(I) : n[t] = [I];
         }
       }), Object.keys(n).length > 0 && b((a) => {
         const e = { ...a };
@@ -56,21 +56,21 @@ const I = (c) => ({
     []
   ), { publish: D, channelStatus: R, channel: h, channelMetadata: O, setChannelMetadata: q } = E({
     channelOptions: C,
-    consumerFn: M,
-    metadataRequired: u === "whiteboard"
-  }), B = f(() => {
+    consumerFn: S,
+    metadataRequired: i === "whiteboard"
+  }), j = f(() => {
     h && h.destroyChannel();
   }, [h]);
   return {
     publishStrokes: D,
     channelStatus: R,
-    closeChannel: B,
+    closeChannel: j,
     initialStrokesData: m,
-    registerCallback: S,
+    registerCallback: M,
     setChannelMetadata: q,
     channelMetadata: O
   };
-}, G = $;
+};
 export {
   G as default
 };

package/dist/features/cue-canvas/hooks/use-canvas-sync-broker.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-canvas-sync-broker.js","sources":["../../../../src/features/cue-canvas/hooks/use-canvas-sync-broker.ts"],"sourcesContent":["import type {\n  IActionData,\n  ICanvasUpdateConfig,\n  IPublishData,\n  TCueCanvasChangeDataObject,\n  TRenderAs,\n} from '../types/cue-canvas';\n\nimport { useMessageBrokerChannel, type IChannelMessage } from '@cuemath/cue-message-broker';\nimport { useMemo, useCallback, useState, useRef } from 'react';\n\ninterface IMessage {\n  eventName: string;\n  eventPayload: {\n    responseId: string;\n    data: TCueCanvasChangeDataObject;\n    userId: string;\n    height: number;\n  };\n}\n\nconst extractStrokeData = (payload: IMessage['eventPayload']): IActionData => ({\n  userId: payload.userId,\n  data: payload.data,\n  height: payload.height,\n  responseId: payload.responseId,\n});\n\nconst useCanvasSyncBroker = (\n  channelId: string,\n  logEvent: (type: string, payload?: Record<string, unknown>) => void,\n  initialCanvasData?: Array<IChannelMessage>,\n  type: TRenderAs = 'canvas',\n) => {\n  const [initialStrokesData, setInitialStrokesData] = useState<Record<string, IActionData[]>>(\n    () => {\n      const map: Record<string, IActionData[]> = {};\n\n      if (!initialCanvasData) return map;\n\n      for (const { message } of initialCanvasData) {\n        const payload = (message.payload as IMessage)?.eventPayload;\n        const qrId = payload?.responseId;\n\n        if (!payload?.responseId) continue;\n\n        const strokeData = extractStrokeData(payload);\n\n        if (qrId && map[qrId]) {\n          map[qrId]?.push(strokeData);\n        } else {\n          map[qrId] = [strokeData];\n        }\n      }\n\n      return map;\n    },\n  );\n  const callbacksMapRef = useRef<Record<string, (data: IActionData) => void>>({});\n\n  const channelOptions = useMemo(\n    () => ({\n      channelId,\n      ttl: type === 'canvas' ? 0 : 24,\n      logger: logEvent,\n    }),\n    [channelId, logEvent, type],\n  );\n\n  const registerCallback = useCallback((qrId: string, cb: (data: IActionData) => void) => {\n    callbacksMapRef.current = { ...callbacksMapRef.current, [qrId]: cb };\n  }, []);\n\n  const onMessageReceive = useCallback(\n    (messages: Array<IChannelMessage>, initialData?: boolean) => {\n      const strokesPerWidgetMap: Record<string, Array<IActionData>> = {};\n\n      messages.forEach(message => {\n        const { payload } = message.message;\n        const { eventPayload } = payload as IMessage;\n        const qrId = eventPayload?.responseId as string;\n        const strokes = eventPayload?.data;\n        const userId = eventPayload?.userId;\n        const canvasHeight = eventPayload?.height;\n        const widgetOnReceiveCallback = callbacksMapRef.current[qrId];\n\n        if (!initialData && widgetOnReceiveCallback) {\n          widgetOnReceiveCallback({\n            data: strokes,\n            height: canvasHeight,\n            userId,\n            responseId: qrId,\n          });\n        } else {\n          const strokeData = extractStrokeData(eventPayload);\n\n          if (qrId && strokesPerWidgetMap[qrId]) {\n            strokesPerWidgetMap[qrId]?.push(strokeData);\n          } else {\n            strokesPerWidgetMap[qrId] = [strokeData];\n          }\n        }\n      });\n\n      if (Object.keys(strokesPerWidgetMap).length > 0) {\n        setInitialStrokesData(prevData => {\n          const currentData = { ...prevData };\n\n          Object.keys(strokesPerWidgetMap).forEach(key => {\n            if (key && currentData[key]) {\n              currentData[key]?.push(...(strokesPerWidgetMap[key] ?? []));\n            } else {\n              currentData[key] = strokesPerWidgetMap[key] ?? [];\n            }\n          });\n\n          return currentData;\n        });\n      }\n    },\n    [],\n  );\n\n  const { publish, channelStatus, channel, channelMetadata, setChannelMetadata } =\n    useMessageBrokerChannel<IPublishData, ICanvasUpdateConfig>({\n      channelOptions,\n      consumerFn: onMessageReceive,\n      metadataRequired: type === 'whiteboard',\n    });\n\n  const closeChannel = useCallback(() => {\n    if (channel) {\n      channel.destroyChannel();\n    }\n  }, [channel]);\n\n  return {\n    publishStrokes: publish,\n    channelStatus,\n    closeChannel,\n    initialStrokesData,\n    registerCallback,\n    setChannelMetadata,\n    channelMetadata,\n  };\n};\n\nexport default useCanvasSyncBroker;\n"],"names":["extractStrokeData","payload","useCanvasSyncBroker","channelId","logEvent","initialCanvasData","type","initialStrokesData","setInitialStrokesData","useState","map","message","_a","qrId","strokeData","_b","callbacksMapRef","useRef","channelOptions","useMemo","registerCallback","useCallback","cb","onMessageReceive","messages","initialData","strokesPerWidgetMap","eventPayload","strokes","userId","canvasHeight","widgetOnReceiveCallback","prevData","currentData","key","publish","channelStatus","channel","channelMetadata","setChannelMetadata","useMessageBrokerChannel","closeChannel","useCanvasSyncBroker$1"],"mappings":"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"}
+{"version":3,"file":"use-canvas-sync-broker.js","sources":["../../../../src/features/cue-canvas/hooks/use-canvas-sync-broker.ts"],"sourcesContent":["import type {\n  IActionData,\n  ICanvasUpdateConfig,\n  IPublishData,\n  TCueCanvasChangeDataObject,\n  TRenderAs,\n} from '../types/cue-canvas';\n\nimport { useMessageBrokerChannel, type IChannelMessage } from '@cuemath/cue-message-broker';\nimport { useMemo, useCallback, useState, useRef } from 'react';\n\ninterface IMessage {\n  eventName: string;\n  eventPayload: {\n    responseId: string;\n    data: TCueCanvasChangeDataObject;\n    userId: string;\n    height: number;\n  };\n}\n\nconst extractStrokeData = (payload: IMessage['eventPayload']): IActionData => ({\n  userId: payload.userId,\n  data: payload.data,\n  height: payload.height,\n  responseId: payload.responseId,\n});\n\nconst useCanvasSyncBroker = (\n  channelId: string,\n  logEvent: (type: string, payload?: Record<string, unknown>) => void,\n  initialCanvasData?: Array<IChannelMessage>,\n  type: TRenderAs = 'canvas',\n) => {\n  const [initialStrokesData, setInitialStrokesData] = useState<Record<string, IActionData[]>>(\n    () => {\n      const map: Record<string, IActionData[]> = {};\n\n      if (!initialCanvasData) return map;\n\n      for (const { message } of initialCanvasData) {\n        const payload = (message.payload as IMessage)?.eventPayload;\n        const qrId = payload?.responseId;\n\n        if (!payload?.responseId) continue;\n\n        const strokeData = extractStrokeData(payload);\n\n        if (qrId && map[qrId]) {\n          map[qrId]?.push(strokeData);\n        } else {\n          map[qrId] = [strokeData];\n        }\n      }\n\n      return map;\n    },\n  );\n  const callbacksMapRef = useRef<Record<string, (data: IActionData) => void>>({});\n\n  const channelOptions = useMemo(\n    () => ({\n      channelId,\n      ttl: type === 'canvas' ? 0 : 24,\n      logger: logEvent,\n    }),\n    [channelId, logEvent, type],\n  );\n\n  const registerCallback = useCallback((qrId: string, cb: (data: IActionData) => void) => {\n    callbacksMapRef.current = { ...callbacksMapRef.current, [qrId]: cb };\n  }, []);\n\n  const onMessageReceive = useCallback(\n    (messages: Array<IChannelMessage>, initialData?: boolean) => {\n      const strokesPerWidgetMap: Record<string, Array<IActionData>> = {};\n\n      messages.forEach(message => {\n        const { payload } = message.message;\n        const { eventPayload } = payload as IMessage;\n        const qrId = eventPayload?.responseId as string;\n        const strokes = eventPayload?.data;\n        const userId = eventPayload?.userId;\n        const canvasHeight = eventPayload?.height;\n        const widgetOnReceiveCallback = callbacksMapRef.current[qrId];\n\n        if (!initialData && widgetOnReceiveCallback) {\n          widgetOnReceiveCallback({\n            data: strokes,\n            height: canvasHeight,\n            userId,\n            responseId: qrId,\n          });\n        } else {\n          const strokeData = extractStrokeData(eventPayload);\n\n          if (qrId && strokesPerWidgetMap[qrId]) {\n            strokesPerWidgetMap[qrId]?.push(strokeData);\n          } else {\n            strokesPerWidgetMap[qrId] = [strokeData];\n          }\n        }\n      });\n\n      if (Object.keys(strokesPerWidgetMap).length > 0) {\n        setInitialStrokesData(prevData => {\n          const currentData = { ...prevData };\n\n          Object.keys(strokesPerWidgetMap).forEach(key => {\n            if (key && currentData[key]) {\n              currentData[key]?.push(...(strokesPerWidgetMap[key] ?? []));\n            } else {\n              currentData[key] = strokesPerWidgetMap[key] ?? [];\n            }\n          });\n\n          return currentData;\n        });\n      }\n    },\n    [],\n  );\n\n  const { publish, channelStatus, channel, channelMetadata, setChannelMetadata } =\n    useMessageBrokerChannel<IPublishData, ICanvasUpdateConfig>({\n      channelOptions,\n      consumerFn: onMessageReceive,\n      metadataRequired: type === 'whiteboard',\n    });\n\n  const closeChannel = useCallback(() => {\n    if (channel) {\n      channel.destroyChannel();\n    }\n  }, [channel]);\n\n  return {\n    publishStrokes: publish,\n    channelStatus,\n    closeChannel,\n    initialStrokesData,\n    registerCallback,\n    setChannelMetadata,\n    channelMetadata,\n  };\n};\n\nexport default useCanvasSyncBroker;\n"],"names":["extractStrokeData","payload","useCanvasSyncBroker","channelId","logEvent","initialCanvasData","type","initialStrokesData","setInitialStrokesData","useState","map","message","_a","qrId","strokeData","_b","callbacksMapRef","useRef","channelOptions","useMemo","registerCallback","useCallback","cb","onMessageReceive","messages","initialData","strokesPerWidgetMap","eventPayload","strokes","userId","canvasHeight","widgetOnReceiveCallback","prevData","currentData","key","publish","channelStatus","channel","channelMetadata","setChannelMetadata","useMessageBrokerChannel","closeChannel"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"use-cue-canvas-actions.js","sources":["../../../../src/features/cue-canvas/hooks/use-cue-canvas-actions.ts"],"sourcesContent":["import { useContext, useMemo } from 'react';\n\nimport PolyContext from '../cue-canvas-context';\n\nexport const useCueCanvasActions = () => {\n  const {\n    activeInstance,\n    setActiveTool,\n    activeTool,\n    setActiveInstance,\n    activeColor,\n    setActiveColor,\n    homeworkId,\n    setHomeworkId,\n  } = useContext(PolyContext);\n\n  const isWritingToolActive = useMemo(\n    () => (activeTool ? ['pen', 'ruler', 'highlighter', 'marker'].includes(activeTool) : false),\n    [activeTool],\n  );\n\n  return {\n    activeInstance,\n    setActiveTool,\n    activeTool,\n    setActiveInstance,\n    activeColor,\n    setActiveColor,\n    isWritingToolActive,\n    homeworkId,\n    setHomeworkId,\n  };\n};\n"],"names":["useCueCanvasActions","activeInstance","setActiveTool","activeTool","setActiveInstance","activeColor","setActiveColor","homeworkId","setHomeworkId","useContext","PolyContext","isWritingToolActive","useMemo"],"mappings":";;AAIO,MAAMA,IAAsB,MAAM;AACjC,QAAA;AAAA,IACJ,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,EAAA,IACEC,EAAWC,CAAW,GAEpBC,IAAsBC;AAAA,IAC1B,MAAOT,IAAa,CAAC,OAAO,SAAS,eAAe,QAAQ,EAAE,SAASA,CAAU,IAAI;AAAA,IACrF,CAACA,CAAU;AAAA,EAAA;AAGN,SAAA;AAAA,IACL,gBAAAF;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,qBAAAK;AAAA,IACA,YAAAJ;AAAA,IACA,eAAAC;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"use-cue-canvas-actions.js","sources":["../../../../src/features/cue-canvas/hooks/use-cue-canvas-actions.ts"],"sourcesContent":["import { useContext, useMemo } from 'react';\n\nimport PolyContext from '../cue-canvas-context';\n\nexport const useCueCanvasActions = () => {\n  const {\n    activeInstance,\n    setActiveTool,\n    activeTool,\n    setActiveInstance,\n    activeColor,\n    setActiveColor,\n    homeworkId,\n    setHomeworkId,\n  } = useContext(PolyContext);\n\n  const isWritingToolActive = useMemo(\n    () => (activeTool ? ['pen', 'ruler', 'highlighter', 'marker'].includes(activeTool) : false),\n    [activeTool],\n  );\n\n  return {\n    activeInstance,\n    setActiveTool,\n    activeTool,\n    setActiveInstance,\n    activeColor,\n    setActiveColor,\n    isWritingToolActive,\n    homeworkId,\n    setHomeworkId,\n  };\n};\n"],"names":["useCueCanvasActions","activeInstance","setActiveTool","activeTool","setActiveInstance","activeColor","setActiveColor","homeworkId","setHomeworkId","useContext","PolyContext","isWritingToolActive","useMemo"],"mappings":";;AAIO,MAAMA,IAAsB,MAAM;AACjC,QAAA;AAAA,IACJ,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,EAAA,IACEC,EAAWC,CAAW,GAEpBC,IAAsBC;AAAA,IAC1B,MAAOT,IAAa,CAAC,OAAO,SAAS,eAAe,QAAQ,EAAE,SAASA,CAAU,IAAI;AAAA,IACrF,CAACA,CAAU;AAAA,EACb;AAEO,SAAA;AAAA,IACL,gBAAAF;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,qBAAAK;AAAA,IACA,YAAAJ;AAAA,IACA,eAAAC;AAAA,EACF;AACF;"}

package/dist/features/cue-canvas/hooks/use-height-extender.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-height-extender.js","sources":["../../../../src/features/cue-canvas/hooks/use-height-extender.ts"],"sourcesContent":["import type { CueCanvasCore } from '../cue-canvas-core';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport { useCueCanvasActions } from './use-cue-canvas-actions';\n\ninterface IUseHeightIncreaseProps {\n  canvasElementRef: React.RefObject<HTMLElement>;\n  cueCanvasRef: React.RefObject<CueCanvasCore> | undefined;\n  canScribble: boolean;\n}\n\nconst useHeightExtender = ({\n  canvasElementRef,\n  cueCanvasRef,\n  canScribble,\n}: IUseHeightIncreaseProps) => {\n  const isScribblingRef = useRef<boolean>(false);\n  const shouldIncreaseHeightRef = useRef<boolean>(false);\n  const { isWritingToolActive } = useCueCanvasActions();\n\n  const handlePointerDown = useCallback(() => {\n    isScribblingRef.current = true;\n  }, []);\n\n  const handlePointerUp = useCallback(() => {\n    if (canvasElementRef.current && shouldIncreaseHeightRef.current) {\n      shouldIncreaseHeightRef.current = false;\n\n      const rect = canvasElementRef.current.getBoundingClientRect();\n      const updatedHeight = rect.height + 200;\n\n      cueCanvasRef?.current?.updateHeight(updatedHeight);\n    }\n\n    isScribblingRef.current = false;\n  }, [canvasElementRef, cueCanvasRef]);\n\n  const handlePointerMove = useCallback(\n    (event: MouseEvent) => {\n      if (isScribblingRef.current && canvasElementRef.current) {\n        const rect = canvasElementRef.current.getBoundingClientRect();\n        const y = event.clientY - rect.top;\n\n        if (y >= rect.height - 200) {\n          shouldIncreaseHeightRef.current = true;\n        }\n      }\n    },\n    [canvasElementRef],\n  );\n\n  useEffect(() => {\n    const canvasEle = canvasElementRef.current;\n\n    if (canScribble && canvasEle && isWritingToolActive) {\n      canvasEle.addEventListener('pointerdown', handlePointerDown);\n      canvasEle.addEventListener('pointerup', handlePointerUp);\n      canvasEle.addEventListener('pointermove', handlePointerMove);\n\n      return () => {\n        canvasEle.removeEventListener('pointerdown', handlePointerDown);\n        canvasEle.removeEventListener('pointerup', handlePointerUp);\n        canvasEle.removeEventListener('pointermove', handlePointerMove);\n      };\n    }\n  }, [\n    canvasElementRef,\n    handlePointerDown,\n    handlePointerMove,\n    handlePointerUp,\n    canScribble,\n    isWritingToolActive,\n  ]);\n};\n\nexport default useHeightExtender;\n"],"names":["useHeightExtender","canvasElementRef","cueCanvasRef","canScribble","isScribblingRef","useRef","shouldIncreaseHeightRef","isWritingToolActive","useCueCanvasActions","handlePointerDown","useCallback","handlePointerUp","updatedHeight","_a","handlePointerMove","event","rect","useEffect","canvasEle"],"mappings":";;AAYA,MAAMA,IAAoB,CAAC;AAAA,EACzB,kBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AACF,MAA+B;AACvB,QAAAC,IAAkBC,EAAgB,EAAK,GACvCC,IAA0BD,EAAgB,EAAK,GAC/C,EAAE,qBAAAE,MAAwBC,KAE1BC,IAAoBC,EAAY,MAAM;AAC1C,IAAAN,EAAgB,UAAU;AAAA,EAC5B,GAAG,CAAE,CAAA,GAECO,IAAkBD,EAAY,MAAM;;AACpC,QAAAT,EAAiB,WAAWK,EAAwB,SAAS;AAC/D,MAAAA,EAAwB,UAAU;AAG5B,YAAAM,IADOX,EAAiB,QAAQ,sBAAsB,EACjC,SAAS;AAEtB,OAAAY,IAAAX,KAAA,gBAAAA,EAAA,YAAA,QAAAW,EAAS,aAAaD;AAAA,IACtC;AAEA,IAAAR,EAAgB,UAAU;AAAA,EAAA,GACzB,CAACH,GAAkBC,CAAY,CAAC,GAE7BY,IAAoBJ;AAAA,IACxB,CAACK,MAAsB;AACjB,UAAAX,EAAgB,WAAWH,EAAiB,SAAS;AACjD,cAAAe,IAAOf,EAAiB,QAAQ,sBAAsB;AAGxD,QAFMc,EAAM,UAAUC,EAAK,OAEtBA,EAAK,SAAS,QACrBV,EAAwB,UAAU;AAAA,MAEtC;AAAA,IACF;AAAA,IACA,CAACL,CAAgB;AAAA,EAAA;AAGnB,EAAAgB,EAAU,MAAM;AACd,UAAMC,IAAYjB,EAAiB;AAE/B,QAAAE,KAAee,KAAaX;AACpB,aAAAW,EAAA,iBAAiB,eAAeT,CAAiB,GACjDS,EAAA,iBAAiB,aAAaP,CAAe,GAC7CO,EAAA,iBAAiB,eAAeJ,CAAiB,GAEpD,MAAM;AACD,QAAAI,EAAA,oBAAoB,eAAeT,CAAiB,GACpDS,EAAA,oBAAoB,aAAaP,CAAe,GAChDO,EAAA,oBAAoB,eAAeJ,CAAiB;AAAA,MAAA;AAAA,EAElE,GACC;AAAA,IACDb;AAAA,IACAQ;AAAA,IACAK;AAAA,IACAH;AAAA,IACAR;AAAA,IACAI;AAAA,EAAA,CACD;AACH;"}
+{"version":3,"file":"use-height-extender.js","sources":["../../../../src/features/cue-canvas/hooks/use-height-extender.ts"],"sourcesContent":["import type { CueCanvasCore } from '../cue-canvas-core';\n\nimport { useCallback, useEffect, useRef } from 'react';\n\nimport { useCueCanvasActions } from './use-cue-canvas-actions';\n\ninterface IUseHeightIncreaseProps {\n  canvasElementRef: React.RefObject<HTMLElement>;\n  cueCanvasRef: React.RefObject<CueCanvasCore> | undefined;\n  canScribble: boolean;\n}\n\nconst useHeightExtender = ({\n  canvasElementRef,\n  cueCanvasRef,\n  canScribble,\n}: IUseHeightIncreaseProps) => {\n  const isScribblingRef = useRef<boolean>(false);\n  const shouldIncreaseHeightRef = useRef<boolean>(false);\n  const { isWritingToolActive } = useCueCanvasActions();\n\n  const handlePointerDown = useCallback(() => {\n    isScribblingRef.current = true;\n  }, []);\n\n  const handlePointerUp = useCallback(() => {\n    if (canvasElementRef.current && shouldIncreaseHeightRef.current) {\n      shouldIncreaseHeightRef.current = false;\n\n      const rect = canvasElementRef.current.getBoundingClientRect();\n      const updatedHeight = rect.height + 200;\n\n      cueCanvasRef?.current?.updateHeight(updatedHeight);\n    }\n\n    isScribblingRef.current = false;\n  }, [canvasElementRef, cueCanvasRef]);\n\n  const handlePointerMove = useCallback(\n    (event: MouseEvent) => {\n      if (isScribblingRef.current && canvasElementRef.current) {\n        const rect = canvasElementRef.current.getBoundingClientRect();\n        const y = event.clientY - rect.top;\n\n        if (y >= rect.height - 200) {\n          shouldIncreaseHeightRef.current = true;\n        }\n      }\n    },\n    [canvasElementRef],\n  );\n\n  useEffect(() => {\n    const canvasEle = canvasElementRef.current;\n\n    if (canScribble && canvasEle && isWritingToolActive) {\n      canvasEle.addEventListener('pointerdown', handlePointerDown);\n      canvasEle.addEventListener('pointerup', handlePointerUp);\n      canvasEle.addEventListener('pointermove', handlePointerMove);\n\n      return () => {\n        canvasEle.removeEventListener('pointerdown', handlePointerDown);\n        canvasEle.removeEventListener('pointerup', handlePointerUp);\n        canvasEle.removeEventListener('pointermove', handlePointerMove);\n      };\n    }\n  }, [\n    canvasElementRef,\n    handlePointerDown,\n    handlePointerMove,\n    handlePointerUp,\n    canScribble,\n    isWritingToolActive,\n  ]);\n};\n\nexport default useHeightExtender;\n"],"names":["useHeightExtender","canvasElementRef","cueCanvasRef","canScribble","isScribblingRef","useRef","shouldIncreaseHeightRef","isWritingToolActive","useCueCanvasActions","handlePointerDown","useCallback","handlePointerUp","updatedHeight","_a","handlePointerMove","event","rect","useEffect","canvasEle"],"mappings":";;AAYA,MAAMA,IAAoB,CAAC;AAAA,EACzB,kBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AACF,MAA+B;AACvB,QAAAC,IAAkBC,EAAgB,EAAK,GACvCC,IAA0BD,EAAgB,EAAK,GAC/C,EAAE,qBAAAE,EAAoB,IAAIC,EAAoB,GAE9CC,IAAoBC,EAAY,MAAM;AAC1C,IAAAN,EAAgB,UAAU;AAAA,EAC5B,GAAG,EAAE,GAECO,IAAkBD,EAAY,MAAM;;AACpC,QAAAT,EAAiB,WAAWK,EAAwB,SAAS;AAC/D,MAAAA,EAAwB,UAAU;AAG5B,YAAAM,IADOX,EAAiB,QAAQ,sBAAsB,EACjC,SAAS;AAEtB,OAAAY,IAAAX,KAAA,gBAAAA,EAAA,YAAA,QAAAW,EAAS,aAAaD;AAAA,IAAa;AAGnD,IAAAR,EAAgB,UAAU;AAAA,EAAA,GACzB,CAACH,GAAkBC,CAAY,CAAC,GAE7BY,IAAoBJ;AAAA,IACxB,CAACK,MAAsB;AACjB,UAAAX,EAAgB,WAAWH,EAAiB,SAAS;AACjD,cAAAe,IAAOf,EAAiB,QAAQ,sBAAsB;AAGxD,QAFMc,EAAM,UAAUC,EAAK,OAEtBA,EAAK,SAAS,QACrBV,EAAwB,UAAU;AAAA,MACpC;AAAA,IAEJ;AAAA,IACA,CAACL,CAAgB;AAAA,EACnB;AAEA,EAAAgB,EAAU,MAAM;AACd,UAAMC,IAAYjB,EAAiB;AAE/B,QAAAE,KAAee,KAAaX;AACpB,aAAAW,EAAA,iBAAiB,eAAeT,CAAiB,GACjDS,EAAA,iBAAiB,aAAaP,CAAe,GAC7CO,EAAA,iBAAiB,eAAeJ,CAAiB,GAEpD,MAAM;AACD,QAAAI,EAAA,oBAAoB,eAAeT,CAAiB,GACpDS,EAAA,oBAAoB,aAAaP,CAAe,GAChDO,EAAA,oBAAoB,eAAeJ,CAAiB;AAAA,MAChE;AAAA,EACF,GACC;AAAA,IACDb;AAAA,IACAQ;AAAA,IACAK;AAAA,IACAH;AAAA,IACAR;AAAA,IACAI;AAAA,EAAA,CACD;AACH;"}

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

@@ -1 +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;"}
+{"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,qBAAqB,GAErCC,IAAkB,CAACC,MAA4B;AACnD,QAAM,EAAE,QAAAC,GAAQ,UAAAC,GAAU,UAAAC,EAAa,IAAAH,GACjCI,IAAiBC,EAAwC,GACzDC,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,GAAI,CAAA;AAAA,MAAA,CACjC;AAEG,aAAAC,KAAQA,EAAK,SAAS,IACZA,EAAK,CAAC,KAAK,UAKlB;AAAA,IACT;AAAA,IACA,CAACL,CAAY;AAAA,EACf;AAEA,SAAAF,EAAe,UAAUI,GAElBA;AACT;"}

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

@@ -1 +1 @@
-{"version":3,"file":"helper.js","sources":["../../../../../src/features/cue-canvas/sidebar/homework/helper.ts"],"sourcesContent":["export const getDateInInputFormat = (inputDate: number | string) => {\n  const isDateInString = typeof inputDate === 'string';\n  const dateToBeConverted = isDateInString ? new Date(inputDate) : new Date(inputDate * 1000);\n\n  const dateNum = dateToBeConverted.getDate();\n  const monthNum = dateToBeConverted.getMonth() + 1;\n  const year = dateToBeConverted.getFullYear();\n\n  return { year, month: monthNum, date: dateNum };\n};\n\nexport function toMonthName(monthNumber: number) {\n  const date = new Date();\n\n  date.setMonth(monthNumber - 1);\n\n  return date.toLocaleString('en-US', {\n    month: 'short',\n  });\n}\nexport const getMonthNameforNumber = (num: number) => {\n  const monthName = toMonthName(+num)?.toUpperCase();\n\n  return monthName;\n};\n"],"names":["getDateInInputFormat","inputDate","dateToBeConverted","dateNum","monthNum","toMonthName","monthNumber","date","getMonthNameforNumber","num","_a"],"mappings":"AAAa,MAAAA,IAAuB,CAACC,MAA+B;AAE5D,QAAAC,IADiB,OAAOD,KAAc,WACD,IAAI,KAAKA,CAAS,IAAI,IAAI,KAAKA,IAAY,GAAI,GAEpFE,IAAUD,EAAkB,WAC5BE,IAAWF,EAAkB,SAAA,IAAa;AAGhD,SAAO,EAAE,MAFIA,EAAkB,eAEhB,OAAOE,GAAU,MAAMD,EAAQ;AAChD;AAEO,SAASE,EAAYC,GAAqB;AACzC,QAAAC,wBAAW;AAEZ,SAAAA,EAAA,SAASD,IAAc,CAAC,GAEtBC,EAAK,eAAe,SAAS;AAAA,IAClC,OAAO;AAAA,EAAA,CACR;AACH;AACa,MAAAC,IAAwB,CAACC,MAAgB;AApBzC,MAAAC;AAuBJ,UAFWA,IAAAL,EAAY,CAACI,CAAG,MAAhB,gBAAAC,EAAmB;AAGvC;"}
+{"version":3,"file":"helper.js","sources":["../../../../../src/features/cue-canvas/sidebar/homework/helper.ts"],"sourcesContent":["export const getDateInInputFormat = (inputDate: number | string) => {\n  const isDateInString = typeof inputDate === 'string';\n  const dateToBeConverted = isDateInString ? new Date(inputDate) : new Date(inputDate * 1000);\n\n  const dateNum = dateToBeConverted.getDate();\n  const monthNum = dateToBeConverted.getMonth() + 1;\n  const year = dateToBeConverted.getFullYear();\n\n  return { year, month: monthNum, date: dateNum };\n};\n\nexport function toMonthName(monthNumber: number) {\n  const date = new Date();\n\n  date.setMonth(monthNumber - 1);\n\n  return date.toLocaleString('en-US', {\n    month: 'short',\n  });\n}\nexport const getMonthNameforNumber = (num: number) => {\n  const monthName = toMonthName(+num)?.toUpperCase();\n\n  return monthName;\n};\n"],"names":["getDateInInputFormat","inputDate","dateToBeConverted","dateNum","monthNum","toMonthName","monthNumber","date","getMonthNameforNumber","num","_a"],"mappings":"AAAa,MAAAA,IAAuB,CAACC,MAA+B;AAE5D,QAAAC,IADiB,OAAOD,KAAc,WACD,IAAI,KAAKA,CAAS,IAAI,IAAI,KAAKA,IAAY,GAAI,GAEpFE,IAAUD,EAAkB,QAAQ,GACpCE,IAAWF,EAAkB,SAAA,IAAa;AAGhD,SAAO,EAAE,MAFIA,EAAkB,YAAY,GAE5B,OAAOE,GAAU,MAAMD,EAAQ;AAChD;AAEO,SAASE,EAAYC,GAAqB;AACzC,QAAAC,wBAAW,KAAK;AAEjB,SAAAA,EAAA,SAASD,IAAc,CAAC,GAEtBC,EAAK,eAAe,SAAS;AAAA,IAClC,OAAO;AAAA,EAAA,CACR;AACH;AACa,MAAAC,IAAwB,CAACC,MAAgB;AApBzC,MAAAC;AAuBJ,UAFWA,IAAAL,EAAY,CAACI,CAAG,MAAhB,gBAAAC,EAAmB;AAGvC;"}

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 }) => {\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;"}
+{"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,gBAAA,CAAA;AAAA,QAAA,GACF;AAAA,QACA,gBAAAJ,EAACK,GAAU,EAAA,SAASP,GAAU,OAAM,yBAClC,UAAC,gBAAAE,EAAAM,GAAA,EAAU,OAAM,QAAQ,CAAA,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,aAAc,CAAA,KADvCA,EAAK,aAEhD,CACD;AAAA,IAAA;AAAA,EAAA;GAEL,EACF,CAAA,GAIWE,IAAAC,EAAKb,CAAY;"}

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: 500,\n              y: 75,\n              rot: 0,\n            },\n          ],\n        },\n      };\n\n      hwRequestImages.forEach(image => {\n        const imgId = uuidv4();\n\n        actionData.data[imgId] = [\n          undefined,\n          {\n            name: 'image',\n            href: image + '?dummyProp=true',\n            x: 48,\n            y: 72,\n            rot: 0,\n            width: 400,\n          },\n        ];\n      });\n\n      activeInstance?.replaceCanvas(actionData);\n    }\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\n          src={hwRequestImages[0] + '?dummyProp=true'}\n          alt=\"Homework Request\"\n          crossOrigin=\"anonymous\"\n        />\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","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;AAEH,QAAAC,EAAA,KAAKE,CAAK,IAAI;AAAA,UACvB;AAAA,UACA;AAAA,YACE,MAAM;AAAA,YACN,MAAMD,IAAQ;AAAA,YACd,GAAG;AAAA,YACH,GAAG;AAAA,YACH,KAAK;AAAA,YACL,OAAO;AAAA,UACT;AAAA,QAAA;AAAA,MACF,CACD,GAEDP,KAAA,QAAAA,EAAgB,cAAcM;AAAA,IAChC;AACS,IAAAb,KACTM,EAAcD,CAAW;AAAA,EAAA,GACxB,CAACE,GAAgBL,GAAeG,GAAaF,GAAiBH,GAAUM,CAAa,CAAC,GAEnF,EAAE,MAAAU,GAAM,OAAAC,EAAM,IAAIC,EAAqBd,CAAW,GAElDe,IAAa,GAAGC,UAAQJ,CAAI,CAAC,IAAIK,aAAUC,IAAAC,EAAsBN,CAAK,MAA3B,gBAAAK,EAA8B,aAAa,CAAC;AAE7F,SACG,gBAAAE,EAAAC,GAAA,EAAU,OAAM,mBAAkB,SAAShB,GAC1C,UAAA,gBAAAiB,EAACC,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAAS,eAAe,GAAG,aAAY,SACpF,UAAA;AAAA,IAAA,gBAAAH;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,KAAKzB,EAAgB,CAAC,IAAI;AAAA,QAC1B,KAAI;AAAA,QACJ,aAAY;AAAA,MAAA;AAAA,IACd;AAAA,sBACC0B,GAAK,EAAA,WAAU,SAAQ,OAAM,SAC3B,UACH5B,GAAA;AAAA,sBACC4B,GAAK,EAAA,WAAU,SAAQ,OAAM,SAC3B,UACHV,GAAA;AAAA,EAAA,EACF,CAAA,EACF,CAAA;AAEJ,GAEeW,IAAAC,EAAKlC,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\n        actionData.data[imgId] = [\n          undefined,\n          {\n            name: 'image',\n            href: image + '?dummyProp=true',\n            x: 48,\n            y: 72,\n            rot: 0,\n            width: 400,\n          },\n        ];\n      });\n\n      activeInstance?.replaceCanvas(actionData);\n    }\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\n          src={hwRequestImages[0] + '?dummyProp=true'}\n          alt=\"Homework Request\"\n          crossOrigin=\"anonymous\"\n        />\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","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,EAAgB,IAAAH,GACvC;AAAA,IACJ,qBAAqBI;AAAA,IACrB,oBAAoBC;AAAA,IACpB,eAAeC;AAAA,IACf,aAAaC;AAAA,EAAA,IACXN,GACE,EAAE,eAAAO,GAAe,gBAAAC,EAAe,IAAIC,EAAoB,GAExDC,IAAoBC,EAAY,MAAM;AAC1C,UAAMC,IAASC,EAAO;AAElB,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,YAAA;AAAA,UACP;AAAA,QACF;AAAA,MAEJ;AAEA,MAAAC,EAAgB,QAAQ,CAASW,MAAA;AAC/B,cAAMC,IAAQH,EAAO;AAEV,QAAAC,EAAA,KAAKE,CAAK,IAAI;AAAA,UACvB;AAAA,UACA;AAAA,YACE,MAAM;AAAA,YACN,MAAMD,IAAQ;AAAA,YACd,GAAG;AAAA,YACH,GAAG;AAAA,YACH,KAAK;AAAA,YACL,OAAO;AAAA,UAAA;AAAA,QAEX;AAAA,MAAA,CACD,GAEDP,KAAA,QAAAA,EAAgB,cAAcM;AAAA,IAAU;AAEjC,IAAAb,EAAA,GACTM,EAAcD,CAAW;AAAA,EAAA,GACxB,CAACE,GAAgBL,GAAeG,GAAaF,GAAiBH,GAAUM,CAAa,CAAC,GAEnF,EAAE,MAAAU,GAAM,OAAAC,MAAUC,EAAqBd,CAAW,GAElDe,IAAa,GAAGC,EAAQ,QAAAJ,CAAI,CAAC,IAAIK,EAAU,WAAAC,IAAAC,EAAsBN,CAAK,MAA3B,gBAAAK,EAA8B,aAAa,CAAC;AAE7F,SACG,gBAAAE,EAAAC,GAAA,EAAU,OAAM,mBAAkB,SAAShB,GAC1C,UAAA,gBAAAiB,EAACC,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAAS,eAAe,GAAG,aAAY,SACpF,UAAA;AAAA,IAAA,gBAAAH;AAAA,MAACI;AAAAA,MAAA;AAAA,QACC,KAAKzB,EAAgB,CAAC,IAAI;AAAA,QAC1B,KAAI;AAAA,QACJ,aAAY;AAAA,MAAA;AAAA,IACd;AAAA,sBACC0B,GAAK,EAAA,WAAU,SAAQ,OAAM,SAC3B,UACH5B,GAAA;AAAA,sBACC4B,GAAK,EAAA,WAAU,SAAQ,OAAM,SAC3B,UACHV,EAAA,CAAA;AAAA,EAAA,EAAA,CACF,EACF,CAAA;AAEJ,GAEeW,IAAAC,EAAKlC,CAAe;"}

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 Clickable from '../../../ui/buttons/clickable/clickable';\nimport useContextMenuClickHandler from '../../../ui/hooks/use-context-menu-click-handler';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport { StyledWrapper, HWWrapper } 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 { menuVisible, onMenuClick } = useContextMenuClickHandler(\n    homeWorkMenuRef,\n    undefined,\n    true,\n    undefined,\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' || activeSidebar === 'puzzle') && menuVisible) {\n      onMenuClick();\n    }\n  }, [activeSidebar, menuVisible, onMenuClick]);\n\n  return (\n    <FlexView $position=\"relative\">\n      <Clickable onClick={handleClick} label=\"homework help\">\n        <StyledWrapper $active={activeSidebar === 'homework'}>\n          <HWWrapper\n            $background={activeSidebar === 'homework' ? 'BLACK' : 'WHITE'}\n            $borderColor={activeSidebar === 'homework' ? 'WHITE' : 'BLACK'}\n            $borderRadius={4}\n            $alignItems=\"center\"\n            $justifyContent=\"center\"\n          >\n            <Text $color={activeSidebar === 'homework' ? 'WHITE' : 'BLACK'} $renderAs=\"ub3-bold\">\n              HW\n            </Text>\n          </HWWrapper>\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","menuVisible","onMenuClick","useContextMenuClickHandler","handleClick","useCallback","useEffect","jsxs","FlexView","jsx","Clickable","StyledWrapper","HWWrapper","Text","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,GAE7B,EAAE,aAAAC,GAAa,aAAAC,EAAA,IAAgBC;AAAA,IACnCJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAGIK,IAAcC,EAAY,MAAM;AACpC,IAAIX,MAAkB,WACpBG,KAAA,QAAAA,EAAW,YAAY,MAERF,EAAAD,MAAkB,aAAa,SAAY,UAAU,GAC1DQ;KACX,CAACR,GAAeG,GAAWK,GAAaP,CAAgB,CAAC;AAE5D,SAAAW,EAAU,MAAM;AACd,KAAKZ,MAAkB,UAAUA,MAAkB,aAAaO,KAClDC;EAEb,GAAA,CAACR,GAAeO,GAAaC,CAAW,CAAC,GAG1C,gBAAAK,EAACC,GAAS,EAAA,WAAU,YAClB,UAAA;AAAA,IAAC,gBAAAC,EAAAC,GAAA,EAAU,SAASN,GAAa,OAAM,iBACrC,UAAC,gBAAAK,EAAAE,GAAA,EAAc,SAASjB,MAAkB,YACxC,UAAA,gBAAAe;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,aAAalB,MAAkB,aAAa,UAAU;AAAA,QACtD,cAAcA,MAAkB,aAAa,UAAU;AAAA,QACvD,eAAe;AAAA,QACf,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAEhB,UAAA,gBAAAe,EAACI,KAAK,QAAQnB,MAAkB,aAAa,UAAU,SAAS,WAAU,YAAW,UAErF,KAAA,CAAA;AAAA,MAAA;AAAA,OAEJ,EACF,CAAA;AAAA,IACCO,KAAe,gBAAAQ,EAACK,GAAa,EAAA,UAAUV,GAAa,YAAAR,GAAwB;AAAA,EAC/E,EAAA,CAAA;AAEJ,GAEemB,IAAAC,EAAKxB,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 Clickable from '../../../ui/buttons/clickable/clickable';\nimport useContextMenuClickHandler from '../../../ui/hooks/use-context-menu-click-handler';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport { StyledWrapper, HWWrapper } 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 { menuVisible, onMenuClick } = useContextMenuClickHandler(\n    homeWorkMenuRef,\n    undefined,\n    true,\n    undefined,\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' || activeSidebar === 'puzzle') && menuVisible) {\n      onMenuClick();\n    }\n  }, [activeSidebar, menuVisible, onMenuClick]);\n\n  return (\n    <FlexView $position=\"relative\">\n      <Clickable onClick={handleClick} label=\"homework help\">\n        <StyledWrapper $active={activeSidebar === 'homework'}>\n          <HWWrapper\n            $background={activeSidebar === 'homework' ? 'BLACK' : 'WHITE'}\n            $borderColor={activeSidebar === 'homework' ? 'WHITE' : 'BLACK'}\n            $borderRadius={4}\n            $alignItems=\"center\"\n            $justifyContent=\"center\"\n          >\n            <Text $color={activeSidebar === 'homework' ? 'WHITE' : 'BLACK'} $renderAs=\"ub3-bold\">\n              HW\n            </Text>\n          </HWWrapper>\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","menuVisible","onMenuClick","useContextMenuClickHandler","handleClick","useCallback","useEffect","jsxs","FlexView","jsx","Clickable","StyledWrapper","HWWrapper","Text","HomeWorkMenu","Homework","memo"],"mappings":";;;;;;;;;AAaA,MAAMA,IAAiE,CAASC,MAAA;AAC9E,QAAM,EAAE,eAAAC,GAAe,kBAAAC,GAAkB,YAAAC,EAAe,IAAAH,GAClD,EAAE,gBAAgBI,EAAU,IAAIC,EAAoB,GACpDC,IAAkBC,EAAO,IAAI,GAE7B,EAAE,aAAAC,GAAa,aAAAC,EAAA,IAAgBC;AAAA,IACnCJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GAEMK,IAAcC,EAAY,MAAM;AACpC,IAAIX,MAAkB,WACpBG,KAAA,QAAAA,EAAW,YAAY,MAERF,EAAAD,MAAkB,aAAa,SAAY,UAAU,GAC1DQ,EAAA;AAAA,KACX,CAACR,GAAeG,GAAWK,GAAaP,CAAgB,CAAC;AAE5D,SAAAW,EAAU,MAAM;AACd,KAAKZ,MAAkB,UAAUA,MAAkB,aAAaO,KAClDC,EAAA;AAAA,EAEb,GAAA,CAACR,GAAeO,GAAaC,CAAW,CAAC,GAG1C,gBAAAK,EAACC,GAAS,EAAA,WAAU,YAClB,UAAA;AAAA,IAAC,gBAAAC,EAAAC,GAAA,EAAU,SAASN,GAAa,OAAM,iBACrC,UAAC,gBAAAK,EAAAE,GAAA,EAAc,SAASjB,MAAkB,YACxC,UAAA,gBAAAe;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,aAAalB,MAAkB,aAAa,UAAU;AAAA,QACtD,cAAcA,MAAkB,aAAa,UAAU;AAAA,QACvD,eAAe;AAAA,QACf,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAEhB,UAAA,gBAAAe,EAACI,KAAK,QAAQnB,MAAkB,aAAa,UAAU,SAAS,WAAU,YAAW,UAErF,KAAA,CAAA;AAAA,MAAA;AAAA,OAEJ,EACF,CAAA;AAAA,IACCO,KAAe,gBAAAQ,EAACK,GAAa,EAAA,UAAUV,GAAa,YAAAR,EAAwB,CAAA;AAAA,EAAA,GAC/E;AAEJ,GAEemB,IAAAC,EAAKxB,CAAyB;"}

package/dist/features/cue-canvas/sidebar/puzzles/filter-selection-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-selection-menu.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/filter-selection-menu.tsx"],"sourcesContent":["import type { IFilterOption } from './api/get-puzzles';\nimport type { FilterSelectionMenuProps } from './puzzles-type';\n\nimport { memo, useCallback, useState } from 'react';\n\nimport BackIcon from '../../../../assets/line-icons/icons/back';\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport CheckboxInputList from '../../../ui/inputs/checkbox-input-list/checkbox-input-list';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport * as Styled from './puzzles-styled';\n\nconst FilterSelectionMenu: React.FC<FilterSelectionMenuProps> = ({\n  closeAllPopups,\n  menuItems,\n  onFiltersChange,\n  type,\n}) => {\n  const [selectedOptions, setSelectedOptions] = useState<string[]>(\n    menuItems.filter((ele: IFilterOption) => ele.applied).map((ele: IFilterOption) => ele.name),\n  );\n\n  const handleFilterChange = useCallback((selectedCodes: string[]) => {\n    setSelectedOptions(selectedCodes);\n  }, []);\n\n  const handleApplyFilters = useCallback(() => {\n    onFiltersChange({\n      [type]: selectedOptions,\n    });\n\n    closeAllPopups();\n  }, [onFiltersChange, closeAllPopups, selectedOptions, type]);\n\n  return (\n    <Styled.MenuContainer>\n      <FlexView $justifyContent=\"space-between\" $flexDirection=\"row\" $gutterX={1} $gapX={0.5}>\n        <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={1}>\n          <Clickable onClick={closeAllPopups} label=\"back\">\n            <BackIcon color=\"WHITE\" />\n          </Clickable>\n          <Text $color=\"WHITE\" $renderAs=\"eyebrow2\">\n            Select {type === 'grades' ? type : type.split('_')[1]}\n            {selectedOptions.length > 0 && <span>{` (${selectedOptions.length})`}</span>}\n          </Text>\n        </FlexView>\n        <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={1}>\n          <TextButton color=\"WHITE\" label=\"Apply\" onClick={handleApplyFilters} />\n          <Clickable onClick={closeAllPopups} label=\"close filter menu\">\n            <CrossIcon color=\"WHITE\" />\n          </Clickable>\n        </FlexView>\n      </FlexView>\n      <Styled.CheckboxWrapper $gutterX={1} $gapX={1}>\n        <CheckboxInputList\n          size=\"medium\"\n          renderAs=\"black-dark\"\n          numColumns={3}\n          options={menuItems.map(ele => ({\n            id: ele.name,\n            label: (\n              <Text $renderAs=\"ub3-bold\" $color=\"WHITE\" $inline>\n                {ele.name}\n              </Text>\n            ),\n          }))}\n          value={selectedOptions}\n          onChange={handleFilterChange}\n        />\n      </Styled.CheckboxWrapper>\n    </Styled.MenuContainer>\n  );\n};\n\nexport default memo(FilterSelectionMenu);\n"],"names":["FilterSelectionMenu","closeAllPopups","menuItems","onFiltersChange","type","selectedOptions","setSelectedOptions","useState","ele","handleFilterChange","useCallback","selectedCodes","handleApplyFilters","jsxs","Styled.MenuContainer","FlexView","jsx","Clickable","BackIcon","Text","TextButton","CrossIcon","Styled.CheckboxWrapper","CheckboxInputList","FilterSelectionMenu$1","memo"],"mappings":";;;;;;;;;;AAcA,MAAMA,IAA0D,CAAC;AAAA,EAC/D,gBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,MAAAC;AACF,MAAM;AACE,QAAA,CAACC,GAAiBC,CAAkB,IAAIC;AAAA,IAC5CL,EAAU,OAAO,CAACM,MAAuBA,EAAI,OAAO,EAAE,IAAI,CAACA,MAAuBA,EAAI,IAAI;AAAA,EAAA,GAGtFC,IAAqBC,EAAY,CAACC,MAA4B;AAClE,IAAAL,EAAmBK,CAAa;AAAA,EAClC,GAAG,CAAE,CAAA,GAECC,IAAqBF,EAAY,MAAM;AAC3B,IAAAP,EAAA;AAAA,MACd,CAACC,CAAI,GAAGC;AAAA,IAAA,CACT,GAEcJ;KACd,CAACE,GAAiBF,GAAgBI,GAAiBD,CAAI,CAAC;AAGzD,SAAA,gBAAAS,EAACC,GAAA,EACC,UAAA;AAAA,IAAC,gBAAAD,EAAAE,GAAA,EAAS,iBAAgB,iBAAgB,gBAAe,OAAM,UAAU,GAAG,OAAO,KACjF,UAAA;AAAA,MAAA,gBAAAF,EAACE,KAAS,gBAAe,OAAM,aAAY,UAAS,iBAAiB,GACnE,UAAA;AAAA,QAAC,gBAAAC,EAAAC,GAAA,EAAU,SAAShB,GAAgB,OAAM,QACxC,UAAC,gBAAAe,EAAAE,GAAA,EAAS,OAAM,QAAA,CAAQ,EAC1B,CAAA;AAAA,QACC,gBAAAL,EAAAM,GAAA,EAAK,QAAO,SAAQ,WAAU,YAAW,UAAA;AAAA,UAAA;AAAA,UAChCf,MAAS,WAAWA,IAAOA,EAAK,MAAM,GAAG,EAAE,CAAC;AAAA,UACnDC,EAAgB,SAAS,KAAK,gBAAAW,EAAC,UAAM,UAAK,KAAAX,EAAgB,MAAM,IAAI,CAAA;AAAA,QAAA,GACvE;AAAA,MAAA,GACF;AAAA,wBACCU,GAAS,EAAA,gBAAe,OAAM,aAAY,UAAS,iBAAiB,GACnE,UAAA;AAAA,QAAA,gBAAAC,EAACI,KAAW,OAAM,SAAQ,OAAM,SAAQ,SAASR,GAAoB;AAAA,QACrE,gBAAAI,EAACC,GAAU,EAAA,SAAShB,GAAgB,OAAM,qBACxC,UAAC,gBAAAe,EAAAK,GAAA,EAAU,OAAM,QAAA,CAAQ,EAC3B,CAAA;AAAA,MAAA,GACF;AAAA,IAAA,GACF;AAAA,sBACCC,GAAA,EAAuB,UAAU,GAAG,OAAO,GAC1C,UAAA,gBAAAN;AAAA,MAACO;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,UAAS;AAAA,QACT,YAAY;AAAA,QACZ,SAASrB,EAAU,IAAI,CAAQM,OAAA;AAAA,UAC7B,IAAIA,EAAI;AAAA,UACR,OACG,gBAAAQ,EAAAG,GAAA,EAAK,WAAU,YAAW,QAAO,SAAQ,SAAO,IAC9C,UAAAX,EAAI,KACP,CAAA;AAAA,QAAA,EAEF;AAAA,QACF,OAAOH;AAAA,QACP,UAAUI;AAAA,MAAA;AAAA,IAAA,GAEd;AAAA,EACF,EAAA,CAAA;AAEJ,GAEee,IAAAC,EAAKzB,CAAmB;"}
+{"version":3,"file":"filter-selection-menu.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/filter-selection-menu.tsx"],"sourcesContent":["import type { IFilterOption } from './api/get-puzzles';\nimport type { FilterSelectionMenuProps } from './puzzles-type';\n\nimport { memo, useCallback, useState } from 'react';\n\nimport BackIcon from '../../../../assets/line-icons/icons/back';\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport CheckboxInputList from '../../../ui/inputs/checkbox-input-list/checkbox-input-list';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport * as Styled from './puzzles-styled';\n\nconst FilterSelectionMenu: React.FC<FilterSelectionMenuProps> = ({\n  closeAllPopups,\n  menuItems,\n  onFiltersChange,\n  type,\n}) => {\n  const [selectedOptions, setSelectedOptions] = useState<string[]>(\n    menuItems.filter((ele: IFilterOption) => ele.applied).map((ele: IFilterOption) => ele.name),\n  );\n\n  const handleFilterChange = useCallback((selectedCodes: string[]) => {\n    setSelectedOptions(selectedCodes);\n  }, []);\n\n  const handleApplyFilters = useCallback(() => {\n    onFiltersChange({\n      [type]: selectedOptions,\n    });\n\n    closeAllPopups();\n  }, [onFiltersChange, closeAllPopups, selectedOptions, type]);\n\n  return (\n    <Styled.MenuContainer>\n      <FlexView $justifyContent=\"space-between\" $flexDirection=\"row\" $gutterX={1} $gapX={0.5}>\n        <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={1}>\n          <Clickable onClick={closeAllPopups} label=\"back\">\n            <BackIcon color=\"WHITE\" />\n          </Clickable>\n          <Text $color=\"WHITE\" $renderAs=\"eyebrow2\">\n            Select {type === 'grades' ? type : type.split('_')[1]}\n            {selectedOptions.length > 0 && <span>{` (${selectedOptions.length})`}</span>}\n          </Text>\n        </FlexView>\n        <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={1}>\n          <TextButton color=\"WHITE\" label=\"Apply\" onClick={handleApplyFilters} />\n          <Clickable onClick={closeAllPopups} label=\"close filter menu\">\n            <CrossIcon color=\"WHITE\" />\n          </Clickable>\n        </FlexView>\n      </FlexView>\n      <Styled.CheckboxWrapper $gutterX={1} $gapX={1}>\n        <CheckboxInputList\n          size=\"medium\"\n          renderAs=\"black-dark\"\n          numColumns={3}\n          options={menuItems.map(ele => ({\n            id: ele.name,\n            label: (\n              <Text $renderAs=\"ub3-bold\" $color=\"WHITE\" $inline>\n                {ele.name}\n              </Text>\n            ),\n          }))}\n          value={selectedOptions}\n          onChange={handleFilterChange}\n        />\n      </Styled.CheckboxWrapper>\n    </Styled.MenuContainer>\n  );\n};\n\nexport default memo(FilterSelectionMenu);\n"],"names":["FilterSelectionMenu","closeAllPopups","menuItems","onFiltersChange","type","selectedOptions","setSelectedOptions","useState","ele","handleFilterChange","useCallback","selectedCodes","handleApplyFilters","jsxs","Styled.MenuContainer","FlexView","jsx","Clickable","BackIcon","Text","TextButton","CrossIcon","Styled.CheckboxWrapper","CheckboxInputList","FilterSelectionMenu$1","memo"],"mappings":";;;;;;;;;;AAcA,MAAMA,IAA0D,CAAC;AAAA,EAC/D,gBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,MAAAC;AACF,MAAM;AACE,QAAA,CAACC,GAAiBC,CAAkB,IAAIC;AAAA,IAC5CL,EAAU,OAAO,CAACM,MAAuBA,EAAI,OAAO,EAAE,IAAI,CAACA,MAAuBA,EAAI,IAAI;AAAA,EAC5F,GAEMC,IAAqBC,EAAY,CAACC,MAA4B;AAClE,IAAAL,EAAmBK,CAAa;AAAA,EAClC,GAAG,EAAE,GAECC,IAAqBF,EAAY,MAAM;AAC3B,IAAAP,EAAA;AAAA,MACd,CAACC,CAAI,GAAGC;AAAA,IAAA,CACT,GAEcJ,EAAA;AAAA,KACd,CAACE,GAAiBF,GAAgBI,GAAiBD,CAAI,CAAC;AAGzD,SAAA,gBAAAS,EAACC,GAAA,EACC,UAAA;AAAA,IAAC,gBAAAD,EAAAE,GAAA,EAAS,iBAAgB,iBAAgB,gBAAe,OAAM,UAAU,GAAG,OAAO,KACjF,UAAA;AAAA,MAAA,gBAAAF,EAACE,KAAS,gBAAe,OAAM,aAAY,UAAS,iBAAiB,GACnE,UAAA;AAAA,QAAC,gBAAAC,EAAAC,GAAA,EAAU,SAAShB,GAAgB,OAAM,QACxC,UAAC,gBAAAe,EAAAE,GAAA,EAAS,OAAM,QAAA,CAAQ,EAC1B,CAAA;AAAA,QACC,gBAAAL,EAAAM,GAAA,EAAK,QAAO,SAAQ,WAAU,YAAW,UAAA;AAAA,UAAA;AAAA,UAChCf,MAAS,WAAWA,IAAOA,EAAK,MAAM,GAAG,EAAE,CAAC;AAAA,UACnDC,EAAgB,SAAS,KAAK,gBAAAW,EAAC,UAAM,UAAK,KAAAX,EAAgB,MAAM,IAAI,CAAA;AAAA,QAAA,EACvE,CAAA;AAAA,MAAA,GACF;AAAA,wBACCU,GAAS,EAAA,gBAAe,OAAM,aAAY,UAAS,iBAAiB,GACnE,UAAA;AAAA,QAAA,gBAAAC,EAACI,KAAW,OAAM,SAAQ,OAAM,SAAQ,SAASR,GAAoB;AAAA,QACrE,gBAAAI,EAACC,GAAU,EAAA,SAAShB,GAAgB,OAAM,qBACxC,UAAC,gBAAAe,EAAAK,GAAA,EAAU,OAAM,QAAQ,CAAA,EAC3B,CAAA;AAAA,MAAA,EACF,CAAA;AAAA,IAAA,GACF;AAAA,sBACCC,GAAA,EAAuB,UAAU,GAAG,OAAO,GAC1C,UAAA,gBAAAN;AAAA,MAACO;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,UAAS;AAAA,QACT,YAAY;AAAA,QACZ,SAASrB,EAAU,IAAI,CAAQM,OAAA;AAAA,UAC7B,IAAIA,EAAI;AAAA,UACR,OACG,gBAAAQ,EAAAG,GAAA,EAAK,WAAU,YAAW,QAAO,SAAQ,SAAO,IAC9C,UAAAX,EAAI,KACP,CAAA;AAAA,QAAA,EAEF;AAAA,QACF,OAAOH;AAAA,QACP,UAAUI;AAAA,MAAA;AAAA,IAAA,EAEd,CAAA;AAAA,EAAA,GACF;AAEJ,GAEee,IAAAC,EAAKzB,CAAmB;"}

package/dist/features/cue-canvas/sidebar/puzzles/filters-section.js.map

@@ -1 +1 @@
-{"version":3,"file":"filters-section.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/filters-section.tsx"],"sourcesContent":["import type { IFilterSectionProps } from './puzzles-type';\n\nimport React, { memo } from 'react';\n\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport CheckboxInputList from '../../../ui/inputs/checkbox-input-list/checkbox-input-list';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\n\nconst FilterSection: React.FC<IFilterSectionProps> = ({\n  title,\n  items,\n  selectedItems,\n  onChange,\n  openSelector,\n}) => {\n  return (\n    <>\n      <Text $renderAs=\"eyebrow2\" $color=\"WHITE\">\n        {title}\n      </Text>\n      <FlexView $gutterX={0.5} $gapX={0.5} $flexRowGapX={0.25}>\n        {items.length > 0 && (\n          <CheckboxInputList\n            size=\"medium\"\n            renderAs=\"black-dark\"\n            numColumns={1}\n            options={items.slice(0, 3).map(ele => ({\n              id: ele,\n              label: (\n                <Text $renderAs=\"ub3-bold\" $color=\"WHITE\" $inline>\n                  {ele}\n                </Text>\n              ),\n            }))}\n            value={selectedItems}\n            onChange={onChange}\n          />\n        )}\n        {items.length > 3 && (\n          <TextButton\n            size=\"small\"\n            color=\"GREY_2\"\n            onClick={openSelector}\n            label={`${items.length - 3}+ more`}\n          />\n        )}\n      </FlexView>\n    </>\n  );\n};\n\nexport default memo(FilterSection);\n"],"names":["FilterSection","title","items","selectedItems","onChange","openSelector","jsxs","Fragment","jsx","Text","FlexView","CheckboxInputList","ele","TextButton","FilterSection$1","memo"],"mappings":";;;;;;AASA,MAAMA,IAA+C,CAAC;AAAA,EACpD,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AACF,MAGM,gBAAAC,EAAAC,GAAA,EAAA,UAAA;AAAA,EAAA,gBAAAC,EAACC,GAAK,EAAA,WAAU,YAAW,QAAO,SAC/B,UACHR,GAAA;AAAA,oBACCS,GAAS,EAAA,UAAU,KAAK,OAAO,KAAK,cAAc,MAChD,UAAA;AAAA,IAAAR,EAAM,SAAS,KACd,gBAAAM;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,UAAS;AAAA,QACT,YAAY;AAAA,QACZ,SAAST,EAAM,MAAM,GAAG,CAAC,EAAE,IAAI,CAAQU,OAAA;AAAA,UACrC,IAAIA;AAAA,UACJ,yBACGH,GAAK,EAAA,WAAU,YAAW,QAAO,SAAQ,SAAO,IAC9C,UACHG,EAAA,CAAA;AAAA,QAAA,EAEF;AAAA,QACF,OAAOT;AAAA,QACP,UAAAC;AAAA,MAAA;AAAA,IACF;AAAA,IAEDF,EAAM,SAAS,KACd,gBAAAM;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAM;AAAA,QACN,SAASR;AAAA,QACT,OAAO,GAAGH,EAAM,SAAS,CAAC;AAAA,MAAA;AAAA,IAC5B;AAAA,EAAA,GAEJ;AACF,EAAA,CAAA,GAIWY,IAAAC,EAAKf,CAAa;"}
+{"version":3,"file":"filters-section.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/filters-section.tsx"],"sourcesContent":["import type { IFilterSectionProps } from './puzzles-type';\n\nimport React, { memo } from 'react';\n\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport CheckboxInputList from '../../../ui/inputs/checkbox-input-list/checkbox-input-list';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\n\nconst FilterSection: React.FC<IFilterSectionProps> = ({\n  title,\n  items,\n  selectedItems,\n  onChange,\n  openSelector,\n}) => {\n  return (\n    <>\n      <Text $renderAs=\"eyebrow2\" $color=\"WHITE\">\n        {title}\n      </Text>\n      <FlexView $gutterX={0.5} $gapX={0.5} $flexRowGapX={0.25}>\n        {items.length > 0 && (\n          <CheckboxInputList\n            size=\"medium\"\n            renderAs=\"black-dark\"\n            numColumns={1}\n            options={items.slice(0, 3).map(ele => ({\n              id: ele,\n              label: (\n                <Text $renderAs=\"ub3-bold\" $color=\"WHITE\" $inline>\n                  {ele}\n                </Text>\n              ),\n            }))}\n            value={selectedItems}\n            onChange={onChange}\n          />\n        )}\n        {items.length > 3 && (\n          <TextButton\n            size=\"small\"\n            color=\"GREY_2\"\n            onClick={openSelector}\n            label={`${items.length - 3}+ more`}\n          />\n        )}\n      </FlexView>\n    </>\n  );\n};\n\nexport default memo(FilterSection);\n"],"names":["FilterSection","title","items","selectedItems","onChange","openSelector","jsxs","Fragment","jsx","Text","FlexView","CheckboxInputList","ele","TextButton","FilterSection$1","memo"],"mappings":";;;;;;AASA,MAAMA,IAA+C,CAAC;AAAA,EACpD,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,eAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AACF,MAGM,gBAAAC,EAAAC,GAAA,EAAA,UAAA;AAAA,EAAA,gBAAAC,EAACC,GAAK,EAAA,WAAU,YAAW,QAAO,SAC/B,UACHR,GAAA;AAAA,oBACCS,GAAS,EAAA,UAAU,KAAK,OAAO,KAAK,cAAc,MAChD,UAAA;AAAA,IAAAR,EAAM,SAAS,KACd,gBAAAM;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,UAAS;AAAA,QACT,YAAY;AAAA,QACZ,SAAST,EAAM,MAAM,GAAG,CAAC,EAAE,IAAI,CAAQU,OAAA;AAAA,UACrC,IAAIA;AAAA,UACJ,yBACGH,GAAK,EAAA,WAAU,YAAW,QAAO,SAAQ,SAAO,IAC9C,UACHG,EAAA,CAAA;AAAA,QAAA,EAEF;AAAA,QACF,OAAOT;AAAA,QACP,UAAAC;AAAA,MAAA;AAAA,IACF;AAAA,IAEDF,EAAM,SAAS,KACd,gBAAAM;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAM;AAAA,QACN,SAASR;AAAA,QACT,OAAO,GAAGH,EAAM,SAAS,CAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EAC5B,EAEJ,CAAA;AAAA,GACF,GAIWY,IAAAC,EAAKf,CAAa;"}

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

@@ -1 +1 @@
-{"version":3,"file":"filters.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/filters.tsx"],"sourcesContent":["import type { IFilterOption } from './api/get-puzzles';\nimport type { FiltersProps } from './puzzles-type';\n\nimport React, { memo, useCallback, useEffect, useMemo, useState } from 'react';\n\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport TabComponent from '../../../ui/tab/tab';\nimport Text from '../../../ui/text/text';\nimport FilterSection from './filters-section';\nimport * as Styled from './puzzles-styled';\nimport { GRADE_DISPLAY_NAMES } from './utils';\n\nconst getAppliedFilters = (filters: IFilterOption[]): string[] => {\n  return filters.filter(item => item.applied).map(item => item.name);\n};\n\nconst getAllFilters = (filters: IFilterOption[]): string[] => {\n  return filters.map(item => item.name);\n};\n\nconst Filters: React.FC<FiltersProps> = props => {\n  const { handleFiltersChange, filterGrades, filterTypes, filterTiles, filterTopics, togglePopup } =\n    props;\n  const [selectedGrades, setSelectedGrade] = useState<string[]>(getAppliedFilters(filterGrades));\n  const [selectedTiles, setSelectedTiles] = useState<string[]>(getAppliedFilters(filterTiles));\n  const [selectedTopics, setSelectedTopics] = useState<string[]>(getAppliedFilters(filterTopics));\n  const [selectedTypes, setSelectedTypes] = useState<string[]>(getAppliedFilters(filterTypes));\n\n  const allTypes = useMemo(() => getAllFilters(filterTypes), [filterTypes]);\n  const allTiles = useMemo(() => getAllFilters(filterTiles), [filterTiles]);\n  const allTopics = useMemo(() => getAllFilters(filterTopics), [filterTopics]);\n\n  const handleTypeChange = useCallback(\n    (ele: string) => {\n      const newSelectedTypes = selectedTypes.includes(ele)\n        ? selectedTypes.filter(type => type !== ele)\n        : [...selectedTypes, ele];\n\n      setSelectedTypes(newSelectedTypes);\n      handleFiltersChange({\n        activity_types: newSelectedTypes,\n      });\n    },\n    [handleFiltersChange, selectedTypes],\n  );\n\n  const handleTileChange = useCallback(\n    (selectedCodes: string[]) => {\n      setSelectedTiles(selectedCodes);\n      handleFiltersChange({\n        activity_tiles: selectedCodes,\n      });\n    },\n    [handleFiltersChange],\n  );\n\n  const handleTopicChange = useCallback(\n    (selectedCodes: string[]) => {\n      setSelectedTopics(selectedCodes);\n      handleFiltersChange({\n        activity_topics: selectedCodes,\n      });\n    },\n    [handleFiltersChange],\n  );\n\n  const toggleGradePopup = useCallback(() => {\n    togglePopup('grades');\n  }, [togglePopup]);\n\n  const toggleTilesPopup = useCallback(() => {\n    togglePopup('tiles');\n  }, [togglePopup]);\n\n  const toggleTopicsPopup = useCallback(() => {\n    togglePopup('topics');\n  }, [togglePopup]);\n\n  useEffect(() => {\n    setSelectedGrade(getAppliedFilters(filterGrades));\n  }, [filterGrades]);\n\n  useEffect(() => {\n    setSelectedTiles(getAppliedFilters(filterTiles));\n  }, [filterTiles]);\n\n  useEffect(() => {\n    setSelectedTopics(getAppliedFilters(filterTopics));\n  }, [filterTopics]);\n\n  useEffect(() => {\n    setSelectedTypes(getAppliedFilters(filterTypes));\n  }, [filterTypes]);\n\n  return (\n    <>\n      <Text $renderAs=\"eyebrow2\" $color=\"WHITE\">\n        GRADE\n      </Text>\n      <FlexView\n        $flexDirection=\"row\"\n        $justifyContent=\"space-between\"\n        $alignItems=\"center\"\n        $gutterX={0.5}\n        $gapX={0.25}\n        $marginBottomX={0.5}\n      >\n        {selectedGrades.length ? (\n          <Styled.SelectedGrades $renderAs=\"eyebrow2\" $color=\"WHITE\">\n            {selectedGrades.map((grade, index) => (\n              <span key={grade}>\n                {GRADE_DISPLAY_NAMES[grade]}\n                {index < selectedGrades.length - 1 ? ', ' : ''}\n              </span>\n            ))}\n          </Styled.SelectedGrades>\n        ) : (\n          <TextButton color=\"WHITE\" onClick={toggleGradePopup} label=\"Select Grade\" />\n        )}\n        {selectedGrades.length > 0 && (\n          <TextButton color=\"WHITE\" onClick={toggleGradePopup} label=\"Edit\" />\n        )}\n      </FlexView>\n      <Text $renderAs=\"eyebrow2\" $color=\"WHITE\">\n        TYPE\n      </Text>\n      <FlexView $flexDirection=\"row\" $flexWrap>\n        {allTypes.map((ele: string) => (\n          <TabComponent\n            key={ele}\n            $width=\"fit-content\"\n            $renderAs=\"secondary\"\n            label={ele}\n            $selected={selectedTypes.includes(ele)}\n            shape=\"square\"\n            $size=\"small\"\n            onClick={() => handleTypeChange(ele)}\n          />\n        ))}\n      </FlexView>\n      <FilterSection\n        title=\"TOPIC\"\n        items={allTopics}\n        selectedItems={selectedTopics}\n        onChange={handleTopicChange}\n        openSelector={toggleTopicsPopup}\n      />\n      <FilterSection\n        title=\"TILE\"\n        items={allTiles}\n        onChange={handleTileChange}\n        selectedItems={selectedTiles}\n        openSelector={toggleTilesPopup}\n      />\n    </>\n  );\n};\n\nexport default memo(Filters);\n"],"names":["getAppliedFilters","filters","item","getAllFilters","Filters","props","handleFiltersChange","filterGrades","filterTypes","filterTiles","filterTopics","togglePopup","selectedGrades","setSelectedGrade","useState","selectedTiles","setSelectedTiles","selectedTopics","setSelectedTopics","selectedTypes","setSelectedTypes","allTypes","useMemo","allTiles","allTopics","handleTypeChange","useCallback","ele","newSelectedTypes","type","handleTileChange","selectedCodes","handleTopicChange","toggleGradePopup","toggleTilesPopup","toggleTopicsPopup","useEffect","jsxs","Fragment","jsx","Text","FlexView","Styled.SelectedGrades","grade","index","GRADE_DISPLAY_NAMES","TextButton","TabComponent","FilterSection","Filters$1","memo"],"mappings":"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"}
+{"version":3,"file":"filters.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/filters.tsx"],"sourcesContent":["import type { IFilterOption } from './api/get-puzzles';\nimport type { FiltersProps } from './puzzles-type';\n\nimport React, { memo, useCallback, useEffect, useMemo, useState } from 'react';\n\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport TabComponent from '../../../ui/tab/tab';\nimport Text from '../../../ui/text/text';\nimport FilterSection from './filters-section';\nimport * as Styled from './puzzles-styled';\nimport { GRADE_DISPLAY_NAMES } from './utils';\n\nconst getAppliedFilters = (filters: IFilterOption[]): string[] => {\n  return filters.filter(item => item.applied).map(item => item.name);\n};\n\nconst getAllFilters = (filters: IFilterOption[]): string[] => {\n  return filters.map(item => item.name);\n};\n\nconst Filters: React.FC<FiltersProps> = props => {\n  const { handleFiltersChange, filterGrades, filterTypes, filterTiles, filterTopics, togglePopup } =\n    props;\n  const [selectedGrades, setSelectedGrade] = useState<string[]>(getAppliedFilters(filterGrades));\n  const [selectedTiles, setSelectedTiles] = useState<string[]>(getAppliedFilters(filterTiles));\n  const [selectedTopics, setSelectedTopics] = useState<string[]>(getAppliedFilters(filterTopics));\n  const [selectedTypes, setSelectedTypes] = useState<string[]>(getAppliedFilters(filterTypes));\n\n  const allTypes = useMemo(() => getAllFilters(filterTypes), [filterTypes]);\n  const allTiles = useMemo(() => getAllFilters(filterTiles), [filterTiles]);\n  const allTopics = useMemo(() => getAllFilters(filterTopics), [filterTopics]);\n\n  const handleTypeChange = useCallback(\n    (ele: string) => {\n      const newSelectedTypes = selectedTypes.includes(ele)\n        ? selectedTypes.filter(type => type !== ele)\n        : [...selectedTypes, ele];\n\n      setSelectedTypes(newSelectedTypes);\n      handleFiltersChange({\n        activity_types: newSelectedTypes,\n      });\n    },\n    [handleFiltersChange, selectedTypes],\n  );\n\n  const handleTileChange = useCallback(\n    (selectedCodes: string[]) => {\n      setSelectedTiles(selectedCodes);\n      handleFiltersChange({\n        activity_tiles: selectedCodes,\n      });\n    },\n    [handleFiltersChange],\n  );\n\n  const handleTopicChange = useCallback(\n    (selectedCodes: string[]) => {\n      setSelectedTopics(selectedCodes);\n      handleFiltersChange({\n        activity_topics: selectedCodes,\n      });\n    },\n    [handleFiltersChange],\n  );\n\n  const toggleGradePopup = useCallback(() => {\n    togglePopup('grades');\n  }, [togglePopup]);\n\n  const toggleTilesPopup = useCallback(() => {\n    togglePopup('tiles');\n  }, [togglePopup]);\n\n  const toggleTopicsPopup = useCallback(() => {\n    togglePopup('topics');\n  }, [togglePopup]);\n\n  useEffect(() => {\n    setSelectedGrade(getAppliedFilters(filterGrades));\n  }, [filterGrades]);\n\n  useEffect(() => {\n    setSelectedTiles(getAppliedFilters(filterTiles));\n  }, [filterTiles]);\n\n  useEffect(() => {\n    setSelectedTopics(getAppliedFilters(filterTopics));\n  }, [filterTopics]);\n\n  useEffect(() => {\n    setSelectedTypes(getAppliedFilters(filterTypes));\n  }, [filterTypes]);\n\n  return (\n    <>\n      <Text $renderAs=\"eyebrow2\" $color=\"WHITE\">\n        GRADE\n      </Text>\n      <FlexView\n        $flexDirection=\"row\"\n        $justifyContent=\"space-between\"\n        $alignItems=\"center\"\n        $gutterX={0.5}\n        $gapX={0.25}\n        $marginBottomX={0.5}\n      >\n        {selectedGrades.length ? (\n          <Styled.SelectedGrades $renderAs=\"eyebrow2\" $color=\"WHITE\">\n            {selectedGrades.map((grade, index) => (\n              <span key={grade}>\n                {GRADE_DISPLAY_NAMES[grade]}\n                {index < selectedGrades.length - 1 ? ', ' : ''}\n              </span>\n            ))}\n          </Styled.SelectedGrades>\n        ) : (\n          <TextButton color=\"WHITE\" onClick={toggleGradePopup} label=\"Select Grade\" />\n        )}\n        {selectedGrades.length > 0 && (\n          <TextButton color=\"WHITE\" onClick={toggleGradePopup} label=\"Edit\" />\n        )}\n      </FlexView>\n      <Text $renderAs=\"eyebrow2\" $color=\"WHITE\">\n        TYPE\n      </Text>\n      <FlexView $flexDirection=\"row\" $flexWrap>\n        {allTypes.map((ele: string) => (\n          <TabComponent\n            key={ele}\n            $width=\"fit-content\"\n            $renderAs=\"secondary\"\n            label={ele}\n            $selected={selectedTypes.includes(ele)}\n            shape=\"square\"\n            $size=\"small\"\n            onClick={() => handleTypeChange(ele)}\n          />\n        ))}\n      </FlexView>\n      <FilterSection\n        title=\"TOPIC\"\n        items={allTopics}\n        selectedItems={selectedTopics}\n        onChange={handleTopicChange}\n        openSelector={toggleTopicsPopup}\n      />\n      <FilterSection\n        title=\"TILE\"\n        items={allTiles}\n        onChange={handleTileChange}\n        selectedItems={selectedTiles}\n        openSelector={toggleTilesPopup}\n      />\n    </>\n  );\n};\n\nexport default memo(Filters);\n"],"names":["getAppliedFilters","filters","item","getAllFilters","Filters","props","handleFiltersChange","filterGrades","filterTypes","filterTiles","filterTopics","togglePopup","selectedGrades","setSelectedGrade","useState","selectedTiles","setSelectedTiles","selectedTopics","setSelectedTopics","selectedTypes","setSelectedTypes","allTypes","useMemo","allTiles","allTopics","handleTypeChange","useCallback","ele","newSelectedTypes","type","handleTileChange","selectedCodes","handleTopicChange","toggleGradePopup","toggleTilesPopup","toggleTopicsPopup","useEffect","jsxs","Fragment","jsx","Text","FlexView","Styled.SelectedGrades","grade","index","GRADE_DISPLAY_NAMES","TextButton","TabComponent","FilterSection","Filters$1","memo"],"mappings":";;;;;;;;;AAaA,MAAMA,IAAoB,CAACC,MAClBA,EAAQ,OAAO,CAAQC,MAAAA,EAAK,OAAO,EAAE,IAAI,CAAQA,MAAAA,EAAK,IAAI,GAG7DC,IAAgB,CAACF,MACdA,EAAQ,IAAI,CAAQC,MAAAA,EAAK,IAAI,GAGhCE,IAAkC,CAASC,MAAA;AAC/C,QAAM,EAAE,qBAAAC,GAAqB,cAAAC,GAAc,aAAAC,GAAa,aAAAC,GAAa,cAAAC,GAAc,aAAAC,MACjFN,GACI,CAACO,GAAgBC,CAAgB,IAAIC,EAAmBd,EAAkBO,CAAY,CAAC,GACvF,CAACQ,GAAeC,CAAgB,IAAIF,EAAmBd,EAAkBS,CAAW,CAAC,GACrF,CAACQ,GAAgBC,CAAiB,IAAIJ,EAAmBd,EAAkBU,CAAY,CAAC,GACxF,CAACS,GAAeC,CAAgB,IAAIN,EAAmBd,EAAkBQ,CAAW,CAAC,GAErFa,IAAWC,EAAQ,MAAMnB,EAAcK,CAAW,GAAG,CAACA,CAAW,CAAC,GAClEe,IAAWD,EAAQ,MAAMnB,EAAcM,CAAW,GAAG,CAACA,CAAW,CAAC,GAClEe,IAAYF,EAAQ,MAAMnB,EAAcO,CAAY,GAAG,CAACA,CAAY,CAAC,GAErEe,IAAmBC;AAAA,IACvB,CAACC,MAAgB;AACf,YAAMC,IAAmBT,EAAc,SAASQ,CAAG,IAC/CR,EAAc,OAAO,CAAQU,MAAAA,MAASF,CAAG,IACzC,CAAC,GAAGR,GAAeQ,CAAG;AAE1B,MAAAP,EAAiBQ,CAAgB,GACbtB,EAAA;AAAA,QAClB,gBAAgBsB;AAAA,MAAA,CACjB;AAAA,IACH;AAAA,IACA,CAACtB,GAAqBa,CAAa;AAAA,EACrC,GAEMW,IAAmBJ;AAAA,IACvB,CAACK,MAA4B;AAC3B,MAAAf,EAAiBe,CAAa,GACVzB,EAAA;AAAA,QAClB,gBAAgByB;AAAA,MAAA,CACjB;AAAA,IACH;AAAA,IACA,CAACzB,CAAmB;AAAA,EACtB,GAEM0B,IAAoBN;AAAA,IACxB,CAACK,MAA4B;AAC3B,MAAAb,EAAkBa,CAAa,GACXzB,EAAA;AAAA,QAClB,iBAAiByB;AAAA,MAAA,CAClB;AAAA,IACH;AAAA,IACA,CAACzB,CAAmB;AAAA,EACtB,GAEM2B,IAAmBP,EAAY,MAAM;AACzC,IAAAf,EAAY,QAAQ;AAAA,EAAA,GACnB,CAACA,CAAW,CAAC,GAEVuB,IAAmBR,EAAY,MAAM;AACzC,IAAAf,EAAY,OAAO;AAAA,EAAA,GAClB,CAACA,CAAW,CAAC,GAEVwB,IAAoBT,EAAY,MAAM;AAC1C,IAAAf,EAAY,QAAQ;AAAA,EAAA,GACnB,CAACA,CAAW,CAAC;AAEhB,SAAAyB,EAAU,MAAM;AACG,IAAAvB,EAAAb,EAAkBO,CAAY,CAAC;AAAA,EAAA,GAC/C,CAACA,CAAY,CAAC,GAEjB6B,EAAU,MAAM;AACG,IAAApB,EAAAhB,EAAkBS,CAAW,CAAC;AAAA,EAAA,GAC9C,CAACA,CAAW,CAAC,GAEhB2B,EAAU,MAAM;AACI,IAAAlB,EAAAlB,EAAkBU,CAAY,CAAC;AAAA,EAAA,GAChD,CAACA,CAAY,CAAC,GAEjB0B,EAAU,MAAM;AACG,IAAAhB,EAAApB,EAAkBQ,CAAW,CAAC;AAAA,EAAA,GAC9C,CAACA,CAAW,CAAC,GAIZ,gBAAA6B,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAK,EAAA,WAAU,YAAW,QAAO,SAAQ,UAE1C,SAAA;AAAA,IACA,gBAAAH;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,gBAAe;AAAA,QACf,iBAAgB;AAAA,QAChB,aAAY;AAAA,QACZ,UAAU;AAAA,QACV,OAAO;AAAA,QACP,gBAAgB;AAAA,QAEf,UAAA;AAAA,UAAA7B,EAAe,SACd,gBAAA2B,EAACG,GAAA,EAAsB,WAAU,YAAW,QAAO,SAChD,YAAe,IAAI,CAACC,GAAOC,wBACzB,QACE,EAAA,UAAA;AAAA,YAAAC,EAAoBF,CAAK;AAAA,YACzBC,IAAQhC,EAAe,SAAS,IAAI,OAAO;AAAA,UAFnC,EAAA,GAAA+B,CAGX,CACD,GACH,IAEA,gBAAAJ,EAACO,GAAW,EAAA,OAAM,SAAQ,SAASb,GAAkB,OAAM,eAAe,CAAA;AAAA,UAE3ErB,EAAe,SAAS,KACtB,gBAAA2B,EAAAO,GAAA,EAAW,OAAM,SAAQ,SAASb,GAAkB,OAAM,OAAO,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAEtE;AAAA,sBACCO,GAAK,EAAA,WAAU,YAAW,QAAO,SAAQ,UAE1C,QAAA;AAAA,IACA,gBAAAD,EAACE,KAAS,gBAAe,OAAM,WAAS,IACrC,UAAApB,EAAS,IAAI,CAACM,MACb,gBAAAY;AAAA,MAACQ;AAAA,MAAA;AAAA,QAEC,QAAO;AAAA,QACP,WAAU;AAAA,QACV,OAAOpB;AAAA,QACP,WAAWR,EAAc,SAASQ,CAAG;AAAA,QACrC,OAAM;AAAA,QACN,OAAM;AAAA,QACN,SAAS,MAAMF,EAAiBE,CAAG;AAAA,MAAA;AAAA,MAP9BA;AAAA,IASR,CAAA,GACH;AAAA,IACA,gBAAAY;AAAA,MAACS;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAOxB;AAAA,QACP,eAAeP;AAAA,QACf,UAAUe;AAAA,QACV,cAAcG;AAAA,MAAA;AAAA,IAChB;AAAA,IACA,gBAAAI;AAAA,MAACS;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAOzB;AAAA,QACP,UAAUO;AAAA,QACV,eAAef;AAAA,QACf,cAAcmB;AAAA,MAAA;AAAA,IAAA;AAAA,EAChB,GACF;AAEJ,GAEee,KAAAC,EAAK9C,CAAO;"}

package/dist/features/cue-canvas/sidebar/puzzles/hooks/use-fetch-cue-canvas-activity.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-fetch-cue-canvas-activity.js","sources":["../../../../../../src/features/cue-canvas/sidebar/puzzles/hooks/use-fetch-cue-canvas-activity.ts"],"sourcesContent":["import type { IGetPuzzles } from '../api/get-puzzles';\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { getPuzzles, type IPuzzlesResponses } from '../api/get-puzzles';\n\nconst useFetchCueCanvasActivity = (studentGrade?: string) => {\n  const [activityFilters, setActivityFilters] = useState<IGetPuzzles>(\n    studentGrade ? { grades: [studentGrade] } : {},\n  );\n  const [isPuzzlesProcessing, setIsPuzzlesProcessing] = useState(false);\n  const [puzzlesData, setPuzzlesData] = useState<IPuzzlesResponses | undefined>();\n  const abortControllerRef = useRef<AbortController | null>(null);\n\n  const fetchResource = useCallback(async () => {\n    setIsPuzzlesProcessing(true);\n\n    if (abortControllerRef.current) {\n      abortControllerRef.current.abort();\n    }\n\n    const controller = new AbortController();\n\n    abortControllerRef.current = controller;\n\n    await getPuzzles({\n      id: '',\n      query: activityFilters,\n      meta: undefined,\n      abortSignal: abortControllerRef.current.signal,\n    })\n      .then(res => {\n        if (res) {\n          const {\n            __CODE__,\n            // isProcessingFailed\n          } = res;\n\n          if (__CODE__ >= 400 && __CODE__ < 500) {\n            // onError(__ERROR__?.message ?? 'Error while fetching the resource');\n          } else if (__CODE__ === 500) {\n            // setIsPuzzlesFailed(isProcessingFailed);\n            // setError('Internal server error, Please try again');\n          } else {\n            const { data } = res || {};\n\n            if (data) {\n              setPuzzlesData(data);\n              setIsPuzzlesProcessing(false);\n            }\n          }\n        }\n      })\n      .catch(() => {\n        setIsPuzzlesProcessing(false);\n        // setIsPuzzlesFailed(true);\n      });\n    setIsPuzzlesProcessing(false);\n  }, [activityFilters]);\n\n  useEffect(() => {\n    fetchResource();\n\n    return () => {\n      if (abortControllerRef.current) {\n        abortControllerRef.current.abort();\n      }\n    };\n  }, [fetchResource]);\n\n  return {\n    isPuzzlesProcessing,\n    puzzlesData,\n    setActivityFilters,\n  };\n};\n\nexport default useFetchCueCanvasActivity;\n"],"names":["useFetchCueCanvasActivity","studentGrade","activityFilters","setActivityFilters","useState","isPuzzlesProcessing","setIsPuzzlesProcessing","puzzlesData","setPuzzlesData","abortControllerRef","useRef","fetchResource","useCallback","controller","getPuzzles","res","__CODE__","data","useEffect"],"mappings":";;AAMM,MAAAA,IAA4B,CAACC,MAA0B;AACrD,QAAA,CAACC,GAAiBC,CAAkB,IAAIC;AAAA,IAC5CH,IAAe,EAAE,QAAQ,CAACA,CAAY,MAAM,CAAC;AAAA,EAAA,GAEzC,CAACI,GAAqBC,CAAsB,IAAIF,EAAS,EAAK,GAC9D,CAACG,GAAaC,CAAc,IAAIJ,EAAwC,GACxEK,IAAqBC,EAA+B,IAAI,GAExDC,IAAgBC,EAAY,YAAY;AAC5C,IAAAN,EAAuB,EAAI,GAEvBG,EAAmB,WACrBA,EAAmB,QAAQ;AAGvB,UAAAI,IAAa,IAAI;AAEvB,IAAAJ,EAAmB,UAAUI,GAE7B,MAAMC,EAAW;AAAA,MACf,IAAI;AAAA,MACJ,OAAOZ;AAAA,MACP,MAAM;AAAA,MACN,aAAaO,EAAmB,QAAQ;AAAA,IAAA,CACzC,EACE,KAAK,CAAOM,MAAA;AACX,UAAIA,GAAK;AACD,cAAA;AAAA,UACJ,UAAAC;AAAA;AAAA,QAEE,IAAAD;AAEA,YAAA,EAAAC,KAAY,OAAOA,IAAW;AAElC,cAAWA,MAAa,KAGjB;AACL,kBAAM,EAAE,MAAAC,EAAA,IAASF,KAAO;AAExB,YAAIE,MACFT,EAAeS,CAAI,GACnBX,EAAuB,EAAK;AAAA,UAEhC;AAAA;AAAA,MACF;AAAA,IAAA,CACD,EACA,MAAM,MAAM;AACX,MAAAA,EAAuB,EAAK;AAAA,IAAA,CAE7B,GACHA,EAAuB,EAAK;AAAA,EAAA,GAC3B,CAACJ,CAAe,CAAC;AAEpB,SAAAgB,EAAU,OACMP,KAEP,MAAM;AACX,IAAIF,EAAmB,WACrBA,EAAmB,QAAQ;EAC7B,IAED,CAACE,CAAa,CAAC,GAEX;AAAA,IACL,qBAAAN;AAAA,IACA,aAAAE;AAAA,IACA,oBAAAJ;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"use-fetch-cue-canvas-activity.js","sources":["../../../../../../src/features/cue-canvas/sidebar/puzzles/hooks/use-fetch-cue-canvas-activity.ts"],"sourcesContent":["import type { IGetPuzzles } from '../api/get-puzzles';\n\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { getPuzzles, type IPuzzlesResponses } from '../api/get-puzzles';\n\nconst useFetchCueCanvasActivity = (studentGrade?: string) => {\n  const [activityFilters, setActivityFilters] = useState<IGetPuzzles>(\n    studentGrade ? { grades: [studentGrade] } : {},\n  );\n  const [isPuzzlesProcessing, setIsPuzzlesProcessing] = useState(false);\n  const [puzzlesData, setPuzzlesData] = useState<IPuzzlesResponses | undefined>();\n  const abortControllerRef = useRef<AbortController | null>(null);\n\n  const fetchResource = useCallback(async () => {\n    setIsPuzzlesProcessing(true);\n\n    if (abortControllerRef.current) {\n      abortControllerRef.current.abort();\n    }\n\n    const controller = new AbortController();\n\n    abortControllerRef.current = controller;\n\n    await getPuzzles({\n      id: '',\n      query: activityFilters,\n      meta: undefined,\n      abortSignal: abortControllerRef.current.signal,\n    })\n      .then(res => {\n        if (res) {\n          const {\n            __CODE__,\n            // isProcessingFailed\n          } = res;\n\n          if (__CODE__ >= 400 && __CODE__ < 500) {\n            // onError(__ERROR__?.message ?? 'Error while fetching the resource');\n          } else if (__CODE__ === 500) {\n            // setIsPuzzlesFailed(isProcessingFailed);\n            // setError('Internal server error, Please try again');\n          } else {\n            const { data } = res || {};\n\n            if (data) {\n              setPuzzlesData(data);\n              setIsPuzzlesProcessing(false);\n            }\n          }\n        }\n      })\n      .catch(() => {\n        setIsPuzzlesProcessing(false);\n        // setIsPuzzlesFailed(true);\n      });\n    setIsPuzzlesProcessing(false);\n  }, [activityFilters]);\n\n  useEffect(() => {\n    fetchResource();\n\n    return () => {\n      if (abortControllerRef.current) {\n        abortControllerRef.current.abort();\n      }\n    };\n  }, [fetchResource]);\n\n  return {\n    isPuzzlesProcessing,\n    puzzlesData,\n    setActivityFilters,\n  };\n};\n\nexport default useFetchCueCanvasActivity;\n"],"names":["useFetchCueCanvasActivity","studentGrade","activityFilters","setActivityFilters","useState","isPuzzlesProcessing","setIsPuzzlesProcessing","puzzlesData","setPuzzlesData","abortControllerRef","useRef","fetchResource","useCallback","controller","getPuzzles","res","__CODE__","data","useEffect"],"mappings":";;AAMM,MAAAA,IAA4B,CAACC,MAA0B;AACrD,QAAA,CAACC,GAAiBC,CAAkB,IAAIC;AAAA,IAC5CH,IAAe,EAAE,QAAQ,CAACA,CAAY,EAAA,IAAM,CAAA;AAAA,EAC9C,GACM,CAACI,GAAqBC,CAAsB,IAAIF,EAAS,EAAK,GAC9D,CAACG,GAAaC,CAAc,IAAIJ,EAAwC,GACxEK,IAAqBC,EAA+B,IAAI,GAExDC,IAAgBC,EAAY,YAAY;AAC5C,IAAAN,EAAuB,EAAI,GAEvBG,EAAmB,WACrBA,EAAmB,QAAQ,MAAM;AAG7B,UAAAI,IAAa,IAAI,gBAAgB;AAEvC,IAAAJ,EAAmB,UAAUI,GAE7B,MAAMC,EAAW;AAAA,MACf,IAAI;AAAA,MACJ,OAAOZ;AAAA,MACP,MAAM;AAAA,MACN,aAAaO,EAAmB,QAAQ;AAAA,IAAA,CACzC,EACE,KAAK,CAAOM,MAAA;AACX,UAAIA,GAAK;AACD,cAAA;AAAA,UACJ,UAAAC;AAAA;AAAA,QAAA,IAEED;AAEA,YAAA,EAAAC,KAAY,OAAOA,IAAW;AAElC,cAAWA,MAAa,KAGjB;AACL,kBAAM,EAAE,MAAAC,MAASF,KAAO,CAAC;AAEzB,YAAIE,MACFT,EAAeS,CAAI,GACnBX,EAAuB,EAAK;AAAA,UAC9B;AAAA;AAAA,MACF;AAAA,IACF,CACD,EACA,MAAM,MAAM;AACX,MAAAA,EAAuB,EAAK;AAAA,IAAA,CAE7B,GACHA,EAAuB,EAAK;AAAA,EAAA,GAC3B,CAACJ,CAAe,CAAC;AAEpB,SAAAgB,EAAU,OACMP,EAAA,GAEP,MAAM;AACX,IAAIF,EAAmB,WACrBA,EAAmB,QAAQ,MAAM;AAAA,EAErC,IACC,CAACE,CAAa,CAAC,GAEX;AAAA,IACL,qBAAAN;AAAA,IACA,aAAAE;AAAA,IACA,oBAAAJ;AAAA,EACF;AACF;"}

package/dist/features/cue-canvas/sidebar/puzzles/launch-puzzle.js.map

@@ -1 +1 @@
-{"version":3,"file":"launch-puzzle.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/launch-puzzle.tsx"],"sourcesContent":["import type { IPuzzlesResultData } from './api/get-puzzles';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useEffect } from 'react';\nimport styled from 'styled-components';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport BackIcon from '../../../../assets/line-icons/icons/back';\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport Button from '../../../ui/buttons/button/button';\nimport { Loader } from '../../../ui/buttons/button/button-styled';\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 { useGetActivity } from './api/get-puzzles';\nimport * as Styled from './puzzles-styled';\nimport { getTags, serializeData } from './utils';\n\nexport const Iframe = styled.iframe`\n  width: 100%;\n  height: 100%;\n`;\n\ninterface ILaunchPuzzleProps {\n  launchPuzzleData: IPuzzlesResultData;\n  onMenuVisibilityChange: () => void;\n  toggleMenu: () => void;\n}\n\nconst LaunchPuzzle: FC<ILaunchPuzzleProps> = memo(props => {\n  const { launchPuzzleData, onMenuVisibilityChange, toggleMenu } = props;\n  const { node_id: nodeId } = launchPuzzleData || {};\n  const { activeInstance: cueCanvas, setHomeworkId, setActiveTool } = useCueCanvasActions();\n\n  const {\n    get: getWbActivity,\n    data: wbActivityData,\n    isProcessed: wbActivityDataProcessed,\n  } = useGetActivity();\n\n  useEffect(() => {\n    getWbActivity(nodeId);\n  }, [getWbActivity, nodeId]);\n  const {\n    activity_tiles: activityTiles,\n    activity_topics: activityTopics,\n    activity_types: activityTypes,\n    grades: grades,\n    worksheet,\n  } = wbActivityData || {};\n  const { instructions_ref: iframeSrc, learnosity_activity_ref: learnnosityActivityRef } =\n    worksheet || {};\n\n  const onLaunchActivityClick = useCallback(async () => {\n    const jsonOBJ = learnnosityActivityRef && (await (await fetch(learnnosityActivityRef)).json());\n\n    const newJSONObj = serializeData(jsonOBJ);\n    const actionData = {\n      ...newJSONObj,\n    };\n\n    toggleMenu();\n\n    cueCanvas?.replaceCanvas(actionData);\n    setHomeworkId(undefined);\n    setActiveTool('move');\n  }, [cueCanvas, learnnosityActivityRef, setActiveTool, setHomeworkId, toggleMenu]);\n\n  if (!wbActivityData || !wbActivityDataProcessed) {\n    return (\n      <Styled.MenuContainer>\n        <FlexView $gutterX={1.5} $gapX={1.5}>\n          <Clickable onClick={onMenuVisibilityChange} label=\"back\">\n            <BackIcon color=\"WHITE\" />\n          </Clickable>\n        </FlexView>\n        <FlexView $alignItems=\"center\" $justifyContent=\"center\" $height=\"100%\">\n          <Loader src={ILLUSTRATIONS.LOADER} alt=\"Loader\" $size=\"small\" />\n        </FlexView>\n      </Styled.MenuContainer>\n    );\n  }\n\n  const getGradesArr = grades ? getTags(grades, 'grades') : [];\n  const getTopicsArr = activityTopics ? getTags(activityTopics) : [];\n  const getTypesArr = activityTypes ? getTags(activityTypes) : [];\n  const getTilesArr = activityTiles ? getTags(activityTiles) : [];\n\n  const tagData: string[] = [...getTopicsArr, ...getGradesArr, ...getTypesArr, ...getTilesArr];\n\n  return (\n    <Styled.MenuContainer>\n      <FlexView\n        $justifyContent=\"space-between\"\n        $alignItems=\"center\"\n        $flexDirection=\"row\"\n        $gutterX={1}\n        $gapX={0.5}\n      >\n        <Clickable onClick={onMenuVisibilityChange} label=\"back\">\n          <BackIcon color=\"WHITE\" />\n        </Clickable>\n        <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={1}>\n          <Button\n            size=\"small\"\n            renderAs=\"primary\"\n            widthX={12}\n            label=\"Launch\"\n            onClick={onLaunchActivityClick}\n          />\n          <Clickable onClick={onMenuVisibilityChange} label=\"close filter menu\">\n            <CrossIcon color=\"WHITE\" />\n          </Clickable>\n        </FlexView>\n      </FlexView>\n      <FlexView $flexDirection=\"row\" $flexColumnGapX={1} $gapX={1} $gutterX={1}>\n        <Text $renderAs=\"ab1\" $color=\"GREY_2\">\n          Tags:\n        </Text>\n        <FlexView $flexDirection=\"row\" $flexColumnGapX={1} $flexRowGapX={0.5} $flexWrap>\n          {tagData.map((tag, index) => (\n            <FlexView $background=\"WHITE\" $borderRadius={16} $gapX={0.25} $gutterX={1} key={index}>\n              <Text $renderAs=\"ub2\" key={index}>\n                {tag}\n              </Text>\n            </FlexView>\n          ))}\n        </FlexView>\n      </FlexView>\n      {iframeSrc && <Iframe id=\"launch_activity_iframe\" src={iframeSrc} />}\n    </Styled.MenuContainer>\n  );\n});\n\nexport default LaunchPuzzle;\n"],"names":["Iframe","styled","LaunchPuzzle","memo","props","launchPuzzleData","onMenuVisibilityChange","toggleMenu","nodeId","cueCanvas","setHomeworkId","setActiveTool","useCueCanvasActions","getWbActivity","wbActivityData","wbActivityDataProcessed","useGetActivity","useEffect","activityTiles","activityTopics","activityTypes","grades","worksheet","iframeSrc","learnnosityActivityRef","onLaunchActivityClick","useCallback","jsonOBJ","actionData","serializeData","jsxs","Styled.MenuContainer","jsx","FlexView","Clickable","BackIcon","Loader","ILLUSTRATIONS","getGradesArr","getTags","getTopicsArr","getTypesArr","getTilesArr","tagData","Button","CrossIcon","Text","tag","index"],"mappings":"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"}
+{"version":3,"file":"launch-puzzle.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/launch-puzzle.tsx"],"sourcesContent":["import type { IPuzzlesResultData } from './api/get-puzzles';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useEffect } from 'react';\nimport styled from 'styled-components';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport BackIcon from '../../../../assets/line-icons/icons/back';\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport Button from '../../../ui/buttons/button/button';\nimport { Loader } from '../../../ui/buttons/button/button-styled';\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 { useGetActivity } from './api/get-puzzles';\nimport * as Styled from './puzzles-styled';\nimport { getTags, serializeData } from './utils';\n\nexport const Iframe = styled.iframe`\n  width: 100%;\n  height: 100%;\n`;\n\ninterface ILaunchPuzzleProps {\n  launchPuzzleData: IPuzzlesResultData;\n  onMenuVisibilityChange: () => void;\n  toggleMenu: () => void;\n}\n\nconst LaunchPuzzle: FC<ILaunchPuzzleProps> = memo(props => {\n  const { launchPuzzleData, onMenuVisibilityChange, toggleMenu } = props;\n  const { node_id: nodeId } = launchPuzzleData || {};\n  const { activeInstance: cueCanvas, setHomeworkId, setActiveTool } = useCueCanvasActions();\n\n  const {\n    get: getWbActivity,\n    data: wbActivityData,\n    isProcessed: wbActivityDataProcessed,\n  } = useGetActivity();\n\n  useEffect(() => {\n    getWbActivity(nodeId);\n  }, [getWbActivity, nodeId]);\n  const {\n    activity_tiles: activityTiles,\n    activity_topics: activityTopics,\n    activity_types: activityTypes,\n    grades: grades,\n    worksheet,\n  } = wbActivityData || {};\n  const { instructions_ref: iframeSrc, learnosity_activity_ref: learnnosityActivityRef } =\n    worksheet || {};\n\n  const onLaunchActivityClick = useCallback(async () => {\n    const jsonOBJ = learnnosityActivityRef && (await (await fetch(learnnosityActivityRef)).json());\n\n    const newJSONObj = serializeData(jsonOBJ);\n    const actionData = {\n      ...newJSONObj,\n    };\n\n    toggleMenu();\n\n    cueCanvas?.replaceCanvas(actionData);\n    setHomeworkId(undefined);\n    setActiveTool('move');\n  }, [cueCanvas, learnnosityActivityRef, setActiveTool, setHomeworkId, toggleMenu]);\n\n  if (!wbActivityData || !wbActivityDataProcessed) {\n    return (\n      <Styled.MenuContainer>\n        <FlexView $gutterX={1.5} $gapX={1.5}>\n          <Clickable onClick={onMenuVisibilityChange} label=\"back\">\n            <BackIcon color=\"WHITE\" />\n          </Clickable>\n        </FlexView>\n        <FlexView $alignItems=\"center\" $justifyContent=\"center\" $height=\"100%\">\n          <Loader src={ILLUSTRATIONS.LOADER} alt=\"Loader\" $size=\"small\" />\n        </FlexView>\n      </Styled.MenuContainer>\n    );\n  }\n\n  const getGradesArr = grades ? getTags(grades, 'grades') : [];\n  const getTopicsArr = activityTopics ? getTags(activityTopics) : [];\n  const getTypesArr = activityTypes ? getTags(activityTypes) : [];\n  const getTilesArr = activityTiles ? getTags(activityTiles) : [];\n\n  const tagData: string[] = [...getTopicsArr, ...getGradesArr, ...getTypesArr, ...getTilesArr];\n\n  return (\n    <Styled.MenuContainer>\n      <FlexView\n        $justifyContent=\"space-between\"\n        $alignItems=\"center\"\n        $flexDirection=\"row\"\n        $gutterX={1}\n        $gapX={0.5}\n      >\n        <Clickable onClick={onMenuVisibilityChange} label=\"back\">\n          <BackIcon color=\"WHITE\" />\n        </Clickable>\n        <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={1}>\n          <Button\n            size=\"small\"\n            renderAs=\"primary\"\n            widthX={12}\n            label=\"Launch\"\n            onClick={onLaunchActivityClick}\n          />\n          <Clickable onClick={onMenuVisibilityChange} label=\"close filter menu\">\n            <CrossIcon color=\"WHITE\" />\n          </Clickable>\n        </FlexView>\n      </FlexView>\n      <FlexView $flexDirection=\"row\" $flexColumnGapX={1} $gapX={1} $gutterX={1}>\n        <Text $renderAs=\"ab1\" $color=\"GREY_2\">\n          Tags:\n        </Text>\n        <FlexView $flexDirection=\"row\" $flexColumnGapX={1} $flexRowGapX={0.5} $flexWrap>\n          {tagData.map((tag, index) => (\n            <FlexView $background=\"WHITE\" $borderRadius={16} $gapX={0.25} $gutterX={1} key={index}>\n              <Text $renderAs=\"ub2\" key={index}>\n                {tag}\n              </Text>\n            </FlexView>\n          ))}\n        </FlexView>\n      </FlexView>\n      {iframeSrc && <Iframe id=\"launch_activity_iframe\" src={iframeSrc} />}\n    </Styled.MenuContainer>\n  );\n});\n\nexport default LaunchPuzzle;\n"],"names":["Iframe","styled","LaunchPuzzle","memo","props","launchPuzzleData","onMenuVisibilityChange","toggleMenu","nodeId","cueCanvas","setHomeworkId","setActiveTool","useCueCanvasActions","getWbActivity","wbActivityData","wbActivityDataProcessed","useGetActivity","useEffect","activityTiles","activityTopics","activityTypes","grades","worksheet","iframeSrc","learnnosityActivityRef","onLaunchActivityClick","useCallback","jsonOBJ","actionData","serializeData","jsxs","Styled.MenuContainer","jsx","FlexView","Clickable","BackIcon","Loader","ILLUSTRATIONS","getGradesArr","getTags","getTopicsArr","getTypesArr","getTilesArr","tagData","Button","CrossIcon","Text","tag","index"],"mappings":"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"}

package/dist/features/cue-canvas/sidebar/puzzles/puzzle-menu-header.js.map

@@ -1 +1 @@
-{"version":3,"file":"puzzle-menu-header.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/puzzle-menu-header.tsx"],"sourcesContent":["import { memo } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport PuzzleIcon from '../../../../assets/line-icons/icons/puzzle-icon';\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\n\nconst MenuHeader: React.FC<{ toggleMenu: () => void; onReset?: () => void }> = ({\n  toggleMenu,\n  onReset,\n}) => (\n  <FlexView\n    $flexDirection=\"row\"\n    $justifyContent=\"space-between\"\n    $alignItems=\"center\"\n    $gutterX={1}\n    $gapX={0.5}\n    $heightX={3}\n  >\n    <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={0.5}>\n      <PuzzleIcon color=\"WHITE\" />\n      <Text $color=\"WHITE\" $renderAs=\"body2\">\n        ACTIVITIES\n      </Text>\n    </FlexView>\n    <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={1}>\n      <TextButton color=\"WHITE\" label=\"Reset\" onClick={onReset} />\n      <Clickable onClick={toggleMenu} label=\"close activities menu\">\n        <CrossIcon color=\"WHITE\" />\n      </Clickable>\n    </FlexView>\n  </FlexView>\n);\n\nexport default memo(MenuHeader);\n"],"names":["MenuHeader","toggleMenu","onReset","jsxs","FlexView","jsx","PuzzleIcon","Text","TextButton","Clickable","CrossIcon","PuzzleMenuHeader","memo"],"mappings":";;;;;;;;AASA,MAAMA,IAAyE,CAAC;AAAA,EAC9E,YAAAC;AAAA,EACA,SAAAC;AACF,MACE,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,gBAAe;AAAA,IACf,iBAAgB;AAAA,IAChB,aAAY;AAAA,IACZ,UAAU;AAAA,IACV,OAAO;AAAA,IACP,UAAU;AAAA,IAEV,UAAA;AAAA,MAAA,gBAAAD,EAACC,KAAS,gBAAe,OAAM,aAAY,UAAS,iBAAiB,KACnE,UAAA;AAAA,QAAC,gBAAAC,EAAAC,GAAA,EAAW,OAAM,QAAQ,CAAA;AAAA,0BACzBC,GAAK,EAAA,QAAO,SAAQ,WAAU,SAAQ,UAEvC,cAAA;AAAA,MAAA,GACF;AAAA,wBACCH,GAAS,EAAA,gBAAe,OAAM,aAAY,UAAS,iBAAiB,GACnE,UAAA;AAAA,QAAA,gBAAAC,EAACG,KAAW,OAAM,SAAQ,OAAM,SAAQ,SAASN,GAAS;AAAA,QAC1D,gBAAAG,EAACI,GAAU,EAAA,SAASR,GAAY,OAAM,yBACpC,UAAC,gBAAAI,EAAAK,GAAA,EAAU,OAAM,QAAA,CAAQ,EAC3B,CAAA;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA;AACF,GAGaC,IAAAC,EAAKZ,CAAU;"}
+{"version":3,"file":"puzzle-menu-header.js","sources":["../../../../../src/features/cue-canvas/sidebar/puzzles/puzzle-menu-header.tsx"],"sourcesContent":["import { memo } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport PuzzleIcon from '../../../../assets/line-icons/icons/puzzle-icon';\nimport Clickable from '../../../ui/buttons/clickable/clickable';\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\n\nconst MenuHeader: React.FC<{ toggleMenu: () => void; onReset?: () => void }> = ({\n  toggleMenu,\n  onReset,\n}) => (\n  <FlexView\n    $flexDirection=\"row\"\n    $justifyContent=\"space-between\"\n    $alignItems=\"center\"\n    $gutterX={1}\n    $gapX={0.5}\n    $heightX={3}\n  >\n    <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={0.5}>\n      <PuzzleIcon color=\"WHITE\" />\n      <Text $color=\"WHITE\" $renderAs=\"body2\">\n        ACTIVITIES\n      </Text>\n    </FlexView>\n    <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={1}>\n      <TextButton color=\"WHITE\" label=\"Reset\" onClick={onReset} />\n      <Clickable onClick={toggleMenu} label=\"close activities menu\">\n        <CrossIcon color=\"WHITE\" />\n      </Clickable>\n    </FlexView>\n  </FlexView>\n);\n\nexport default memo(MenuHeader);\n"],"names":["MenuHeader","toggleMenu","onReset","jsxs","FlexView","jsx","PuzzleIcon","Text","TextButton","Clickable","CrossIcon","PuzzleMenuHeader","memo"],"mappings":";;;;;;;;AASA,MAAMA,IAAyE,CAAC;AAAA,EAC9E,YAAAC;AAAA,EACA,SAAAC;AACF,MACE,gBAAAC;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,gBAAe;AAAA,IACf,iBAAgB;AAAA,IAChB,aAAY;AAAA,IACZ,UAAU;AAAA,IACV,OAAO;AAAA,IACP,UAAU;AAAA,IAEV,UAAA;AAAA,MAAA,gBAAAD,EAACC,KAAS,gBAAe,OAAM,aAAY,UAAS,iBAAiB,KACnE,UAAA;AAAA,QAAC,gBAAAC,EAAAC,GAAA,EAAW,OAAM,QAAQ,CAAA;AAAA,0BACzBC,GAAK,EAAA,QAAO,SAAQ,WAAU,SAAQ,UAEvC,aAAA,CAAA;AAAA,MAAA,GACF;AAAA,wBACCH,GAAS,EAAA,gBAAe,OAAM,aAAY,UAAS,iBAAiB,GACnE,UAAA;AAAA,QAAA,gBAAAC,EAACG,KAAW,OAAM,SAAQ,OAAM,SAAQ,SAASN,GAAS;AAAA,QAC1D,gBAAAG,EAACI,GAAU,EAAA,SAASR,GAAY,OAAM,yBACpC,UAAC,gBAAAI,EAAAK,GAAA,EAAU,OAAM,QAAQ,CAAA,EAC3B,CAAA;AAAA,MAAA,EACF,CAAA;AAAA,IAAA;AAAA,EAAA;AACF,GAGaC,IAAAC,EAAKZ,CAAU;"}