@cuemath/leap 3.1.0-gg2 → 3.1.1-beta-0.1

package/dist/features/cue-canvas/toolbar/grid-menu.js

@@ -1,27 +1,27 @@
 import { jsxs as a, jsx as r } from "react/jsx-runtime";
 import { memo as f, useRef as C, useCallback as $ } from "react";
-import n from "../../ui/buttons/clickable/clickable.js";
+import t from "../../ui/buttons/clickable/clickable.js";
 import h from "../../ui/hooks/use-context-menu-click-handler.js";
-import t from "../../ui/layout/flex-view.js";
+import l from "../../ui/layout/flex-view.js";
 import { GRID_NAMES as b } from "../cue-canvas-helpers.js";
 import { StyledWrapper as k, MenuWrapper as G } from "../cue-cavas-styled.js";
-import { useCueCanvasActions as l } from "../hooks/use-cue-canvas-actions.js";
+import { useCueCanvasActions as c } from "../hooks/use-cue-canvas-actions.js";
 import { GRID_TO_COMP as x } from "./icon-map.js";
-const A = f(({ GridIcon: c }) => {
-  const { activeInstance: e } = l(), i = C(null), { activeTool: d } = l(), { menuVisible: m, onMenuClick: u } = h(
-    i,
+const A = f(({ GridIcon: d }) => {
+  const { activeInstance: e } = c(), n = C(null), { activeTool: m } = c(), { menuVisible: u, onMenuClick: i } = h(
+    n,
     void 0,
     !0,
     void 0
   ), p = $(
     (o) => {
-      e == null || e.changeGrid(o);
+      e == null || e.changeGrid(o), i();
     },
-    [e]
+    [e, i]
   );
-  return /* @__PURE__ */ a(t, { $gutterX: 0.25, ref: i, children: [
-    /* @__PURE__ */ r(n, { onClick: u, label: "grid", children: /* @__PURE__ */ r(k, { $active: d === "grid", children: /* @__PURE__ */ r(c, {}) }) }),
-    m && /* @__PURE__ */ r(
+  return /* @__PURE__ */ a(l, { $gutterX: 0.25, ref: n, children: [
+    /* @__PURE__ */ r(t, { onClick: i, label: "grid", children: /* @__PURE__ */ r(k, { $active: m === "grid", children: /* @__PURE__ */ r(d, {}) }) }),
+    u && /* @__PURE__ */ r(
       G,
       {
         $borderColor: "GREY_1",
@@ -33,12 +33,12 @@ const A = f(({ GridIcon: c }) => {
         children: b.map((o) => {
           const s = x[o];
           return /* @__PURE__ */ r(
-            n,
+            t,
             {
               onClick: () => p(o),
               label: o,
               children: /* @__PURE__ */ r(
-                t,
+                l,
                 {
                   $width: 48,
                   $height: 48,

package/dist/features/cue-canvas/toolbar/grid-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid-menu.js","sources":["../../../../src/features/cue-canvas/toolbar/grid-menu.tsx"],"sourcesContent":["import type { TCueCanvasGridName } from '../types/cue-canvas';\nimport type { IGridMenu, TToolComponentType } from '../types/toolbar';\n\nimport React, { memo, useCallback, 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 { GRID_NAMES } from '../cue-canvas-helpers';\nimport { MenuWrapper, StyledWrapper } from '../cue-cavas-styled';\nimport { useCueCanvasActions } from '../hooks/use-cue-canvas-actions';\nimport { GRID_TO_COMP } from './icon-map';\n\nconst GridMenu: React.FC<IGridMenu> = memo(({ GridIcon }) => {\n  const { activeInstance: cueCanvas } = useCueCanvasActions();\n  const gridMenuRef = useRef(null);\n  const { activeTool } = useCueCanvasActions();\n  const { menuVisible, onMenuClick } = useContextMenuClickHandler(\n    gridMenuRef,\n    undefined,\n    true,\n    undefined,\n  );\n  const onGridOptionClick = useCallback(\n    (gridOption: TCueCanvasGridName) => {\n      cueCanvas?.changeGrid(gridOption);\n    },\n    [cueCanvas],\n  );\n\n  return (\n    <FlexView $gutterX={0.25} ref={gridMenuRef}>\n      <Clickable onClick={onMenuClick} label=\"grid\">\n        <StyledWrapper $active={activeTool === 'grid'}>\n          <GridIcon />\n        </StyledWrapper>\n      </Clickable>\n      {menuVisible && (\n        <MenuWrapper\n          $borderColor=\"GREY_1\"\n          $background=\"GREY_1\"\n          $flexDirection=\"row\"\n          $widthX={11.15}\n          $flexWrap={true}\n          $flexGapX={0.5}\n        >\n          {GRID_NAMES.map(gridName => {\n            const GridComponent = GRID_TO_COMP[gridName] as TToolComponentType;\n\n            return (\n              <Clickable\n                key={gridName}\n                onClick={() => onGridOptionClick(gridName)}\n                label={gridName}\n              >\n                <FlexView\n                  $width={48}\n                  $height={48}\n                  $borderColor=\"BLACK\"\n                  $borderRadius={4}\n                  $background=\"WHITE\"\n                >\n                  <GridComponent />\n                </FlexView>\n              </Clickable>\n            );\n          })}\n        </MenuWrapper>\n      )}\n    </FlexView>\n  );\n});\n\nexport default GridMenu;\n"],"names":["GridMenu","memo","GridIcon","cueCanvas","useCueCanvasActions","gridMenuRef","useRef","activeTool","menuVisible","onMenuClick","useContextMenuClickHandler","onGridOptionClick","useCallback","gridOption","jsxs","FlexView","jsx","Clickable","StyledWrapper","MenuWrapper","GRID_NAMES","gridName","GridComponent","GRID_TO_COMP"],"mappings":";;;;;;;;;AAaA,MAAMA,IAAgCC,EAAK,CAAC,EAAE,UAAAC,QAAe;AAC3D,QAAM,EAAE,gBAAgBC,EAAU,IAAIC,EAAoB,GACpDC,IAAcC,EAAO,IAAI,GACzB,EAAE,YAAAC,MAAeH,KACjB,EAAE,aAAAI,GAAa,aAAAC,EAAA,IAAgBC;AAAA,IACnCL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEIM,IAAoBC;AAAA,IACxB,CAACC,MAAmC;AAClC,MAAAV,KAAA,QAAAA,EAAW,WAAWU;AAAA,IACxB;AAAA,IACA,CAACV,CAAS;AAAA,EAAA;AAGZ,SACG,gBAAAW,EAAAC,GAAA,EAAS,UAAU,MAAM,KAAKV,GAC7B,UAAA;AAAA,IAAA,gBAAAW,EAACC,GAAU,EAAA,SAASR,GAAa,OAAM,QACrC,UAAA,gBAAAO,EAACE,GAAc,EAAA,SAASX,MAAe,QACrC,UAAC,gBAAAS,EAAAd,GAAA,CAAA,CAAS,EACZ,CAAA,GACF;AAAA,IACCM,KACC,gBAAAQ;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,cAAa;AAAA,QACb,aAAY;AAAA,QACZ,gBAAe;AAAA,QACf,SAAS;AAAA,QACT,WAAW;AAAA,QACX,WAAW;AAAA,QAEV,UAAAC,EAAW,IAAI,CAAYC,MAAA;AACpB,gBAAAC,IAAgBC,EAAaF,CAAQ;AAGzC,iBAAA,gBAAAL;AAAA,YAACC;AAAA,YAAA;AAAA,cAEC,SAAS,MAAMN,EAAkBU,CAAQ;AAAA,cACzC,OAAOA;AAAA,cAEP,UAAA,gBAAAL;AAAA,gBAACD;AAAA,gBAAA;AAAA,kBACC,QAAQ;AAAA,kBACR,SAAS;AAAA,kBACT,cAAa;AAAA,kBACb,eAAe;AAAA,kBACf,aAAY;AAAA,kBAEZ,4BAACO,GAAc,EAAA;AAAA,gBAAA;AAAA,cACjB;AAAA,YAAA;AAAA,YAZKD;AAAA,UAAA;AAAA,QAaP,CAEH;AAAA,MAAA;AAAA,IACH;AAAA,EAEJ,EAAA,CAAA;AAEJ,CAAC;"}
+{"version":3,"file":"grid-menu.js","sources":["../../../../src/features/cue-canvas/toolbar/grid-menu.tsx"],"sourcesContent":["import type { TCueCanvasGridName } from '../types/cue-canvas';\nimport type { IGridMenu, TToolComponentType } from '../types/toolbar';\n\nimport React, { memo, useCallback, 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 { GRID_NAMES } from '../cue-canvas-helpers';\nimport { MenuWrapper, StyledWrapper } from '../cue-cavas-styled';\nimport { useCueCanvasActions } from '../hooks/use-cue-canvas-actions';\nimport { GRID_TO_COMP } from './icon-map';\n\nconst GridMenu: React.FC<IGridMenu> = memo(({ GridIcon }) => {\n  const { activeInstance: cueCanvas } = useCueCanvasActions();\n  const gridMenuRef = useRef(null);\n  const { activeTool } = useCueCanvasActions();\n  const { menuVisible, onMenuClick } = useContextMenuClickHandler(\n    gridMenuRef,\n    undefined,\n    true,\n    undefined,\n  );\n  const onGridOptionClick = useCallback(\n    (gridOption: TCueCanvasGridName) => {\n      cueCanvas?.changeGrid(gridOption);\n      onMenuClick();\n    },\n    [cueCanvas, onMenuClick],\n  );\n\n  return (\n    <FlexView $gutterX={0.25} ref={gridMenuRef}>\n      <Clickable onClick={onMenuClick} label=\"grid\">\n        <StyledWrapper $active={activeTool === 'grid'}>\n          <GridIcon />\n        </StyledWrapper>\n      </Clickable>\n      {menuVisible && (\n        <MenuWrapper\n          $borderColor=\"GREY_1\"\n          $background=\"GREY_1\"\n          $flexDirection=\"row\"\n          $widthX={11.15}\n          $flexWrap={true}\n          $flexGapX={0.5}\n        >\n          {GRID_NAMES.map(gridName => {\n            const GridComponent = GRID_TO_COMP[gridName] as TToolComponentType;\n\n            return (\n              <Clickable\n                key={gridName}\n                onClick={() => onGridOptionClick(gridName)}\n                label={gridName}\n              >\n                <FlexView\n                  $width={48}\n                  $height={48}\n                  $borderColor=\"BLACK\"\n                  $borderRadius={4}\n                  $background=\"WHITE\"\n                >\n                  <GridComponent />\n                </FlexView>\n              </Clickable>\n            );\n          })}\n        </MenuWrapper>\n      )}\n    </FlexView>\n  );\n});\n\nexport default GridMenu;\n"],"names":["GridMenu","memo","GridIcon","cueCanvas","useCueCanvasActions","gridMenuRef","useRef","activeTool","menuVisible","onMenuClick","useContextMenuClickHandler","onGridOptionClick","useCallback","gridOption","jsxs","FlexView","jsx","Clickable","StyledWrapper","MenuWrapper","GRID_NAMES","gridName","GridComponent","GRID_TO_COMP"],"mappings":";;;;;;;;;AAaA,MAAMA,IAAgCC,EAAK,CAAC,EAAE,UAAAC,QAAe;AAC3D,QAAM,EAAE,gBAAgBC,EAAU,IAAIC,EAAoB,GACpDC,IAAcC,EAAO,IAAI,GACzB,EAAE,YAAAC,MAAeH,KACjB,EAAE,aAAAI,GAAa,aAAAC,EAAA,IAAgBC;AAAA,IACnCL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEIM,IAAoBC;AAAA,IACxB,CAACC,MAAmC;AAClC,MAAAV,KAAA,QAAAA,EAAW,WAAWU,IACVJ;IACd;AAAA,IACA,CAACN,GAAWM,CAAW;AAAA,EAAA;AAGzB,SACG,gBAAAK,EAAAC,GAAA,EAAS,UAAU,MAAM,KAAKV,GAC7B,UAAA;AAAA,IAAA,gBAAAW,EAACC,GAAU,EAAA,SAASR,GAAa,OAAM,QACrC,UAAA,gBAAAO,EAACE,GAAc,EAAA,SAASX,MAAe,QACrC,UAAC,gBAAAS,EAAAd,GAAA,CAAA,CAAS,EACZ,CAAA,GACF;AAAA,IACCM,KACC,gBAAAQ;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,cAAa;AAAA,QACb,aAAY;AAAA,QACZ,gBAAe;AAAA,QACf,SAAS;AAAA,QACT,WAAW;AAAA,QACX,WAAW;AAAA,QAEV,UAAAC,EAAW,IAAI,CAAYC,MAAA;AACpB,gBAAAC,IAAgBC,EAAaF,CAAQ;AAGzC,iBAAA,gBAAAL;AAAA,YAACC;AAAA,YAAA;AAAA,cAEC,SAAS,MAAMN,EAAkBU,CAAQ;AAAA,cACzC,OAAOA;AAAA,cAEP,UAAA,gBAAAL;AAAA,gBAACD;AAAA,gBAAA;AAAA,kBACC,QAAQ;AAAA,kBACR,SAAS;AAAA,kBACT,cAAa;AAAA,kBACb,eAAe;AAAA,kBACf,aAAY;AAAA,kBAEZ,4BAACO,GAAc,EAAA;AAAA,gBAAA;AAAA,cACjB;AAAA,YAAA;AAAA,YAZKD;AAAA,UAAA;AAAA,QAaP,CAEH;AAAA,MAAA;AAAA,IACH;AAAA,EAEJ,EAAA,CAAA;AAEJ,CAAC;"}

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

@@ -1,34 +1,36 @@
 import { jsx as r } from "react/jsx-runtime";
-import { memo as p, useCallback as T } from "react";
-import f from "../../ui/buttons/clickable/clickable.js";
-import d from "../../ui/layout/flex-view.js";
-import { STATELESS_TOOLS as C, getIsWritingTool as u } from "../cue-canvas-helpers.js";
-import { StyledWrapper as v } from "../cue-cavas-styled.js";
+import { memo as T, useCallback as d } from "react";
+import C from "../../ui/buttons/clickable/clickable.js";
+import u from "../../ui/layout/flex-view.js";
+import { STATELESS_TOOLS as v, getIsWritingTool as h } from "../cue-canvas-helpers.js";
+import { StyledWrapper as k } from "../cue-cavas-styled.js";
 import { useCueCanvasActions as O } from "../hooks/use-cue-canvas-actions.js";
 import S from "./grid-menu.js";
 import { TOOLS_TO_COMP as $ } from "./icon-map.js";
-const h = ({ tool: o, withGutter: n, shouldAnimate: l }) => {
-  const e = $[o], {
-    activeInstance: i,
+const A = ({ tool: o, withGutter: a, shouldAnimate: s }) => {
+  const t = $[o], {
+    activeInstance: e,
     setActiveTool: m,
     activeTool: c,
-    activeColor: a
-  } = O(), s = T(
-    (t) => {
-      i == null || i.setTool(t), C.has(t) || m(t);
+    activeColor: f,
+    homeworkId: l,
+    setHomeworkId: n
+  } = O(), p = d(
+    (i) => {
+      e == null || e.setTool(i), i === "clearAll" && l && n(void 0), v.has(i) || m(i);
     },
-    [i, m]
+    [e, l, m, n]
   );
-  return o === "grid" ? /* @__PURE__ */ r(S, { GridIcon: e }) : /* @__PURE__ */ r(d, { $gutterX: n ? 0.25 : 0, children: /* @__PURE__ */ r(f, { onClick: () => s(o), label: o, children: u(o) ? /* @__PURE__ */ r(
-    e,
+  return o === "grid" ? /* @__PURE__ */ r(S, { GridIcon: t }) : /* @__PURE__ */ r(u, { $gutterX: a ? 0.25 : 0, children: /* @__PURE__ */ r(C, { onClick: () => p(o), label: o, children: h(o) ? /* @__PURE__ */ r(
+    t,
     {
       $active: c === o,
-      $activeColor: a,
-      $shouldAnimate: l
+      $activeColor: f,
+      $shouldAnimate: s
     }
-  ) : /* @__PURE__ */ r(v, { $active: c === o, children: /* @__PURE__ */ r(e, {}) }) }) });
-}, G = p(h);
+  ) : /* @__PURE__ */ r(k, { $active: c === o, children: /* @__PURE__ */ r(t, {}) }) }) });
+}, M = T(A);
 export {
-  G as default
+  M as default
 };
 //# sourceMappingURL=tool.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"tool.js","sources":["../../../../src/features/cue-canvas/toolbar/tool.tsx"],"sourcesContent":["import type { TCueCanvasTool } from '../types/cue-canvas';\nimport type { TToolComponentType } from '../types/toolbar';\nimport type { FC } from 'react';\n\nimport { memo, useCallback } from 'react';\n\nimport Clickable from '../../ui/buttons/clickable/clickable';\nimport FlexView from '../../ui/layout/flex-view';\nimport { getIsWritingTool, STATELESS_TOOLS } from '../cue-canvas-helpers';\nimport { StyledWrapper } from '../cue-cavas-styled';\nimport { useCueCanvasActions } from '../hooks/use-cue-canvas-actions';\nimport GridMenu from './grid-menu';\nimport { TOOLS_TO_COMP } from './icon-map';\n\ninterface IToolProps {\n  tool: TCueCanvasTool;\n  withGutter?: boolean;\n  shouldAnimate?: boolean;\n}\n\nconst Tool: FC<IToolProps> = ({ tool, withGutter, shouldAnimate }) => {\n  const ToolComponent = TOOLS_TO_COMP[tool] as TToolComponentType;\n  const {\n    activeInstance: cueCanvas,\n    setActiveTool,\n    activeTool,\n    activeColor,\n  } = useCueCanvasActions();\n\n  const onToolClick = useCallback(\n    (t: TCueCanvasTool) => {\n      cueCanvas?.setTool(t);\n\n      if (!STATELESS_TOOLS.has(t)) {\n        setActiveTool(t);\n      }\n    },\n    [cueCanvas, setActiveTool],\n  );\n\n  if (tool === 'grid') {\n    return <GridMenu GridIcon={ToolComponent} />;\n  }\n\n  return (\n    <FlexView $gutterX={withGutter ? 0.25 : 0}>\n      <Clickable onClick={() => onToolClick(tool)} label={tool}>\n        {getIsWritingTool(tool) ? (\n          <ToolComponent\n            $active={activeTool === tool}\n            $activeColor={activeColor}\n            $shouldAnimate={shouldAnimate}\n          />\n        ) : (\n          <StyledWrapper $active={activeTool === tool}>\n            <ToolComponent />\n          </StyledWrapper>\n        )}\n      </Clickable>\n    </FlexView>\n  );\n};\n\nexport default memo(Tool);\n"],"names":["Tool","tool","withGutter","shouldAnimate","ToolComponent","TOOLS_TO_COMP","cueCanvas","setActiveTool","activeTool","activeColor","useCueCanvasActions","onToolClick","useCallback","STATELESS_TOOLS","jsx","GridMenu","FlexView","Clickable","getIsWritingTool","StyledWrapper","Tool$1","memo"],"mappings":";;;;;;;;;AAoBA,MAAMA,IAAuB,CAAC,EAAE,MAAAC,GAAM,YAAAC,GAAY,eAAAC,QAAoB;AAC9D,QAAAC,IAAgBC,EAAcJ,CAAI,GAClC;AAAA,IACJ,gBAAgBK;AAAA,IAChB,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,aAAAC;AAAA,MACEC,EAAoB,GAElBC,IAAcC;AAAA,IAClB,CAAC,MAAsB;AACrB,MAAAN,KAAA,QAAAA,EAAW,QAAQ,IAEdO,EAAgB,IAAI,CAAC,KACxBN,EAAc,CAAC;AAAA,IAEnB;AAAA,IACA,CAACD,GAAWC,CAAa;AAAA,EAAA;AAG3B,SAAIN,MAAS,SACJ,gBAAAa,EAACC,GAAS,EAAA,UAAUX,EAAe,CAAA,sBAIzCY,GAAS,EAAA,UAAUd,IAAa,OAAO,GACtC,UAAC,gBAAAY,EAAAG,GAAA,EAAU,SAAS,MAAMN,EAAYV,CAAI,GAAG,OAAOA,GACjD,UAAAiB,EAAiBjB,CAAI,IACpB,gBAAAa;AAAA,IAACV;AAAA,IAAA;AAAA,MACC,SAASI,MAAeP;AAAA,MACxB,cAAcQ;AAAA,MACd,gBAAgBN;AAAA,IAAA;AAAA,EAClB,IAEC,gBAAAW,EAAAK,GAAA,EAAc,SAASX,MAAeP,GACrC,UAAC,gBAAAa,EAAAV,GAAA,CAAc,CAAA,EACjB,CAAA,EAEJ,CAAA,EACF,CAAA;AAEJ,GAEegB,IAAAC,EAAKrB,CAAI;"}
+{"version":3,"file":"tool.js","sources":["../../../../src/features/cue-canvas/toolbar/tool.tsx"],"sourcesContent":["import type { TCueCanvasTool } from '../types/cue-canvas';\nimport type { TToolComponentType } from '../types/toolbar';\nimport type { FC } from 'react';\n\nimport { memo, useCallback } from 'react';\n\nimport Clickable from '../../ui/buttons/clickable/clickable';\nimport FlexView from '../../ui/layout/flex-view';\nimport { getIsWritingTool, STATELESS_TOOLS } from '../cue-canvas-helpers';\nimport { StyledWrapper } from '../cue-cavas-styled';\nimport { useCueCanvasActions } from '../hooks/use-cue-canvas-actions';\nimport GridMenu from './grid-menu';\nimport { TOOLS_TO_COMP } from './icon-map';\n\ninterface IToolProps {\n  tool: TCueCanvasTool;\n  withGutter?: boolean;\n  shouldAnimate?: boolean;\n}\n\nconst Tool: FC<IToolProps> = ({ tool, withGutter, shouldAnimate }) => {\n  const ToolComponent = TOOLS_TO_COMP[tool] as TToolComponentType;\n  const {\n    activeInstance: cueCanvas,\n    setActiveTool,\n    activeTool,\n    activeColor,\n    homeworkId,\n    setHomeworkId,\n  } = useCueCanvasActions();\n\n  const onToolClick = useCallback(\n    (t: TCueCanvasTool) => {\n      cueCanvas?.setTool(t);\n      if (t === 'clearAll' && homeworkId) {\n        setHomeworkId(undefined);\n      }\n\n      if (!STATELESS_TOOLS.has(t)) {\n        setActiveTool(t);\n      }\n    },\n    [cueCanvas, homeworkId, setActiveTool, setHomeworkId],\n  );\n\n  if (tool === 'grid') {\n    return <GridMenu GridIcon={ToolComponent} />;\n  }\n\n  return (\n    <FlexView $gutterX={withGutter ? 0.25 : 0}>\n      <Clickable onClick={() => onToolClick(tool)} label={tool}>\n        {getIsWritingTool(tool) ? (\n          <ToolComponent\n            $active={activeTool === tool}\n            $activeColor={activeColor}\n            $shouldAnimate={shouldAnimate}\n          />\n        ) : (\n          <StyledWrapper $active={activeTool === tool}>\n            <ToolComponent />\n          </StyledWrapper>\n        )}\n      </Clickable>\n    </FlexView>\n  );\n};\n\nexport default memo(Tool);\n"],"names":["Tool","tool","withGutter","shouldAnimate","ToolComponent","TOOLS_TO_COMP","cueCanvas","setActiveTool","activeTool","activeColor","homeworkId","setHomeworkId","useCueCanvasActions","onToolClick","useCallback","t","STATELESS_TOOLS","jsx","GridMenu","FlexView","Clickable","getIsWritingTool","StyledWrapper","Tool$1","memo"],"mappings":";;;;;;;;;AAoBA,MAAMA,IAAuB,CAAC,EAAE,MAAAC,GAAM,YAAAC,GAAY,eAAAC,QAAoB;AAC9D,QAAAC,IAAgBC,EAAcJ,CAAI,GAClC;AAAA,IACJ,gBAAgBK;AAAA,IAChB,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,aAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,MACEC,EAAoB,GAElBC,IAAcC;AAAA,IAClB,CAACC,MAAsB;AACrB,MAAAT,KAAA,QAAAA,EAAW,QAAQS,IACfA,MAAM,cAAcL,KACtBC,EAAc,MAAS,GAGpBK,EAAgB,IAAID,CAAC,KACxBR,EAAcQ,CAAC;AAAA,IAEnB;AAAA,IACA,CAACT,GAAWI,GAAYH,GAAeI,CAAa;AAAA,EAAA;AAGtD,SAAIV,MAAS,SACJ,gBAAAgB,EAACC,GAAS,EAAA,UAAUd,EAAe,CAAA,sBAIzCe,GAAS,EAAA,UAAUjB,IAAa,OAAO,GACtC,UAAC,gBAAAe,EAAAG,GAAA,EAAU,SAAS,MAAMP,EAAYZ,CAAI,GAAG,OAAOA,GACjD,UAAAoB,EAAiBpB,CAAI,IACpB,gBAAAgB;AAAA,IAACb;AAAA,IAAA;AAAA,MACC,SAASI,MAAeP;AAAA,MACxB,cAAcQ;AAAA,MACd,gBAAgBN;AAAA,IAAA;AAAA,EAClB,IAEC,gBAAAc,EAAAK,GAAA,EAAc,SAASd,MAAeP,GACrC,UAAC,gBAAAgB,EAAAb,GAAA,CAAc,CAAA,EACjB,CAAA,EAEJ,CAAA,EACF,CAAA;AAEJ,GAEemB,IAAAC,EAAKxB,CAAI;"}

package/dist/features/homework/homework-card-view.js

@@ -1,66 +1,67 @@
 import { jsxs as i, jsx as e } from "react/jsx-runtime";
-import { memo as X, useState as N, useRef as p, useCallback as u, useLayoutEffect as v } from "react";
-import B from "../../assets/line-icons/icons/closed-eye.js";
-import R from "../chapters-v2/comps/node-card/node-card-tags.js";
-import { getNodeTypeBasedBgImage as L } from "../chapters-v2/utils/index.js";
-import { getNodeCardBasedIcon as O } from "../chapters-v2/utils/node-card-utils.js";
-import g from "../ui/arrow-tooltip/arrow-tooltip.js";
+import { memo as N, useState as v, useRef as u, useCallback as g, useLayoutEffect as B } from "react";
+import R from "../../assets/line-icons/icons/closed-eye.js";
+import L from "../chapters-v2/comps/node-card/node-card-tags.js";
+import { getNodeTypeBasedBgImage as O } from "../chapters-v2/utils/index.js";
+import { getNodeCardBasedIcon as S } from "../chapters-v2/utils/node-card-utils.js";
+import h from "../ui/arrow-tooltip/arrow-tooltip.js";
 import r from "../ui/layout/flex-view.js";
-import S from "../ui/lottie-animation/lottie-animation.js";
-import W from "./card-title.js";
-import D from "./node-progress.js";
-import { CardWrapper as j, IconWrapper as G, BannerImageWrapper as M, BannerImage as V, HeaderText as z, SubHeaderText as U } from "./styles.js";
-const F = { renderer: "canvas", autoplay: !1 }, K = ({
+import W from "../ui/lottie-animation/lottie-animation.js";
+import D from "./card-title.js";
+import j from "./node-progress.js";
+import { CardWrapper as G, IconWrapper as M, BannerImageWrapper as V, BannerImage as z, HeaderText as U, SubHeaderText as F } from "./styles.js";
+const K = { renderer: "canvas", autoplay: !1 }, P = ({
   header: d,
-  isInQueue: h,
-  nodeData: $,
-  studentContainerRef: f,
-  subHeader: T,
-  userType: w
+  isInQueue: $,
+  nodeData: f,
+  studentContainerRef: T,
+  subHeader: w,
+  userType: I,
+  isMilestone: c = !1
 }) => {
   const {
     node_type: o,
-    state: I,
-    accuracy: b,
+    state: b,
+    accuracy: y,
     due_date_ts: a,
-    image_url: c,
-    image_hue: l,
-    card_header: y = "",
-    unlocked_on_ts: m,
-    course_type: _
-  } = $, [x, C] = N(!1), n = p(null), H = L(o), s = p(null), { lottie: k } = O(o), A = u(() => {
+    image_url: l,
+    image_hue: m,
+    card_header: _ = "",
+    unlocked_on_ts: p,
+    course_type: x
+  } = f, [C, H] = v(!1), n = u(null), k = O(o), s = u(null), { lottie: A } = S(o), E = g(() => {
     var t;
     (t = s.current) == null || t.play();
-  }, []), E = u(() => {
+  }, []), X = g(() => {
     var t;
     (t = s.current) == null || t.stop();
   }, []);
-  return v(() => {
-    n.current && n.current.scrollHeight > n.current.clientHeight && C(!0);
+  return B(() => {
+    n.current && n.current.scrollHeight > n.current.clientHeight && H(!0);
   }, []), /* @__PURE__ */ i(
     r,
     {
-      ref: f,
+      ref: T,
       $widthX: 12.38,
       $position: "relative",
-      $background: `${l || "ORANGE"}_2`,
-      onMouseEnter: A,
-      onMouseLeave: E,
+      $background: `${m || "ORANGE"}_2`,
+      onMouseEnter: E,
+      onMouseLeave: X,
       children: [
         /* @__PURE__ */ i(
-          j,
+          G,
           {
             $flexDirection: "row",
             $alignItems: "center",
             $width: "100%",
             $heightX: 3.5,
-            $bgImage: H,
+            $bgImage: k,
             $gutterX: 0.78125,
             $flexGap: 8.5,
             $position: "relative",
             children: [
               /* @__PURE__ */ e(
-                G,
+                M,
                 {
                   $width: 31,
                   $height: 31,
@@ -69,54 +70,55 @@ const F = { renderer: "canvas", autoplay: !1 }, K = ({
                   $position: "relative",
                   $alignItems: "center",
                   $justifyContent: "center",
-                  children: /* @__PURE__ */ e(S, { src: k, ref: s, settings: F })
+                  children: /* @__PURE__ */ e(W, { src: A, ref: s, settings: K })
                 }
               ),
-              /* @__PURE__ */ e(W, { cardHeader: y, nodeType: o, courseType: _ }),
-              h && /* @__PURE__ */ e(
-                g,
+              /* @__PURE__ */ e(D, { cardHeader: _, nodeType: o, courseType: x }),
+              $ && /* @__PURE__ */ e(
+                h,
                 {
                   renderAs: "primary",
                   tooltipItem: "Not visible to student",
                   position: "bottom",
                   zIndex: 6,
-                  children: /* @__PURE__ */ e(B, {})
+                  children: /* @__PURE__ */ e(R, {})
                 }
               ),
-              !!c && /* @__PURE__ */ e(M, { children: /* @__PURE__ */ e(V, { src: c, alt: "Chapter image" }) })
+              !!l && /* @__PURE__ */ e(V, { children: /* @__PURE__ */ e(z, { src: l, alt: "Chapter image" }) })
             ]
           }
         ),
         /* @__PURE__ */ e(
-          R,
+          L,
           {
             nodeType: o,
-            state: I,
-            accuracy: b,
+            state: b,
+            accuracy: y,
             dueDateTs: a,
-            isStudent: w === "STUDENT"
+            isStudent: I === "STUDENT",
+            isMilestone: c
           }
         ),
-        a && m && /* @__PURE__ */ e(
-          D,
+        !c && a && p && /* @__PURE__ */ e(
+          j,
           {
             dueDate: a * 1e3,
-            unlockedOn: m * 1e3,
-            progressBg: `${l || "ORANGE"}_4`
+            unlockedOn: p * 1e3,
+            progressBg: `${m || "ORANGE"}_4`
           }
         ),
         /* @__PURE__ */ i(r, { $gutterX: 0.75, $gapX: 1, $flexRowGapX: 0.5, $background: "WHITE", children: [
           /* @__PURE__ */ e(
-            g,
+            h,
             {
               renderAs: "primary",
               position: "bottom",
               tooltipItem: d,
               width: 300,
-              hidden: !x,
+              hidden: !C,
               parentWidth: "auto",
               zIndex: 6,
-              children: /* @__PURE__ */ e(r, { $heightX: 2.5, children: /* @__PURE__ */ e(z, { ref: n, $renderAs: "ab3", children: d }) })
+              children: /* @__PURE__ */ e(r, { $heightX: 2.5, children: /* @__PURE__ */ e(U, { ref: n, $renderAs: "ab3", children: d }) })
             }
           ),
           /* @__PURE__ */ i(
@@ -127,7 +129,7 @@ const F = { renderer: "canvas", autoplay: !1 }, K = ({
               $alignItems: "center",
               $justifyContent: "space-between",
               children: [
-                /* @__PURE__ */ e(U, { $renderAs: "ub3", $color: "BLACK_T_60", children: T }),
+                /* @__PURE__ */ e(F, { $renderAs: "ub3", $color: "BLACK_T_60", children: w }),
                 /* @__PURE__ */ e(r, { $width: 32 })
               ]
             }
@@ -136,8 +138,8 @@ const F = { renderer: "canvas", autoplay: !1 }, K = ({
       ]
     }
   );
-}, ae = X(K);
+}, se = N(P);
 export {
-  ae as default
+  se as default
 };
 //# sourceMappingURL=homework-card-view.js.map

package/dist/features/homework/homework-card-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"homework-card-view.js","sources":["../../../src/features/homework/homework-card-view.tsx"],"sourcesContent":["import type { INodeDataProps } from '../chapters-v2/comps/node-card/node-card-types';\nimport type { ILottieAnimationRef } from '../ui/lottie-animation/types';\nimport type { TUserTypes } from '../ui/types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useLayoutEffect, useRef, useState } from 'react';\n\nimport ClosedEyeIcon from '../../assets/line-icons/icons/closed-eye';\nimport NodeCardTags from '../chapters-v2/comps/node-card/node-card-tags';\nimport { getNodeTypeBasedBgImage } from '../chapters-v2/utils';\nimport { getNodeCardBasedIcon } from '../chapters-v2/utils/node-card-utils';\nimport ArrowTooltip from '../ui/arrow-tooltip/arrow-tooltip';\nimport FlexView from '../ui/layout/flex-view';\nimport LottieAnimation from '../ui/lottie-animation/lottie-animation';\nimport CardTitle from './card-title';\nimport NodeProgress from './node-progress';\nimport * as Styled from './styles';\n\nconst renderSettings = { renderer: 'canvas', autoplay: false };\n\ninterface IHomeworkCardViewProps {\n  header: string;\n  isInQueue?: boolean;\n  nodeData: INodeDataProps;\n  studentContainerRef: React.RefObject<HTMLDivElement>;\n  subHeader: string;\n  userType: TUserTypes;\n}\n\nconst HomeworkView: FC<IHomeworkCardViewProps> = ({\n  header,\n  isInQueue,\n  nodeData,\n  studentContainerRef,\n  subHeader,\n  userType,\n}) => {\n  const {\n    node_type: nodeType,\n    state,\n    accuracy,\n    due_date_ts: dueDateTs,\n    image_url: imageUrl,\n    image_hue: imageHue,\n    card_header: cardHeader = '',\n    unlocked_on_ts: unlockedOnTs,\n    course_type: courseType,\n  } = nodeData;\n  const [showTitleTooltip, setShowTitleTooltip] = useState(false);\n  const titleTextRef = useRef<HTMLDivElement>(null);\n  const bgImage = getNodeTypeBasedBgImage(nodeType);\n  const animationRef = useRef<ILottieAnimationRef | null>(null);\n  const { lottie: nodeCardLottie } = getNodeCardBasedIcon(nodeType);\n\n  const handleOnMouseEnter = useCallback(() => {\n    animationRef.current?.play();\n  }, []);\n\n  const handleOnMouseLeave = useCallback(() => {\n    animationRef.current?.stop();\n  }, []);\n\n  useLayoutEffect(() => {\n    if (\n      titleTextRef.current &&\n      titleTextRef.current.scrollHeight > titleTextRef.current.clientHeight\n    ) {\n      setShowTitleTooltip(true);\n    }\n  }, []);\n\n  return (\n    <FlexView\n      ref={studentContainerRef}\n      $widthX={12.38}\n      $position=\"relative\"\n      $background={`${imageHue || 'ORANGE'}_2`}\n      onMouseEnter={handleOnMouseEnter}\n      onMouseLeave={handleOnMouseLeave}\n    >\n      <Styled.CardWrapper\n        $flexDirection=\"row\"\n        $alignItems=\"center\"\n        $width=\"100%\"\n        $heightX={3.5}\n        $bgImage={bgImage}\n        $gutterX={0.78125}\n        $flexGap={8.5}\n        $position=\"relative\"\n      >\n        <Styled.IconWrapper\n          $width={31}\n          $height={31}\n          $borderRadiusX={2}\n          $background=\"WHITE_1\"\n          $position=\"relative\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n        >\n          <LottieAnimation src={nodeCardLottie} ref={animationRef} settings={renderSettings} />\n        </Styled.IconWrapper>\n        <CardTitle cardHeader={cardHeader} nodeType={nodeType} courseType={courseType} />\n        {isInQueue && (\n          <ArrowTooltip\n            renderAs=\"primary\"\n            tooltipItem=\"Not visible to student\"\n            position=\"bottom\"\n            zIndex={6}\n          >\n            <ClosedEyeIcon />\n          </ArrowTooltip>\n        )}\n        {!!imageUrl && (\n          <Styled.BannerImageWrapper>\n            <Styled.BannerImage src={imageUrl} alt=\"Chapter image\" />\n          </Styled.BannerImageWrapper>\n        )}\n      </Styled.CardWrapper>\n      <NodeCardTags\n        nodeType={nodeType}\n        state={state}\n        accuracy={accuracy}\n        dueDateTs={dueDateTs}\n        isStudent={userType === 'STUDENT'}\n      />\n      {dueDateTs && unlockedOnTs && (\n        <NodeProgress\n          dueDate={dueDateTs * 1000}\n          unlockedOn={unlockedOnTs * 1000}\n          progressBg={`${imageHue || 'ORANGE'}_4`}\n        />\n      )}\n      <FlexView $gutterX={0.75} $gapX={1} $flexRowGapX={0.5} $background=\"WHITE\">\n        <ArrowTooltip\n          renderAs=\"primary\"\n          position=\"bottom\"\n          tooltipItem={header}\n          width={300}\n          hidden={!showTitleTooltip}\n          parentWidth=\"auto\"\n          zIndex={6}\n        >\n          <FlexView $heightX={2.5}>\n            <Styled.HeaderText ref={titleTextRef} $renderAs=\"ab3\">\n              {header}\n            </Styled.HeaderText>\n          </FlexView>\n        </ArrowTooltip>\n        <FlexView\n          $flexDirection=\"row\"\n          $heightX={1.25}\n          $alignItems=\"center\"\n          $justifyContent=\"space-between\"\n        >\n          <Styled.SubHeaderText $renderAs=\"ub3\" $color=\"BLACK_T_60\">\n            {subHeader}\n          </Styled.SubHeaderText>\n          <FlexView $width={32} />\n        </FlexView>\n      </FlexView>\n    </FlexView>\n  );\n};\n\nexport default memo(HomeworkView);\n"],"names":["renderSettings","HomeworkView","header","isInQueue","nodeData","studentContainerRef","subHeader","userType","nodeType","state","accuracy","dueDateTs","imageUrl","imageHue","cardHeader","unlockedOnTs","courseType","showTitleTooltip","setShowTitleTooltip","useState","titleTextRef","useRef","bgImage","getNodeTypeBasedBgImage","animationRef","nodeCardLottie","getNodeCardBasedIcon","handleOnMouseEnter","useCallback","_a","handleOnMouseLeave","useLayoutEffect","jsxs","FlexView","Styled.CardWrapper","jsx","Styled.IconWrapper","LottieAnimation","CardTitle","ArrowTooltip","ClosedEyeIcon","Styled.BannerImageWrapper","Styled.BannerImage","NodeCardTags","NodeProgress","Styled.HeaderText","Styled.SubHeaderText","HomeworkView$1","memo"],"mappings":"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"}
+{"version":3,"file":"homework-card-view.js","sources":["../../../src/features/homework/homework-card-view.tsx"],"sourcesContent":["import type { INodeDataProps } from '../chapters-v2/comps/node-card/node-card-types';\nimport type { ILottieAnimationRef } from '../ui/lottie-animation/types';\nimport type { TUserTypes } from '../ui/types';\nimport type { FC } from 'react';\n\nimport { memo, useCallback, useLayoutEffect, useRef, useState } from 'react';\n\nimport ClosedEyeIcon from '../../assets/line-icons/icons/closed-eye';\nimport NodeCardTags from '../chapters-v2/comps/node-card/node-card-tags';\nimport { getNodeTypeBasedBgImage } from '../chapters-v2/utils';\nimport { getNodeCardBasedIcon } from '../chapters-v2/utils/node-card-utils';\nimport ArrowTooltip from '../ui/arrow-tooltip/arrow-tooltip';\nimport FlexView from '../ui/layout/flex-view';\nimport LottieAnimation from '../ui/lottie-animation/lottie-animation';\nimport CardTitle from './card-title';\nimport NodeProgress from './node-progress';\nimport * as Styled from './styles';\n\nconst renderSettings = { renderer: 'canvas', autoplay: false };\n\ninterface IHomeworkCardViewProps {\n  header: string;\n  isInQueue?: boolean;\n  nodeData: INodeDataProps;\n  studentContainerRef: React.RefObject<HTMLDivElement>;\n  subHeader: string;\n  userType: TUserTypes;\n  isMilestone?: boolean;\n}\n\nconst HomeworkView: FC<IHomeworkCardViewProps> = ({\n  header,\n  isInQueue,\n  nodeData,\n  studentContainerRef,\n  subHeader,\n  userType,\n  isMilestone = false,\n}) => {\n  const {\n    node_type: nodeType,\n    state,\n    accuracy,\n    due_date_ts: dueDateTs,\n    image_url: imageUrl,\n    image_hue: imageHue,\n    card_header: cardHeader = '',\n    unlocked_on_ts: unlockedOnTs,\n    course_type: courseType,\n  } = nodeData;\n  const [showTitleTooltip, setShowTitleTooltip] = useState(false);\n  const titleTextRef = useRef<HTMLDivElement>(null);\n  const bgImage = getNodeTypeBasedBgImage(nodeType);\n  const animationRef = useRef<ILottieAnimationRef | null>(null);\n  const { lottie: nodeCardLottie } = getNodeCardBasedIcon(nodeType);\n\n  const handleOnMouseEnter = useCallback(() => {\n    animationRef.current?.play();\n  }, []);\n\n  const handleOnMouseLeave = useCallback(() => {\n    animationRef.current?.stop();\n  }, []);\n\n  useLayoutEffect(() => {\n    if (\n      titleTextRef.current &&\n      titleTextRef.current.scrollHeight > titleTextRef.current.clientHeight\n    ) {\n      setShowTitleTooltip(true);\n    }\n  }, []);\n\n  return (\n    <FlexView\n      ref={studentContainerRef}\n      $widthX={12.38}\n      $position=\"relative\"\n      $background={`${imageHue || 'ORANGE'}_2`}\n      onMouseEnter={handleOnMouseEnter}\n      onMouseLeave={handleOnMouseLeave}\n    >\n      <Styled.CardWrapper\n        $flexDirection=\"row\"\n        $alignItems=\"center\"\n        $width=\"100%\"\n        $heightX={3.5}\n        $bgImage={bgImage}\n        $gutterX={0.78125}\n        $flexGap={8.5}\n        $position=\"relative\"\n      >\n        <Styled.IconWrapper\n          $width={31}\n          $height={31}\n          $borderRadiusX={2}\n          $background=\"WHITE_1\"\n          $position=\"relative\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n        >\n          <LottieAnimation src={nodeCardLottie} ref={animationRef} settings={renderSettings} />\n        </Styled.IconWrapper>\n        <CardTitle cardHeader={cardHeader} nodeType={nodeType} courseType={courseType} />\n        {isInQueue && (\n          <ArrowTooltip\n            renderAs=\"primary\"\n            tooltipItem=\"Not visible to student\"\n            position=\"bottom\"\n            zIndex={6}\n          >\n            <ClosedEyeIcon />\n          </ArrowTooltip>\n        )}\n        {!!imageUrl && (\n          <Styled.BannerImageWrapper>\n            <Styled.BannerImage src={imageUrl} alt=\"Chapter image\" />\n          </Styled.BannerImageWrapper>\n        )}\n      </Styled.CardWrapper>\n      <NodeCardTags\n        nodeType={nodeType}\n        state={state}\n        accuracy={accuracy}\n        dueDateTs={dueDateTs}\n        isStudent={userType === 'STUDENT'}\n        isMilestone={isMilestone}\n      />\n      {!isMilestone && dueDateTs && unlockedOnTs && (\n        <NodeProgress\n          dueDate={dueDateTs * 1000}\n          unlockedOn={unlockedOnTs * 1000}\n          progressBg={`${imageHue || 'ORANGE'}_4`}\n        />\n      )}\n      <FlexView $gutterX={0.75} $gapX={1} $flexRowGapX={0.5} $background=\"WHITE\">\n        <ArrowTooltip\n          renderAs=\"primary\"\n          position=\"bottom\"\n          tooltipItem={header}\n          width={300}\n          hidden={!showTitleTooltip}\n          parentWidth=\"auto\"\n          zIndex={6}\n        >\n          <FlexView $heightX={2.5}>\n            <Styled.HeaderText ref={titleTextRef} $renderAs=\"ab3\">\n              {header}\n            </Styled.HeaderText>\n          </FlexView>\n        </ArrowTooltip>\n        <FlexView\n          $flexDirection=\"row\"\n          $heightX={1.25}\n          $alignItems=\"center\"\n          $justifyContent=\"space-between\"\n        >\n          <Styled.SubHeaderText $renderAs=\"ub3\" $color=\"BLACK_T_60\">\n            {subHeader}\n          </Styled.SubHeaderText>\n          <FlexView $width={32} />\n        </FlexView>\n      </FlexView>\n    </FlexView>\n  );\n};\n\nexport default memo(HomeworkView);\n"],"names":["renderSettings","HomeworkView","header","isInQueue","nodeData","studentContainerRef","subHeader","userType","isMilestone","nodeType","state","accuracy","dueDateTs","imageUrl","imageHue","cardHeader","unlockedOnTs","courseType","showTitleTooltip","setShowTitleTooltip","useState","titleTextRef","useRef","bgImage","getNodeTypeBasedBgImage","animationRef","nodeCardLottie","getNodeCardBasedIcon","handleOnMouseEnter","useCallback","_a","handleOnMouseLeave","useLayoutEffect","jsxs","FlexView","Styled.CardWrapper","jsx","Styled.IconWrapper","LottieAnimation","CardTitle","ArrowTooltip","ClosedEyeIcon","Styled.BannerImageWrapper","Styled.BannerImage","NodeCardTags","NodeProgress","Styled.HeaderText","Styled.SubHeaderText","HomeworkView$1","memo"],"mappings":"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"}